Merge version_2 into main

Merge version_2 into main

src/app/page.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import React, { useState } from "react";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
 import ContactCenter from '@/components/sections/contact/ContactCenter';
@@ -13,7 +14,53 @@ import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
 import { Bell, CalendarPlus, Car, CreditCard, Mic, Music, Soup, Star, Sun, Tv, Users, Utensils, Wifi, Wine } from "lucide-react";
 
+// Helper function to parse price string to number
+const parsePrice = (priceString: string): number => {
+  return parseFloat(priceString.replace('R$', '').replace(',', '.').trim());
+};
+
+// Initial product data with base price (numeric)
+const initialProductsData = [
+  { id: "p1", name: "Carne de Sol com Macaxeira", basePrice: parsePrice("R$ 49,90"), imageSrc: "http://img.b2bpic.net/free-photo/top-close-view-dish-spices-dish-potatoes-mushrooms-cutting-board-notebook-colorful-spices-around-it_140725-117358.jpg", imageAlt: "Carne de sol com macaxeira" },
+  { id: "p2", name: "Porção Mista Especial", basePrice: parsePrice("R$ 59,90"), imageSrc: "http://img.b2bpic.net/free-photo/plate-with-various-pickles_140725-4051.jpg", imageAlt: "Porção mista especial" },
+  { id: "p3", name: "Frango Crocante", basePrice: parsePrice("R$ 39,90"), imageSrc: "http://img.b2bpic.net/free-photo/top-view-baked-chicken-veggies-plate-with-cutlery_23-2148682740.jpg", imageAlt: "Frango crocante" },
+  { id: "p4", name: "Self-Service Caseiro", basePrice: parsePrice("R$ 29,90"), imageSrc: "http://img.b2bpic.net/free-photo/top-view-food-wooden-board_23-2148725083.jpg", imageAlt: "Self-service caseiro" },
+  { id: "p5", name: "Cerveja Artesanal Gelada", basePrice: parsePrice("R$ 15,00"), imageSrc: "http://img.b2bpic.net/free-photo/beer-with-crispy-fish-hors-d-oeuvres-world-beer-day_1150-23312.jpg", imageAlt: "Cerveja artesanal gelada" },
+  { id: "p6", name: "Coquetel Dom Anderson", basePrice: parsePrice("R$ 25,00"), imageSrc: "http://img.b2bpic.net/free-photo/milky-cocktail-with-chopped-coconut-inside_114579-3224.jpg", imageAlt: "Coquetel Dom Anderson" },
+];
+
 export default function LandingPage() {
+  // State to manage products, including their current quantity and price
+  const [currentProducts, setCurrentProducts] = useState(
+    initialProductsData.map(product => ({
+      ...product,
+      quantity: 1, // Default quantity for each product
+      price: `R$ ${product.basePrice.toFixed(2).replace('.', ',')}`, // Initial formatted price string
+    }))
+  );
+
+  // Handler for quantity changes on individual products
+  const handleQuantityChange = (productId: string, newQuantity: number) => {
+    setCurrentProducts(prevProducts =>
+      prevProducts.map(product =>
+        product.id === productId
+          ? { 
+              ...product,
+              quantity: newQuantity,
+              price: `R$ ${(product.basePrice * newQuantity).toFixed(2).replace('.', ',')}`, // Recalculate and format price
+            }
+          : product
+      )
+    );
+  };
+
+  // Prepare products array for the ProductCardThree component, adding initialQuantity and onQuantityChange props
+  const productsForComponent = currentProducts.map(product => ({
+    ...product,
+    initialQuantity: product.quantity, // Pass current quantity for display in the component
+    onQuantityChange: (newQuantity: number) => handleQuantityChange(product.id, newQuantity), // Pass the specific handler for this product
+  }));
+
   return (
     <ThemeProvider
         defaultButtonVariant="bounce-effect"
@@ -170,20 +217,7 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={true}
       animationType="blur-reveal"
-      products={[
+      products={productsForComponent} // Use the state-derived products
-        {
-          id: "p1",          name: "Carne de Sol com Macaxeira",          price: "R$ 49,90",          imageSrc: "http://img.b2bpic.net/free-photo/top-close-view-dish-spices-dish-potatoes-mushrooms-cutting-board-notebook-colorful-spices-around-it_140725-117358.jpg",          imageAlt: "Carne de sol com macaxeira"},
-        {
-          id: "p2",          name: "Porção Mista Especial",          price: "R$ 59,90",          imageSrc: "http://img.b2bpic.net/free-photo/plate-with-various-pickles_140725-4051.jpg",          imageAlt: "Porção mista especial"},
-        {
-          id: "p3",          name: "Frango Crocante",          price: "R$ 39,90",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-baked-chicken-veggies-plate-with-cutlery_23-2148682740.jpg",          imageAlt: "Frango crocante"},
-        {
-          id: "p4",          name: "Self-Service Caseiro",          price: "R$ 29,90",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-food-wooden-board_23-2148725083.jpg",          imageAlt: "Self-service caseiro"},
-        {
-          id: "p5",          name: "Cerveja Artesanal Gelada",          price: "R$ 15,00",          imageSrc: "http://img.b2bpic.net/free-photo/beer-with-crispy-fish-hors-d-oeuvres-world-beer-day_1150-23312.jpg",          imageAlt: "Cerveja artesanal gelada"},
-        {
-          id: "p6",          name: "Coquetel Dom Anderson",          price: "R$ 25,00",          imageSrc: "http://img.b2bpic.net/free-photo/milky-cocktail-with-chopped-coconut-inside_114579-3224.jpg",          imageAlt: "Coquetel Dom Anderson"},
-      ]}
       title="Cardápio Destaque"
       description="Delícias preparadas com carinho, para todos os gostos e momentos. Explore nossos petiscos, pratos e bebidas."
     />