From 90b6256a4efe9642a83f198c17a4184535e5e3f0 Mon Sep 17 00:00:00 2001
From: bkellam <bshizzle1234@gmail.com>
Date: Sat, 24 Aug 2024 20:10:01 -0700
Subject: [PATCH] Set query param to empty when input box is empty

---
 src/app/page.tsx | 26 ++++++++++++--------------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 2c61ce1a..bc19480c 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -28,13 +28,14 @@ interface ZoekFileMatch {
     URL: string,
 }
 
-interface ZoekSearchResult {
-    result: {
-        QueryStr: string,
-        FileMatches: ZoekFileMatch[] | null,
-    }
+interface ZoekResult {
+    QueryStr: string,
+    FileMatches: ZoekFileMatch[] | null,
 }
 
+interface ZoekSearchResponse {
+    result: ZoekResult;
+}
 
 export default function Home() {
     const router = useRouter();
@@ -67,9 +68,8 @@ export default function Home() {
                     query={query}
                     numResults={numResults}
                     onQueryChange={(query) => setQuery(query)}
-                    onClear={() => setFileMatches([])}
-                    onSearchResult={({ result }) => {
-                        setFileMatches(result.FileMatches ?? []);
+                    onSearchResult={(result) => {
+                        setFileMatches(result?.FileMatches ?? []);
                         router.push(`?query=${query}&numResults=${numResults}`);
                     }}
                 />
@@ -91,8 +91,7 @@ interface SearchBarProps {
     query: string;
     numResults: number;
     onQueryChange: (query: string) => void;
-    onSearchResult: (result: ZoekSearchResult) => void,
-    onClear: () => void,
+    onSearchResult: (result?: ZoekResult) => void,
 }
 
 const SearchBar = ({
@@ -100,20 +99,19 @@ const SearchBar = ({
     numResults,
     onQueryChange,
     onSearchResult,
-    onClear,
 }: SearchBarProps) => {
     const SEARCH_DEBOUNCE_MS = 200;
 
     const search = useDebouncedCallback((query: string) => {
         if (query === "") {
-            onClear();
+            onSearchResult(undefined);
             return;
         }
         console.log('making query...');
         fetch(`http://localhost:3000/zoekt/search?query=${query}&numResults=${numResults}`)
             .then(response => response.json())
-            .then(({ data }: { data: ZoekSearchResult }) => {
-                onSearchResult(data);
+            .then(({ data }: { data: ZoekSearchResponse }) => {
+                onSearchResult(data.result);
             })
             // @todo : error handling
             .catch(error => {