only front-end init

contexts/CartContext.tsx

@@ -0,0 +1,74 @@
+"use client";
+
+import React, { createContext, useContext, useState, ReactNode } from "react";
+import { Product } from "@/data/products";
+
+export interface CartItem {
+  product: Product;
+  quantity: number;
+  selectedColor: string;
+  selectedLength: string;
+}
+
+interface CartContextType {
+  items: CartItem[];
+  addItem: (product: Product, color: string, length: string) => void;
+  removeItem: (productId: string) => void;
+  updateQuantity: (productId: string, quantity: number) => void;
+  clearCart: () => void;
+  totalItems: number;
+  totalPrice: number;
+  isCartOpen: boolean;
+  setIsCartOpen: (open: boolean) => void;
+}
+
+const CartContext = createContext<CartContextType | undefined>(undefined);
+
+export const CartProvider = ({ children }: { children: ReactNode }) => {
+  const [items, setItems] = useState<CartItem[]>([]);
+  const [isCartOpen, setIsCartOpen] = useState(false);
+
+  const addItem = (product: Product, color: string, length: string) => {
+    setItems((prev) => {
+      const existing = prev.find((i) => i.product.id === product.id && i.selectedColor === color && i.selectedLength === length);
+      if (existing) {
+        return prev.map((i) =>
+          i.product.id === product.id && i.selectedColor === color && i.selectedLength === length
+            ? { ...i, quantity: i.quantity + 1 }
+            : i
+        );
+      }
+      return [...prev, { product, quantity: 1, selectedColor: color, selectedLength: length }];
+    });
+    setIsCartOpen(true);
+  };
+
+  const removeItem = (productId: string) => {
+    setItems((prev) => prev.filter((i) => i.product.id !== productId));
+  };
+
+  const updateQuantity = (productId: string, quantity: number) => {
+    if (quantity <= 0) {
+      removeItem(productId);
+      return;
+    }
+    setItems((prev) => prev.map((i) => (i.product.id === productId ? { ...i, quantity } : i)));
+  };
+
+  const clearCart = () => setItems([]);
+
+  const totalItems = items.reduce((sum, i) => sum + i.quantity, 0);
+  const totalPrice = items.reduce((sum, i) => sum + i.product.price * i.quantity, 0);
+
+  return (
+    <CartContext.Provider value={{ items, addItem, removeItem, updateQuantity, clearCart, totalItems, totalPrice, isCartOpen, setIsCartOpen }}>
+      {children}
+    </CartContext.Provider>
+  );
+};
+
+export const useCart = () => {
+  const context = useContext(CartContext);
+  if (!context) throw new Error("useCart must be used within CartProvider");
+  return context;
+};