@armoyu/ui 1.0.0 → 1.0.2

package/src/components/shared/LoginModal.tsx

@@ -1,208 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { Button } from '../Button';
-import { useAuth } from '../../context/AuthContext';
-import { userList } from '../../lib/constants/seedData';
-
-export function LoginModal({ isOpen, onClose }: { isOpen: boolean; onClose: () => void }) {
-  const { login } = useAuth();
-  const [isSubmitting, setIsSubmitting] = React.useState(false);
-  const [username, setUsername] = React.useState('');
-  const [password, setPassword] = React.useState('');
-  const [error, setError] = React.useState('');
-
-  // QR Kod State'leri
-  const [qrValue, setQrValue] = React.useState('');
-  const [qrProgress, setQrProgress] = React.useState(100);
-
-  // Modal açıldığında form verilerinin ve QR kodun yönetimi
-  React.useEffect(() => {
-    if (!isOpen) {
-      setUsername('');
-      setPassword('');
-      setError('');
-      return;
-    }
-
-    const generateQR = () => {
-      // Gerçek senaryoda bu veri backend'den dönen ve JWT içeren tek kullanımlık bir token olur.
-      setQrValue(`armoyu_mobile_auth_${Math.random().toString(36).substring(2, 15)}`);
-      setQrProgress(100);
-    };
-
-    generateQR();
-
-    const refreshInterval = setInterval(() => {
-      generateQR();
-    }, 20000); // Her 20 saniyede bir yenilenir
-
-    const progressInterval = setInterval(() => {
-      // 20 saniyelik süreci 100 parçaya bölerek her 100ms'de azaltır
-      setQrProgress((prev) => Math.max(0, prev - (100 / (20000 / 100)))); 
-    }, 100);
-
-    return () => {
-      clearInterval(refreshInterval);
-      clearInterval(progressInterval);
-    };
-  }, [isOpen]);
-
-  if (!isOpen) return null;
-
-  const handleLogin = (e: React.FormEvent) => {
-    e.preventDefault();
-    setError('');
-    setIsSubmitting(true);
-    
-    // Simulate API delay
-    setTimeout(() => {
-      // Search for the user in our seeded userList
-      const foundUser = userList.find((u: any) => 
-        u.username.toLowerCase() === username.toLowerCase()
-      );
-
-      if (foundUser) {
-        login(foundUser);
-        setIsSubmitting(false);
-        onClose();
-      } else {
-        setError('Kullanıcı bulunamadı! Lütfen listedeki geçerli bir kullanıcı adını deneyin.');
-        setIsSubmitting(false);
-      }
-    }, 800);
-  };
-
-  const fillTestAccount = () => {
-    setUsername('test');
-    setPassword('123456');
-    setError('');
-  };
-
-  return (
-    <div className="fixed inset-0 z-[100] flex items-center justify-center bg-black/60 backdrop-blur-sm p-4 animate-in fade-in duration-200">
-      <div className="relative glass-panel bg-[#0a0a0e]/95 w-full max-w-4xl rounded-[2rem] shadow-[0_0_50px_rgba(0,0,0,1)] border border-white/10 flex flex-col md:flex-row overflow-hidden animate-in zoom-in-95 duration-300">
-        
-        {/* Kapat butonu */}
-        <button 
-          onClick={onClose}
-          className="absolute top-6 right-6 z-20 text-gray-400 hover:text-white transition-colors bg-white/5 p-2 rounded-full hover:bg-white/10 border border-white/5"
-          title="Kapat"
-        >
-          <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
-        </button>
-
-        {/* Klasik Giriş Alanı (Sol) */}
-        <div className="w-full md:w-1/2 p-8 lg:p-12 flex flex-col justify-center relative z-10">
-          
-          <h2 className="text-3xl font-black mb-2 text-white tracking-tight">
-            Giriş Yap
-          </h2>
-          <p className="text-gray-400 text-sm mb-8">Kaldığın yerden oynamaya devam et.</p>
-
-          {/* Test Hesabı Asistanı */}
-          <div className="mb-6 p-4 bg-blue-500/10 border border-blue-500/20 rounded-xl text-center shadow-inner flex items-center justify-between gap-4">
-            <p className="text-xs text-blue-300 font-medium text-left">Test hesabı ile <br/>arayüzü inceleyin.</p>
-            <button 
-              type="button" 
-              onClick={() => { setUsername('berkaytikenoglu'); setPassword('armo-v3'); }}
-              className="text-xs font-bold bg-gradient-to-r from-blue-600 to-blue-500 hover:from-blue-500 hover:to-blue-400 text-white py-2 px-4 rounded-lg transition-all shadow-[0_0_10px_rgba(37,99,235,0.3)] border border-blue-400/50 whitespace-nowrap"
-            >
-              Kurucu Bilgilerini Gir
-            </button>
-          </div>
-
-          <form className="space-y-4" onSubmit={handleLogin}>
-            {error && (
-              <div className="p-3 bg-red-500/10 border border-red-500/30 text-red-400 text-sm font-medium rounded-xl text-center animate-in slide-in-from-top-2 duration-200">
-                {error}
-              </div>
-            )}
-
-            <div className="space-y-1.5">
-              <label className="text-xs font-bold text-gray-400 uppercase tracking-wider">Kullanıcı Adı</label>
-              <input 
-                required
-                type="text" 
-                value={username}
-                onChange={(e) => setUsername(e.target.value)}
-                className="w-full bg-white/5 border border-white/10 hover:border-white/20 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500 transition-all font-medium"
-                placeholder="••••••"
-              />
-            </div>
-            
-            <div className="space-y-1.5">
-              <label className="text-xs font-bold text-gray-400 uppercase tracking-wider">Şifre</label>
-              <input 
-                required
-                type="password" 
-                value={password}
-                onChange={(e) => setPassword(e.target.value)}
-                className="w-full bg-white/5 border border-white/10 hover:border-white/20 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500 transition-all font-medium tracking-widest"
-                placeholder="••••••••"
-              />
-            </div>
-            
-            <div className="flex justify-between items-center text-sm px-1 pt-1">
-              <label className="flex items-center space-x-2 cursor-pointer text-gray-400 hover:text-gray-300">
-                <input type="checkbox" className="rounded bg-transparent border border-white/20 text-blue-500 focus:ring-blue-500 h-4 w-4" />
-                <span>Beni Hatırla</span>
-              </label>
-              <a href="#" className="text-blue-400 hover:text-blue-300 transition-colors font-medium">Şifremi Unuttum</a>
-            </div>
-
-            <Button variant="primary" className="w-full h-12 text-md mt-6 font-bold shadow-[0_0_15px_rgba(37,99,235,0.4)] rounded-xl" isLoading={isSubmitting}>
-              Hesabıma Giriş Yap
-            </Button>
-            
-            <p className="text-center text-gray-500 text-sm mt-6 font-medium">
-              Henüz ARMOYU&apos;da değil misin? <a href="#" className="text-blue-400 hover:text-blue-300 ml-1">Kayıt Ol</a>
-            </p>
-          </form>
-        </div>
-
-        {/* QR Kod Alanı (Sağ) */}
-        <div className="w-full md:w-1/2 bg-gradient-to-br from-[#0c101c] to-[#160b24] p-8 lg:p-12 flex flex-col items-center justify-center border-t md:border-t-0 md:border-l border-white/5 relative">
-          
-          <div className="text-center space-y-4 mb-8 relative z-10 w-full">
-            <h3 className="text-2xl font-bold text-white tracking-tight">Mobil Uygulama İle Gir</h3>
-            <p className="text-gray-400 text-sm max-w-[260px] mx-auto leading-relaxed">
-              ARMOYU uygulamasından <strong className="text-white font-medium">Ayarlar &gt; QR Okut</strong> menüsüne girerek saniyeler içinde bağlanın.
-            </p>
-          </div>
-
-          {/* QR Container */}
-          <div className="relative p-3 bg-white/10 backdrop-blur-md rounded-[2rem] shadow-2xl overflow-hidden border border-white/10">
-             <div className="bg-white p-4 rounded-2xl relative overflow-hidden group">
-                {/* QR Resim */}
-                <img 
-                  src={`https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=${qrValue}`}
-                  alt="Login QR Code"
-                  className="w-44 h-44 md:w-48 md:h-48 transition-all duration-300 group-hover:scale-105"
-                  style={{ opacity: qrProgress > 95 ? 0.3 : 1 }} 
-                />
-             </div>
-          </div>
-
-          {/* Animasyonlu Timer */}
-          <div className="mt-10 flex flex-col items-center w-full max-w-[220px]">
-             <div className="w-full h-1.5 bg-white/10 rounded-full overflow-hidden shadow-inner">
-               <div 
-                 className="h-full bg-gradient-to-r from-blue-500 to-purple-500 rounded-full transition-all duration-100 ease-linear shadow-[0_0_10px_rgba(168,85,247,0.5)]"
-                 style={{ width: `${qrProgress}%` }}
-               />
-             </div>
-             <p className="text-xs text-gray-400 mt-3 font-medium flex items-center gap-1.5">
-               <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" className={`${qrProgress < 15 ? 'text-red-400 animate-pulse' : 'text-blue-400'}`}><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>
-               <span className={`${qrProgress < 15 ? 'text-red-400' : 'text-gray-400'}`}>
-                 {Math.ceil((qrProgress / 100) * 20)} saniye içinde yenilenecek
-               </span>
-             </p>
-          </div>
-
-        </div>
-
-      </div>
-    </div>
-  );
-}

package/src/components/shared/MainLayoutWrapper.tsx

@@ -1,15 +0,0 @@
-'use client';
-
-import { useLayout } from '../../context/LayoutContext';
-import { useAuth } from '../../context/AuthContext';
-import { useSocket } from '../../context/SocketContext';
-
-export function MainLayoutWrapper({ children }: { children: React.ReactNode }) {
-  const { pageWidth } = useLayout();
-
-  return (
-    <main className={`flex-grow w-full overflow-x-hidden pt-8 px-4 md:px-8 mx-auto z-10 transition-all duration-700 ${pageWidth}`}>
-      {children}
-    </main>
-  );
-}

package/src/components/shared/PageWidth.tsx

@@ -1,22 +0,0 @@
-'use client';
-
-import { useEffect } from 'react';
-import { useLayout } from '../../context/LayoutContext';
-
-interface PageWidthProps {
-  width: string; // Örn: 'max-w-7xl', 'max-w-full', 'max-w-[90%]'
-}
-
-export function PageWidth({ width }: PageWidthProps) {
-  const { setPageWidth } = useLayout();
-
-  useEffect(() => {
-    // Sayfa yüklendiğinde yeni genişliği uygula
-    setPageWidth(width);
-
-    // Sayfadan çıkıldığında varsayılan değere (%80) geri dön
-    return () => setPageWidth('max-w-[80%]');
-  }, [width, setPageWidth]);
-
-  return null; // Görünür bir element üretmez
-}

package/src/components/showcase/CommunityTab.tsx

@@ -1,22 +0,0 @@
-import React from 'react';
-import { 
-  ForumBoard, 
-  GroupCard, 
-  groupList, 
-  MOCK_FORUM_CATEGORIES 
-} from '../../index';
-
-export function CommunityTab() {
-  return (
-    <div className="space-y-12">
-       <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-orange-500 pl-4">Topluluk & Forum</h3>
-       <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
-          <div className="md:col-span-2">
-             <ForumBoard {...MOCK_FORUM_CATEGORIES[1].boards[0]} />
-          </div>
-          <GroupCard {...groupList[0]} />
-          <GroupCard {...groupList[1]} />
-       </div>
-    </div>
-  );
-}

package/src/components/showcase/CorporateTab.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { 
-  Header, 
-  Footer, 
-  ViewModeToggle 
-} from '../../index';
-
-export function CorporateTab() {
-  return (
-    <div className="space-y-16">
-       <div className="space-y-6">
-          <div className="flex items-center justify-between">
-             <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-indigo-500 pl-4">Header Bileşeni</h3>
-             <span className="text-[10px] font-bold text-armoyu-text-muted uppercase italic bg-black/20 px-3 py-1 rounded-lg">Kütüphane Bileşeni Önizleme</span>
-          </div>
-          <div className="rounded-[32px] overflow-hidden border border-white/5 shadow-2xl relative">
-             <Header />
-          </div>
-       </div>
-
-       <div className="space-y-6">
-          <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-indigo-500 pl-4">Footer Bileşeni</h3>
-          <div className="rounded-[32px] overflow-hidden border border-white/5 shadow-2xl">
-             <Footer />
-          </div>
-       </div>
-
-       <div className="grid grid-cols-1 md:grid-cols-2 gap-8 pt-8">
-          <div className="glass-panel p-8 rounded-[40px]">
-             <h4 className="text-[10px] font-black uppercase text-center mb-6 opacity-30 italic">Görünüm Seçici</h4>
-             <div className="flex justify-center">
-                <ViewModeToggle mode="grid" onChange={() => {}} />
-             </div>
-          </div>
-       </div>
-    </div>
-  );
-}

package/src/components/showcase/GeneralTab.tsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import { 
-  Button, 
-  RollingNumber, 
-  Slider, 
-  StatsGrid, 
-  mockGlobalStats 
-} from '../../index';
-
-export function GeneralTab() {
-  return (
-    <div className="space-y-12">
-      <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-blue-500 pl-4">Temel Bileşenler</h3>
-      <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
-        <div className="glass-panel p-8 rounded-[40px] space-y-6">
-          <h4 className="text-xs font-black uppercase tracking-widest text-armoyu-text-muted mb-4 opacity-50 italic">Butonlar</h4>
-          <div className="flex flex-wrap gap-4">
-            <Button>Normal Buton</Button>
-            <Button variant="ghost">Hayalet Buton</Button>
-            <Button className="bg-gradient-to-r from-blue-600 to-indigo-600">Premium Buton</Button>
-            <Button className="bg-emerald-500">Başarı</Button>
-          </div>
-        </div>
-        <div className="glass-panel p-8 rounded-[40px] space-y-6">
-          <h4 className="text-xs font-black uppercase tracking-widest text-armoyu-text-muted mb-4 opacity-50 italic">Sayı Animasyonları</h4>
-          <div className="flex items-center gap-8">
-             <div className="text-4xl font-black text-blue-500 italic"><RollingNumber value="14.2" />B</div>
-             <div className="text-3xl font-black text-armoyu-text italic opacity-60"><RollingNumber value="1250" /></div>
-          </div>
-        </div>
-        <div className="glass-panel p-8 rounded-[40px] space-y-6 md:col-span-2">
-           <h4 className="text-xs font-black uppercase tracking-widest text-armoyu-text-muted mb-4 opacity-50 italic">Slider / Carousel</h4>
-           <Slider />
-        </div>
-        <div className="md:col-span-2">
-           <StatsGrid stats={mockGlobalStats} />
-        </div>
-      </div>
-    </div>
-  );
-}

package/src/components/showcase/MessagesTab.tsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import { 
-  ChatNotes, 
-  ChatList, 
-  ChatContainer, 
-  MOCK_SESSION 
-} from '../../index';
-
-export function MessagesTab() {
-  return (
-    <div className="space-y-12">
-       <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-emerald-500 pl-4">Mesajlaşma Sistemi</h3>
-       <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 h-[700px]">
-          <div className="lg:col-span-4 glass-panel rounded-[40px] overflow-hidden flex flex-col">
-             <ChatNotes />
-             <div className="flex-1 overflow-hidden p-2">
-                <ChatList contacts={MOCK_SESSION.chatList} activeId="c1" onSelect={() => {}} />
-             </div>
-          </div>
-          <div className="lg:col-span-8 glass-panel rounded-[40px] overflow-hidden">
-             <ChatContainer />
-          </div>
-       </div>
-    </div>
-  );
-}

package/src/components/showcase/ProfileTab.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-import { 
-  ProfileHeader, 
-  ProfileStats, 
-  ProfileContent, 
-  userList 
-} from '../../index';
-
-export function ProfileTab() {
-  const me = userList[0];
-  
-  return (
-    <div className="space-y-12">
-       <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-pink-500 pl-4">Kullanıcı Profili</h3>
-       <ProfileHeader user={me} isOwnProfile={true} />
-       <ProfileStats />
-       <ProfileContent user={me} />
-    </div>
-  );
-}

package/src/components/showcase/ShopTab.tsx

@@ -1,24 +0,0 @@
-import React from 'react';
-import { 
-  StoreHeader, 
-  NewsCard, 
-  newsList 
-} from '../../index';
-
-export function ShopTab() {
-  return (
-    <div className="space-y-12">
-       <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-yellow-500 pl-4">Mağaza & İçerik</h3>
-       <div className="space-y-8">
-          <div className="glass-panel p-6 rounded-[32px]">
-             <StoreHeader searchQuery="" setSearchQuery={() => {}} />
-          </div>
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
-             {newsList.map(news => (
-               <NewsCard key={news.slug} {...news} />
-             ))}
-          </div>
-       </div>
-    </div>
-  );
-}

package/src/components/showcase/SocialTab.tsx

@@ -1,28 +0,0 @@
-import React from 'react';
-import { 
-  AuthSidebarLeft, 
-  Stories, 
-  PostCard, 
-  postList 
-} from '../../index';
-
-export function SocialTab() {
-  const samplePosts = postList.slice(0, 3);
-  
-  return (
-    <div className="space-y-12">
-       <h3 className="text-2xl font-black italic uppercase tracking-tighter border-l-4 border-purple-500 pl-4">Sosyal Modüller</h3>
-       <div className="grid grid-cols-1 lg:grid-cols-12 gap-8">
-          <aside className="lg:col-span-3">
-             <AuthSidebarLeft />
-          </aside>
-          <div className="lg:col-span-9 space-y-8">
-             <Stories />
-             <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-                {samplePosts.map(post => <PostCard key={post.id} {...post} />)}
-             </div>
-          </div>
-       </div>
-    </div>
-  );
-}

package/src/context/AuthContext.tsx

@@ -1,104 +0,0 @@
-'use client';
-
-import React, { createContext, useContext, useState, useEffect } from 'react';
-import { User, Session } from '@armoyu/core';
-
-import { userList, MOCK_SESSION } from '../lib/constants/seedData';
-
-interface AuthContextType {
-  user: User | null;
-  session: Session | null;
-  login: (userData: User) => void;
-  logout: () => void;
-  isLoading: boolean;
-  isLoginModalOpen: boolean;
-  setIsLoginModalOpen: (open: boolean) => void;
-  updateUser: (updatedUser: User) => void;
-  updateSession: (updatedSession: Session) => void;
-}
-
-const AuthContext = createContext<AuthContextType | undefined>(undefined);
-
-export function AuthProvider({ children }: { children: React.ReactNode }) {
-  const [user, setUser] = useState<User | null>(null);
-  const [session, setSession] = useState<Session | null>(null);
-  const [isLoading, setIsLoading] = useState(true);
-  const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
-
-  useEffect(() => {
-    // Check local storage for persistent login
-    const savedUserStr = localStorage.getItem('armoyu_user');
-    
-    if (savedUserStr) {
-      try {
-        const savedData = JSON.parse(savedUserStr);
-        const username = savedData.username;
-        
-        // Find user in seedData to maintain all object references
-        const foundUser = userList.find((u: any) => u.username === username);
-        
-        if (foundUser) {
-          setUser(foundUser);
-          // If it's Berkay, use the mock session with notifications
-          if (username === 'berkaytikenoglu') {
-            setSession(MOCK_SESSION);
-          } else {
-            setSession(new Session({ user: foundUser, token: 'mock-token' }));
-          }
-        }
-      } catch (e) {
-        console.error('Failed to restore session', e);
-        localStorage.removeItem('armoyu_user');
-      }
-    }
-    
-    // Explicitly set loading to false AFTER the check
-    setIsLoading(false);
-  }, []);
-
-  const login = (userData: User) => {
-    setUser(userData);
-    
-    // Handle session initialization
-    if (userData.username === 'berkaytikenoglu') {
-      setSession(MOCK_SESSION);
-    } else {
-      setSession(new Session({ user: userData, token: 'mock-token' }));
-    }
-
-    localStorage.setItem('armoyu_user', JSON.stringify({ username: userData.username }));
-    setIsLoginModalOpen(false); // Close modal on success
-  };
-
-  const logout = () => {
-    setUser(null);
-    setSession(null);
-    localStorage.removeItem('armoyu_user');
-  };
-
-  const updateUser = (updatedUser: User) => {
-    setUser(updatedUser);
-    if (session) {
-      setSession(new Session({ ...session, user: updatedUser }));
-    }
-  };
-
-  const updateSession = (updatedSession: Session) => {
-    setSession(updatedSession);
-  };
-
-  return (
-    <AuthContext.Provider value={{ user, session, login, logout, isLoading, isLoginModalOpen, setIsLoginModalOpen, updateUser, updateSession }}>
-      {children}
-    </AuthContext.Provider>
-  );
-}
-
-export function useAuth() {
-  const context = useContext(AuthContext);
-  if (context === undefined) {
-    throw new Error('useAuth must be used within an AuthProvider');
-  }
-  return context;
-}
-

package/src/context/CartContext.tsx

@@ -1,93 +0,0 @@
-'use client';
-
-import React, { createContext, useContext, useState, useEffect } from 'react';
-import { Product, CartItem } from '@armoyu/core';
-
-
-interface CartContextType {
-  cart: CartItem[];
-  addToCart: (product: Product, quantity?: number) => void;
-  removeFromCart: (productId: string) => void;
-  updateQuantity: (productId: string, quantity: number) => void;
-  clearCart: () => void;
-  totalItems: number;
-  totalPrice: number;
-}
-
-const CartContext = createContext<CartContextType | undefined>(undefined);
-
-export function CartProvider({ children }: { children: React.ReactNode }) {
-  const [cart, setCart] = useState<CartItem[]>([]);
-
-  // Load cart from localStorage on mount
-  useEffect(() => {
-    const savedCart = localStorage.getItem('armoyu_cart');
-    if (savedCart) {
-      try {
-        const parsed = JSON.parse(savedCart);
-        setCart(parsed.map((i: any) => CartItem.fromJSON(i)));
-      } catch (e) {
-        console.error('Failed to parse cart', e);
-      }
-    }
-  }, []);
-
-  // Save cart to localStorage on change
-  useEffect(() => {
-    localStorage.setItem('armoyu_cart', JSON.stringify(cart));
-  }, [cart]);
-
-  const addToCart = (product: Product, quantity: number = 1) => {
-    setCart(prev => {
-      const existing = prev.find(item => item.product.id === product.id);
-      if (existing) {
-        return prev.map(item => 
-          item.product.id === product.id 
-            ? new CartItem({ ...item, quantity: item.quantity + quantity })
-            : item
-        );
-      }
-      return [...prev, new CartItem({ product, quantity })];
-    });
-  };
-
-  const removeFromCart = (productId: string) => {
-    setCart(prev => prev.filter(item => item.product.id !== productId));
-  };
-
-  const updateQuantity = (productId: string, quantity: number) => {
-    setCart(prev => prev.map(item => 
-      item.product.id === productId 
-        ? new CartItem({ ...item, quantity: Math.max(1, quantity) })
-        : item
-    ));
-  };
-
-  const clearCart = () => setCart([]);
-
-  const totalItems = cart.reduce((acc, item) => acc + item.quantity, 0);
-  const totalPrice = cart.reduce((acc, item) => acc + item.getTotalPrice(), 0);
-
-  return (
-    <CartContext.Provider value={{ 
-      cart, 
-      addToCart, 
-      removeFromCart, 
-      updateQuantity, 
-      clearCart, 
-      totalItems, 
-      totalPrice 
-    }}>
-      {children}
-    </CartContext.Provider>
-  );
-}
-
-export function useCart() {
-  const context = useContext(CartContext);
-  if (context === undefined) {
-    throw new Error('useCart must be used within a CartProvider');
-  }
-  return context;
-}
-