Integrate collaborative monaco editor

CS3219-AY2425S1 · Nov 2, 2024 · 6050f39 · 6050f39
1 parent 608f28d
commit 6050f39
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/frontend/components/collab/collab-room.tsx b/frontend/components/collab/collab-room.tsx
@@ -2,8 +2,15 @@ import React from "react";
 import { Button } from "@/components/ui/button";
 import { X } from "lucide-react";
 import Chat from "./chat";
-import CodeEditor from "./code-editor";
 import QuestionDisplay from "./question-display";
+import dynamic from "next/dynamic";
+
+const MonacoEditor = dynamic(
+  () => import("@/components/collab/monaco-editor"),
+  {
+    ssr: false,
+  }
+);
 
 export default function CollabRoom({ roomId }: { roomId: string }) {
   return (
@@ -20,7 +27,7 @@ export default function CollabRoom({ roomId }: { roomId: string }) {
           <QuestionDisplay roomId={roomId} />
           <Chat roomId={roomId} />
         </div>
-        <CodeEditor />
+        <MonacoEditor roomId={roomId} />
       </div>
     </div>
   );