26 lines
798 B
TypeScript

'use client';
import { ReadonlyTimeRange } from '../shared/time-range';
import { type OrderComponentProps } from './types';
import { useOrderQuery } from '@/hooks/api/orders';
import { formatDate } from '@repo/utils/datetime-format';
export function OrderDateTime({ documentId }: Readonly<OrderComponentProps>) {
const { data: { order } = {} } = useOrderQuery({ documentId });
if (!order) return null;
return (
<div className="flex flex-col">
<span className="text-sm tracking-wide text-muted-foreground">
{order.slot?.datetime_start ? formatDate(order.slot.datetime_start).user() : ''}
</span>
<ReadonlyTimeRange
className="text-3xl"
datetimeEnd={order?.datetime_end}
datetimeStart={order?.datetime_start}
/>
</div>
);
}