1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / chinawholesale-frontend-next / src / components / pages / recent-view /
Filename : RecentViewProduct.js
back
'use client'
import React, { useMemo } from 'react'
import { Pagination } from 'antd'
import { useRouter } from 'next/navigation'
import { useRecentViewProducts } from '@/api/product-api'
import ProductSectionSkeleton from '@/components/skeleton/ProductSectionSkeleton'
import { MainCard } from '@/components/cards/main-card'
import { ProductList } from '@/components/list-item/product-list'

export default function RecentViewProduct({ searchParams, paginate = true }) {
    const history = useRouter()
    const page = searchParams?.page || 1

    let { data, isLoading } = useRecentViewProducts(searchParams)
    const recentData = useMemo(() => data?.data || [], [data])

    const handlePaginationClick = (paginate) => {
        history.push(`/recent-view?page=${paginate.selected + 1}`)
    }

    const products = recentData?.data || []
    const TotalCount = products?.count || 0


    return (
        <>
            <MainCard
                className={''}
                label={'Recent viewed products'}
            >
                {
                    isLoading ?
                        <ProductSectionSkeleton />
                        :
                        <ProductList products={products} />
                }

                {
                    products?.length > 24 && paginate &&
                    <div className={'py-8 w-full flex justify-center items-center'}>
                        <Pagination
                            defaultCurrent={page}
                            total={TotalCount}
                            pageSize={24}
                            defaultPageSize={24}
                            onChange={handlePaginationClick}
                            showSizeChanger={false}
                            responsive={true}
                        />
                    </div>
                }

            </MainCard>
        </>
    )
}