FatttSnake/oxygen-ui
1
0
Fork 0
Code Pull Requests Activity

Add loading to editor

Browse Source
This commit is contained in:
Fat Snake
2024-01-09 17:50:59 +08:00
parent d802844516
commit e846c28082
3 changed files with 104 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/components/Playground/CodeEditor/Editor/index.tsx
View File

@@ -36,7 +36,7 @@ const Editor: React.FC<EditorProps> = ({
highlighter: () => undefined,
dispose: () => undefined
})
const { onWatch } = useTypesProgress()
const { total, finished, onWatch } = useTypesProgress()
const file = files[selectedFileName] ?? { name: 'Untitled' }
const handleOnEditorDidMount = (editor: editor.IStandaloneCodeEditor, monaco: Monaco) => {
@@ -87,21 +87,24 @@ const Editor: React.FC<EditorProps> = ({
return (
<>
<MonacoEditor
theme={theme}
path={file.name}
className={`monaco-editor-${theme ?? 'light'}`}
language={file.language}
value={file.value}
onChange={onChange}
onMount={handleOnEditorDidMount}
options={{
...MonacoEditorConfig,
...options,
theme: undefined,
readOnly: readonly
}}
/>
<div data-component={'playground-code-editor-editor'}>
<MonacoEditor
theme={theme}
path={file.name}
className={`monaco-editor-${theme ?? 'light'}`}
language={file.language}
value={file.value}
onChange={onChange}
onMount={handleOnEditorDidMount}
options={{
...MonacoEditorConfig,
...options,
theme: undefined,
readOnly: readonly
}}
/>
{total > 0 && !finished && <div className={'playground-code-editor-loading'} />}
</div>
</>
)
}