import { PrismLight as SyntaxHighlighter } from "react-syntax-highlighter";
import tsx from "react-syntax-highlighter/dist/cjs/languages/prism/tsx";
import { oneDark } from "react-syntax-highlighter/dist/cjs/styles/prism";

SyntaxHighlighter.registerLanguage("tsx", tsx);

type CustomCodeBlock = {
    children: string,
    className: string

}



const CustomCodeBlock = ({children, className}: CustomCodeBlock): JSX.Element => {
    const language = className?.replace("lang-","");
    return (
        <SyntaxHighlighter language={language} style={oneDark}>
            {children}
        </SyntaxHighlighter>
    )
}

export default CustomCodeBlock;

