fix order search result

SocialGouv · Aug 29, 2024 · 6000236 · 6000236
1 parent b442726
commit 6000236
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 25 deletions.
diff --git a/src/client/src/components/Search/Search.js b/src/client/src/components/Search/Search.js
@@ -35,6 +35,7 @@ const Search = ({
   searchTerm,
   setSearchTerm,
   resetSearch,
+  resetSort,
   handlePageChange,
   addFilter,
   removeFilter,
@@ -105,6 +106,7 @@ const Search = ({
                     })}
                     onClick={(e) => {
                       e.preventDefault();
+                      resetSort();
                       sendRequest(searchTerm, options);
                     }}
                   >
@@ -257,6 +259,7 @@ Search.propTypes = {
   removeFilter: PropTypes.func.isRequired,
   removeFilters: PropTypes.func.isRequired,
   resetSearch: PropTypes.func.isRequired,
+  resetSort: PropTypes.func.isRequired,
   results: PropTypes.array,
   searchTerm: PropTypes.string.isRequired,
   sendRequest: PropTypes.func.isRequired,

diff --git a/src/client/src/containers/Search/Search.js b/src/client/src/containers/Search/Search.js
@@ -8,6 +8,7 @@ import SearchView from "../../components/Search";
 import Http from "../../services/Http";
 import {
   useResetSearch,
+  useResetSort,
   useSearchFilters,
   useSearchPage,
   useSearchQuery,
@@ -60,17 +61,15 @@ const Search = () => {
 
   const { data, loading, error, makeQuery, query } = useSearchQuery();
   const resetSearch = useResetSearch();
+  const resetSort = useResetSort();
   useEffect(() => {
     if (searchQuery) {
       onSearch();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   useEffect(() => {
-    if (sortField && sortDirection) {
-      onSearch();
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    onSearch();
   }, [sortField, sortDirection]);
 
   const downloadQuery = async () => {
@@ -141,6 +140,7 @@ const Search = () => {
       searchTerm={searchQuery || ""}
       setSearchTerm={setSearchQuery}
       resetSearch={resetSearch}
+      resetSort={resetSort}
       handlePageChange={handlePageChange}
       addFilter={addFilter}
       removeFilter={removeFilter}

diff --git a/src/client/src/services/Store/actions/search.js b/src/client/src/services/Store/actions/search.js
@@ -45,3 +45,9 @@ export const resetSearch = () => (dispatch) => {
     type: types.RESET_SEARCH,
   });
 };
+
+export const resetSort = () => (dispatch) => {
+  dispatch({
+    type: types.RESET_SORT,
+  });
+};
diff --git a/src/client/src/services/Store/constants/ActionTypes.js b/src/client/src/services/Store/constants/ActionTypes.js
@@ -6,3 +6,4 @@ export const SET_SEARCH_FILTERS = "SET_SEARCH_FILTERS";
 export const SET_SEARCH_SORT = "SET_SEARCH_SORT";
 export const SET_SEARCH_RESULTS = "SET_SEARCH_RESULTS";
 export const RESET_SEARCH = "RESET_SEARCH";
+export const RESET_SORT = "RESET_SORT";
diff --git a/src/client/src/services/Store/hooks/search.js b/src/client/src/services/Store/hooks/search.js
@@ -5,6 +5,7 @@ import { useDispatch, useSelector } from "react-redux";
 import { useElasticQuery } from "../../Elastic/elastic";
 import {
   resetSearch,
+  resetSort,
   setSearchFilters,
   setSearchPage as setSearchPageAction,
   setSearchResults,
@@ -117,3 +118,8 @@ export const useResetSearch = () => {
 
   return () => dispatch(resetSearch());
 };
+export const useResetSort = () => {
+  const dispatch = useDispatch();
+
+  return () => dispatch(resetSort());
+};
diff --git a/src/client/src/services/Store/reducers/search.js b/src/client/src/services/Store/reducers/search.js
@@ -1,5 +1,6 @@
 import {
   RESET_SEARCH,
+  RESET_SORT,
   SET_SEARCH_FILTERS,
   SET_SEARCH_PAGE,
   SET_SEARCH_RESULTS,
@@ -52,6 +53,15 @@ const search = (state = initialState, action) => {
           sortField: action.sortField,
         },
       };
+    case RESET_SORT:
+      return {
+        ...state,
+        sort: {
+          ...state.sort,
+          sortField: null,
+          sortOrder: null,
+        },
+      };
 
     case SET_SEARCH_PAGE:
       return {

diff --git a/src/client/src/utils/search-table/hooks.js b/src/client/src/utils/search-table/hooks.js
@@ -43,33 +43,29 @@ export const useSort = () => {
 
   const toggleSortField = (field) => {
     if (field !== sortField) {
+      // Set a new sort field and default direction to "desc"
       setSortField(field);
       setSearchSortField(field);
-
-      addFilter("sortField", field);
-      addFilter("sortDirection", "desc");
-      setSortDirection("desc");
-      setSearchSortOrder("desc");
-      return;
-    }
-
-    if (sortDirection === "desc") {
-      setSortDirection("asc");
-      setSearchSortOrder("asc");
-      addFilter("sortDirection", "asc");
-
-      return;
-    }
-    if (sortDirection === "asc") {
       setSortDirection("desc");
       setSearchSortOrder("desc");
+      addFilter("sortField", field);
       addFilter("sortDirection", "desc");
-
-      return;
+    } else {
+      // Toggling sort direction if field is the same
+      if (sortDirection === "desc") {
+        setSortDirection("asc");
+        setSearchSortOrder("asc");
+        addFilter("sortDirection", "asc");
+      } else if (sortDirection === "asc") {
+        // Reset on the third click
+        setSortField(null);
+        setSortDirection(null);
+        setSearchSortField(null);
+        setSearchSortOrder(null);
+        addFilter("sortField", null);
+        addFilter("sortDirection", null);
+      }
     }
-
-    setSortField(null);
-    setSortDirection(null);
   };
 
   return {