Fixed Bug 60575 - Rooms.Files. Images/media are not opening from the New files panel.

packages/client/src/components/panels/NewFilesPanel/index.js

@@ -71,14 +71,14 @@ class NewFilesPanel extends React.Component {
     const folderIds = folders
       .filter((f) => !readingFiles.includes(f.id.toString()))
       .map((f) => f.id);
-
+    console.log("tut check 2");
     this.props
       .markAsRead(folderIds, fileIds)
       //.then(() => this.setNewBadgeCount())
       .then(() => {
         const { hasNew, refreshFiles } = this.props;
 
-        return hasNew ? refreshFiles() : Promise.resolve();
+        return Promise.resolve(); //hasNew ? refreshFiles() :
       })
       .catch((err) => toastr.error(err))
       .finally(() => {
@@ -111,6 +111,8 @@ class NewFilesPanel extends React.Component {
       return this.onFileClick(item);
     }
 
+    console.log("tut check");
+
     markAsRead(folderIds, fileIds, item)
       .then(() => {
         //updateFolderBadge(folderId, 1);
@@ -121,7 +123,7 @@ class NewFilesPanel extends React.Component {
         this.onFileClick(item);
       })
       .then(() => {
-        refreshFiles();
+        // refreshFiles();
       })
       .catch((err) => toastr.error(err));
   };
@@ -130,9 +132,13 @@ class NewFilesPanel extends React.Component {
     const { id, fileExst, webUrl, fileType, providerKey } = item;
     const {
       filter,
-      //setMediaViewerData,
+      setMediaViewerData,
       fetchFiles,
       addFileToRecentlyViewed,
+      playlist,
+      setCurrentItem,
+      isMediaOrImage,
+      currentFolderId,
     } = this.props;
 
     if (!fileExst) {
@@ -141,7 +147,10 @@ class NewFilesPanel extends React.Component {
         .finally(() => this.onClose());
     } else {
       const canEdit = [5, 6, 7].includes(fileType); //TODO: maybe dirty
-      const isMedia = [2, 3, 4].includes(fileType);
+      // const isMedia = [2, 3, 4].includes(fileType);
+
+      const isMedia = isMediaOrImage(fileExst);
+      const isMediaActive = playlist.findIndex((el) => el.fileId === id) !== -1;
 
       if (canEdit && providerKey) {
         return addFileToRecentlyViewed(id)
@@ -160,8 +169,21 @@ class NewFilesPanel extends React.Component {
       }
 
       if (isMedia) {
-        //const mediaItem = { visible: true, id };
-        //setMediaViewerData(mediaItem);
+        if (currentFolderId !== item.folderId) {
+          fetchFiles(item.folderId, null)
+            .then(() => {
+              const mediaItem = { visible: true, id };
+              setMediaViewerData(mediaItem);
+            })
+            .catch((err) => toastr.error(err))
+            .finally(() => this.onClose());
+        } else {
+          const mediaItem = { visible: true, id };
+          setMediaViewerData(mediaItem);
+
+          return this.onClose();
+        }
+
         return;
       }
 
@@ -311,10 +333,14 @@ export default inject(
       refreshFiles,
     } = filesStore;
     //const { updateRootBadge } = treeFoldersStore;
-    const { setMediaViewerData } = mediaViewerDataStore;
-    const { getIcon, getFolderIcon } = settingsStore;
+    const {
+      playlist,
+      setMediaViewerData,
+      setCurrentItem,
+    } = mediaViewerDataStore;
+    const { getIcon, getFolderIcon, isMediaOrImage } = settingsStore;
     const { markAsRead } = filesActionsStore;
-    const { pathParts } = selectedFolderStore;
+    const { pathParts, id: currentFolderId } = selectedFolderStore;
 
     const {
       setNewFilesPanelVisible,
@@ -331,6 +357,11 @@ export default inject(
       newFilesIds,
       isLoading,
 
+      playlist,
+      setCurrentItem,
+      isMediaOrImage,
+      currentFolderId,
+
       //setIsLoading,
       fetchFiles,
       setMediaViewerData,

packages/client/src/store/FilesStore.js

@@ -287,6 +287,8 @@ class FilesStore {
       console.log(`[WS] markasnew-file ${fileId}:${count}`);
 
       const foundIndex = fileId && this.files.findIndex((x) => x.id === fileId);
+
+      this.treeFoldersStore.fetchTreeFolders();
       if (foundIndex == -1) return;
 
       this.updateFileStatus(
@@ -295,7 +297,6 @@ class FilesStore {
           ? this.files[foundIndex].fileStatus | FileStatus.IsNew
           : this.files[foundIndex].fileStatus & ~FileStatus.IsNew
       );
-      this.treeFoldersStore.fetchTreeFolders();
     });
 
     //WAIT FOR RESPONSES OF EDITING FILE