feat: make entire cart drawer UI and WhatsApp order draft fully language-compatible (Swedish default + en/hi/ur translations for title, notes, buttons, and drafted message)

components/CartDrawer.tsx

@@ -30,6 +30,8 @@
 
 import { useCart } from './CartContext';
 import Link from 'next/link';
+import { useLanguage } from "@/lib/language-context";
+import { getTranslation } from "@/lib/translations";
 
 export default function CartDrawer() {
   const { 
@@ -42,6 +44,9 @@ export default function CartDrawer() {
     clearCart 
   } = useCart();
 
+  const { language } = useLanguage();
+  const t = getTranslation(language);
+
   /**
    * WHATSAPP DEEP LINK ORDERING
    * 
@@ -58,16 +63,24 @@ export default function CartDrawer() {
       .map((item) => `${item.quantity} × ${item.name}  —  ${item.price * item.quantity} kr`)
       .join('\n');
 
-    const message = 
-`Hello Shahi Kitchen 👋
+    const now = new Date();
+    const suggested = new Date(now.getTime() + 30 * 60 * 1000);
+    // Use locale-appropriate time formatting so the suggested time in the draft feels native
+    const timeLocale = language === 'sv' ? 'sv-SE' : 'en-GB';
+    const suggestedTime = suggested.toLocaleTimeString(timeLocale, { hour: '2-digit', minute: '2-digit' });
 
-I would like to place an order:
+    const msg = t.cartDrawer;
+    const message = 
+`${msg.messageHello}
+
+${msg.messageIntro}
 
 ${lines}
+${msg.messageConfirm.replace('{time}', suggestedTime)}
 
-Total: ${totalPrice} kr
+${msg.messageTotal}: ${totalPrice} kr
 
-Thank you!`;
+${msg.messageThanks}`;
 
     const encoded = encodeURIComponent(message);
     // This is the same WhatsApp business number used for table reservations on the homepage
@@ -92,10 +105,10 @@ Thank you!`;
         {/* HEADER — Title + item count + quick clear + close button */}
         <div className="flex items-center justify-between p-6 border-b border-[#EDE6D9]">
           <div className="flex items-center gap-3">
-            <h2 className="text-2xl tracking-[-0.5px]">Your Basket</h2>
+            <h2 className="text-2xl tracking-[-0.5px]">{t.cartDrawer.title}</h2>
             {items.length > 0 && (
               <span className="text-xs px-2.5 py-0.5 rounded-full bg-[#EDE6D9] text-[#6B665F]">
-                {items.length} {items.length === 1 ? 'item' : 'items'}
+                {items.length} {items.length === 1 ? t.cartDrawer.item : t.cartDrawer.items}
               </span>
             )}
           </div>
@@ -105,7 +118,7 @@ Thank you!`;
                 onClick={clearCart}
                 className="text-xs text-[#B38B4D] hover:underline"
               >
-                Clear
+                {t.cartDrawer.clear}
               </button>
             )}
             <button 
@@ -123,13 +136,13 @@ Thank you!`;
           {items.length === 0 ? (
             <div className="flex flex-col items-center justify-center h-full text-center">
               <div className="text-6xl mb-4">🛒</div>
-              <p className="text-lg text-[#6B665F]">Your basket is empty</p>
+              <p className="text-lg text-[#6B665F]">{t.cartDrawer.empty}</p>
               <Link 
                 href="/menu" 
                 onClick={closeCart}
                 className="mt-6 text-[#B38B4D] hover:underline"
               >
-                Browse the menu →
+                {t.cartDrawer.browseMenu}
               </Link>
             </div>
           ) : (
@@ -167,7 +180,7 @@ Thank you!`;
                         onClick={() => removeFromCart(item.id)}
                         className="ml-auto text-xs text-[#B38B4D] hover:underline"
                       >
-                        Remove
+                        {t.cartDrawer.remove}
                       </button>
                     </div>
                   </div>
@@ -185,37 +198,41 @@ Thank you!`;
               onClick={clearCart} 
               className="text-xs text-[#8A8478] hover:text-[#B38B4D] mb-3 underline"
             >
-              Clear basket
+              {t.cartDrawer.clearBasket}
             </button>
 
             <div className="flex justify-between text-lg font-medium mb-4">
-              <span>Total</span>
+              <span>{t.cartDrawer.total}</span>
               <span>{totalPrice.toFixed(0)} kr</span>
             </div>
 
+            <p className="text-xs text-center text-[#6B665F] mb-3">
+              {t.cartDrawer.pickupNote}
+            </p>
+
             <button
               onClick={orderViaWhatsApp}
               className="btn-primary w-full py-4 rounded-full text-base tracking-[0.5px] font-medium mb-2 flex items-center justify-center gap-2"
             >
-              Send order via WhatsApp
+              {t.cartDrawer.sendViaWhatsApp}
             </button>
 
             <button
               onClick={() => window.open('tel:031288910', '_self')}
               className="btn-outline w-full py-3 rounded-full text-sm tracking-[0.5px] font-medium mb-3"
             >
-              Call 031-28 89 10
+              {t.cartDrawer.call}
             </button>
 
             <button
               onClick={closeCart}
               className="w-full text-sm text-[#6B665F] hover:text-[#2C2A26] pt-1"
             >
-              Continue browsing
+              {t.cartDrawer.continueBrowsing}
             </button>
 
             <p className="text-[10px] text-center text-[#8A8478] mt-4">
-              WhatsApp opens with your order pre-filled. We will confirm availability.
+              {t.cartDrawer.whatsappHint}
             </p>
           </div>
         )}

lib/translations.ts

@@ -148,6 +148,30 @@ export const translations = {
     add: 'Add',
     viewCart: 'View Cart',
 
+    // Cart Drawer (fully language-aware)
+    cartDrawer: {
+      title: 'Your Basket',
+      item: 'item',
+      items: 'items',
+      clear: 'Clear',
+      empty: 'Your basket is empty',
+      browseMenu: 'Browse the menu →',
+      clearBasket: 'Clear basket',
+      total: 'Total',
+      pickupNote: 'Estimated order pickup time is 30 minutes, but it can vary depending on workload and availability.',
+      sendViaWhatsApp: 'Send order via WhatsApp',
+      call: 'Call 031-28 89 10',
+      continueBrowsing: 'Continue browsing',
+      whatsappHint: 'WhatsApp opens with your order pre-filled. We will confirm availability.',
+      remove: 'Remove',
+      // WhatsApp message fragments (used to build the draft in the correct language)
+      messageHello: 'Hello Shahi Kitchen 👋',
+      messageIntro: 'I would like to place an order:',
+      messageConfirm: 'Please confirm pickup time (e.g. {time} or later)',
+      messageTotal: 'Total',
+      messageThanks: 'Thank you!',
+    },
+
     // Full Menu Page
     menu: {
       title: 'Our Menu',
@@ -295,6 +319,30 @@ export const translations = {
     add: 'Lägg till',
     viewCart: 'Visa Varukorg',
 
+    // Cart Drawer (fully language-aware)
+    cartDrawer: {
+      title: 'Din varukorg',
+      item: 'vara',
+      items: 'varor',
+      clear: 'Rensa',
+      empty: 'Din varukorg är tom',
+      browseMenu: 'Bläddra i menyn →',
+      clearBasket: 'Rensa varukorg',
+      total: 'Totalt',
+      pickupNote: 'Uppskattad upphämtningstid är cirka 30 minuter, men den kan variera beroende på arbetsbelastning och tillgänglighet.',
+      sendViaWhatsApp: 'Skicka beställning via WhatsApp',
+      call: 'Ring 031-28 89 10',
+      continueBrowsing: 'Fortsätt bläddra',
+      whatsappHint: 'WhatsApp öppnas med din förifyllda beställning. Vi bekräftar tillgänglighet.',
+      remove: 'Ta bort',
+      // WhatsApp message fragments (used to build the draft in the correct language)
+      messageHello: 'Hej Shahi Kitchen 👋',
+      messageIntro: 'Jag skulle vilja lägga en beställning:',
+      messageConfirm: 'Vänligen bekräfta upphämtningstid (t.ex. {time} eller senare)',
+      messageTotal: 'Totalt',
+      messageThanks: 'Tack!',
+    },
+
     // Full Menu Page
     menu: {
       title: 'Vår Meny',
@@ -451,6 +499,30 @@ export const translations = {
 
     add: 'ऐड करें',
     viewCart: 'कार्ट देखें',
+
+    // Cart Drawer (fully language-aware)
+    cartDrawer: {
+      title: 'आपकी टोकरी',
+      item: 'आइटम',
+      items: 'आइटम',
+      clear: 'साफ करें',
+      empty: 'आपकी टोकरी खाली है',
+      browseMenu: 'मेन्यू ब्राउज़ करें →',
+      clearBasket: 'टोकरी साफ करें',
+      total: 'कुल',
+      pickupNote: 'अनुमानित ऑर्डर पिकअप समय 30 मिनट है, लेकिन कार्यभार और उपलब्धता के आधार पर भिन्न हो सकता है।',
+      sendViaWhatsApp: 'व्हाट्सएप पर ऑर्डर भेजें',
+      call: 'कॉल करें 031-28 89 10',
+      continueBrowsing: 'ब्राउज़िंग जारी रखें',
+      whatsappHint: 'व्हाट्सएप आपके ऑर्डर के साथ खुलेगा। हम उपलब्धता की पुष्टि करेंगे।',
+      remove: 'हटाएं',
+      // WhatsApp message fragments
+      messageHello: 'नमस्ते Shahi Kitchen 👋',
+      messageIntro: 'मैं एक ऑर्डर देना चाहता/चाहती हूँ:',
+      messageConfirm: 'कृपया पिकअप समय की पुष्टि करें (उदा. {time} या बाद में)',
+      messageTotal: 'कुल',
+      messageThanks: 'धन्यवाद!',
+    },
   },
 
   ur: {
@@ -595,6 +667,30 @@ export const translations = {
 
     add: 'شامل کریں',
     viewCart: 'کارٹ دیکھیں',
+
+    // Cart Drawer (fully language-aware)
+    cartDrawer: {
+      title: 'آپ کی ٹوکری',
+      item: 'آئٹم',
+      items: 'آئٹمز',
+      clear: 'صاف کریں',
+      empty: 'آپ کی ٹوکری خالی ہے',
+      browseMenu: 'مینو دیکھیں →',
+      clearBasket: 'ٹوکری صاف کریں',
+      total: 'کل',
+      pickupNote: 'تخمینی آرڈر پک اپ کا وقت 30 منٹ ہے، لیکن کام کے بوجھ اور دستیابی کے مطابق مختلف ہو سکتا ہے۔',
+      sendViaWhatsApp: 'واٹس ایپ پر آرڈر بھیجیں',
+      call: 'کال کریں 031-28 89 10',
+      continueBrowsing: 'براؤزنگ جاری رکھیں',
+      whatsappHint: 'واٹس ایپ آپ کے آرڈر کے ساتھ کھلے گا۔ ہم دستیابی کی تصدیق کریں گے۔',
+      remove: 'ہٹائیں',
+      // WhatsApp message fragments
+      messageHello: 'ہیلو Shahi Kitchen 👋',
+      messageIntro: 'میں ایک آرڈر دینا چاہتا ہوں:',
+      messageConfirm: 'براہ مہربانی پک اپ ٹائم کی تصدیق کریں (مثلاً {time} یا بعد میں)',
+      messageTotal: 'کل',
+      messageThanks: 'شکریہ!',
+    },
   },
 } as const;