Come In Baku

import React, { useMemo } from ‘react’;
import { X, Trash2, Plus, Minus, ShoppingBag, ArrowRight } from ‘lucide-react’;
import { useAppContext } from ‘../App’;
import { TRANSLATIONS, RESTAURANT_INFO } from ‘../constants’;
import { Link } from ‘react-router-dom’;

interface CartDrawerProps {
isOpen: boolean;
onClose: () => void;
}

export const CartDrawer: React.FC = ({ isOpen, onClose }) => {
const { cart, removeFromCart, updateQuantity, clearCart, language } = useAppContext();
const t = TRANSLATIONS[language];

const { subtotal, serviceCharge, total } = useMemo(() => {
const sub = cart.reduce((acc, item) => acc + (item.price * item.quantity), 0);
const svc = sub * RESTAURANT_INFO.serviceCharge;
return {
subtotal: sub,
serviceCharge: svc,
total: sub + svc
};
}, [cart]);

if (!isOpen) return null;

return (

{/* Backdrop */}

{/* Drawer */}

{/* Header */}

{t.cart || ‘Your Tray’}


{cart.reduce((a, b) => a + b.quantity, 0)} items

{/* Items List */}

{cart.length === 0 ? (

{t.emptyTray || ‘Your tray is empty’}

Add some delicious items from our menu to get started.


{t.startOrder || ‘Start Ordering’}

) : (
cart.map((item) => (

{item.name[language]

{item.name[language] || item.name[‘EN’]}

{item.price} ₼

{/* Quantity Controls */}



{item.quantity}

))
)}

{/* Footer */}
{cart.length > 0 && (

{t.subtotal || ‘Subtotal’}
{subtotal.toFixed(2)} ₼
{t.serviceCharge || ‘Service (5%)’}
{serviceCharge.toFixed(2)} ₼
{t.total || ‘Total’}
{total.toFixed(2)} ₼

)}

);
};