YAMLException: missed comma between flow collection entries at line 12, column 2: \{

[Aviral0702]

I am stuck on this error where it says that : YAMLException: missed comma between flow collection entries at line 12, column 2:. For reference this is the error shown on the console.

One of my mdx files looks like this.

title: Actions Runner Controller (ARC)
subtitle: Collaborative and visual infrastructure as design for Actions Runner Controller (ARC)
integrationIcon: icons/color/actions-runner-controller-color.svg
darkModeIntegrationIcon: icons/white/actions-runner-controller-white.svg
docURL: https://docs.meshery.io/extensibility/integrations/actions-runner-controller
description:
category: App Definition and Development
subcategory: Continuous Integration & Delivery
registrant: Artifact Hub
components: [
{
"name": "horizontal-runner-autoscaler",
"colorIcon": "icons/components/horizontal-runner-autoscaler/icons/color/horizontal-runner-autoscaler-color.svg",
"whiteIcon": "icons/components/horizontal-runner-autoscaler/icons/white/horizontal-runner-autoscaler-white.svg",
"description": "",
},
{
"name": "runner-deployment",
"colorIcon": "icons/components/runner-deployment/icons/color/runner-deployment-color.svg",
"whiteIcon": "icons/components/runner-deployment/icons/white/runner-deployment-white.svg",
"description": "",
},
{
"name": "runner-replica-set",
"colorIcon": "icons/components/runner-replica-set/icons/color/runner-replica-set-color.svg",
"whiteIcon": "icons/components/runner-replica-set/icons/white/runner-replica-set-white.svg",
"description": "",
},
{
"name": "runner",
"colorIcon": "icons/components/runner/icons/color/runner-color.svg",
"whiteIcon": "icons/components/runner/icons/white/runner-white.svg",
"description": "",
},
{
"name": "runner-set",
"colorIcon": "icons/components/runner-set/icons/color/runner-set-color.svg",
"whiteIcon": "icons/components/runner-set/icons/white/runner-set-white.svg",
"description": "",
}]
featureList: [
"Deploy self hosted runners on Kubernetes cluster with a simple set of commands.",
"Auto scale runners based on demand.",
"Setup across GitHub editions including GitHub Enterprise editions and GitHub Enterprise Cloud."
]
workingSlides: [
../_images/kanvas-visualizer.webp,
../_images/kanvas-designer.webp
]
howItWorks: "Collaborative Infrastructure as Design"
howItWorksDetails: "Collaboratively manage infrastructure with your coworkers synchronously sharing the same designs."
published: TRUE

A Kubernetes controller that operates self-hosted runners for GitHub Actions on your Kubernetes cluster.

Collaboratively and visually diagram your cloud native infrastructure with GitOps-style pipeline integration. Design, test, and manage configuration your Kubernetes-based, containerized applications as a visual topology.

Looking for best practice cloud native design and deployment best practices? Choose from thousands of pre-built components in MeshMap. Choose from hundreds of ready-made design patterns by importing templates from Meshery Catalog or use our low code designer, MeshMap, to create and deploy your own cloud native infrastructure designs.

Please help I am trying to migrate to gatsby-plugin-mdx v4 and MDX V2

I couldn't find a file to try anything there are a huge number of these mdx files.

[ChristianMurphy]

Welcome @Aviral0702!
Sorry you ran into some spot of trouble.
Could you share a reproduction of what you are seeing?
Both the file and the code?
Using https://gatsby.new