56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
'use client'
|
|
|
|
import ProductCategoryBox from '@/app/components/layout/shop/products-cat'
|
|
import axiosInstance from '@/axios/axiosInstance'
|
|
import { useEffect } from 'react'
|
|
import { useQuery } from '@tanstack/react-query'
|
|
|
|
const Page = ()=>{
|
|
|
|
const query = useQuery({ queryKey: ['categoryProducts'], queryFn: async ()=>{
|
|
|
|
return await axiosInstance.get("shop/v2/product-category/list/")
|
|
},refetchOnWindowFocus:true, })
|
|
|
|
const category = query.data?.data ?? []
|
|
useEffect(() => {
|
|
if (!query.isSuccess) return
|
|
const frame = requestAnimationFrame(() => {
|
|
try {
|
|
const position = Number(localStorage.getItem('scrollY'))
|
|
if (Number.isFinite(position) && position > 0) window.scrollTo(0, position)
|
|
} catch {
|
|
console.warn('Could not restore the saved shop scroll position.')
|
|
}
|
|
})
|
|
return () => cancelAnimationFrame(frame)
|
|
}, [query.isSuccess])
|
|
|
|
if(query.isLoading){
|
|
return (
|
|
<p className='text-center'>درحال دریافت اطلاعات</p>
|
|
)
|
|
}
|
|
|
|
if(query.isError){
|
|
return (
|
|
<p className='text-center'>
|
|
خطا در دریافت اطلاعات
|
|
</p>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<div className="grid grid-cols-2 min-[1350px]:grid-cols-5 min-[767px]:grid-cols-3 min-[1100px]:grid-cols-4 gap-x-2 gap-y-2">
|
|
{query.isSuccess?category.map((iteam:any)=>{
|
|
return <ProductCategoryBox key={iteam.id} iteam={iteam} />
|
|
}):null}
|
|
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Page
|