Replace entire repo content with updated code from /root/shahikitchen-website/

components/WishlistDrawer.tsx

@@ -8,6 +8,7 @@ import { useLanguage } from '@/presentation/providers/language-provider';
 import { getTranslation } from '@/presentation/i18n/translations';
 import { getMenuPosterSrc, applyNextImageFallback, getMenuPosterCandidates } from '@/lib/assets';
 import { getMenuItemById } from '@/lib/menu-data';
+import { getMenuItemName } from '@/application/i18n/menu-localization';
 import { buildCartLineFromMenuItem } from '@/application/cart/cart-line-builder';
 
 export default function WishlistDrawer() {
@@ -20,7 +21,7 @@ export default function WishlistDrawer() {
   } = useWishlist();
 
   const { addToCart } = useCart();
-  const { language } = useLanguage();
+  const { language, isRtl } = useLanguage();
   const t = getTranslation(language);
 
   if (!isOpen) return null;
@@ -43,7 +44,11 @@ export default function WishlistDrawer() {
         onClick={closeWishlist}
       />
 
-      <div className="fixed top-0 right-0 h-full w-full max-w-md bg-[#F8F5F0] z-[985] shadow-2xl flex flex-col">
+      <div
+        className={`fixed top-0 h-full w-full max-w-md bg-[#F8F5F0] z-[985] shadow-2xl flex flex-col ${
+          isRtl ? 'left-0 border-r border-[#EDE6D9]' : 'right-0 border-l border-[#EDE6D9]'
+        }`}
+      >
         <div className="flex items-center justify-between p-6 border-b border-[#EDE6D9]">
           <div className="flex items-center gap-3">
             <Heart className="h-5 w-5 text-[#c99a2e] fill-[#c99a2e]/20" />
@@ -88,7 +93,14 @@ export default function WishlistDrawer() {
             </div>
           ) : (
             <div className="space-y-5">
-              {items.map((item) => (
+              {items.map((item) => {
+                const menuItem = getMenuItemById(item.id);
+                const displayName = getMenuItemName(language, {
+                  id: item.id,
+                  name: menuItem?.name ?? item.name,
+                });
+
+                return (
                 <div
                   key={item.id}
                   className="flex gap-4 rounded-2xl border border-[#EDE6D9] bg-white p-4"
@@ -96,7 +108,7 @@ export default function WishlistDrawer() {
                   <div className="h-20 w-20 shrink-0 overflow-hidden rounded-xl bg-[#F2EDE4]">
                     <img
                       src={getMenuPosterSrc(item)}
-                      alt={item.name}
+                      alt={displayName}
                       className="h-full w-full object-cover"
                       loading="lazy"
                       onError={(e) => {
@@ -112,7 +124,7 @@ export default function WishlistDrawer() {
                   <div className="flex-1 min-w-0">
                     <div className="flex justify-between gap-2">
                       <h4 className="font-medium tracking-[-0.3px] text-[#101724] truncate">
-                        {item.name}
+                        {displayName}
                       </h4>
                       <span className="shrink-0 text-right font-medium text-[#B38B4D] tabular-nums text-sm leading-tight">
                         {(() => {
@@ -147,13 +159,14 @@ export default function WishlistDrawer() {
                     </div>
                   </div>
                 </div>
-              ))}
+              );
+              })}
             </div>
           )}
         </div>
 
         {items.length > 0 && (
-          <div className="p-6 border-t border-[#EDE6D9] bg-white">
+          <div className="p-6 pb-[max(1.5rem,env(safe-area-inset-bottom))] border-t border-[#EDE6D9] bg-white">
             <p className="text-xs text-center text-[#6B665F] mb-4">
               {t.wishlistDrawer.hint}
             </p>