feat: add cart and product pages, quantity controls, and first-visit development notice

components/HorizontalShowcase.tsx

@@ -1,16 +1,11 @@
 'use client';
 
-import type {Machine} from '@/types/domain';
 import {useEffect, useRef, useState} from 'react';
 import {gsap} from 'gsap';
 import {ScrollTrigger} from 'gsap/ScrollTrigger';
-import {Modal, Button, message} from 'antd';
-import {ShoppingCartOutlined} from '@ant-design/icons';
-import {useAppDispatch} from '@/store/hooks';
 import VendingCard from './VendingCard';
 import {showcaseVideoSrc} from '@/data/content';
 import {useLanguage} from '@/app/context/LanguageContext';
-import {addToCart} from '@/store/cartSlice';
 
 gsap.registerPlugin(ScrollTrigger);
 
@@ -18,9 +13,7 @@ export default function HorizontalShowcase() {
     const sectionRef = useRef<HTMLElement>(null);
     const trackRef = useRef<HTMLDivElement>(null);
     const videoRef = useRef<HTMLVideoElement>(null);
-    const dispatch = useAppDispatch();
     const {t} = useLanguage();
-    const [quickViewMachine, setQuickViewMachine] = useState<Machine | null>(null);
     const [videoAvailable, setVideoAvailable] = useState(true);
 
     useEffect(() => {
@@ -74,23 +67,6 @@ export default function HorizontalShowcase() {
         return () => ctx.revert();
     }, []);
 
-    const handleModalAddToCart = () => {
-        if (!quickViewMachine) return;
-
-        dispatch(
-            addToCart({
-                id: quickViewMachine.id,
-                name: quickViewMachine.name,
-                priceNumeric: quickViewMachine.priceNumeric,
-                priceLabel: quickViewMachine.priceLabel,
-                image: quickViewMachine.image,
-            })
-        );
-
-        message.success(t.cart.addToast(quickViewMachine.name));
-        setQuickViewMachine(null);
-    };
-
     return (
         <section id="showcase" ref={sectionRef} className="relative w-full overflow-hidden">
             <div className="absolute inset-0 z-0">
@@ -116,37 +92,10 @@ export default function HorizontalShowcase() {
 
             <div ref={trackRef} className="horizontal-track relative z-10" dir="ltr">
                 {t.machines.map((machine) => (
-                    <VendingCard key={machine.id} machine={machine} onQuickView={setQuickViewMachine}/>
+                    <VendingCard key={machine.id} machine={machine}/>
                 ))}
             </div>
 
-            <Modal
-                open={!!quickViewMachine}
-                onCancel={() => setQuickViewMachine(null)}
-                footer={null}
-                centered
-                title={quickViewMachine?.name}
-            >
-                {quickViewMachine && (
-                    <div className="flex flex-col gap-4">
-                        <img
-                            src={quickViewMachine.image}
-                            alt={quickViewMachine.name}
-                            className="w-full h-64 object-contain"
-                        />
-                        <p className="text-secondary leading-7">{quickViewMachine.description}</p>
-                        <p className="text-xl font-bold text-primary">{quickViewMachine.priceLabel}</p>
-                        <Button
-                            type="primary"
-                            size="large"
-                            icon={<ShoppingCartOutlined/>}
-                            onClick={handleModalAddToCart}
-                        >
-                            {t.machineActions.addToCart}
-                        </Button>
-                    </div>
-                )}
-            </Modal>
         </section>
     );
 }