✨ Working form submission with query params

Co-authored-by: Sindre Kjelsrud <kjelsrudsindre@gmail.com>

src/App.tsx

@@ -36,7 +36,7 @@ function App() {
     } else {
       setLoading(false)
     }
-  }, [])
+  }, [location.search])
 
   const calculatePages = (totalResults: number): number => {
     return Math.round(totalResults / 10)

src/components/MovieForm/index.tsx

@@ -11,7 +11,10 @@ const MovieForm: React.FC = () => {
   return (
     <q.form
       className="flex flex-col gap-3 card p-4 rounded-lg w-full lg:px-14"
-      onSubmit={() => navigateToPage(movieTitle, movieYear, movieType)}
+      onSubmit={(e) => {
+        e.preventDefault()
+        navigateToPage(movieTitle, movieYear, movieType)
+      }}
     >
       <q.label>Choose a movie title:</q.label>
       <q.input

src/util/navigate.ts

@@ -11,6 +11,8 @@ export const useNavigateToPage = () => {
       if (type) query += `&type=${type}`
       if (year) query += `&year=${year}`
 
+      console.log(query)
+
       navigate(query)
     }
   }