1const CodePreviewBlock = ({codeStr}: { codeStr: string }) => {
2
3    const {theme, setTheme, wrapLongLines, setWrapLongLines} = useCodePreviewerStore();
4
5    let _theme = coldarkDark;
6    switch (theme) {
7        case 'coldarkDark':
8            break;
9        case 'coy':
10            _theme = coy;
11            break;
12        case 'darcula':
13            _theme = darcula;
14            break;
15        case 'dracula':
16            _theme = dracula;
17            break;
18        default:
19            break;
20    }
21
22    return (
23        <>
24            <div>
25                <div className="flex items-center justify-center gap-x-8 pb-2 pt-6">
26                    <ThemeSelect value={theme} setValue={setTheme}/>
27                    <SwapSwitch/>
28                </div>
29
30                <div className="mx-auto max-h-[600px] w-full max-w-5xl overflow-y-scroll">
31                    <SyntaxHighlighter
32                        language="typescript"
33                        style={_theme}
34                        wrapLongLines={wrapLongLines}
35                        showLineNumbers={!wrapLongLines}
36                        customStyle={{
37                            borderRadius: '24px',
38                        }}
39                    >
40                        {codeStr}
41                    </SyntaxHighlighter>
42                </div>
43            </div>
44
45        </>
46    )
47}
48