fix(ui): url search params

frontend/app/components/shared/SessionSearch/SessionSearch.tsx

@@ -14,11 +14,7 @@ import useSessionSearchQueryHandler from 'App/hooks/useSessionSearchQueryHandler
 let debounceFetch: any = () => {
 };
 
-interface Props {
-
-}
-
-function SessionSearch(props: Props) {
+function SessionSearch() {
   const { tagWatchStore, aiFiltersStore, searchStore, customFieldStore, projectsStore } = useStore();
   const appliedFilter = searchStore.instance;
   const metaLoading = customFieldStore.isLoading;
@@ -28,7 +24,6 @@ function SessionSearch(props: Props) {
 
   useSessionSearchQueryHandler({
     appliedFilter,
-    applyFilter: searchStore.updateFilter,
     loading: metaLoading,
     onBeforeLoad: async () => {
       const tags = await tagWatchStore.getTags();

frontend/app/hooks/useSessionSearchQueryHandler.ts

@@ -1,17 +1,18 @@
 import { useEffect, useState } from 'react';
 import { useHistory } from 'react-router';
 import { createUrlQuery, getFiltersFromQuery } from 'App/utils/search';
+import { useStore } from '@/mstore';
 
 interface Props {
   onBeforeLoad?: () => Promise<any>;
   appliedFilter: any;
-  applyFilter: any;
   loading: boolean;
 }
 
 const useSessionSearchQueryHandler = (props: Props) => {
+  const { searchStore } = useStore();
   const [beforeHookLoaded, setBeforeHookLoaded] = useState(!props.onBeforeLoad);
-  const { appliedFilter, applyFilter, loading } = props;
+  const { appliedFilter, loading } = props;
   const history = useHistory();
 
   useEffect(() => {
@@ -21,8 +22,9 @@ const useSessionSearchQueryHandler = (props: Props) => {
           await props.onBeforeLoad();
           setBeforeHookLoaded(true);
         }
+
         const filter = getFiltersFromQuery(history.location.search, appliedFilter);
-        applyFilter(filter, true, false);
+        searchStore.applyFilter(filter, true);
       }
     };
 

frontend/app/utils/search.ts

@@ -1,7 +1,7 @@
 import { getFilterKeyTypeByKey, setQueryParamKeyFromFilterkey } from 'Types/filter/filterType';
 import Period, { CUSTOM_RANGE } from 'Types/app/period';
-import Filter from 'Types/filter/filter';
 import { filtersMap } from 'Types/filter/newFilter';
+import Search from '@/mstore/types/search';
 
 type QueryItem = {
   key: any;
@@ -52,7 +52,7 @@ export const getFiltersFromQuery = (search: string, filter: any) => {
   const period: any = getPeriodFromEntries(entries);
   const filters = getFiltersFromEntries(entries);
 
-  return Filter({ filters, rangeValue: period.rangeName, startDate: period.start, endDate: period.end });
+  return new Search({ filters, rangeValue: period.rangeName, startDate: period.start, endDate: period.end });
 };
 
 const getFiltersFromEntries = (entries: any) => {
@@ -126,7 +126,7 @@ const getPeriodFromEntries = (entries: any) => {
 };
 
 function getQueryObject(search: any) {
-  let jsonArray = search
+  return search
     .slice(1)
     .split('&')
     .map((item: any) => {
@@ -134,5 +134,4 @@ function getQueryObject(search: any) {
       key = key.replace('[]', '');
       return { key: key, value: decodeURI(value) };
     });
-  return jsonArray;
 }