Web: Files: fixed NewFilesPanel styles

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

@@ -153,7 +153,10 @@ export default function withFileActions(WrappedFileItem) {
       if (encrypted && isPrivacy) return checkProtocol(item.id, true);
 
       if (isTrashFolder) return;
-      if ((e && e.target.tagName === "INPUT") || !!e.target.closest(".badges"))
+      if (
+        (e && e.target.tagName === "INPUT") ||
+        !!e.target.closest(".lock-file")
+      )
         return;
 
       e.preventDefault();

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

@@ -30,7 +30,7 @@ class ArticleBodyContent extends React.Component {
     } = this.props;
 
     setSelectedNode(data);
-    hideArticle(false);
+    hideArticle();
     setIsLoading(true);
     // const selectedFolderTitle =
     //   (e.node && e.node.props && e.node.props.title) || null;

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

@@ -8,7 +8,6 @@ import Heading from "@appserver/components/heading";
 import Aside from "@appserver/components/aside";
 import Row from "@appserver/components/row";
 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 toastr from "studio/toastr";
@@ -19,6 +18,7 @@ import {
   StyledHeaderContent,
   StyledBody,
   StyledFooter,
+  StyledSharingBody,
 } from "../StyledPanels";
 import { inject, observer } from "mobx-react";
 import { combineUrl } from "@appserver/common/utils";
@@ -27,6 +27,8 @@ import config from "../../../../package.json";
 import Loaders from "@appserver/common/components/Loaders";
 import withLoader from "../../../HOCs/withLoader";
 
+const SharingBodyStyle = { height: `calc(100vh - 156px)` };
+
 class NewFilesPanel extends React.Component {
   state = { readingFiles: [] };
 
@@ -65,9 +67,10 @@ class NewFilesPanel extends React.Component {
       .finally(() => this.onClose());
   };
 
-  onNewFileClick = (item) => {
+  onNewFileClick = (e) => {
+    const { id, extension: fileExst } = e.target.dataset;
+
     const { /* updateFolderBadge, */ markAsRead } = this.props;
-    const { /* folderId, */ fileExst, id } = item;
     const readingFiles = this.state.readingFiles;
 
     const fileIds = fileExst ? [id] : [];
@@ -178,33 +181,31 @@ class NewFilesPanel extends React.Component {
             </StyledHeaderContent>
             {!isLoading ? (
               <StyledBody className="files-operations-body">
-                <RowContainer useReactWindow>
+                <StyledSharingBody stype="mediumBlack" style={SharingBodyStyle}>
                   {newFiles.map((file) => {
                     const element = this.getItemIcon(file);
                     return (
                       <Row key={file.id} element={element}>
-                        <Box
-                          onClick={this.onNewFileClick.bind(this, file)}
-                          marginProp="auto 0"
+                        <Link
+                          onClick={this.onNewFileClick}
+                          containerWidth="100%"
+                          type="page"
+                          fontWeight={600}
+                          color="#333"
+                          isTextOverflow
+                          truncate
+                          title={file.title}
+                          fontSize="14px"
+                          className="files-new-link"
+                          data-id={file.id}
+                          data-extension={file.fileExst}
                         >
-                          <Link
-                            containerWidth="100%"
-                            type="page"
-                            fontWeight="bold"
-                            color="#333"
-                            isTextOverflow
-                            truncate
-                            title={file.title}
-                            fontSize="14px"
-                            className="files-new-link"
-                          >
-                            {file.title}
-                          </Link>
-                        </Box>
+                          {file.title}
+                        </Link>
                       </Row>
                     );
                   })}
-                </RowContainer>
+                </StyledSharingBody>
               </StyledBody>
             ) : (
               <div key="loader" className="panel-loader-wrapper">

products/ASC.Files/Client/src/components/panels/StyledPanels.js

@@ -271,7 +271,7 @@ const StyledHeaderContent = styled.div`
 
 const StyledBody = styled.div`
   &.files-operations-body {
-    padding: 0 16px;
+    padding: 0 0 0 16px;
     box-sizing: border-box;
     width: 100%;
     height: calc(100vh - 125px);

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

@@ -2,6 +2,7 @@ import { getNewFiles } from "@appserver/common/api/files";
 import { makeAutoObservable } from "mobx";
 
 class DialogsStore {
+  authStore;
   treeFoldersStore;
   filesStore;
   selectedFolderStore;
@@ -32,12 +33,13 @@ class DialogsStore {
   unsubscribe = null;
   convertItem = null;
 
-  constructor(treeFoldersStore, filesStore, selectedFolderStore) {
+  constructor(authStore, treeFoldersStore, filesStore, selectedFolderStore) {
     makeAutoObservable(this);
 
     this.treeFoldersStore = treeFoldersStore;
     this.filesStore = filesStore;
     this.selectedFolderStore = selectedFolderStore;
+    this.authStore = authStore;
   }
 
   setSharingPanelVisible = (sharingPanelVisible) => {
@@ -132,6 +134,7 @@ class DialogsStore {
       this.setNewFilesIds(null);
     }
 
+    this.authStore.settingsStore.hideArticle();
     this.newFilesPanelVisible = newFilesPanelVisible;
   };
 

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

@@ -45,6 +45,7 @@ const secondaryProgressDataStore = new SecondaryProgressDataStore();
 const primaryProgressDataStore = new PrimaryProgressDataStore();
 
 const dialogsStore = new DialogsStore(
+  store.auth,
   treeFoldersStore,
   filesStore,
   selectedFolderStore