refactor(frontend): remove useFiltersNext; refactor the current useFi…

…lters
MTES-MCT · Nov 13, 2024 · b9b66b1 · b9b66b1
1 parent 4ff486c
commit b9b66b1
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 93 deletions.
diff --git a/frontend/src/hooks/useFilters.tsx b/frontend/src/hooks/useFilters.tsx
@@ -1,10 +1,8 @@
 import { useMemo, useState } from 'react';
 import housingSlice, {
-  initialHousingFilters,
+  initialHousingFilters
 } from '../store/reducers/housingReducer';
 import { HousingFilters } from '../models/HousingFilters';
-import { TrackEventActions, TrackEventCategories } from '../models/TrackEvent';
-import { useMatomo } from '@jonkoops/matomo-tracker-react';
 import { useAppDispatch, useAppSelector } from './useStore';
 
 interface FiltersOptions {
@@ -17,7 +15,6 @@ interface FiltersOptions {
 
 export function useFilters(opts?: FiltersOptions) {
   const dispatch = useAppDispatch();
-  const { trackEvent } = useMatomo();
   const initialState = opts?.initialState ?? initialHousingFilters;
 
   const storage = opts?.storage ?? 'store';
@@ -31,10 +28,6 @@ export function useFilters(opts?: FiltersOptions) {
   const [filters, setFilters] =
     storage === 'store' ? [store.filters, changeFilters] : state;
 
-  const establishment = useAppSelector(
-    (state) => state.authentication.authUser?.establishment,
-  );
-
   const { filtersExpanded: expand } = useAppSelector((state) => state.housing);
   const { expandFilters } = housingSlice.actions;
 
@@ -45,42 +38,17 @@ export function useFilters(opts?: FiltersOptions) {
   function removeFilter(removed: HousingFilters) {
     setFilters({
       ...filters,
-      ...removed,
+      ...removed
     });
   }
 
   const length = useMemo<number>(() => Object.keys(filters).length, [filters]);
 
-  function onChange(changed: HousingFilters, filterLabel?: string): void {
+  function onChange(changed: HousingFilters): void {
     setFilters({
       ...filters,
-      ...changed,
+      ...changed
     });
-    if (filterLabel) {
-      trackNewFilter(changed, filterLabel);
-    }
-  }
-
-  function trackNewFilter(changedFilters: HousingFilters, filterLabel: string) {
-    const filterEntry = Object.entries(changedFilters)[0];
-    const prevFilterEntry = Object.entries(filters).find(
-      (_) => _[0] === filterEntry[0],
-    );
-    const filterValues = filterEntry[1] as Array<string>;
-    const prevFilterValues = prevFilterEntry
-      ? (prevFilterEntry[1] as Array<string>)
-      : [];
-    const newValues = filterValues.filter
-      ? filterValues.filter((_) => prevFilterValues?.indexOf(_) === -1)
-      : [];
-    if (newValues.length) {
-      trackEvent({
-        category: TrackEventCategories.Filter,
-        action: TrackEventActions.Filter(filterLabel),
-        name: newValues.toString(),
-        value: establishment?.siren,
-      });
-    }
   }
 
   function onReset(): void {
@@ -95,6 +63,6 @@ export function useFilters(opts?: FiltersOptions) {
     removeFilter,
     onChangeFilters: onChange,
     onResetFilters: onReset,
-    setExpand,
+    setExpand
   };
 }
diff --git a/frontend/src/hooks/useFiltersNext.ts b/frontend/src/hooks/useFiltersNext.ts
diff --git a/frontend/src/views/Group/GroupView.tsx b/frontend/src/views/Group/GroupView.tsx
@@ -26,14 +26,13 @@ import {
   useFindCampaignsQuery
 } from '../../services/campaign.service';
 import NotFoundView from '../NotFoundView';
-import { useFilters } from '../../hooks/useFiltersNext';
+import { useFilters } from '../../hooks/useFilters';
 
 interface RouterState {
   alert?: string;
 }
 
 function GroupView() {
-  const router = useHistory<RouterState | undefined>();
   const { id } = useParams<{ id: string }>();
 
   const { data: group, isLoading: isLoadingGroup } = useGetGroupQuery(id);
@@ -42,13 +41,14 @@ function GroupView() {
 
   const {
     filters,
-    expand,
-    removeFilters,
-    setExpand,
+    removeFilter: removeFilters,
     setFilters: onChangeFilters,
-    resetFilters: onResetFilters
+    onResetFilters,
+    expand,
+    setExpand
   } = useFilters({
-    initialFilters: {
+    storage: 'state',
+    initialState: {
       groupIds: [id]
     }
   });
@@ -61,6 +61,7 @@ function GroupView() {
 
   const { view } = useAppSelector((state) => state.housing);
 
+  const router = useHistory<RouterState | undefined>();
   const alert = router.location.state?.alert ?? '';
   const [removeGroup] = useRemoveGroupMutation();
   async function onGroupRemove(): Promise<void> {

diff --git a/frontend/src/views/HousingList/HousingListView.tsx b/frontend/src/views/HousingList/HousingListView.tsx
@@ -31,9 +31,11 @@ const HousingListView = () => {
     filters,
     setExpand,
     setFilters,
+    onChangeFilters,
     onResetFilters,
     removeFilter
   } = useFilters({
+    storage: 'store',
     initialState: initialHousingFilters
   });
 
@@ -66,7 +68,7 @@ const HousingListView = () => {
       <HousingListFiltersSidemenu
         filters={filters}
         expand={expand}
-        onChange={setFilters}
+        onChange={onChangeFilters}
         onReset={onResetFilters}
         onClose={() => setExpand(false)}
       />