JAP - Orders

import React, { ReactElement, useCallback } from 'react'; import { NextPageWithLayout } from '../../_app'; import AccountLayout from '@/components/sheardComponent/AccountLayout'; import Pagetitle from '@/components/sheardComponent/Pagetitle'; import useAxiosPrivate from '@/hooks/useAxiosPrivate'; import { api_routes } from '@/helper/routes'; import { Order } from '@/helper/types'; import useSWRInfinite from "swr/infinite"; import InfiniteScroll from 'react-infinite-scroll-component'; import OrderCard from '@/components/order/OrderCard'; import Head from 'next/head'; const PAGE_SIZE = 20; const OrdersPage:NextPageWithLayout = () => { const axiosPrivate = useAxiosPrivate(); const ordersFetcher = async (url: string) => { const res =await axiosPrivate.get(url); return res.data.data }; const getOrderKey = useCallback((pageIndex:any, previousPageData:any) => { if (previousPageData && previousPageData.length===0) return null; return `${api_routes.place_order_paginate}?total=${PAGE_SIZE}&page=${pageIndex+1}`; }, []) const { data, size, setSize, isLoading, } = useSWRInfinite(getOrderKey, ordersFetcher, { initialSize:1, revalidateAll: false, revalidateFirstPage: false, persistSize: false, parallel: false }); const fetchNextPage = () => setSize(size+1); return ( <> JAP - Orders

Orders

} refreshFunction={fetchNextPage} style={{overflowX: 'hidden'}} > {(data ? data.flat() : []).map((item, index) => )} ); }; OrdersPage.getLayout = function getLayout(page: ReactElement) { return (

{page}

) } export default OrdersPage;