Web.Files/Common: Filter: add folder param instead of hash param

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

@@ -58,13 +58,6 @@ class TreeFolders extends React.Component {
 
   onSelect = data => {
     if (this.props.selectedKeys[0] !== data[0]) {
-      const url = `${history.location.pathname}${history.location.search}`;
-      const symbol =
-        history.location.hash ||
-        history.location.search[history.location.search.length - 1] === "/"
-          ? ""
-          : "/";
-      history.push(`${url}${symbol}#${data[0]}`);
       const newFilter = this.props.filter.clone();
       fetchFiles(data[0], newFilter, store.dispatch).catch(err =>
         toastr.error("Something went wrong", err)

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

@@ -9,39 +9,38 @@ import {
   setRootFolders
 } from "../../../store/files/actions";
 import store from "../../../store/store";
-import { api, history } from "asc-web-common";
+import { api } from "asc-web-common";
 const { files } = api;
 
 class ArticleBodyContent extends React.Component {
   state = { expandedKeys: this.props.filter.treeFolders };
 
   componentDidMount() {
-    if (history.location.hash) {
-      const folderId = history.location.hash.slice(1);
+    const newFilter = this.props.filter.clone();
+    const folderId = newFilter.folder;
 
-      let expandedKeys = [];
-      files
-        .getFolder(folderId)
-        .then(data => {
-          for (let item of data.pathParts) {
-            expandedKeys.push(item.toString());
-          }
+    let expandedKeys = [];
+    files
+      .getFolder(folderId)
+      .then(data => {
+        for (let item of data.pathParts) {
+          expandedKeys.push(item.toString());
+        }
 
-          expandedKeys.pop();
+        expandedKeys.pop();
 
-          fetchFiles(folderId, this.props.filter, store.dispatch).catch(err =>
-            toastr.error("Something went wrong", err)
-          );
-        })
-        .catch(err => toastr.error("Something went wrong", err))
-        .finally(() => this.setState({ expandedKeys }));
-    }
+        fetchFiles(folderId, newFilter, store.dispatch).catch(err =>
+          toastr.error("Something went wrong", err)
+        );
+      })
+      .catch(err => toastr.error("Something went wrong", err))
+      .finally(() => this.setState({ expandedKeys }));
   }
 
   componentDidUpdate(prevProps) {
     if (
       this.props.filter.treeFolders.length !==
-        prevProps.filter.treeFolders.length ||
+      prevProps.filter.treeFolders.length ||
       this.state.expandedKeys.length !== this.props.filter.treeFolders.length
     ) {
       this.setState({ expandedKeys: this.props.filter.treeFolders });

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

@@ -4,7 +4,6 @@ import { withRouter } from "react-router";
 import {
   constants,
   Headline,
-  history,
   store
 } from 'asc-web-common';
 import { connect } from "react-redux";
@@ -17,7 +16,7 @@ import {
   toastr
 } from "asc-web-components";
 import { EmptyTrashDialog } from '../../../../dialogs';
-import { fetchFolder } from "../../../../../store/files/actions";
+import { fetchFiles } from "../../../../../store/files/actions";
 import { default as filesStore } from "../../../../../store/store";
 
 const { isAdmin } = store.auth.selectors;
@@ -105,7 +104,8 @@ const SectionHeaderContent = props => {
     isHeaderChecked,
     isHeaderIndeterminate,
     selection,
-    isRecycleBinFolder } = props;
+    isRecycleBinFolder,
+    filter } = props;
 
   const createDocument = useCallback(
     () => onCreate('docx'),
@@ -272,14 +272,7 @@ const SectionHeaderContent = props => {
   ]);
 
   const onBackToParentFolder = () => {
-    fetchFolder(props.parentId, filesStore.dispatch);
-
-    const url =
-      history.location.search !== ""
-        ? history.location.search
-        : history.location.state;
-
-    history.push(`${history.location.pathname}${url}#${props.parentId}`);
+    fetchFiles(props.parentId, filter, filesStore.dispatch);
   };
 
   const isItemsSelected = selection.length;
@@ -428,6 +421,7 @@ const mapStateToProps = state => {
     parentId: selectedFolder.parentId,
     selection,
     title: selectedFolder.title,
+    filter: state.files.filter
   };
 };
 

products/ASC.Files/Client/src/helpers/constants.js

@@ -6,4 +6,5 @@ export const SEARCH = "search";
 export const SORT_BY = "sortby";
 export const SORT_ORDER = "sortorder";
 export const PAGE = "page";
-export const PAGE_COUNT = "pagecount";
+export const PAGE_COUNT = "pagecount";
+export const FOLDER = "folder";

products/ASC.Files/Client/src/helpers/converters.js

@@ -6,7 +6,8 @@ import {
   SORT_ORDER,
   PAGE,
   PAGE_COUNT,
-  AUTHOR_TYPE
+  AUTHOR_TYPE,
+  FOLDER
 } from "./constants";
 import { api, utils } from "asc-web-common";
 const { FilesFilter } = api;
@@ -32,6 +33,7 @@ export function getFilterByLocation(location) {
   const pageCount =
     (urlFilter[PAGE_COUNT] && +urlFilter[PAGE_COUNT]) ||
     defaultFilter.pageCount;
+  const folder = urlFilter[FOLDER] || defaultFilter.folder;
 
   const newFilter = new FilesFilter(
     page,
@@ -42,7 +44,10 @@ export function getFilterByLocation(location) {
     filterType,
     withSubfolders,
     search,
-    authorType
+    authorType,
+    defaultFilter.treeFolders,
+    defaultFilter.selectedItem,
+    folder
   );
 
   return newFilter;

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

@@ -1,4 +1,4 @@
-import { api, constants, history } from "asc-web-common";
+import { api, history } from "asc-web-common";
 import axios from "axios";
 import {
   AUTHOR_TYPE,
@@ -8,12 +8,12 @@ import {
   SEARCH_TYPE,
   SEARCH,
   SORT_BY,
-  SORT_ORDER
+  SORT_ORDER,
+  FOLDER
 } from "../../helpers/constants";
 import config from "../../../package.json";
 import { getTreeFolders } from "./selectors";
 
-const { FilterType, FileType } = constants;
 const { files, FilesFilter } = api;
 
 export const SET_FOLDER = "SET_FOLDER";
@@ -93,8 +93,8 @@ export function setRootFolders(rootFolders) {
   };
 }
 
-export function setFilesFilter(filter, folderId) {
-  setFilterUrl(filter, folderId);
+export function setFilesFilter(filter) {
+  setFilterUrl(filter);
   return {
     type: SET_FILES_FILTER,
     filter
@@ -121,7 +121,7 @@ export function deselectFile(file) {
   };
 }
 
-export function setFilterUrl(filter, folderId) {
+export function setFilterUrl(filter) {
   const defaultFilter = FilesFilter.getDefault();
   const params = [];
 
@@ -139,6 +139,9 @@ export function setFilterUrl(filter, folderId) {
   if (filter.authorType) {
     params.push(`${AUTHOR_TYPE}=${filter.authorType}`);
   }
+  if (filter.folder) {
+    params.push(`${FOLDER}=${filter.folder}`);
+  }
 
   if (filter.pageCount !== defaultFilter.pageCount) {
     params.push(`${PAGE_COUNT}=${filter.pageCount}`);
@@ -148,17 +151,17 @@ export function setFilterUrl(filter, folderId) {
   params.push(`${SORT_BY}=${filter.sortBy}`);
   params.push(`${SORT_ORDER}=${filter.sortOrder}`);
 
-  const hash = folderId === "@my" ? "" : `#${folderId}`;
-  history.push(`${config.homepage}/filter?${params.join("&")}${hash}`);
+  history.push(`${config.homepage}/filter?${params.join("&")}`);
 }
 
 // TODO: similar to fetchFolder, remove one
 export function fetchFiles(folderId, filter, dispatch) {
   const filterData = filter ? filter.clone() : FilesFilter.getDefault();
+  filterData.folder = folderId;
   return files.getFolder(folderId, filter).then(data => {
     filterData.treeFolders = getTreeFolders(data.pathParts, filterData);
     filterData.total = data.total;
-    dispatch(setFilesFilter(filterData, folderId));
+    dispatch(setFilesFilter(filterData));
     dispatch(setFolders(data.folders));
     dispatch(setFiles(data.files));
     return dispatch(setSelectedFolder({ folders: data.folders, ...data.current, pathParts: data.pathParts }));

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

@@ -1,5 +1,4 @@
 import { toUrlParams } from "../../utils";
-import { FilterType } from '../../constants';
 
 const DEFAULT_PAGE = 0;
 const DEFAULT_PAGE_COUNT = 25;
@@ -12,6 +11,7 @@ const DEFAULT_SEARCH = null;
 const DEFAULT_FOLDER_PATH = [];
 const DEFAULT_AUTHOR_TYPE = null;
 const DEFAULT_SELECTED_ITEM = {};
+const DEFAULT_FOLDER = '@my';
 
 // TODO: add next params
 // subjectGroup bool
@@ -35,6 +35,7 @@ class FilesFilter {
     authorType = DEFAULT_AUTHOR_TYPE,
     treeFolders = DEFAULT_FOLDER_PATH,
     selectedItem = DEFAULT_SELECTED_ITEM,
+    folder = DEFAULT_FOLDER
   ) {
     this.page = page;
     this.pageCount = pageCount;
@@ -47,6 +48,7 @@ class FilesFilter {
     this.authorType = authorType;
     this.treeFolders = treeFolders;
     this.selectedItem = selectedItem;
+    this.folder = folder;
   }
 
   getStartIndex = () => {
@@ -109,7 +111,8 @@ class FilesFilter {
       this.search,
       this.authorType,
       this.treeFolders,
-      this.selectedItem
+      this.selectedItem,
+      this.folder
     );
   }
 
@@ -123,6 +126,7 @@ class FilesFilter {
       this.sortOrder === filter.sortOrder &&
       this.page === filter.page &&
       this.selectedItem.key === filter.selectedItem.key &&
+      this.folder === filter.folder &&
       this.pageCount === filter.pageCount;
 
     return equals;