From a1f2102c9040350f740ec62a6c9f8f2d15b6ada7 Mon Sep 17 00:00:00 2001
From: M1ngdaXie <156019134+M1ngdaXie@users.noreply.github.com>
Date: Mon, 12 Jan 2026 16:57:51 -0800
Subject: [PATCH] fix: Update permission handling in Editor and EditorPage
 components

---
 frontend/src/components/Editor/Editor.tsx | 10 +++++++++-
 frontend/src/pages/EditorPage.tsx         |  2 +-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Editor/Editor.tsx b/frontend/src/components/Editor/Editor.tsx
index 7cd2e5a..0c01f68 100644
--- a/frontend/src/components/Editor/Editor.tsx
+++ b/frontend/src/components/Editor/Editor.tsx
@@ -12,7 +12,8 @@ interface EditorProps {
 }
 
 const Editor = ({ providers, permission }: EditorProps) => {
-  const isEditable = permission !== "view";
+  // Default to false (read-only) until permission is loaded
+  const isEditable = permission === "edit";
 
   const editor = useEditor({
     extensions: [
@@ -34,6 +35,13 @@ const Editor = ({ providers, permission }: EditorProps) => {
     editable: isEditable,
   });
 
+  // Update editable state when permission changes
+  useEffect(() => {
+    if (editor) {
+      editor.setEditable(permission === "edit");
+    }
+  }, [editor, permission]);
+
   useEffect(() => {
     if (editor && providers.awareness) {
       const user = providers.awareness.getLocalState()?.user;
diff --git a/frontend/src/pages/EditorPage.tsx b/frontend/src/pages/EditorPage.tsx
index d8bb4eb..54c348b 100644
--- a/frontend/src/pages/EditorPage.tsx
+++ b/frontend/src/pages/EditorPage.tsx
@@ -24,7 +24,7 @@ const EditorPage = () => {
       <div className="page-header">
         <button onClick={() => navigate("/")}>← Back to Home</button>
         <div className="header-actions">
-          {permission === "view" && (
+          {permission !== "edit" && permission !== null && (
             <div className="view-only-badge" style={{ display: 'flex', alignItems: 'center', gap: '4px', padding: '4px 12px', backgroundColor: '#f0f0f0', borderRadius: '4px', fontSize: '14px' }}>
               <span>👁️</span>
               <span>View only</span>