61 lines
2.1 KiB
TypeScript
61 lines
2.1 KiB
TypeScript
import { useEffect, useState } from 'react';
|
|
import { orderBookingClient } from '../../api/clients';
|
|
import { ORDER_BOOKING } from '../../api/config';
|
|
import { RecordView } from './RecordView';
|
|
import { OrderCard } from '../cards/OrderCard';
|
|
import { StatsTiles } from '../reusable/StatsTiles';
|
|
import type { TileItem } from '../../api/types';
|
|
|
|
export interface WiredRecordViewProps {
|
|
onRowClick?: (row: Record<string, unknown>, index: number) => void;
|
|
pageSize?: number;
|
|
headerActions?: React.ReactNode;
|
|
rowActions?: (row: Record<string, unknown>) => React.ReactNode;
|
|
refreshKey?: number;
|
|
}
|
|
|
|
/** Orders record view (Order Booking workflow). */
|
|
export function OrdersView({ onRowClick, pageSize, headerActions, rowActions, refreshKey }: WiredRecordViewProps) {
|
|
const [analyticsTiles, setAnalyticsTiles] = useState<TileItem[]>([]);
|
|
|
|
useEffect(() => {
|
|
let live = true;
|
|
|
|
// Defer the fetch so it doesn't compete with the main list fetch
|
|
const timer = setTimeout(async () => {
|
|
try {
|
|
const res = await orderBookingClient.recordView(ORDER_BOOKING.recordViews.ANALYTICS_ORDERS, { limit: 0 });
|
|
if (live && res.tile_values) {
|
|
const filteredTiles = (res.tile_values as TileItem[]).filter(
|
|
(t) => t.key !== 'total_orders' && t.key !== 'total_orders_count'
|
|
);
|
|
setAnalyticsTiles(filteredTiles);
|
|
}
|
|
} catch (e) {
|
|
console.error("Failed to load analytics tiles for orders", e);
|
|
}
|
|
}, 100);
|
|
|
|
return () => { live = false; clearTimeout(timer); };
|
|
}, [refreshKey]);
|
|
|
|
return (
|
|
<div className="flex flex-col gap-5 w-full">
|
|
{analyticsTiles.length > 0 && <StatsTiles tiles={analyticsTiles} />}
|
|
<RecordView
|
|
client={orderBookingClient}
|
|
rvUid={ORDER_BOOKING.recordViews.ORDERS}
|
|
title="Orders"
|
|
onRowClick={onRowClick}
|
|
pageSize={pageSize}
|
|
headerActions={headerActions}
|
|
rowActions={rowActions}
|
|
refreshKey={refreshKey}
|
|
sortBy="instance_id"
|
|
sortDir="desc"
|
|
renderItem={(row, fields) => <OrderCard row={row} fields={fields} />}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|