diff --git a/src/app/page.tsx b/src/app/page.tsx index e415d2b..211e3ab 100644 --- a/src/app/page.tsx +++ b/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 (