Bob AI: Can you add a button to see the entire menu and cr...

src/components/sections/product/ProductCardTwo.tsx

@@ -11,6 +11,7 @@ import type { Product } from "@/lib/api/product";
 import type { LucideIcon } from "lucide-react";
 import type { ButtonConfig, GridVariant, CardAnimationType, TitleSegment } from "@/components/cardStack/types";
 import type { TextboxLayout, InvertedBackground } from "@/providers/themeProvider/config/constants";
+import { useRouter } from "next/navigation";
 
 type ProductCardTwoGridVariant = Exclude<GridVariant, "timeline" | "one-large-right-three-stacked-left" | "items-top-row-full-width-bottom" | "full-width-top-items-bottom-row" | "one-large-left-three-stacked-right">;
 
@@ -178,6 +179,7 @@ const ProductCardTwo = ({
     const { products: fetchedProducts, isLoading } = useProducts();
     const products = (fetchedProducts.length > 0 ? fetchedProducts : productsProp) as ProductCard[];
     const shouldUseLightText = shouldUseInvertedText(useInvertedBackground, theme.cardStyle);
+    const router = useRouter();
 
     const customGridRows = (gridVariant === "bento-grid" || gridVariant === "bento-grid-inverted")
         ? "md:grid-rows-[22rem_22rem] 2xl:grid-rows-[26rem_26rem]"
@@ -237,6 +239,12 @@ const ProductCardTwo = ({
                     actionButtonClassName={actionButtonClassName}
                 />
             ))}
+            <button
+                className="text-accent hover:text-accent-hover"
+                onClick={() => router.push("/menu")}
+            >
+                View Full Menu
+            </button>
         </CardStack>
     );
 };