Merge pull request '(FEAT): Added the view all button for Connor!' (#74) from feature/view-all into master

Reviewed-on: #74

web/src/components/inputs/RecipeSearchBar.tsx

@@ -7,10 +7,9 @@ import { isApiError } from "../../types/api/error";
 import type { Recipe } from "../../types/recipe";
 import { useNavigate } from "react-router-dom";
 import { FilterContext } from "../../context/FilterContext";
+import ROUTE_CONSTANTS from "../../types/routes";
 
 interface RecipeSearchBarProps {
-  // filters: SearchFilters;
-  // setFilters: React.Dispatch<React.SetStateAction<SearchFilters>>;
   redirect: boolean;
   searchOnLoad: boolean;
   favorites: boolean;
@@ -30,7 +29,7 @@ export default function RecipeSearchBar({ redirect, searchOnLoad, favorites, set
   // SERVER FUNCTIONS
   const fetchSearchResults = async () => {
     if (redirect) {
-      await navigate("/v2/web/search");
+      await navigate(ROUTE_CONSTANTS.Search);
       return;
     }
 
@@ -39,7 +38,7 @@ export default function RecipeSearchBar({ redirect, searchOnLoad, favorites, set
     if (setLoading) setLoading(true);
 
     try {
-      const result = await SearchRecipes(filters);
+      const result = await SearchRecipes({ ...filters, Favorites: favorites });
       if (isApiError(result)) {
         console.error(result.message);
         return;
@@ -76,14 +75,6 @@ export default function RecipeSearchBar({ redirect, searchOnLoad, favorites, set
       void fetchSearchResults();
   }, [searchOnLoad]);
 
-  useEffect(() => {
-    setFilters({
-      ...filters,
-      Favorites: favorites
-    });
-  }, [favorites]);
-
-
   return (
     <form className="w-full px-4 my-8" onSubmit={(e) => void searchHandler(e)}>
       <div className="flex w-full gap-x-2">

web/src/pages/Home.tsx

@@ -88,7 +88,12 @@ export default function Home() {
         <div className="w-full md:w-3/4">
           <RecipeSearchBar redirect={true} favorites={false} searchOnLoad={false} setRecipes={null} />
         </div>
-        <div className="hidden" id="result-list"></div>
+        <p className="leading-relaxed text-gray-800">
+          Not sure what you want? {" "}
+          <a href={ROUTE_CONSTANTS.Search} className="text-blue-500 underline hover:text-blue-700 duration-300">
+            View all recipes here
+          </a>
+        </p>
       </section>
 
       {/* Highlight Section */}

web/src/types/filters.ts

@@ -1,4 +0,0 @@
-export interface SearchFilters {
-
-
-}

web/src/types/routes.ts

@@ -8,6 +8,7 @@ const ROUTE_CONSTANTS: {
   ShoppingList: string;
   Login: string;
   History: string;
+  Search: string;
   Recipe: (id: number) => string;
 } = {
   Home: `${VERSION_FLAG}/web/home`,
@@ -17,6 +18,7 @@ const ROUTE_CONSTANTS: {
   ShoppingList: `${VERSION_FLAG}/web/list`,
   Login: `${VERSION_FLAG}/web/login`,
   History: `${VERSION_FLAG}/web/history`,
+  Search: `${VERSION_FLAG}/web/search`,
   Recipe: (id: number) => `${VERSION_FLAG}/web/recipe/${id}`,
 };