feat!: Enable "See all nnn results" button on search results

[#OCD-4339]
mattystank · Feb 13, 2024 · 0fdad6f · 0fdad6f
1 parent 6f9c717
commit 0fdad6f
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 4 deletions.
diff --git a/src/app/components/filter/filter-context.jsx b/src/app/components/filter/filter-context.jsx
@@ -236,6 +236,11 @@ function FilterProvider(props) {
           })),
         })));
         break;
+      case 'seeAllTextSearchResults':
+        filters.forEach((c) => {
+          clearFilter(filters.find((f) => f.key === c.key), c, setFilters);
+        });
+        break;
       case 'setFilterDisability':
         setFilterDisability(filters, category, value, setFilters);
         break;

diff --git a/src/app/pages/collections/search/search-view.jsx b/src/app/pages/collections/search/search-view.jsx
@@ -1,5 +1,6 @@
 import React, { useContext, useEffect, useState } from 'react';
 import {
+  Button,
   Box,
   Paper,
   Table,
@@ -131,6 +132,7 @@ function ChplSearchView(props) {
   const [editionlessIsOn, setEditionlessIsOn] = useState(false);
   const [headers, setHeaders] = useState(initialHeaders);
   const [listings, setListings] = useState([]);
+  const [searchTermRecordCount, setSearchTermRecordCount] = useState(undefined);
   const [orderBy, setOrderBy] = useStorage(`${storageKey}-orderBy`, 'developer');
   const [pageNumber, setPageNumber] = useStorage(`${storageKey}-pageNumber`, 0);
   const [pageSize, setPageSize] = useStorage(`${storageKey}-pageSize`, 25);
@@ -158,7 +160,8 @@ function ChplSearchView(props) {
       ...listing,
     })));
     setRecordCount(data.recordCount);
-  }, [data?.directReviewsAvailable, data?.results, data?.recordCount, isError, isLoading, analytics]);
+    setSearchTermRecordCount(data.searchTermRecordCount);
+  }, [data?.directReviewsAvailable, data?.results, data?.recordCount, data?.searchTeramRecordCount, isError, isLoading, analytics]);
 
   useEffect(() => {
     if (data?.recordCount > 0 && pageNumber > 0 && data?.results?.length === 0) {
@@ -186,6 +189,10 @@ function ChplSearchView(props) {
     setSortDescending(orderDirection === 'desc');
   };
 
+  const seeAllResults = () => {
+    dispatch('seeAllTextSearchResults');
+  };
+
   const pageStart = (pageNumber * pageSize) + 1;
   const pageEnd = Math.min((pageNumber + 1) * pageSize, recordCount);
 
@@ -231,9 +238,19 @@ function ChplSearchView(props) {
                 <Typography variant="subtitle2">Search Results:</Typography>
                 { listings.length === 0
                   && (
-                    <Typography>
-                      No results found
-                    </Typography>
+                    <>
+                      <Typography>
+                        No results found
+                      </Typography>
+                      { searchTermRecordCount > 0
+                        && (
+                          <Button
+                            onClick={seeAllResults}
+                          >
+                            { `See ${searchTermRecordCount} more?` }
+                          </Button>
+                        )}
+                    </>
                   )}
                 { listings.length > 0
                   && (