hamid zarghami
93 lines
4.0 KiB
TypeScript
93 lines
4.0 KiB
TypeScript
'use client'
|
||
import React, { useMemo } from 'react'
|
||
import { useRouter } from 'next/navigation'
|
||
import { ArrowLeft } from 'iconsax-react'
|
||
import Image from 'next/image'
|
||
import { useGetFavorites } from './hooks/useFavoriteData'
|
||
import MenuItem from '@/components/listview/MenuItem'
|
||
import MenuItemRenderer from '@/components/listview/MenuItemRenderer'
|
||
import VerticalScrollView from '@/components/listview/VerticalScrollView'
|
||
import type { Favorite } from './types/Types'
|
||
import type { Food } from '@/app/[name]/(Main)/types/Types'
|
||
|
||
function FavoritePage() {
|
||
const router = useRouter()
|
||
const { data: favoritesData, isLoading } = useGetFavorites()
|
||
|
||
const favorites = useMemo(() => {
|
||
return favoritesData?.data || []
|
||
}, [favoritesData?.data])
|
||
|
||
const foodItems = useMemo(() => {
|
||
return favorites.map((favorite: Favorite) => {
|
||
const favoriteFood = favorite.food
|
||
// تبدیل FavoriteFood به Food برای استفاده در MenuItem
|
||
const food: Food = {
|
||
id: favoriteFood.id,
|
||
category: favoriteFood.category,
|
||
title: favoriteFood.title,
|
||
desc: favoriteFood.desc,
|
||
content: favoriteFood.content,
|
||
price: favoriteFood.price,
|
||
prepareTime: favoriteFood.prepareTime ?? 0,
|
||
isActive: favoriteFood.isActive,
|
||
images: favoriteFood.images,
|
||
inPlaceServe: favoriteFood.inPlaceServe,
|
||
pickupServe: favoriteFood.pickupServe,
|
||
discount: favoriteFood.discount,
|
||
isSpecialOffer: favoriteFood.isSpecialOffer,
|
||
}
|
||
return food
|
||
})
|
||
}, [favorites])
|
||
|
||
return (
|
||
<div className='overflow-y-auto h-full noscrollbar flex flex-col'>
|
||
<div className='grid grid-cols-3 items-center'>
|
||
<span></span>
|
||
<h1 className='text-sm2 place-self-center font-medium'>علاقهمندیها</h1>
|
||
<ArrowLeft
|
||
className='cursor-pointer place-self-end'
|
||
size='24'
|
||
color='currentColor'
|
||
onClick={() => { router.back() }}
|
||
/>
|
||
</div>
|
||
|
||
<div className="mt-8 flex-1 h-full">
|
||
{isLoading ? (
|
||
<div className='flex flex-col items-center justify-center gap-2 py-12 text-sm2 text-muted-foreground'>
|
||
<span className='h-4 w-4 animate-spin rounded-full border border-dashed border-foreground border-t-transparent'></span>
|
||
<p>در حال دریافت علاقهمندیها...</p>
|
||
</div>
|
||
) : foodItems.length === 0 ? (
|
||
<div className='flex flex-col items-center justify-center gap-4 h-full'>
|
||
<Image
|
||
src='/assets/images/favorite.png'
|
||
alt='favorite'
|
||
width={120}
|
||
height={120}
|
||
className='object-contain'
|
||
/>
|
||
<div className='flex flex-col items-center gap-2 text-sm2 text-muted-foreground'>
|
||
<p>شما هیچ مورد علاقهمندی ثبت نکردهاید</p>
|
||
<p className='text-xs'>
|
||
برای افزودن غذا به علاقهمندیها، به صفحه جزئیات غذا بروید
|
||
</p>
|
||
</div>
|
||
</div>
|
||
) : (
|
||
<VerticalScrollView className="overflow-y-auto h-full">
|
||
{foodItems.map((food) => (
|
||
<MenuItemRenderer key={food.id}>
|
||
<MenuItem food={food} />
|
||
</MenuItemRenderer>
|
||
))}
|
||
</VerticalScrollView>
|
||
)}
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default FavoritePage |