From 6050f398c2bdfcb63b75dc95468b27b96f9460f4 Mon Sep 17 00:00:00 2001
From: Selwyn Ang <selwynang.01@gmail.com>
Date: Sun, 3 Nov 2024 00:35:36 +0800
Subject: [PATCH] Integrate collaborative monaco editor

---
 frontend/components/collab/collab-room.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/frontend/components/collab/collab-room.tsx b/frontend/components/collab/collab-room.tsx
index 6ae9941ea3..23915fc2b7 100644
--- 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>
   );