Vitron-Front/app/routes/profile.bookmarks.tsx
2026-04-29 01:44:16 +03:30

88 lines
3.2 KiB
TypeScript

import { useServiceGetUserBookmarks } from "../requestHandler/use-bookmark-hooks";
import ProfilePagesHeader from "../components/ProfilePagesHeader";
import bookmark from "../assets/icons/profile/bookmark/bookmark.svg";
import MondrianProductList from "~/components/MondrianProductList";
import { MetaFunction } from "@remix-run/node";
export default function Bookmarks() {
const {
data,
isLoading,
isError,
refetch,
fetchNextPage,
hasNextPage,
isFetchingNextPage,
} = useServiceGetUserBookmarks();
// Flatten the pages data
const bookmarks = data?.pages.flatMap((page) => page.results) || [];
return (
<div className="flex flex-col gap-6">
<ProfilePagesHeader title="ذخیره شده‌ها" />
{/* Content */}
<MondrianProductList
products={bookmarks.map((bookmark) => {
return {
id: bookmark.productId,
title: bookmark.productTitle,
images: bookmark.productImage ? [bookmark.productImage] : [],
basePrice: bookmark.basePrice
? parseInt(bookmark.basePrice)
: undefined,
discountPercent: bookmark.discountPercent
? parseInt(bookmark.discountPercent)
: undefined,
discountPrice: bookmark.discountPrice
? parseInt(bookmark.discountPrice)
: undefined,
};
})}
fetchNextPage={fetchNextPage}
hasNextPage={hasNextPage}
isFetchingNextPage={isFetchingNextPage}
isLoading={isLoading}
isError={isError}
refetch={refetch}
emptyState={{
image: <img alt="cartBanner" src={bookmark} className="w-12 h-12" />,
title: "محصولی ذخیره نشده است",
description:
"تمام محصول‌هایی که ذخیره کنید در این قسمت قابل مشاهده است.",
}}
/>
</div>
);
}
export const meta: MetaFunction = () => {
return [
{ title: "ذخیره شده‌ها - ویترون" },
{
name: "description",
content:
"مدیریت و مشاهده تمام محصولات ذخیره شده شما در ویترون. فیلتر بر اساس وضعیت و جستجو در محصولات.",
},
{
name: "keywords",
content: "ذخیره شده، مدیریت ذخیره شده، فروشگاه، مشتری، ویترون",
},
{ name: "robots", content: "noindex, follow" },
{ property: "og:title", content: "ذخیره شده‌ها - ویترون" },
{
property: "og:description",
content:
"مدیریت و مشاهده تمام محصولات ذخیره شده شما در ویترون. فیلتر بر اساس وضعیت و جستجو در محصولات.",
},
{ property: "og:type", content: "website" },
{ name: "twitter:card", content: "summary" },
{ name: "twitter:title", content: "ذخیره شده‌ها - ویترون" },
{
name: "twitter:description",
content:
"مدیریت و مشاهده تمام محصولات ذخیره شده شما در ویترون. فیلتر بر اساس وضعیت و جستجو در محصولات.",
},
];
};