From d89a45daa8b92318c0b1ffe1acf19f28b95df2a2 Mon Sep 17 00:00:00 2001
From: cfngc4594 <cfngc4594@gmail.com>
Date: Tue, 4 Mar 2025 21:26:51 +0800
Subject: [PATCH] feat(editor): update loading state with padding and refactor
 dynamic import

---
 src/components/core-editor-lsp.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/components/core-editor-lsp.tsx b/src/components/core-editor-lsp.tsx
index b2205da..718fd0d 100644
--- a/src/components/core-editor-lsp.tsx
+++ b/src/components/core-editor-lsp.tsx
@@ -11,6 +11,7 @@ import { connectToLanguageServer } from "@/lib/language-server";
 import { LanguageServerMetadata } from "@/types/language-server";
 import type { MonacoLanguageClient } from "monaco-languageclient";
 
+// Dynamically import Monaco Editor with SSR disabled
 const Editor = dynamic(
   async () => {
     await import("vscode");
@@ -21,7 +22,11 @@ const Editor = dynamic(
   },
   {
     ssr: false,
-    loading: () => <Skeleton className="h-full w-full rounded-3xl" />
+    loading: () => (
+      <div className="h-full w-full p-2">
+        <Skeleton className="h-full w-full rounded-3xl" />
+      </div>
+    ),
   }
 );
 
@@ -112,7 +117,11 @@ export default function CoreEditorLsp({
       beforeMount={handleEditorWillMount}
       onMount={handleEditorDidMount}
       options={editorConfig}
-      loading={<Skeleton className="h-full w-full rounded-3xl" />}
+      loading={
+        <div className="h-full w-full p-2">
+          <Skeleton className="h-full w-full rounded-3xl" />
+        </div>
+      }
     />
   );
 }