ORDERHISTORY COMPONENT

Display customer order history with status badges and tracking information.

PROPS

PropTypeDescription
ordersOrder[]Array of orders
loadingbooleanLoading state
onOrderClick(order) => voidOrder click handler

Order Status Variants

Order FAN-2025-001

Placed on December 20, 2025

Shipped

Total

€ 41,18

Order FAN-2025-002

Placed on December 22, 2025

Processing

Total

€ 119,96

Order FAN-2025-003

Placed on December 15, 2025

Delivered

Total

€ 44,98

Order FAN-2025-004

Placed on December 23, 2025

Pending

Total

€ 75,86

Order FAN-2025-005

Placed on December 18, 2025

Cancelled

Total

€ 47,28

Empty State

No orders yet

Start shopping to see your orders here

USAGE EXAMPLES

IMPLEMENTATION

1import { OrderHistory } from '@/components/fanbace/order-history';
2import { useOrders } from '@/lib/sdk';
3
4export default function OrdersPage() {
5 const { orders, loading } = useOrders();
6
7 return (
8 <OrderHistory
9 orders={orders}
10 loading={loading}
11 onOrderClick={(order) => router.push(`/orders/${order.id}`)}
12 />
13 );
14}