web/src/context/FilterContext.tsx

@@ -4,7 +4,6 @@ import type { SearchFilters } from "../types/search";
 interface FilterContextType {
   filters: SearchFilters;
   setFilters: (filters: SearchFilters) => void;
-  resetFilters: () => void;
 }
 
 export const FilterContext = createContext<FilterContextType>({
@@ -17,5 +16,4 @@ export const FilterContext = createContext<FilterContextType>({
     Favorites: false,
   },
   setFilters: () => { return },
-  resetFilters: () => { return },
 });

web/src/context/FilterProvider.tsx

@@ -36,7 +36,7 @@ export function FilterProvider({ children }: { children: ReactNode }) {
   }, [filters]);
 
   return (
-    <FilterContext value={{ filters, setFilters, resetFilters: () => setFilters(DEFAULT_FILTERS) }}>
+    <FilterContext value={{ filters, setFilters }}>
       {children}
     </FilterContext>
   )

web/src/pages/Home.tsx

@@ -12,13 +12,10 @@ import { GetRecipeOfTheWeek } from "../services/RecipeService";
 import { isApiError, type ApiError } from "../types/api/error";
 import { AuthContext } from "../context/AuthContext";
 import { GetAuthenticatedUserMadeRecipes, GetAuthenticateUserViewedRecipes } from "../services/UserService";
-import { useNavigate } from "react-router-dom";
-import { FilterContext } from "../context/FilterContext";
 
 export default function Home() {
   // Context
   const { isLoggedIn } = use(AuthContext);
-  const { resetFilters } = use(FilterContext);
 
   // Page state
   const [recipeOfTheWeek, setRecipeOfTheWeek] = useState<Recipe | null>(null);
@@ -27,7 +24,6 @@ export default function Home() {
   const [viewedRecipes, setViewedRecipes] = useState<Recipe[]>([]);
 
   const [error, setError] = useState<string>("");
-  const navigate = useNavigate();
 
   // Fetch the recipe of the week
   useEffect(() => {
@@ -59,12 +55,6 @@ export default function Home() {
     void fetch();
   }, [isLoggedIn]);
 
-  const viewAllRecipesHandler = () => {
-    // Clear filters
-    resetFilters();
-    void navigate(ROUTE_CONSTANTS.Search);
-  }
-
   // BUG: Prob remove
   useEffect(() => {
     if (error)
@@ -100,11 +90,8 @@ export default function Home() {
         </div>
         <p className="leading-relaxed text-gray-800">
           Not sure what you want? {" "}
-          <button onClick={viewAllRecipesHandler} className="text-blue-500 underline hover:text-blue-700 duration-300 cursor-pointer">
-            View all recipes here
-          </button>
-
           <a href={ROUTE_CONSTANTS.Search} className="text-blue-500 underline hover:text-blue-700 duration-300">
+            View all recipes here
           </a>
         </p>
       </section>