improved searchPage reducer

Teknologforeningen · Oct 2, 2024 · 2c7a8d6 · 2c7a8d6
1 parent f298f33
commit 2c7a8d6
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 30 deletions.
diff --git a/components/header/navbar/index.tsx b/components/header/navbar/index.tsx
@@ -98,10 +98,10 @@ const Navbar = ({
           )}
         </div>
 
-        <Row className={position === 'side' ? 'mt-6' : ''}>
+        <Row className={classNames({ 'mr-10 mt-1': position === 'side' })}>
           <button
             onClick={openSearch}
-            className={position === 'side' ? 'mr-10 mt-1' : ''}
+            className={classNames({ 'mr-10 mt-1': position === 'side' })}
           >
             <MdSearch color="white" size={32} />
           </button>

diff --git a/components/header/navbar/searchpage/index.tsx b/components/header/navbar/searchpage/index.tsx
@@ -89,17 +89,14 @@ const SearchOverlay = ({
   const debouncedHandleSearch = debounce(handleSearch, 500, debounceTimeout)
   const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const { value } = event.target
-    dispatch({ type: 'SET_IS_FETCHED', payload: false })
-    dispatch({ type: 'SET_QUERY', payload: value })
+    dispatch({ type: 'INPUT_CHANGED', payload: value })
     if (value && value.length >= 2) {
-      dispatch({ type: 'SET_SEARCHING', payload: true })
       debouncedHandleSearch([value, fileSearch])
     }
   }
 
   const toggleSearchType = () => {
-    dispatch({ type: 'SET_IS_FETCHED', payload: false })
-    dispatch({ type: 'SET_FILE_SEARCH', payload: !fileSearch })
+    dispatch({ type: 'TOGGLE_SEARCH_TYPE' })
     handleSearch(query, !fileSearch)
   }
 
@@ -178,13 +175,8 @@ const SearchOverlay = ({
                           Vill du söka filer?{' '}
                           <span
                             onClick={() => {
-                              dispatch({
-                                type: 'SET_IS_FETCHED',
-                                payload: false,
-                              })
                               dispatch({
                                 type: 'SET_FILE_SEARCH',
-                                payload: true,
                               })
                               handleSearch(query, true)
                             }}

diff --git a/components/header/navbar/searchpage/reducer.ts b/components/header/navbar/searchpage/reducer.ts
@@ -11,17 +11,14 @@ type State = {
 }
 
 type Action =
-  | { type: 'SET_QUERY'; payload: string }
-  | { type: 'SET_FILE_SEARCH'; payload: boolean }
+  | { type: 'SET_FILE_SEARCH' }
   | { type: 'SET_SEARCHING'; payload: boolean }
   | { type: 'SET_IS_FETCHED'; payload: boolean }
   | { type: 'SET_FILE_RESULTS'; payload: drive_v3.Schema$FileList }
   | { type: 'SET_RESULTS'; payload: SearchData }
   | { type: 'CLEAR_RESULTS' }
-  | {
-      type: 'APPEND_FILE_RESULTS'
-      payload: { filteredFiles: drive_v3.Schema$File[]; nextPageToken: string }
-    }
+  | { type: 'TOGGLE_SEARCH_TYPE' }
+  | { type: 'INPUT_CHANGED'; payload: string }
 
 export const initialState: State = {
   query: '',
@@ -39,10 +36,8 @@ export const initialState: State = {
 
 export const searchReducer = (state: State, action: Action): State => {
   switch (action.type) {
-    case 'SET_QUERY':
-      return { ...state, query: action.payload }
     case 'SET_FILE_SEARCH':
-      return { ...state, fileSearch: action.payload }
+      return { ...state, fileSearch: true, isFetched: false }
     case 'SET_SEARCHING':
       return { ...state, searching: action.payload }
     case 'SET_IS_FETCHED':
@@ -51,16 +46,14 @@ export const searchReducer = (state: State, action: Action): State => {
       return { ...state, fileResults: action.payload }
     case 'SET_RESULTS':
       return { ...state, results: action.payload }
-    case 'APPEND_FILE_RESULTS':
+    case 'TOGGLE_SEARCH_TYPE':
+      return { ...state, fileSearch: !state.fileSearch, isFetched: false }
+    case 'INPUT_CHANGED':
       return {
         ...state,
-        fileResults: {
-          files: [
-            ...(state.fileResults.files ?? []),
-            ...(action.payload.filteredFiles || []),
-          ],
-          nextPageToken: action.payload.nextPageToken,
-        },
+        query: action.payload,
+        isFetched: false,
+        searching: action.payload.length >= 2,
       }
     case 'CLEAR_RESULTS':
       return { ...initialState, fileSearch: state.fileSearch }

diff --git a/next-env.d.ts b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/basic-features/typescript for more information.