How to get the language name for md codeBlock rendring

Question

i am using electron, react. and I am using codemirror to make a editor to edit markdown files. I am also using remark to render the Markdown file in real time. for some reason the syntax highlighting didnt work for codeblocks i tried to implement react-syntax-highlighter it worked as expected i got the content inside the code block syntax but i couldn't get the language name which is important for syntax highlighting

this is the remark file

import React from 'react'
import { unified } from 'unified'
import remarkParse from 'remark-parse'
import remarkGfm from 'remark-gfm'
import remarkReact from 'remark-react'
import remarkBreaks from 'remark-breaks'
import remarkMath from 'remark-math'
import './preview.css'
import 'github-markdown-css/github-markdown.css'
import { Prism } from 'react-syntax-highlighter'

interface Props {
  doc: string
}

const Preview: React.FC<Props> = (props) => {
  const md = unified()
    .use(remarkBreaks)
    .use(remarkMath)
    .use(remarkParse)
    .use(remarkGfm)
    .use(remarkReact, {
      createElement: React.createElement,
      remarkReactComponents: {
        code: ({ children }) => {
const language = Nil;
  
          return <Prism language={language}>{children}</Prism>;
},
      }
    })
    .processSync(props.doc).result


  return <div className='preview markdown-body'>{md}</div>
}

export default Preview

i tried className it didnt work here is the code

const language = className && className.replace('language-', '');
  
          return <Prism language={language}>{children}</Prism>;
},