fix problem

2026-06-21 15:04:52 +03:30
parent d34a3a92f1
commit c565c0957f
5 changed files with 307 additions and 455 deletions
@@ -6,8 +6,8 @@ import PlusIcon from "@/components/icons/PlusIcon";
 import { toast, toastLoginRequired } from "@/components/Toast";
 import { getToken } from "@/lib/api/func";
 import { ef } from "@/lib/helpers/utfNumbers";
-import clsx from "clsx";
 import { glassSurface, glassSurfaceCard, glassSurfaceFlat } from "@/lib/styles/glassSurface";
+import clsx from "clsx";
 import { motion } from "framer-motion";
 import { ArrowLeft, Clock, Cup, Heart, TruckTick } from "iconsax-react";
 import { useParams, useRouter } from "next/navigation";
@@ -106,18 +106,14 @@ function FoodPage({}: Props) {
      : Array.isArray(foodData.images) && foodData.images.length > 0
        ? typeof foodData.images[0] === "string"
          ? foodData.images[0]
-          : typeof foodData.images[0] === "object" &&
-              foodData.images[0] !== null &&
-              "url" in foodData.images[0]
+          : typeof foodData.images[0] === "object" && foodData.images[0] !== null && "url" in foodData.images[0]
            ? (foodData.images[0] as { url: string }).url
            : "/assets/images/no-image.png"
        : "/assets/images/no-image.png";
  const categoryName = foodData.category?.title;
  const prepareTime = foodData.prepareTime || 0;
  const price = foodData.price || 0;
-  const content = Array.isArray(foodData.content)
-    ? foodData.content.join("، ")
-    : foodData.content || foodData.desc || "";
+  const content = Array.isArray(foodData.content) ? foodData.content.join("، ") : foodData.content || foodData.desc || "";

  const handleBackToMenu = () => {
    const urlParams = new URLSearchParams(window.location.search);
@@ -136,7 +132,9 @@ function FoodPage({}: Props) {
        !isAvailable && "opacity-50",
      )}
    >
-      <div className={glassSurface('relative w-full lg:h-full min-h-0 rounded-2xl overflow-hidden lg:rounded-r-none lg:order-1 lg:!bg-transparent lg:!border-0 lg:!shadow-none lg:[backdrop-filter:none]')}>
+      <div
+        className={glassSurface("relative w-full lg:h-full min-h-0 rounded-2xl overflow-hidden lg:rounded-r-none lg:order-1 lg:bg-transparent! lg:border-0! lg:shadow-none! lg:[backdrop-filter:none]")}
+      >
        {/* eslint-disable-next-line @next/next/no-img-element */}
        <img
          className="lg:object-cover lg:h-full object-cover bg-[#F2F2F9] w-full"
@@ -147,34 +145,20 @@ function FoodPage({}: Props) {
          }}
        />
        <div className="absolute top-4 left-0 pe-5.5 ps-7 w-full inline-flex justify-between items-center">
-          <div className={glassSurfaceFlat('whitespace-nowrap rounded-[34px] py-1.5 px-4 w-min text-xs text-disabled2 dark:text-disabled-text font-bold')}>
-            {categoryName || "-"}
-          </div>
-          <button
-            onClick={handleBackToMenu}
-            className={glassSurfaceFlat('p-2 rounded-full')}
-          >
-            <ArrowLeft
-              size={18}
-              className="stroke-primary dark:stroke-foreground"
-            />
+          <div className={glassSurfaceFlat("whitespace-nowrap rounded-[34px] py-1.5 px-4 w-min text-xs text-disabled2 dark:text-disabled-text font-bold")}>{categoryName || "-"}</div>
+          <button onClick={handleBackToMenu} className={glassSurfaceFlat("p-2 rounded-full")}>
+            <ArrowLeft size={18} className="stroke-primary dark:stroke-foreground" />
          </button>
        </div>
      </div>

-      <div className={glassSurfaceCard('relative px-6 pt-6 pb-7.5 lg:flex lg:flex-col lg:h-full lg:min-h-0 w-full overflow-hidden not-lg:-translate-y-6 lg:rounded-l-none lg:overflow-y-auto rounded-3xl')}>
+      <div
+        className={glassSurfaceCard("relative px-6 pt-6 pb-7.5 lg:flex lg:flex-col lg:h-full lg:min-h-0 w-full overflow-hidden not-lg:-translate-y-6 lg:rounded-l-none lg:overflow-y-auto rounded-3xl")}
+      >
        <div className="w-full inline-flex justify-between items-center shrink-0">
          <h5 className="text-base font-bold">{foodName}</h5>
-          <button
-            onClick={handleToggleFavorite}
-            className="p-2 bg-[#EAECF0] dark:bg-neutral-600 rounded-lg"
-          >
-            <Heart
-              variant={isFavorite ? "Bold" : "Outline"}
-              size={24}
-              color="currentColor"
-              className={isFavorite ? "fill-primary dark:fill-foreground" : ""}
-            />
+          <button onClick={handleToggleFavorite} className="p-2 bg-[#EAECF0] dark:bg-neutral-600 rounded-lg">
+            <Heart variant={isFavorite ? "Bold" : "Outline"} size={24} color="currentColor" className={isFavorite ? "fill-primary dark:fill-foreground" : ""} />
          </button>
        </div>

@@ -182,10 +166,7 @@ function FoodPage({}: Props) {
          <div className="text-xs">
            <div className="flex items-center gap-1">
              <Clock size={14} className="stroke-disabled-text" />
-              <span className="text-disabled-text">
-                زمان پخت و آماده سازی:{" "}
-                {prepareTime > 0 ? `${ef(String(prepareTime))} دقیقه` : "-"}
-              </span>
+              <span className="text-disabled-text">زمان پخت و آماده سازی: {prepareTime > 0 ? `${ef(String(prepareTime))} دقیقه` : "-"}</span>
            </div>
            <div className="flex items-center gap-2 mt-2">
              <Cup size={14} className="stroke-disabled-text" />
@@ -195,18 +176,9 @@ function FoodPage({}: Props) {
                    <div>۰</div>
                    <span>امتیاز برای هر بار خرید</span>
                  </>
-                ) : about?.data?.score?.purchaseScore &&
-                  about?.data?.score?.purchaseAmount ? (
+                ) : about?.data?.score?.purchaseScore && about?.data?.score?.purchaseAmount ? (
                  <>
-                    <div>
-                      {ef(
-                        Math.round(
-                          foodData?.price *
-                            (Number(about.data.score.purchaseScore) /
-                              Number(about.data.score.purchaseAmount)),
-                        ).toLocaleString("en-US"),
-                      )}
-                    </div>
+                    <div>{ef(Math.round(foodData?.price * (Number(about.data.score.purchaseScore) / Number(about.data.score.purchaseAmount))).toLocaleString("en-US"))}</div>
                    <span>امتیاز برای هر بار خرید</span>
                  </>
                ) : (
@@ -216,9 +188,7 @@ function FoodPage({}: Props) {
            </div>
            <div className="flex items-center gap-2 mt-2">
              <TruckTick size={14} className="stroke-disabled-text" />
-              <span className="text-disabled-text">
-                {foodData.pickupServe ? "ارسال با پیک" : "-"}
-              </span>
+              <span className="text-disabled-text">{foodData.pickupServe ? "ارسال با پیک" : "-"}</span>
            </div>
          </div>

@@ -235,38 +205,23 @@ function FoodPage({}: Props) {
            className="bg-background pattern-secondary-bg active:drop-shadow-xs max-w-[115px] rounded-md w-full h-8 inline-flex p-1 justify-between items-center gap-2 relative overflow-hidden"
          >
            {quantity <= 0 ? (
-              <button
-                onClick={handleAddToCart}
-                disabled={!isAvailable}
-                className="inline-flex w-full justify-center items-center gap-2 disabled:pointer-events-none disabled:opacity-40"
-              >
+              <button onClick={handleAddToCart} disabled={!isAvailable} className="inline-flex w-full justify-center items-center gap-2 disabled:pointer-events-none disabled:opacity-40">
                <PlusIcon />
-                <div className="text-sm2 pt-0.5 font-normal text-foreground">
-                  افزودن
-                </div>
+                <div className="text-sm2 pt-0.5 font-normal text-foreground">افزودن</div>
              </button>
            ) : (
              <>
                <button
                  onClick={handleAddToCart}
                  disabled={!isAvailable}
-                  className={glassSurfaceFlat('hover:brightness-95 active:brightness-90 rounded-sm p-2 transition-all disabled:opacity-40 disabled:pointer-events-none')}
+                  className={glassSurfaceFlat("hover:brightness-95 active:brightness-90 rounded-sm p-2 transition-all disabled:opacity-40 disabled:pointer-events-none")}
                >
                  <PlusIcon className="text-foreground" />
                </button>
-                <motion.div
-                  key={quantity}
-                  initial={{ scale: 1 }}
-                  animate={{ scale: [1.2, 0.95, 1] }}
-                  transition={{ duration: 0.3 }}
-                  className="text-sm2 pt-0.5 font-semibold"
-                >
+                <motion.div key={quantity} initial={{ scale: 1 }} animate={{ scale: [1.2, 0.95, 1] }} transition={{ duration: 0.3 }} className="text-sm2 pt-0.5 font-semibold">
                  {quantity}
                </motion.div>
-                <button
-                  onClick={handleRemoveFromCart}
-                  className={glassSurfaceFlat('hover:brightness-95 active:brightness-90 rounded-sm p-2 transition-all')}
-                >
+                <button onClick={handleRemoveFromCart} className={glassSurfaceFlat("hover:brightness-95 active:brightness-90 rounded-sm p-2 transition-all")}>
                  <MinusIcon className="text-foreground" />
                </button>
              </>