import React, { ReactElement, useCallback } from 'react'; import { NextPageWithLayout } from '../../_app'; import AccountLayout from '@/components/sheardComponent/AccountLayout'; import Pagetitle from '@/components/sheardComponent/Pagetitle'; import { Order } from '@/helper/types'; import { useSession } from 'next-auth/react'; import useSWR from 'swr' import { api_routes } from '@/helper/routes'; import { GetServerSideProps, InferGetServerSidePropsType } from 'next'; import Link from 'next/link'; import { axiosPublic } from '../../../../axios'; import Head from 'next/head'; import Image from 'next/image'; type ServerSideProps = { reciept: string } export const getServerSideProps: GetServerSideProps<{ repo: ServerSideProps }> = async (ctx: any) => { return { props: { repo: { reciept: ctx?.params.reciept, } } } } const OrderDetailPage:NextPageWithLayout> = ({repo}) => { const { status, data:session } = useSession(); const fetcher = useCallback( async (url: string) => { if(status==='authenticated'){ const headers = { headers: { "Authorization" : `Bearer ${session?.user.token}`, "Accept": 'application/json' } } const res = await axiosPublic.get(url,headers) return res.data.order; } return undefined; }, [status, session], ); const { data:order, isLoading:loading } = useSWR(status==='authenticated' ? api_routes.place_order_detail+`/${repo.reciept}` : null, fetcher); return ( <> JAP - Orders {loading &&
Loading...
} {order && order.products.length >= 1 && (
Order Reciept : {order.receipt}
Payment Status : {order.payment_status}
Order Status : {order.order_status}
  • Payment Mode : {order.mode_of_payment} Order Placed : {order.created_at}
{order.products.map((item, index) => { return( ) } )}
Images Product Unit Price Quantity Total
{item.featured_image_link && } {item.name} ₹{item.discounted_price} {item.quantity} ₹{item.total_quantity_price}

Order totals

    {/*
  • Subtotal ₹ {order.sub_total}
  • Total Discount - ₹ {order.total_discount}
    • */}
  • GST + ₹ {order.gst_charge}
  • Delivery Charge + ₹ {order.delivery_charge}
    • {/*
  • Cumulative Total ₹ {order.sub_total}
    • */}
  • Coupon Discount - ₹ {order.coupon_discount}
  • Total ₹ {order.total_price_with_coupon_dicount}
)} ); }; OrderDetailPage.getLayout = function getLayout(page: ReactElement) { return (
{page}
) } export default OrderDetailPage;