diff --git a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx index 964c11b294..9ce542acf2 100644 --- a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx +++ b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx @@ -1,10 +1,9 @@ -import { FC, useState, useMemo, useRef, useEffect } from 'react'; +import { FC, useState, useRef, useEffect } from 'react'; import { StyleWithAtRules } from 'style9'; import { CreateView } from '@toeverything/framework/virgo'; -import CodeMirror from './CodeMirror'; +import CodeMirror, { ReactCodeMirrorRef } from './CodeMirror'; import { styled } from '@toeverything/components/ui'; -import DeleteSweepOutlinedIcon from '@mui/icons-material/DeleteSweepOutlined'; import { javascript } from '@codemirror/lang-javascript'; import { html } from '@codemirror/lang-html'; @@ -46,7 +45,6 @@ import { dockerFile } from '@codemirror/legacy-modes/mode/dockerfile'; import { julia } from '@codemirror/legacy-modes/mode/julia'; import { r } from '@codemirror/legacy-modes/mode/r'; import { Extension } from '@codemirror/state'; -// import { Select } from '../../components/select'; import { Option, Select } from '@toeverything/components/ui'; import { @@ -102,8 +100,6 @@ const langs: Record = { julia: () => StreamLanguage.define(julia), dockerfile: () => StreamLanguage.define(dockerFile), r: () => StreamLanguage.define(r), - // clike: () => StreamLanguage.define(clike), - // clike: () => clike({ }), }; const DEFAULT_LANG = 'javascript'; const CodeBlock = styled('div')(({ theme }) => ({ @@ -120,7 +116,7 @@ const CodeBlock = styled('div')(({ theme }) => ({ flexWrap: 'wrap', justifyContent: 'space-between', }, - '.delete-block': { + '.copy-block': { padding: '6px 10px', backgroundColor: '#fff', borderRadius: theme.affine.shape.borderRadius, @@ -134,22 +130,21 @@ export const CodeView: FC = ({ block, editor }) => { const initValue: string = block.getProperty('text')?.value?.[0]?.text; const langType: string = block.getProperty('lang'); const [extensions, setExtensions] = useState(); - const codeMirror = useRef(); - useOnSelect(block.id, (is_select: boolean) => { + const codeMirror = useRef(); + useOnSelect(block.id, (_is_select: boolean) => { if (codeMirror.current) { - //@ts-ignore codeMirror?.current?.view?.focus(); } }); - const onChange = (value: any, codeEditor: any) => { + const onChange = (value: string) => { block.setProperty('text', { value: [{ text: value }], }); }; - function handleLangChange(lang: string) { + const handleLangChange = (lang: string) => { block.setProperty('lang', lang); setExtensions([langs[lang]()]); - } + }; useEffect(() => { handleLangChange(langType ? langType : DEFAULT_LANG); }, []); @@ -172,19 +167,12 @@ export const CodeView: FC = ({ block, editor }) => { >
- {/* { - // setSelectedOption(selectedValue); handleLangChange(selectedValue); }} > @@ -198,17 +186,8 @@ export const CodeView: FC = ({ block, editor }) => {
-
+
Copy - {/* */}