From 12609c5b77b0c25df54fa3c68d799dd915485903 Mon Sep 17 00:00:00 2001
From: Mushka Nikita <nikitamushka@mail.ru>
Date: Wed, 18 Jan 2023 16:14:16 +0300
Subject: [PATCH] Fixed bug 60574

---
 .../components/GlobalEvents/EditRoomEvent.js  | 55 +++++++++++--------
 .../client/src/store/SelectedFolderStore.js   | 32 +++++++++++
 packages/common/store/InfoPanelStore.js       | 13 +++++
 3 files changed, 77 insertions(+), 23 deletions(-)

diff --git a/packages/client/src/components/GlobalEvents/EditRoomEvent.js b/packages/client/src/components/GlobalEvents/EditRoomEvent.js
index beb5ddc550..df0656261d 100644
--- a/packages/client/src/components/GlobalEvents/EditRoomEvent.js
+++ b/packages/client/src/components/GlobalEvents/EditRoomEvent.js
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import { EditRoomDialog } from "../dialogs";
 import { Encoder } from "@docspace/common/utils/encoder";
 import api from "@docspace/common/api";
+import { getRoomInfo } from "@docspace/common/api/rooms";
 
 const EditRoomEvent = ({
   addActiveItems,
@@ -34,7 +35,11 @@ const EditRoomEvent = ({
 
   withPaging,
 
-  reloadSelection,
+  addDefaultLogoPaths,
+  updateLogoPathsCacheBreaker,
+  removeLogoPaths,
+
+  reloadInfoPanelSelection,
 }) => {
   const { t } = useTranslation(["CreateEditRoomDialog", "Common", "Files"]);
 
@@ -110,34 +115,31 @@ const EditRoomEvent = ({
               ...calculateRoomLogoParams(img, x, y, zoom),
             });
 
-            if (!withPaging) {
-              setFolder(room);
-            }
-
-            // to update state info panel
-            reloadSelection();
-
+            if (!withPaging) setFolder(room);
+            reloadInfoPanelSelection();
             URL.revokeObjectURL(img.src);
-
             setActiveFolders([]);
           };
           img.src = url;
         });
       } else {
-        if (!withPaging) {
-          setFolder(room);
-        }
-        // to update state info panel
-        reloadSelection();
+        if (!withPaging) setFolder(room);
+        reloadInfoPanelSelection();
       }
     } catch (err) {
       console.log(err);
     } finally {
-      if (withPaging) {
-        await updateCurrentFolder(null, currentFolderId);
-      }
-      setIsLoading(false);
+      if (withPaging) await updateCurrentFolder(null, currentFolderId);
 
+      if (item.logo.original && !roomParams.icon.uploadedFile) {
+        removeLogoPaths();
+        reloadInfoPanelSelection();
+      } else if (!item.logo.original && roomParams.icon.uploadedFile)
+        addDefaultLogoPaths();
+      else if (item.logo.original && roomParams.icon.uploadedFile)
+        updateLogoPathsCacheBreaker();
+
+      setIsLoading(false);
       onClose();
     }
   };
@@ -147,7 +149,6 @@ const EditRoomEvent = ({
 
     if (logo) {
       const imgExst = logo.slice(".")[1];
-
       const file = await fetch(logo)
         .then((res) => res.arrayBuffer())
         .then(
@@ -167,7 +168,6 @@ const EditRoomEvent = ({
 
   useEffect(() => {
     setCreateRoomDialogVisible(true);
-
     return () => setCreateRoomDialogVisible(false);
   }, []);
 
@@ -209,12 +209,17 @@ export default inject(
     } = filesStore;
 
     const { createTag, fetchTags } = tagsStore;
-    const { id: currentFolderId } = selectedFolderStore;
+    const {
+      id: currentFolderId,
+      addDefaultLogoPaths,
+      removeLogoPaths,
+      updateLogoPathsCacheBreaker,
+    } = selectedFolderStore;
     const { updateCurrentFolder } = filesActionsStore;
     const { getThirdPartyIcon } = settingsStore.thirdPartyStore;
     const { setCreateRoomDialogVisible } = dialogsStore;
     const { withPaging } = auth.settingsStore;
-    const { reloadSelection } = auth.infoPanelStore;
+    const { reloadSelection: reloadInfoPanelSelection } = auth.infoPanelStore;
     return {
       addActiveItems,
       setActiveFolders,
@@ -240,7 +245,11 @@ export default inject(
       withPaging,
       setCreateRoomDialogVisible,
 
-      reloadSelection,
+      addDefaultLogoPaths,
+      updateLogoPathsCacheBreaker,
+      removeLogoPaths,
+
+      reloadInfoPanelSelection,
     };
   }
 )(observer(EditRoomEvent));
diff --git a/packages/client/src/store/SelectedFolderStore.js b/packages/client/src/store/SelectedFolderStore.js
index a244cb1e11..882eac781c 100644
--- a/packages/client/src/store/SelectedFolderStore.js
+++ b/packages/client/src/store/SelectedFolderStore.js
@@ -74,6 +74,38 @@ class SelectedFolderStore {
     this.parentId = parentId;
   };
 
+  addDefaultLogoPaths = () => {
+    const cachebreaker = new Date().getTime();
+    this.logo = {
+      small: `/storage/room_logos/root/${this.id}_small.png?` + cachebreaker,
+      medium: `/storage/room_logos/root/${this.id}_medium.png?` + cachebreaker,
+      large: `/storage/room_logos/root/${this.id}_large.png?` + cachebreaker,
+      original:
+        `/storage/room_logos/root/${this.id}_original.png?` + cachebreaker,
+    };
+  };
+
+  removeLogoPaths = () => {
+    this.logo = {
+      small: "",
+      medium: "",
+      large: "",
+      original: "",
+    };
+  };
+
+  updateLogoPathsCacheBreaker = () => {
+    if (!this.logo.original) return;
+
+    const cachebreaker = new Date().getTime();
+    this.logo = {
+      small: this.logo.small.split("?")[0] + "?" + cachebreaker,
+      medium: this.logo.medium.split("?")[0] + "?" + cachebreaker,
+      large: this.logo.large.split("?")[0] + "?" + cachebreaker,
+      original: this.logo.original.split("?")[0] + "?" + cachebreaker,
+    };
+  };
+
   setSelectedFolder = (selectedFolder) => {
     const { socketHelper } = this.settingsStore;
 
diff --git a/packages/common/store/InfoPanelStore.js b/packages/common/store/InfoPanelStore.js
index 9e91f35073..d8fa7a01dc 100644
--- a/packages/common/store/InfoPanelStore.js
+++ b/packages/common/store/InfoPanelStore.js
@@ -143,6 +143,19 @@ class InfoPanelStore {
     this.setSelection(this.calculateSelection());
   };
 
+  updateRoomLogoCacheBreaker = () => {
+    const logo = this.selection.logo;
+    this.setSelection({
+      ...this.selection,
+      logo: {
+        small: logo.small.split("?")[0] + "?" + new Date().getTime(),
+        medium: logo.medium.split("?")[0] + "?" + new Date().getTime(),
+        large: logo.large.split("?")[0] + "?" + new Date().getTime(),
+        original: logo.original.split("?")[0] + "?" + new Date().getTime(),
+      },
+    });
+  };
+
   reloadSelectionParentRoom = async () => {
     if (!this.getIsRooms) return;