feat(ticket-actions): show lot context on extension cards
This commit is contained in:
@@ -13,7 +13,11 @@ export function RequestExtensionAction({
|
||||
dueAt: string | null;
|
||||
}) {
|
||||
return (
|
||||
<TicketActionCard icon={Clock3} title="Request Extension">
|
||||
<TicketActionCard
|
||||
icon={Clock3}
|
||||
title="Request Extension"
|
||||
contextLabel={`Lot ${assignmentId}`}
|
||||
>
|
||||
<TicketExtensionRequestPanel
|
||||
ticketId={ticketId}
|
||||
assignmentId={assignmentId}
|
||||
|
||||
@@ -105,7 +105,11 @@ function ExtensionReviewForm({
|
||||
const extensionDays = getExtensionDays(request);
|
||||
|
||||
return (
|
||||
<TicketActionCard icon={CalendarClock} title="Extension Request Details">
|
||||
<TicketActionCard
|
||||
icon={CalendarClock}
|
||||
title="Extension Request Details"
|
||||
contextLabel={`Lot ${assignmentId}`}
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<Requester request={request} />
|
||||
|
||||
@@ -253,7 +257,11 @@ export function ReviewExtensionRequestAction({
|
||||
|
||||
if (extensionRequestQuery.isLoading) {
|
||||
return (
|
||||
<TicketActionCard icon={Clock3} title="Extension Request">
|
||||
<TicketActionCard
|
||||
icon={Clock3}
|
||||
title="Extension Request"
|
||||
contextLabel={`Lot ${assignmentId}`}
|
||||
>
|
||||
<div className="flex items-center justify-center py-8 text-muted-foreground">
|
||||
<Loader2 className="mr-2 size-4 animate-spin" />
|
||||
<span className="text-sm">Checking for requests...</span>
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
import type { LucideIcon } from 'lucide-react';
|
||||
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
@@ -9,6 +10,7 @@ interface TicketActionCardProps {
|
||||
icon: LucideIcon;
|
||||
iconClassName?: string;
|
||||
title: string;
|
||||
contextLabel?: string;
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
@@ -16,15 +18,23 @@ export function TicketActionCard({
|
||||
icon: Icon,
|
||||
iconClassName,
|
||||
title,
|
||||
contextLabel,
|
||||
children,
|
||||
}: TicketActionCardProps) {
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2 text-base">
|
||||
<Icon className={cn('text-primary', iconClassName)} />
|
||||
{title}
|
||||
</CardTitle>
|
||||
<div className="flex items-center justify-between gap-3">
|
||||
<CardTitle className="flex min-w-0 items-center gap-2 text-base">
|
||||
<Icon className={cn('shrink-0 text-primary', iconClassName)} />
|
||||
<span className="truncate">{title}</span>
|
||||
</CardTitle>
|
||||
{contextLabel ? (
|
||||
<Badge variant="secondary" className="shrink-0">
|
||||
{contextLabel}
|
||||
</Badge>
|
||||
) : null}
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>{children}</CardContent>
|
||||
</Card>
|
||||
|
||||
Reference in New Issue
Block a user