fix(playground): adjust layout of the editor component for improved responsiveness

This commit is contained in:
ngc2207 2025-01-05 09:15:15 +08:00
parent 5a9a20dee6
commit c629dc5612

View File

@ -172,35 +172,44 @@ export default function PlaygroundPage() {
</Button>
</div>
</div>
<Editor
theme="vs-dark"
path={file.name}
defaultLanguage={file.language}
defaultValue={file.value}
options={{ automaticLayout: true }}
onMount={(editor) => {
editorRef.current = editor;
if (editorRef.current) {
const model = editorRef.current.getModel();
if (model) {
const lineCount = model.getLineCount();
const lastLineLength = model.getLineLength(lineCount);
editorRef.current.setPosition({
lineNumber: lineCount,
column: lastLineLength + 1,
});
editorRef.current.focus();
connectToLanguageServer(language, webSocketRef)
.then((languageClient) => {
languageClientRef.current = languageClient;
})
.catch((error) => {
console.error("Failed to connect to language server:", error);
});
}
}
}}
/>
<div className="flex flex-1 mt-0 m-3 gap-x-1">
<div className="w-1/3"></div>
<div className="w-1/3">
<Editor
theme="vs-dark"
path={file.name}
defaultLanguage={file.language}
defaultValue={file.value}
options={{ automaticLayout: true }}
onMount={(editor) => {
editorRef.current = editor;
if (editorRef.current) {
const model = editorRef.current.getModel();
if (model) {
const lineCount = model.getLineCount();
const lastLineLength = model.getLineLength(lineCount);
editorRef.current.setPosition({
lineNumber: lineCount,
column: lastLineLength + 1,
});
editorRef.current.focus();
connectToLanguageServer(language, webSocketRef)
.then((languageClient) => {
languageClientRef.current = languageClient;
})
.catch((error) => {
console.error(
"Failed to connect to language server:",
error
);
});
}
}
}}
/>
</div>
<div className="w-1/3"></div>
</div>
</div>
);
}