Web:Client:Added popstate event handling for accounts and settings.

packages/client/src/pages/AccountsHome/index.js

@@ -42,11 +42,20 @@ const PureHome = ({
 
   setSelectedNode,
   withPaging,
+  onClickBack,
 }) => {
   const { location } = history;
   const { pathname } = location;
   //console.log("People Home render");
 
+  useEffect(() => {
+    window.addEventListener("popstate", onClickBack);
+
+    return () => {
+      window.removeEventListener("popstate", onClickBack);
+    };
+  }, []);
+
   useEffect(() => {
     if (pathname.indexOf("/accounts/filter") > -1) {
       setSelectedNode(["accounts", "filter"]);
@@ -120,36 +129,45 @@ PureHome.propTypes = {
 
 const Home = withTranslation("People")(PureHome);
 
-export default inject(({ auth, peopleStore, treeFoldersStore }) => {
-  const { settingsStore } = auth;
-  const { showCatalog, withPaging } = settingsStore;
-  const { usersStore, selectedGroupStore, loadingStore, viewAs } = peopleStore;
-  const { getUsersList } = usersStore;
-  const { selectedGroup } = selectedGroupStore;
-  const { setSelectedNode } = treeFoldersStore;
-  const {
-    isLoading,
-    setIsLoading,
-    setIsRefresh,
-    firstLoad,
-    setFirstLoad,
-  } = loadingStore;
+export default inject(
+  ({ auth, peopleStore, treeFoldersStore, filesActionsStore }) => {
+    const { settingsStore } = auth;
+    const { showCatalog, withPaging } = settingsStore;
+    const {
+      usersStore,
+      selectedGroupStore,
+      loadingStore,
+      viewAs,
+    } = peopleStore;
+    const { getUsersList } = usersStore;
+    const { selectedGroup } = selectedGroupStore;
+    const { setSelectedNode } = treeFoldersStore;
+    const { onClickBack } = filesActionsStore;
+    const {
+      isLoading,
+      setIsLoading,
+      setIsRefresh,
+      firstLoad,
+      setFirstLoad,
+    } = loadingStore;
 
-  return {
-    isAdmin: auth.isAdmin,
-    isLoading,
-    getUsersList,
-    setIsLoading,
-    setIsRefresh,
-    selectedGroup,
-    showCatalog,
-    firstLoad,
-    setFirstLoad,
-    viewAs,
-    setSelectedNode,
-    checkedMaintenance: auth.settingsStore.checkedMaintenance,
-    setMaintenanceExist: auth.settingsStore.setMaintenanceExist,
-    snackbarExist: auth.settingsStore.snackbarExist,
-    withPaging,
-  };
-})(observer(withRouter(Home)));
+    return {
+      isAdmin: auth.isAdmin,
+      isLoading,
+      getUsersList,
+      setIsLoading,
+      setIsRefresh,
+      selectedGroup,
+      showCatalog,
+      firstLoad,
+      setFirstLoad,
+      viewAs,
+      setSelectedNode,
+      checkedMaintenance: auth.settingsStore.checkedMaintenance,
+      setMaintenanceExist: auth.settingsStore.setMaintenanceExist,
+      snackbarExist: auth.settingsStore.snackbarExist,
+      withPaging,
+      onClickBack,
+    };
+  }
+)(observer(withRouter(Home)));

packages/client/src/pages/Settings/index.js

@@ -15,7 +15,16 @@ const PureSettings = ({
   isLoadedSettingsTree,
   setFirstLoad,
   isAdmin,
+  onClickBack,
 }) => {
+  useEffect(() => {
+    window.addEventListener("popstate", onClickBack);
+
+    return () => {
+      window.removeEventListener("popstate", onClickBack);
+    };
+  }, []);
+
   useEffect(() => {
     setFirstLoad(false);
   }, [setFirstLoad]);
@@ -71,10 +80,17 @@ SettingsHeader,
 const Settings = withTranslation(["FilesSettings", "Common"])(PureSettings);
 
 export default inject(
-  ({ auth, filesStore, settingsStore, treeFoldersStore }) => {
+  ({
+    auth,
+    filesStore,
+    settingsStore,
+    treeFoldersStore,
+    filesActionsStore,
+  }) => {
     const { setFirstLoad, isLoading } = filesStore;
     const { setSelectedNode } = treeFoldersStore;
     const { getFilesSettings, isLoadedSettingsTree } = settingsStore;
+    const { onClickBack } = filesActionsStore;
 
     return {
       isLoading,
@@ -83,6 +99,7 @@ export default inject(
       setSelectedNode,
       getFilesSettings,
       isAdmin: auth.isAdmin,
+      onClickBack,
     };
   }
 )(observer(Settings));

packages/client/src/store/FilesActionsStore.js

@@ -1900,10 +1900,12 @@ class FilesActionStore {
   };
 
   onClickBack = () => {
-    const { roomType, parentId } = this.selectedFolderStore;
+    const { roomType, parentId, setSelectedFolder } = this.selectedFolderStore;
+    const { setSelectedNode } = this.treeFoldersStore;
 
     const categoryType = getCategoryType(location);
     const isRoom = !!roomType;
+    setSelectedFolder(null);
 
     if (
       categoryType === CategoryType.SharedRoom ||
@@ -1929,6 +1931,14 @@ class FilesActionStore {
     ) {
       return this.backToParentFolder();
     }
+
+    if (categoryType === CategoryType.Settings) {
+      setSelectedNode(["common"]);
+    }
+
+    if (categoryType === CategoryType.Accounts) {
+      setSelectedNode(["accounts", "filter"]);
+    }
   };
 
   moveToRoomsPage = () => {