web: People: Moved setup of filter url to people/actions.js

products/ASC.People/Client/src/App.js

@@ -1,6 +1,6 @@
 import React, { Suspense } from "react";
 import { connect } from "react-redux";
-import { BrowserRouter, Switch } from "react-router-dom";
+import { Router, Switch } from "react-router-dom";
 import { Loader } from "asc-web-components";
 import PeopleLayout from "./components/Layout/index";
 import Home from "./components/pages/Home";
@@ -10,6 +10,7 @@ import ProfileAction from './components/pages/ProfileAction';
 import GroupAction from './components/pages/GroupAction';
 import { Error404 } from "./components/pages/Error";
 import Reassign from './components/pages/Reassign';
+import history from './history';
 
 /*const Profile = lazy(() => import("./components/pages/Profile"));
 const ProfileAction = lazy(() => import("./components/pages/ProfileAction"));
@@ -18,7 +19,7 @@ const GroupAction = lazy(() => import("./components/pages/GroupAction"));*/
 const App = ({ settings }) => {
   const { homepage } = settings;
   return (
-    <BrowserRouter>
+    <Router history={history}>
       <PeopleLayout>
         <Suspense
           fallback={<Loader className="pageLoader" type="rombs" size={40} />}
@@ -59,7 +60,7 @@ const App = ({ settings }) => {
           </Switch>
         </Suspense>
       </PeopleLayout>
-    </BrowserRouter>
+    </Router>
   );
 };
 

products/ASC.People/Client/src/components/pages/Home/Section/Filter/index.js

@@ -1,4 +1,4 @@
-import React, { useCallback } from "react";
+import React from "react";
 import { connect } from "react-redux";
 import { FilterInput } from "asc-web-components";
 import { fetchPeople } from "../../../../../store/people/actions";
@@ -13,6 +13,17 @@ import {
 } from "./../../../../../helpers/customNames";
 import { withRouter } from "react-router";
 import Filter from "../../../../../store/people/filter";
+import {
+  EMPLOYEE_STATUS,
+  ACTIVATION_STATUS,
+  ROLE,
+  GROUP,
+  SEARCH,
+  SORT_BY,
+  SORT_ORDER,
+  PAGE,
+  PAGE_COUNT
+} from "../../../../../helpers/constants";
 
 const getEmployeeStatus = filterValues => {
   const employeeStatus = result(
@@ -58,16 +69,6 @@ const getGroup = filterValues => {
   return groupId || null;
 };
 
-const EMPLOYEE_STATUS = "employeestatus";
-const ACTIVATION_STATUS = "activationstatus";
-const ROLE = "role";
-const GROUP = "group";
-const SEARCH = "search";
-const SORT_BY = "sortby";
-const SORT_ORDER = "sortorder";
-const PAGE = "page";
-const PAGE_COUNT = "pagecount";
-
 class SectionFilterContent extends React.Component {
   componentDidMount() {
     const { location, filter, onLoading, fetchPeople } = this.props;
@@ -133,9 +134,7 @@ class SectionFilterContent extends React.Component {
   }
 
   onFilter = data => {
-    const { onLoading, fetchPeople, filter, settings, history } = this.props;
-
-    const defaultFilter = Filter.getDefault();
+    const { onLoading, fetchPeople, filter } = this.props;
 
     const employeeStatus = getEmployeeStatus(data.filterValues);
     const activationStatus = getActivationStatus(data.filterValues);
@@ -156,40 +155,6 @@ class SectionFilterContent extends React.Component {
     newFilter.search = search;
     newFilter.group = group;
 
-    const params = [];
-
-    if (employeeStatus) {
-      params.push(`${EMPLOYEE_STATUS}=${employeeStatus}`);
-    }
-
-    if (activationStatus) {
-      params.push(`${ACTIVATION_STATUS}=${activationStatus}`);
-    }
-
-    if (role) {
-      params.push(`${ROLE}=${role}`);
-    }
-
-    if (group) {
-      params.push(`${GROUP}=${group}`);
-    }
-
-    if (search) {
-      params.push(`${SEARCH}=${search}`);
-    }
-
-    if (
-      params.length > 0 ||
-      (sortBy !== defaultFilter.sortBy || sortOrder !== defaultFilter.sortOrder)
-    ) {
-      params.push(`${SORT_BY}=${sortBy}`);
-      params.push(`${SORT_ORDER}=${sortOrder}`);
-    }
-
-    if (params.length > 0) {
-      history.push(`${settings.homepage}/filter?${params.join("&")}`);
-    }
-
     onLoading(true);
     fetchPeople(newFilter).finally(() => onLoading(false));
   };
@@ -268,7 +233,13 @@ class SectionFilterContent extends React.Component {
         label: t("LblOther"),
         isHeader: true
       },
-      { key: "filter-type-group", group: "filter-other", subgroup: 'filter-group', label: t('CustomDepartment', { department }), defaultSelectLabel: t("DefaultSelectLabel") },
+      {
+        key: "filter-type-group",
+        group: "filter-other",
+        subgroup: "filter-group",
+        label: t("CustomDepartment", { department }),
+        defaultSelectLabel: t("DefaultSelectLabel")
+      },
       ...groupOptions
     ];
 

products/ASC.People/Client/src/history.js

@@ -0,0 +1,3 @@
+import { createBrowserHistory } from 'history';
+
+export default createBrowserHistory();

products/ASC.People/Client/src/store/people/actions.js

@@ -1,5 +1,18 @@
 import * as api from "../services/api";
 import Filter from "./filter";
+import history from "../../history";
+import config from "../../../package.json";
+import {
+  EMPLOYEE_STATUS,
+  ACTIVATION_STATUS,
+  ROLE,
+  GROUP,
+  SEARCH,
+  SORT_BY,
+  SORT_ORDER,
+  PAGE,
+  PAGE_COUNT
+} from "../../helpers/constants";
 
 export const SET_GROUPS = "SET_GROUPS";
 export const SET_USERS = "SET_USERS";
@@ -74,6 +87,49 @@ export function deselectUser(user) {
 }
 
 export function setFilter(filter) {
+  const defaultFilter = Filter.getDefault();
+  const params = [];
+
+  if (filter.employeeStatus) {
+    params.push(`${EMPLOYEE_STATUS}=${filter.employeeStatus}`);
+  }
+
+  if (filter.activationStatus) {
+    params.push(`${ACTIVATION_STATUS}=${filter.activationStatus}`);
+  }
+
+  if (filter.role) {
+    params.push(`${ROLE}=${filter.role}`);
+  }
+
+  if (filter.group) {
+    params.push(`${GROUP}=${filter.group}`);
+  }
+
+  if (filter.search) {
+    params.push(`${SEARCH}=${filter.search}`);
+  }
+
+  if (filter.page > 0) {
+    params.push(`${PAGE}=${filter.page + 1}`);
+  }
+
+  if (filter.pageCount !== defaultFilter.pageCount) {
+    params.push(`${PAGE_COUNT}=${filter.pageCount}`);
+  }
+
+  if (
+    params.length > 0 ||
+    (filter.sortBy !== defaultFilter.sortBy ||
+      filter.sortOrder !== defaultFilter.sortOrder)
+  ) {
+    params.push(`${SORT_BY}=${filter.sortBy}`);
+    params.push(`${SORT_ORDER}=${filter.sortOrder}`);
+  }
+
+  if (params.length > 0) {
+    history.push(`${config.homepage}/filter?${params.join("&")}`);
+  }
   return {
     type: SET_FILTER,
     filter
@@ -89,8 +145,9 @@ export function setSelectorUsers(users) {
 
 export function fetchSelectorUsers() {
   return dispatch => {
-    api.getSelectorUserList()
-    .then(res => dispatch(setSelectorUsers(res.data.response)));
+    api
+      .getSelectorUserList()
+      .then(res => dispatch(setSelectorUsers(res.data.response)));
   };
 }
 
@@ -102,7 +159,7 @@ export function fetchPeople(filter) {
 
 export function fetchPeopleByFilter(dispatch, filter) {
   let filterData = (filter && filter.clone()) || Filter.getDefault();
-  
+
   return api.getUserList(filterData).then(res => {
     filterData.total = res.data.total;
     dispatch(setFilter(filterData));

web/ASC.Web.Client/src/App.js

@@ -1,5 +1,5 @@
 import React, { Suspense, lazy } from "react";
-import { BrowserRouter, Route, Switch } from "react-router-dom";
+import { Router, Route, Switch } from "react-router-dom";
 import { Loader } from "asc-web-components";
 import StudioLayout from "./components/Layout/index";
 import Login from "./components/pages/Login";
@@ -27,7 +27,7 @@ const App = () => {
           </Switch>
         </Suspense>
       </StudioLayout>
-    </BrowserRouter>
+    </Router>
   );
 };