Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-14 13:25:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(component): fixes codeblock so lang selection persists across refresh

Browse Source
This commit is contained in:
Caleb OLeary
2022-08-06 12:15:54 -05:00
committed by Caleb OLeary
parent 53453b81b8
commit 7042a04212
1 changed files with 7 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
libs/components/editor-blocks/src/blocks/code/CodeView.tsx
View File

@@ -105,7 +105,7 @@ const langs: Record<string, any> = {
// clike: () => StreamLanguage.define(clike),
// clike: () => clike({ }),
};
const DEFAULT_LANG = 'javascript';
const CodeBlock = styled('div')(({ theme }) => ({
backgroundColor: '#F2F5F9',
padding: '8px 24px',
@@ -132,8 +132,7 @@ const CodeBlock = styled('div')(({ theme }) => ({
}));
export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
const initValue: string = block.getProperty('text')?.value?.[0]?.text;
const langType: string = block.getProperty('lang')?.value?.[0]?.text;
const [mode, setMode] = useState('javascript');
const langType: string = block.getProperty('lang');
const [extensions, setExtensions] = useState<Extension[]>();
const codeMirror = useRef();
useOnSelect(block.id, (is_select: boolean) => {
@@ -147,14 +146,14 @@ export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
value: [{ text: value }],
});
};
useEffect(() => {
handleLangChange(langType ? langType : 'javascript');
}, []);
function handleLangChange(lang: string) {
block.setProperty('lang', lang);
setMode(lang);
setExtensions([langs[lang]()]);
}
useEffect(() => {
handleLangChange(langType ? langType : DEFAULT_LANG);
}, []);
const copyCode = () => {
copyToClipboard(initValue);
};
@@ -182,7 +181,7 @@ export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
<Select
width={128}
placeholder="Search for a field type"
value={mode}
value={langType || DEFAULT_LANG}
listboxStyle={{ maxHeight: '400px' }}
onChange={(selectedValue: string) => {
// setSelectedOption(selectedValue);