menu: on click on prduct open details as BS, also add redirect button to detials page if user click on redirect button

src/pages/menu/components/MenuList/MenuList.tsx

@@ -6,6 +6,8 @@ import { useAppSelector } from "redux/hooks";
 import { Product } from "utils/types/appTypes";
 import styles from "./MenuList.module.css";
 import ProductCard from "pages/menu/components/MenuList/ProductCard.tsx";
+import { ProductBottomSheet } from "pages/product/components/ProductBottomSheet";
+import { useState } from "react";
 
 interface MenuListProps {
   data:
@@ -20,6 +22,7 @@ interface MenuListProps {
 export function MenuList({ data, categoryRefs }: MenuListProps) {
   const { isRTL } = useAppSelector((state) => state.locale);
   const products = data?.products;
+  const [isBottomSheetOpen, setIsBottomSheetOpen] = useState(false);
 
   const { t } = useTranslation();
   const { themeName } = useAppSelector((state) => state.theme);
@@ -80,12 +83,20 @@ export function MenuList({ data, categoryRefs }: MenuListProps) {
               </ProTitle>
               <div className={styles.menuItemsGrid}>
                 {categoryProducts.map((item: Product) => (
-                  <ProductCard item={item} key={item.id} />
+                  <ProductCard
+                    item={item}
+                    key={item.id}
+                    setIsBottomSheetOpen={setIsBottomSheetOpen}
+                  />
                 ))}
               </div>
             </div>
           );
         })}
+        <ProductBottomSheet
+          isOpen={isBottomSheetOpen}
+          onClose={() => setIsBottomSheetOpen(false)}
+        />
       </div>
     </>
   );