Web: Files: moved getNewFiles to actions

products/ASC.Files/Client/src/HOCs/withBadges.js

@@ -64,15 +64,13 @@ export default function withBadges(WrappedComponent) {
         selectedFolderPathParts,
         markAsRead,
         setNewFilesPanelVisible,
-        setNewFilesIds,
       } = this.props;
       if (item.fileExst) {
         markAsRead([], [item.id], item);
       } else {
-        setNewFilesPanelVisible(true);
         const newFolderIds = selectedFolderPathParts;
         newFolderIds.push(item.id);
-        setNewFilesIds(newFolderIds);
+        setNewFilesPanelVisible(true, newFolderIds, item);
       }
     };
 
@@ -228,7 +226,7 @@ export default function withBadges(WrappedComponent) {
       } = filesActionsStore;
       const { isTabletView } = auth.settingsStore;
       const { setIsVerHistoryPanel, fetchFileVersions } = versionHistoryStore;
-      const { setNewFilesPanelVisible, setNewFilesIds } = dialogsStore;
+      const { setNewFilesPanelVisible } = dialogsStore;
       const { filter, setIsLoading, fetchFiles } = filesStore;
       const { secondaryProgressDataStore } = uploadDataStore;
       const {
@@ -253,7 +251,6 @@ export default function withBadges(WrappedComponent) {
         selectedFolderPathParts: selectedFolderStore.pathParts,
         markAsRead,
         setNewFilesPanelVisible,
-        setNewFilesIds,
         updateRootBadge,
         setSecondaryProgressBarData,
         selectedFolderId: selectedFolderStore.id,

products/ASC.Files/Client/src/components/Article/Body/index.js

@@ -75,8 +75,7 @@ class ArticleBodyContent extends React.Component {
   };
 
   onShowNewFilesPanel = (folderId) => {
-    this.props.setNewFilesPanelVisible(true);
-    this.props.setNewFilesIds([folderId]);
+    this.props.setNewFilesPanelVisible(true, [folderId]);
   };
 
   render() {
@@ -127,7 +126,7 @@ export default inject(
         ? selectedNode
         : [selectedFolderStore.id + ""];
 
-    const { setNewFilesPanelVisible, setNewFilesIds } = dialogsStore;
+    const { setNewFilesPanelVisible } = dialogsStore;
 
     return {
       selectedFolderTitle: selectedFolderStore.title,
@@ -142,7 +141,6 @@ export default inject(
       setSelectedNode,
       setTreeFolders,
       setNewFilesPanelVisible,
-      setNewFilesIds,
 
       homepage: config.homepage,
     };

products/ASC.Files/Client/src/components/panels/NewFilesPanel/index.js

@@ -11,7 +11,6 @@ import Box from "@appserver/components/box";
 import RowContainer from "@appserver/components/row-container";
 import Button from "@appserver/components/button";
 import { withTranslation } from "react-i18next";
-import { getNewFiles } from "@appserver/common/api/files";
 import toastr from "studio/toastr";
 import { ReactSVG } from "react-svg";
 import {
@@ -30,16 +29,7 @@ class NewFilesPanel extends React.Component {
   constructor(props) {
     super(props);
 
-    this.state = { files: [], readingFiles: [] };
-  }
-
-  componentDidMount() {
-    const { newFilesIds, setIsLoading } = this.props;
-    setIsLoading(true);
-    getNewFiles(newFilesIds[newFilesIds.length - 1])
-      .then((files) => this.setState({ files }))
-      .catch((err) => toastr.error(err))
-      .finally(() => setIsLoading(false));
+    state = { readingFiles: [] };
   }
 
   onClose = () => {
@@ -65,7 +55,7 @@ class NewFilesPanel extends React.Component {
     const fileIds = [];
     const folderIds = [];
 
-    for (let item of this.state.files) {
+    for (let item of this.props.newFiles) {
       if (item.fileExst) fileIds.push(item.id);
       else folderIds.push(item.id);
     }
@@ -148,9 +138,10 @@ class NewFilesPanel extends React.Component {
       updateRootBadge,
       updateFolderBadge,
       pathParts,
+      newFiles,
     } = this.props;
 
-    const filesCount = this.state.files.length;
+    const filesCount = newFiles.length;
     updateRootBadge(+newFilesIds[0], filesCount);
 
     if (newFilesIds.length <= 1) {
@@ -165,8 +156,7 @@ class NewFilesPanel extends React.Component {
 
   render() {
     //console.log("NewFiles panel render");
-    const { t, visible, isLoading } = this.props;
-    const { files } = this.state;
+    const { t, visible, isLoading, newFiles } = this.props;
     const zIndex = 310;
 
     return (
@@ -191,7 +181,7 @@ class NewFilesPanel extends React.Component {
             {!isLoading ? (
               <StyledBody className="files-operations-body">
                 <RowContainer useReactWindow>
-                  {files.map((file) => {
+                  {newFiles.map((file) => {
                     const element = this.getItemIcon(file);
                     return (
                       <Row key={file.id} element={element}>
@@ -260,7 +250,7 @@ export default inject(
       fetchFiles,
       filter,
       addFileToRecentlyViewed,
-      setIsLoading,
+      //setIsLoading,
       isLoading,
       updateFilesBadge,
       updateFolderBadge,
@@ -276,16 +266,18 @@ export default inject(
       setNewFilesPanelVisible,
       newFilesPanelVisible: visible,
       newFilesIds,
+      newFiles,
     } = dialogsStore;
 
     return {
       filter,
       pathParts,
       visible,
+      newFiles,
       newFilesIds,
       isLoading,
 
-      setIsLoading,
+      //setIsLoading,
       fetchFiles,
       setMediaViewerData,
       addFileToRecentlyViewed,

products/ASC.Files/Client/src/store/DialogsStore.js

@@ -1,6 +1,10 @@
+import { getNewFiles } from "@appserver/common/api/files";
 import { makeAutoObservable } from "mobx";
 
 class DialogsStore {
+  treeFoldersStore;
+  filesStore;
+
   sharingPanelVisible = false;
   ownerPanelVisible = false;
   moveToPanelVisible = false;
@@ -19,13 +23,17 @@ class DialogsStore {
   connectItem = null;
   destFolderId = null;
   newFilesIds = null;
+  newFiles = null;
   conflictResolveDialogData = null;
   conflictResolveDialogItems = null;
   removeMediaItem = null;
   unsubscribe = null;
 
-  constructor() {
+  constructor(treeFoldersStore, filesStore) {
     makeAutoObservable(this);
+
+    this.treeFoldersStore = treeFoldersStore;
+    this.filesStore = filesStore;
   }
 
   setSharingPanelVisible = (sharingPanelVisible) => {
@@ -86,8 +94,29 @@ class DialogsStore {
     this.destFolderId = destFolderId;
   };
 
-  setNewFilesPanelVisible = (newFilesPanelVisible) => {
-    if (!newFilesPanelVisible) this.setNewFilesIds(null);
+  setNewFilesPanelVisible = async (visible, newIds, item) => {
+    const id = newIds && newIds[newIds.length - 1];
+    let newFilesPanelVisible = visible;
+
+    if (visible) {
+      const files = await getNewFiles(id);
+      if (files && files.length) {
+        this.setNewFiles(files);
+        setNewFilesIds(newIds);
+      } else {
+        newFilesPanelVisible = false;
+        const { getRootFolder, updateRootBadge } = this.treeFoldersStore;
+        const { updateFolderBadge } = this.filesStore;
+        const { rootFolderType, id } = item;
+
+        const rootFolder = getRootFolder(rootFolderType);
+        updateRootBadge(rootFolder.id, item.new);
+        updateFolderBadge(id, item.new);
+      }
+    } else {
+      this.setNewFilesIds(null);
+    }
+
     this.newFilesPanelVisible = newFilesPanelVisible;
   };
 
@@ -95,6 +124,10 @@ class DialogsStore {
     this.newFilesIds = newFilesIds;
   };
 
+  setNewFiles = (files) => {
+    this.newFiles = files;
+  };
+
   setConflictResolveDialogVisible = (conflictResolveDialogVisible) => {
     this.conflictResolveDialogVisible = conflictResolveDialogVisible;
   };
@@ -116,4 +149,4 @@ class DialogsStore {
   };
 }
 
-export default new DialogsStore();
+export default DialogsStore;

products/ASC.Files/Client/src/store/index.js

@@ -15,7 +15,7 @@ import SecondaryProgressDataStore from "./SecondaryProgressDataStore";
 import PrimaryProgressDataStore from "./PrimaryProgressDataStore";
 
 import VersionHistoryStore from "./VersionHistoryStore";
-import dialogsStore from "./DialogsStore";
+import DialogsStore from "./DialogsStore";
 
 import store from "studio/store";
 
@@ -46,6 +46,7 @@ const uploadDataStore = new UploadDataStore(
   secondaryProgressDataStore,
   primaryProgressDataStore
 );
+const dialogsStore = new DialogsStore(treeFoldersStore, filesStore);
 const filesActionsStore = new FilesActionsStore(
   store.auth,
   uploadDataStore,
@@ -58,6 +59,7 @@ const filesActionsStore = new FilesActionsStore(
 );
 
 const versionHistoryStore = new VersionHistoryStore(filesStore);
+
 const stores = {
   filesStore,
   settingsStore,