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

Merge pull request #126 from caleboleary/bugfix/codeblock-persist-lang

Browse Source 
fix(component): fixes codeblock so lang selection persists across ref…
This commit is contained in:
DarkSky
2022-08-07 01:36:07 +08:00
committed by GitHub
parent 53453b81b8 7042a04212
commit 0a31d455da
1 changed files with 7 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
libs/components/editor-blocks/src/blocks/code/CodeView.tsx
+7 -8
View File
@@ -105,7 +105,7 @@ const langs: Record<string, any> = {
// clike: () => StreamLanguage.define(clike), // clike: () => StreamLanguage.define(clike),
// clike: () => clike({ }), // clike: () => clike({ }),
}; };
const DEFAULT_LANG = 'javascript';
const CodeBlock = styled('div')(({ theme }) => ({ const CodeBlock = styled('div')(({ theme }) => ({
backgroundColor: '#F2F5F9', backgroundColor: '#F2F5F9',
padding: '8px 24px', padding: '8px 24px',
@@ -132,8 +132,7 @@ const CodeBlock = styled('div')(({ theme }) => ({
})); }));
export const CodeView: FC<CreateCodeView> = ({ block, editor }) => { export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
const initValue: string = block.getProperty('text')?.value?.[0]?.text; const initValue: string = block.getProperty('text')?.value?.[0]?.text;
const langType: string = block.getProperty('lang')?.value?.[0]?.text; const langType: string = block.getProperty('lang');
const [mode, setMode] = useState('javascript');
const [extensions, setExtensions] = useState<Extension[]>(); const [extensions, setExtensions] = useState<Extension[]>();
const codeMirror = useRef(); const codeMirror = useRef();
useOnSelect(block.id, (is_select: boolean) => { useOnSelect(block.id, (is_select: boolean) => {
@@ -147,14 +146,14 @@ export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
value: [{ text: value }], value: [{ text: value }],
}); });
}; };
useEffect(() => {
handleLangChange(langType ? langType : 'javascript');
}, []);
function handleLangChange(lang: string) { function handleLangChange(lang: string) {
block.setProperty('lang', lang); block.setProperty('lang', lang);
setMode(lang);
setExtensions([langs[lang]()]); setExtensions([langs[lang]()]);
} }
useEffect(() => {
handleLangChange(langType ? langType : DEFAULT_LANG);
}, []);
const copyCode = () => { const copyCode = () => {
copyToClipboard(initValue); copyToClipboard(initValue);
}; };
@@ -182,7 +181,7 @@ export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
<Select <Select
width={128} width={128}
placeholder="Search for a field type" placeholder="Search for a field type"
value={mode} value={langType || DEFAULT_LANG}
listboxStyle={{ maxHeight: '400px' }} listboxStyle={{ maxHeight: '400px' }}
onChange={(selectedValue: string) => { onChange={(selectedValue: string) => {
// setSelectedOption(selectedValue); // setSelectedOption(selectedValue);