From b0ddbbb5f87710fd23e2bc4d82d405e65f13ef3b Mon Sep 17 00:00:00 2001
From: Tim Down <158919+timdown@users.noreply.github.com>
Date: Wed, 8 Nov 2023 12:10:07 +0000
Subject: [PATCH] Merge pull request #15653 from
 overleaf/td-ide-page-wait-before-open-doc

React IDE page: open a document after project:joined handling has finished

GitOrigin-RevId: ce48b5fabf7124c37b811b4be132cb28f1eb9857
---
 .../ide-react/components/editor-and-sidebar.tsx  |  7 ++++---
 .../ide-react/context/editor-manager-context.tsx |  1 +
 .../ide-react/context/ide-react-context.tsx      | 16 ++++++++--------
 3 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/services/web/frontend/js/features/ide-react/components/editor-and-sidebar.tsx b/services/web/frontend/js/features/ide-react/components/editor-and-sidebar.tsx
index 9cb40fb966..6b5b99a154 100644
--- a/services/web/frontend/js/features/ide-react/components/editor-and-sidebar.tsx
+++ b/services/web/frontend/js/features/ide-react/components/editor-and-sidebar.tsx
@@ -71,6 +71,7 @@ export function EditorAndSidebar({
     openInitialDoc,
   } = useEditorManagerContext()
   const { view } = useLayoutContext()
+  const { projectJoined } = useIdeReactContext()
   const [, setOpenFile] = useScopeValue<BinaryFile | null>('openFile')
 
   const historyIsOpen = view === 'history'
@@ -143,14 +144,14 @@ export function EditorAndSidebar({
     )
   }, [openDocId])
 
-  // Open a document once the file tree is ready
+  // Open a document once the file tree and project are ready
   const initialOpenDoneRef = useRef(false)
   useEffect(() => {
-    if (fileTreeReady && !initialOpenDoneRef.current) {
+    if (fileTreeReady && projectJoined && !initialOpenDoneRef.current) {
       initialOpenDoneRef.current = true
       openInitialDoc(rootDocId)
     }
-  }, [fileTreeReady, openInitialDoc, rootDocId])
+  }, [fileTreeReady, openInitialDoc, projectJoined, rootDocId])
 
   // Keep the editor file tree around so that it is available and up to date
   // when restoring a file
diff --git a/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx b/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
index 8426f2e007..db42757589 100644
--- a/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
@@ -463,6 +463,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
           )
           return
         }
+        debugConsole.error('Error opening document', error)
         showGenericMessageModal(
           t('error_opening_document'),
           t('error_opening_document_detail')
diff --git a/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx b/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
index d4a9e66ab5..b19d39b393 100644
--- a/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
@@ -36,6 +36,7 @@ type IdeReactContextValue = {
     React.SetStateAction<IdeReactContextValue['startedFreeTrial']>
   >
   reportError: (error: any, meta?: Record<string, any>) => void
+  projectJoined: boolean
 }
 
 const IdeReactContext = createContext<IdeReactContextValue | undefined>(
@@ -95,6 +96,10 @@ export const IdeReactProvider: FC = ({ children }) => {
   const [eventLog] = useState(() => new EventLog())
   const [startedFreeTrial, setStartedFreeTrial] = useState(false)
 
+  // Set to true only after project:joined has fired and all its listeners have
+  // been called
+  const [projectJoined, setProjectJoined] = useState(false)
+
   const { socket } = useConnectionContext()
 
   const reportError = useCallback(
@@ -140,6 +145,7 @@ export const IdeReactProvider: FC = ({ children }) => {
       // Make watchers update immediately
       scopeStore.flushUpdates()
       eventEmitter.emit('project:joined', { project, permissionsLevel })
+      setProjectJoined(true)
     }
 
     socket.on('joinProjectResponse', handleJoinProjectResponse)
@@ -154,13 +160,6 @@ export const IdeReactProvider: FC = ({ children }) => {
       ...getMockIde(),
       socket,
       reportError,
-      // TODO: MIGRATION: Remove this once it's no longer used
-      fileTreeManager: {
-        findEntityByPath: () => null,
-        selectEntity: () => {},
-        getPreviewByPath: () => null,
-        getRootDocDirname: () => '',
-      },
     }
   }, [socket, reportError])
 
@@ -172,8 +171,9 @@ export const IdeReactProvider: FC = ({ children }) => {
       setStartedFreeTrial,
       projectId,
       reportError,
+      projectJoined,
     }),
-    [eventEmitter, eventLog, reportError, startedFreeTrial]
+    [eventEmitter, eventLog, projectJoined, reportError, startedFreeTrial]
   )
 
   return (