Merge branch 'feature/files' of https://github.com/ONLYOFFICE/AppServer into feature/files

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

@@ -73,9 +73,7 @@ class TreeFolders extends React.Component {
       const itemId = item.id.toString();
       if (curId.indexOf(itemId) >= 0) {
         const listIds = curId;
-        const treeItem = listIds.find(
+        const treeItem = listIds.find(x => x.toString() === itemId);
-          x => x.toString() === itemId
-        );
         if (treeItem === undefined) {
           listIds.push(itemId);
         }
@@ -156,23 +154,7 @@ class TreeFolders extends React.Component {
 
         const treeData = [...this.state.treeData];
         this.getNewTreeData(treeData, listIds, data.folders, 10);
-
+        this.props.setTreeFolders(treeData);
-        const root = {
-          my: null,
-          share: null,
-          common: null,
-          project: null,
-          trash: null
-        };
-        root.my = treeData[0];
-        root.share = treeData[1];
-        root.common = treeData[2];
-        root.project = treeData[3];
-        root.trash = treeData[4];
-        root.trash.folders = null;
-        root.trash.foldersCount = null;
-
-        this.props.setRootFolders(root);
         this.setState({ treeData });
       })
       .catch(() => this.props.onLoading(false))

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

@@ -1,12 +1,11 @@
 import React from "react";
 import { connect } from "react-redux";
-import { utils, toastr } from "asc-web-components";
+import { toastr } from "asc-web-components";
-import { getRootFolders } from "../../../store/files/selectors";
 import TreeFolders from "./TreeFolders";
 import {
   setFilter,
   fetchFiles,
-  setRootFolders
+  setTreeFolders
 } from "../../../store/files/actions";
 import store from "../../../store/store";
 import { api } from "asc-web-common";
@@ -55,7 +54,7 @@ class ArticleBodyContent extends React.Component {
       currentModule,
       filter,
       setFilter,
-      setRootFolders,
+      setTreeFolders,
       onLoading,
       isLoading
     } = this.props;
@@ -69,7 +68,7 @@ class ArticleBodyContent extends React.Component {
         data={data}
         filter={filter}
         setFilter={setFilter}
-        setRootFolders={setRootFolders}
+        setTreeFolders={setTreeFolders}
         expandedKeys={this.state.expandedKeys}
         onLoading={onLoading}
         isLoading={isLoading}
@@ -79,12 +78,12 @@ class ArticleBodyContent extends React.Component {
 }
 
 function mapStateToProps(state) {
-  const { rootFolders, selectedFolder, filter } = state.files;
+  const { treeFolders, selectedFolder, filter } = state.files;
   const currentFolderId = selectedFolder.id.toString();
   const fakeNewDocuments = 8;
 
   return {
-    data: getRootFolders(rootFolders),
+    data: treeFolders,
     selectedKeys: selectedFolder ? [currentFolderId] : [""],
     fakeNewDocuments,
     currentModule: currentFolderId,
@@ -92,6 +91,6 @@ function mapStateToProps(state) {
   };
 }
 
-export default connect(mapStateToProps, { setFilter, setRootFolders })(
+export default connect(mapStateToProps, { setFilter, setTreeFolders })(
   ArticleBodyContent
 );

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

@@ -85,10 +85,11 @@ ArticleMainButtonContent.propTypes = {
 };
 
 const mapStateToProps = (state) => {
-  const rootFolderOfCurrent = state.files.selectedFolder ? state.files.selectedFolder.pathParts[0] : -1; 
+  const rootFolderOfCurrent = state.files.selectedFolder ? state.files.selectedFolder.pathParts[0] : -1;
+  const myFolderIndex = 0;
   return {
     settings: state.auth.settings,
-    isMyDocuments: isMyDocuments(state.files.rootFolders.my.id, rootFolderOfCurrent)
+    isMyDocuments: isMyDocuments(state.files.treeFolders[myFolderIndex].id, rootFolderOfCurrent)
   }
 }
 

products/ASC.Files/Client/src/components/pages/Home/Section/Body/FilesRowContent.js

@@ -186,6 +186,13 @@ class FilesRowContent extends React.PureComponent {
     }
       .edit-text {
         height: 30px;
+        font-size: 15px;
+        outline: 0 !important;
+        font-weight: bold;
+        margin: 0;
+        font-family: 'Open Sans',sans-serif,Arial;
+        text-align: left;
+        color: #333333;
       }
       .edit-button {
         margin-left: 8px;

products/ASC.Files/Client/src/components/pages/Home/Section/Body/index.js

@@ -3,6 +3,7 @@ import { withRouter } from "react-router";
 import { connect } from "react-redux";
 import { withTranslation } from "react-i18next";
 import isEqual from "lodash/isEqual";
+import styled from "styled-components";
 import {
   Icons,
   Row,
@@ -18,7 +19,7 @@ import {
   deselectFile,
   fetchFiles,
   fetchFolder,
-  fetchRootFolders,
+  //fetchRootFolders,
   selectFile,
   setAction
 } from '../../../../../store/files/actions';
@@ -88,7 +89,7 @@ class SectionBodyContent extends React.PureComponent {
       });
     })
 
-    fetchRootFolders(store.dispatch);
+    //fetchRootFolders(store.dispatch);
   }
 
   onClickDelete = (item) => {
@@ -112,7 +113,7 @@ class SectionBodyContent extends React.PureComponent {
     deleteFolder(folderId)
       .catch(err => toastr.error(err))
       .then(() => fetchFiles(currentFolderId, filter, store.dispatch))
-      .then(() => fetchRootFolders(store.dispatch))
+      //.then(() => fetchRootFolders(store.dispatch))
       .then(() => toastr.success(`Folder moved to recycle bin`));
   }
 
@@ -183,12 +184,38 @@ class SectionBodyContent extends React.PureComponent {
     }
   };
 
+  getItemIcon = (extension, isEdit) => {
+    const setEditIconStyle = isEdit ? { style: { marginLeft: '24px' } } : {};
+
+    return extension
+      ? <Icons.ActionsDocumentsIcon
+        {...setEditIconStyle}
+        size='big'
+        isfill={true}
+        color="#A3A9AE"
+      />
+      : <Icons.CatalogFolderIcon
+        {...setEditIconStyle}
+        size='big'
+        isfill={true}
+        color="#A3A9AE"
+      />
+  };
+
   render() {
     const { files, folders, viewer, parentId, folderId, settings, selection, fileAction, onLoading, filter } = this.props;
     const { editingId } = this.state;
 
     let items = [...folders, ...files];
 
+    const SimpleFilesRow = styled(Row)`
+      ${props => !props.contextOptions && `
+          & > div:last-child {
+              width: 0px;
+            }
+        `}
+    `;
+
     if (fileAction && fileAction.type === FileAction.Create) {
       items.unshift({
         id: -1,
@@ -208,12 +235,10 @@ class SectionBodyContent extends React.PureComponent {
             : { contextOptions };
           const checked = isFileSelected(selection, item.id, item.parentId);
           const checkedProps = /* isAdmin(viewer) */ isEdit ? {} : { checked };
-          const element = item.fileExst
+          const element = this.getItemIcon(item.fileExst, isEdit);
-            ? <Icons.ActionsDocumentsIcon size='big' isfill={true} color="#A3A9AE" />
-            : <Icons.CatalogFolderIcon size='big' isfill={true} color="#A3A9AE" />;
 
           return (
-            <Row
+            <SimpleFilesRow
               key={item.id}
               data={item}
               element={element}
@@ -224,12 +249,12 @@ class SectionBodyContent extends React.PureComponent {
               needForUpdate={this.needForUpdate}
             >
               <FilesRowContent item={item} viewer={viewer} culture={settings.culture} onEditComplete={this.onEditComplete} onLoading={onLoading} />
-            </Row>
+            </SimpleFilesRow>
           );
         })}
       </RowContainer>
     ) : parentId !== 0 ? (
-      <EmptyFolderContainer parentId={parentId} filter={filter}/>
+      <EmptyFolderContainer parentId={parentId} filter={filter} />
     ) : <p>RootFolderContainer</p>;
   }
 }
@@ -260,7 +285,7 @@ export default connect(
     deleteFolder,
     deselectFile,
     fetchFiles,
-    fetchRootFolders,
+    //fetchRootFolders,
     selectFile,
     setAction
   }

products/ASC.Files/Client/src/components/pages/Home/Section/Header/index.js

@@ -413,11 +413,12 @@ const SectionHeaderContent = props => {
 };
 
 const mapStateToProps = state => {
-  const { selectedFolder, selection, rootFolders } = state.files;
+  const { selectedFolder, selection, treeFolders } = state.files;
+  const trashFolderIndex = 3;
   return {
     folder: selectedFolder.parentId !== 0,
     isAdmin: isAdmin(state.auth.user),
-    isRecycleBinFolder: rootFolders.trash.id === selectedFolder.id,
+    isRecycleBinFolder: treeFolders[trashFolderIndex].id === selectedFolder.id,
     parentId: selectedFolder.parentId,
     selection,
     title: selectedFolder.title,

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

@@ -2,7 +2,7 @@ import React from "react";
 import ReactDOM from "react-dom";
 import { Provider } from "react-redux";
 import store from "./store/store";
-import { fetchMyFolder, fetchRootFolders, fetchFiles } from "./store/files/actions";
+import { fetchMyFolder, fetchTreeFolders, fetchFiles } from "./store/files/actions";
 import config from "../package.json";
 import "./custom.scss";
 import App from "./App";
@@ -21,7 +21,7 @@ if (token) {
     .then(() => getPortalPasswordSettings(store.dispatch))
     .then(() => getPortalCultures(store.dispatch))
     .then(() => fetchMyFolder(store.dispatch))
-    .then(() => fetchRootFolders(store.dispatch))
+    .then(() => fetchTreeFolders(store.dispatch))
     .then(() => {
       const re = new RegExp(`${config.homepage}((/?)$|/filter)`, "gm");
       const match = window.location.pathname.match(re);

products/ASC.Files/Client/src/store/files/actions.js

@@ -23,7 +23,7 @@ export const SET_FILES = "SET_FILES";
 export const SET_SELECTION = "SET_SELECTION";
 export const SET_SELECTED = "SET_SELECTED";
 export const SET_SELECTED_FOLDER = "SET_SELECTED_FOLDER";
-export const SET_ROOT_FOLDERS = "SET_ROOT_FOLDERS";
+export const SET_TREE_FOLDERS = "SET_TREE_FOLDERS";
 export const SET_FILES_FILTER = "SET_FILES_FILTER";
 export const SET_FILTER = "SET_FILTER";
 export const SELECT_FILE = "SELECT_FILE";
@@ -86,10 +86,10 @@ export function setSelectedFolder(selectedFolder) {
   };
 }
 
-export function setRootFolders(rootFolders) {
+export function setTreeFolders(treeFolders) {
   return {
-    type: SET_ROOT_FOLDERS,
+    type: SET_TREE_FOLDERS,
-    rootFolders
+    treeFolders
   };
 }
 
@@ -229,37 +229,13 @@ export function fetchSharedFolder(dispatch) {
   });
 }
 
-export function fetchRootFolders(dispatch) {
+export function fetchTreeFolders(dispatch) {
-
+  return files.getFoldersTree().then(data => dispatch(setTreeFolders(data)));
-  let root = {
-    my: null,
-    share: null,
-    common: null,
-    project: null,
-    trash: null
-  };
-
-  return axios.all([
-    files.getMyFolderList(),
-    files.getSharedFolderList(),
-    files.getCommonFolderList(),
-    files.getProjectsFolderList(),
-    files.getTrashFolderList()
-  ])
-    .then(axios.spread((my, share, common, project, trash) => {
-      root.my = { folders: my.folders, ...my.current }
-      root.share = { folders: share.folders, ...share.current }
-      root.common = { folders: common.folders, ...common.current }
-      root.project = { folders: project.folders, ...project.current }
-      root.trash = { folders: trash.folders, ...trash.current }
-    }))
-    .then(() => dispatch(setRootFolders(root)));;
 }
 
-export function testUpdateMyFolder(folders) {
+/*export function testUpdateMyFolder(folders) {
   return (dispatch, getState) => {
     const { files } = getState();
-    const { rootFolders } = files;
 
     console.log("folders", folders);
 
@@ -273,7 +249,7 @@ export function testUpdateMyFolder(folders) {
 
   }
   //setRootFolders
-}
+}*/
 
 export function createFile(folderId, title) {
   return dispatch => {

products/ASC.Files/Client/src/store/files/reducers.js

@@ -6,7 +6,7 @@ import {
   SET_FILTER,
   SET_FOLDER,
   SET_FOLDERS,
-  SET_ROOT_FOLDERS,
+  SET_TREE_FOLDERS,
   SET_SELECTED_FOLDER,
   SET_SELECTED,
   SET_SELECTION,
@@ -24,7 +24,7 @@ const initialState = {
   files: null,
   filter: FilesFilter.getDefault(),
   folders: null,
-  rootFolders: [],
+  treeFolders: [],
   selected: "none",
   selectedFolder: null,
   selection: []
@@ -65,9 +65,9 @@ const filesReducer = (state = initialState, action) => {
       return Object.assign({}, state, {
         selectedFolder: action.selectedFolder
       });
-    case SET_ROOT_FOLDERS:
+    case SET_TREE_FOLDERS:
       return Object.assign({}, state, {
-        rootFolders: action.rootFolders
+        treeFolders: action.treeFolders
       });
     case SET_FILTER:
       return Object.assign({}, state, {

products/ASC.Files/Client/src/store/files/selectors.js

@@ -3,22 +3,6 @@ import { constants } from 'asc-web-common';
 
 const { FileType, FilterType } = constants;
 
-export const getRootFolders = files => {
-  const { my, share, common, project, trash } = files;
-
-  my.key = "0-0";
-  share.key = "0-1";
-  common.key = "0-2";
-  project.key = "0-3";
-  trash.key = "0-4";
-  trash.folders = null;
-  trash.foldersCount = null;
-
-  const data = [ my, share, common, project, trash];
-
-  return data;
-};
-
 export const canWebEdit = fileExst => {
   const editedDocs = ['.pptx', '.pptm', '.ppt', '.ppsx', '.ppsm', '.pps', '.potx', '.potm', '.pot', '.odp', '.fodp', '.otp', '.xlsx', '.xlsm', '.xls', '.xltx', '.xltm', '.xlt', '.ods', '.fods', '.ots', '.csv', '.docx', '.docm', '.doc', '.dotx', '.dotm', '.dot', '.odt', '.fodt', '.ott', '.txt', '.rtf', '.mht', '.html', '.htm'];
   const result = editedDocs.findIndex(item => item === fileExst);

web/ASC.Web.Common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asc-web-common",
-  "version": "1.0.124",
+  "version": "1.0.125",
   "description": "Ascensio System SIA common components and solutions library",
   "license": "AGPL-3.0",
   "files": [

web/ASC.Web.Common/src/api/files/index.js

@@ -40,26 +40,26 @@ export function getFolder(folderId, filter, fake = false) {
 }
 
 export function getFoldersTree() {
-  const rootFoldersPaths = ['@my', '@share', '@common', '@projects', '@trash']; //TODO: need get from settings
+  const rootFoldersPaths = ['@my', '@share', '@common', /*'@projects',*/ '@trash']; //TODO: need get from settings
   const requestsArray = rootFoldersPaths.map(path => request({ method: "get", url: `/files/${path}` }));
 
   return axios.all(requestsArray)
     .then(axios.spread((...responses) =>
-      responses.map(data => {
+      responses.map((data, index) => {
+        const trashIndex = 3;
         return {
           id: data.current.id,
-          key: `0-${data.current.id}`,
+          key: `0-${index}`,
           title: data.current.title,
-          folders: data.folders.map(folder => {
+          folders: index !== trashIndex ? data.folders.map(folder => {
             return {
               id: folder.id,
-              key: `0-${folder.parentId}-${folder.id}`,
               title: folder.title,
-              folders: [],
+              foldersCount: folder.foldersCount,
-              foldersCount: folder.foldersCount
             }
-          }),
+          }) : null,
-          foldersCount: data.current.foldersCount
+          pathParts: data.pathParts,
+          foldersCount: index !== trashIndex ? data.current.foldersCount : null
         }
       })
     ))