36 lines
1.2 KiB
TypeScript
36 lines
1.2 KiB
TypeScript
import type { Address, AuditEvent, OrderDetail } from "@orderops/shared";
|
|
import { AuditTimeline } from "./audit-timeline";
|
|
import { OrderItemsPanel } from "./order-items-panel";
|
|
import { OrderSummaryPanel } from "./order-summary";
|
|
import { ShippingAddressForm } from "./shipping-address-form";
|
|
|
|
interface OrderDetailPageProps {
|
|
order: OrderDetail;
|
|
auditEvents: AuditEvent[];
|
|
onUpdateQuantity: (itemId: string, quantity: number) => Promise<void>;
|
|
onSaveAddress: (address: Address) => Promise<void>;
|
|
onCancel: () => Promise<void>;
|
|
}
|
|
|
|
export function OrderDetailPage({
|
|
order,
|
|
auditEvents,
|
|
onUpdateQuantity,
|
|
onSaveAddress,
|
|
onCancel
|
|
}: OrderDetailPageProps) {
|
|
return (
|
|
<div className="space-y-4">
|
|
<OrderSummaryPanel order={order} />
|
|
<div className="flex justify-end">
|
|
<button className="rounded-md bg-red-600 px-4 py-2 text-sm font-medium text-white" onClick={() => void onCancel()} type="button">
|
|
Cancel order
|
|
</button>
|
|
</div>
|
|
<OrderItemsPanel order={order} onUpdateQuantity={onUpdateQuantity} />
|
|
<ShippingAddressForm order={order} onSave={onSaveAddress} />
|
|
<AuditTimeline events={auditEvents} />
|
|
</div>
|
|
);
|
|
}
|