classify web

2026-02-24 12:52:49 +05:00
commit 64af77101f
310 changed files with 45449 additions and 0 deletions
--- a/components/PagesComponent/ProductDetail/ProductDetailCard.jsx
+++ b/components/PagesComponent/ProductDetail/ProductDetailCard.jsx
@@ -0,0 +1,95 @@
+import { formatDateMonthYear, t } from "@/utils/index";
+import { FaHeart, FaRegCalendarCheck, FaRegHeart } from "react-icons/fa";
+import { manageFavouriteApi } from "@/utils/api";
+import { toast } from "sonner";
+import { usePathname } from "next/navigation";
+import { getIsLoggedIn } from "@/redux/reducer/authSlice";
+import { useSelector } from "react-redux";
+import { getCompanyName } from "@/redux/reducer/settingSlice";
+import ShareDropdown from "@/components/Common/ShareDropdown";
+import { setIsLoginOpen } from "@/redux/reducer/globalStateSlice";
+
+const ProductDetailCard = ({ productDetails, setProductDetails }) => {
+  const path = usePathname();
+  const currentUrl = `${process.env.NEXT_PUBLIC_WEB_URL}${path}`;
+  const translated_item = productDetails?.translated_item;
+  const isLoggedIn = useSelector(getIsLoggedIn);
+  const CompanyName = useSelector(getCompanyName);
+  const FbTitle =
+    (translated_item?.name || productDetails?.name) + " | " + CompanyName;
+  const headline = `🚀 Discover the perfect deal! Explore "${
+    translated_item?.name || productDetails?.name
+  }" from ${CompanyName} and grab it before it's gone. Shop now at`;
+
+  const isJobCategory = Number(productDetails?.category?.is_job_category) === 1;
+  const price = isJobCategory
+    ? productDetails?.formatted_salary_range
+    : productDetails?.formatted_price;
+
+  const handleLikeItem = async () => {
+    if (!isLoggedIn) {
+      setIsLoginOpen(true);
+      return;
+    }
+    try {
+      const response = await manageFavouriteApi.manageFavouriteApi({
+        item_id: productDetails?.id,
+      });
+      if (response?.data?.error === false) {
+        setProductDetails((prev) => ({
+          ...prev,
+          is_liked: !productDetails?.is_liked,
+        }));
+      }
+      toast.success(response?.data?.message);
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
+  return (
+    <div className="flex flex-col gap-4 border p-4 rounded-lg">
+      <div className="flex justify-between max-w-full">
+        <div className="flex flex-col gap-2">
+          <h1
+            className="text-2xl font-medium word-break-all line-clamp-2"
+            title={translated_item?.name || productDetails?.name}
+          >
+            {translated_item?.name || productDetails?.name}
+          </h1>
+          <h2
+            className="text-primary text-3xl font-bold break-all text-balance line-clamp-2"
+            title={price}
+          >
+            {price}
+          </h2>
+        </div>
+        <div className="flex flex-col gap-4">
+          <button
+            className="rounded-full size-10 flex items-center justify-center p-2 border"
+            onClick={handleLikeItem}
+          >
+            {productDetails?.is_liked === true ? (
+              <FaHeart size={20} className="text-primary" />
+            ) : (
+              <FaRegHeart size={20} />
+            )}
+          </button>
+          <ShareDropdown
+            url={currentUrl}
+            title={FbTitle}
+            headline={headline}
+            companyName={CompanyName}
+            className="rounded-full p-2 border bg-white"
+          />
+        </div>
+      </div>
+      <div className="flex gap-1 items-center">
+        <FaRegCalendarCheck />
+        {t("postedOn")}:{formatDateMonthYear(productDetails?.created_at)}
+      </div>
+    </div>
+  );
+};
+
+export default ProductDetailCard;