Issue when adding NetlifyCMS to astro config & using getCollection with render()

Hi, I'm facing an error which I couldn't solve it, I'm using astro getCollection() method then render multi MDXs in same page.

so when I'm using the method before adding the NetlifyCMS everything works fine

export const getContent = async ({
  pageName,
  locale,
}: {
  pageName: PageName;
  locale: string;
}): Promise<AstroComponentFactory[]> => {
  const allContent = (
    await getCollection(pageName, (entry) => entry.id.includes(locale))
  ).sort((a, b) => a.data.order - b.data.order) as CollectionEntry<PageName>[];

  const mdxComponents = await Promise.all(
    allContent.map(async (content) => {
      try {
        // will throw an error
        const { Content } = await content.render();
        return Content;
      } catch (e) {
        console.log(e);
        return null;
      }
    })
  );

  return mdxComponents.filter(
    (component) => component !== null
  ) as AstroComponentFactory[];
};

but when adding NetlifyCMS in integrations like this code below

// when commit this part all works fine
NetlifyCMS({
      config: {
        backend: {
          name: "github",
          branch: "main",
        },
        collections: [
          {
            name: "hero",
            label: "hero section",
            folder: "src/content/home/hero",
            create: true,
            delete: false,
            extension: "mdx",
            format: "frontmatter",
            fields: [
              { name: "title", widget: "string", label: "File Title" },
              {
                widget: "string",
                name: "firstLine",
                label: "First Line",
                required: true,
              },
            ],
          },
        ],
      },
    }),

I'm getting this error

Error: Parse error @:12:102
    at parse (file:///Users/my-user/Desktop/magical-main/node_modules/.pnpm/es-module-lexer@1.3.0/node_modules/es-module-lexer/dist/lexer.js:2:358)
    at TransformContext.transform (file:///Users/my-user/Desktop/magical-main/node_modules/.pnpm/@astrojs+mdx@0.19.7_astro@2.9.3/node_modules/@astrojs/mdx/dist/index.js:102:58)
    at Object.transform (file:///Users/my-user/Desktop/magical-main/node_modules/.pnpm/vite@4.4.7/node_modules/vite/dist/node/chunks/dep-3b8eb186.js:44240:62)
    at async loadAndTransform (file:///Users/my-user/Desktop/magical-main/node_modules/.pnpm/vite@4.4.7/node_modules/vite/dist/node/chunks/dep-3b8eb186.js:54896:29)
    at async instantiateModule (file:///Users/my-user/Desktop/magical-main/node_modules/.pnpm/vite@4.4.7/node_modules/vite/dist/node/chunks/dep-3b8eb186.js:55821:10) {
  idx: 464,
  plugin: '@astrojs/mdx-postprocess',
  id: '/Users/my-user/Desktop/magical-main/src/content/home/hero/en.mdx',
  pluginCode: '/*@jsxRuntime automatic @jsxImportSource astro*/\n' +
    'export const frontmatter = {\n' +
    '  "title": "Testing Hero",\n' +
    '  "firstLine": "Crafting softwares with astro and DecapCMS",\n' +
    '  "description": "Hero is a simple, extensible, drop-in replacement for the default Hugo theme.",\n' +
    '  "order": 1\n' +
    '};\n' +
    'export function getHeadings() {\n' +
    '  return [];\n' +
    '}\n' +
    'function _createMdxContent(props) {\n' +
    '  return <><h1>{" "}{frontmatter.title}{" "}</h1>{"\\n"}<h1>{" "}{frontmatter.firstLine}{" "}</h1></>;\n' +
    '}\n' +
    'function MDXContent(props = {}) {\n' +
    '  const {wrapper: MDXLayout} = props.components || ({});\n' +
    '  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);\n' +
    '}\n' +
    'export default MDXContent;\n'
}

So what could be the issue here and how to solve it? *note: If I used.md files it will work fine

for full reff you can see this repo

Update: I believe it could be astro version in astro-netlify-cms it's older then the one I'm using which is "astro": "^2.9.3",

delucis / astro-netlify-cms

Issue when adding NetlifyCMS to astro config & using getCollection with render() #74