From 74b8f7ee26d78fb22797bb981a394d486eb1409a Mon Sep 17 00:00:00 2001
From: Shivansh Kumar <104713531+ShivanshKumar760@users.noreply.github.com>
Date: Mon, 10 Feb 2025 01:14:48 +0530
Subject: [PATCH] "This ensures proper saving of collaboration data when user
 leaves the room Fixes #9104"

---
 excalidraw-app/App.tsx               |  6 +++---
 excalidraw-app/collab/Collab.tsx     | 12 ++++++++----
 excalidraw-app/share/ShareDialog.tsx |  9 +++++----
 3 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/excalidraw-app/App.tsx b/excalidraw-app/App.tsx
index f7842505a..0def0213d 100644
--- a/excalidraw-app/App.tsx
+++ b/excalidraw-app/App.tsx
@@ -476,7 +476,7 @@ const ExcalidrawWrapper = () => {
           collabAPI?.isCollaborating() &&
           !isCollaborationLink(window.location.href)
         ) {
-          collabAPI.stopCollaboration(false);
+          await collabAPI.stopCollaboration(false);
         }
         excalidrawAPI.updateScene({ appState: { isLoading: true } });
 
@@ -968,9 +968,9 @@ const ExcalidrawWrapper = () => {
                 "exit",
                 "collaboration",
               ],
-              perform: () => {
+              perform: async () => {
                 if (collabAPI) {
-                  collabAPI.stopCollaboration();
+                  await collabAPI.stopCollaboration();
                   if (!collabAPI.isCollaborating()) {
                     setShareDialogState({ isOpen: false });
                   }
diff --git a/excalidraw-app/collab/Collab.tsx b/excalidraw-app/collab/Collab.tsx
index 1097aeda9..b993e9c1f 100644
--- a/excalidraw-app/collab/Collab.tsx
+++ b/excalidraw-app/collab/Collab.tsx
@@ -340,13 +340,14 @@ class Collab extends PureComponent<CollabProps, CollabState> {
     }
   };
 
-  stopCollaboration = (keepRemoteState = true) => {
+  stopCollaboration = async (keepRemoteState = true) => {
     this.queueBroadcastAllElements.cancel();
     this.queueSaveToFirebase.cancel();
     this.loadImageFiles.cancel();
     this.resetErrorIndicator(true);
 
-    this.saveCollabRoomToFirebase(
+    // Ensure we save the latest state before stopping collaboration
+    await this.saveCollabRoomToFirebase(
       getSyncableElements(
         this.excalidrawAPI.getSceneElementsIncludingDeleted(),
       ),
@@ -367,6 +368,9 @@ class Collab extends PureComponent<CollabProps, CollabState> {
       // that could have been saved in other tabs while we were collaborating
       resetBrowserStateVersions();
 
+      // Ensure all pending changes are saved before pushing new state
+      this.queueSaveToFirebase.flush();
+      
       window.history.pushState({}, APP_NAME, window.location.origin);
       this.destroySocketClient();
 
@@ -938,9 +942,9 @@ class Collab extends PureComponent<CollabProps, CollabState> {
   }, SYNC_FULL_SCENE_INTERVAL_MS);
 
   queueSaveToFirebase = throttle(
-    () => {
+    async () => {
       if (this.portal.socketInitialized) {
-        this.saveCollabRoomToFirebase(
+        await this.saveCollabRoomToFirebase(
           getSyncableElements(
             this.excalidrawAPI.getSceneElementsIncludingDeleted(),
           ),
diff --git a/excalidraw-app/share/ShareDialog.tsx b/excalidraw-app/share/ShareDialog.tsx
index b3a307526..d3c8f1577 100644
--- a/excalidraw-app/share/ShareDialog.tsx
+++ b/excalidraw-app/share/ShareDialog.tsx
@@ -164,10 +164,11 @@ const ActiveRoomDialog = ({
           icon={playerStopFilledIcon}
           onClick={() => {
             trackEvent("share", "room closed");
-            collabAPI.stopCollaboration();
-            if (!collabAPI.isCollaborating()) {
-              handleClose();
-            }
+            collabAPI.stopCollaboration().then(() => {
+              if (!collabAPI.isCollaborating()) {
+                handleClose();
+              }
+            });
           }}
         />
       </div>