console.log(params);

'use client';

//...imports ....

const OrderItem = ({ order }: OrderItemProps) => {
 
//.......some content ....

  return (
    <div className="flex flex-col items-center gap-3 md:flex-row md:justify-center">
      <OrderTableContentWrapper>{order.id}</OrderTableContentWrapper>
      <OrderTableContentWrapper className="md:w-[200px]">
        {format(new Date(order.createdAt), 'hh:mmaaa MMM do, yyyy')}
      </OrderTableContentWrapper>
      <OrderTableContentWrapper className="md:w-24">
        {formattedTotalCartPrice}
      </OrderTableContentWrapper>
      <OrderTableContentWrapper className="flex flex-row justify-center md:w-20">
        <div
          className={cn(
            'w-20 rounded-sm p-1 text-center text-sm text-white',
            {
              'bg-red-600': !order.paid,
              'bg-green-600': order.paid
            }
          )}
        >
          {order.paid ? 'Paid' : 'Not Paid'}
        </div>
      </OrderTableContentWrapper>
      <OrderTableContentWrapper className="flex flex-row justify-center md:w-24">
        <Link
          href={`/user/${order.userId}/orders/${order.id}`}
          className={cn(
            buttonVariants({ variant: 'outline', size: 'sm' }),
            'rounded-xl'
          )}
        >
          Details
        </Link>
      </OrderTableContentWrapper>
    </div>
  );
};

export default OrderItem;

'use client';

//..imports

const OrderId = ({ params }: { params: { id: string } }) => {

//...useState

  const { id } = params;

  const { status, data: session } = useSession();


  const fetchData = async () => {
    try {
      setIsLoading(true);
      const response = await fetch(
        `/api/user/${session?.user.id}/orders/${id}`,
        {
          method: 'GET',
          headers: {
            'Content-Type': 'application/json'
          },
          cache: 'no-cache'
        }
      );

      if (response.ok) {
        const data: OrderProps = await response.json();
        console.log(data.order);
        // setOrder(data);
      } else {
        setIsError(true);
        toast.error('An unexpected error occurred');
      }
      setIsLoading(false);
    } catch (error) {
      setIsError(true);
      toast.error('An unexpected error is occured');
      setIsLoading(false);
    }
  };

  useEffect(() => {
    fetchData();
  }, []);

  if (status === 'loading') {
    return (
      <div className="m-auto mt-20">
        <Loading />
      </div>
    );
  }

  return <div>OrderId</div>;
};

export default OrderId;

import { NextResponse } from 'next/server';
import prisma from '../../../../../../prisma/client';

export const revalidate = 0;

export async function GET({ params }: { params: { id: string } }) {
  console.log('params:', params);
  try {
    const orderListbyUserId = await prisma.order.findMany({
      where: {
        userId: params.id
      },
      orderBy: {
        createdAt: 'desc'
      },
      include: {
        user: true,
        cartItems: {
          include: {
            menu: true // Include Menu details within cartItems
          }
        }
      }
    });

    return NextResponse.json(
      {
        orderList: orderListbyUserId,
        message: `All orders to userId: ${params.id} are returned`
      },
      { status: 200 }
    );
  } catch (error) {
    return NextResponse.json(
      {
        message: error
      },
      { status: 500 }
    );
  }
}

export async function GET(req: Request, { params }: { params: { id: string } }) {}