feat(ticket-actions): show lot context on extension cards

This commit is contained in:
2026-07-31 19:37:20 +05:30
parent 514b42ea91
commit faefd34cd4
3 changed files with 29 additions and 7 deletions

View File

@@ -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}

View File

@@ -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>

View File

@@ -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>