fix(dashboard): guard nested fields (resolution, firstResponse, awaitingAction) to prevent undefined access and runtime crash; add safe fallbacks in UI

This commit is contained in:
codex-bot 2025-10-21 14:12:41 -03:00
parent 68b897c30c
commit 2cdc856009

View file

@ -83,17 +83,18 @@ export function SectionCards() {
rateLabel: "Taxa indisponível", rateLabel: "Taxa indisponível",
} }
} }
const current = dashboard.resolution.resolvedLast7d ?? 0 const current = dashboard?.resolution?.resolvedLast7d ?? 0
const previous = dashboard.resolution.previousResolved ?? 0 const previous = dashboard?.resolution?.previousResolved ?? 0
const deltaPercentage = dashboard.resolution.deltaPercentage ?? null const deltaPercentage = dashboard?.resolution?.deltaPercentage ?? null
const positive = deltaPercentage !== null ? deltaPercentage >= 0 : current >= previous const positive = deltaPercentage !== null ? deltaPercentage >= 0 : current >= previous
const badgeLabel = deltaPercentage !== null const badgeLabel = deltaPercentage !== null
? `${deltaPercentage >= 0 ? "+" : ""}${deltaPercentage.toFixed(1)}%` ? `${deltaPercentage >= 0 ? "+" : ""}${deltaPercentage.toFixed(1)}%`
: previous > 0 : previous > 0
? `${current - previous >= 0 ? "+" : ""}${current - previous}` ? `${current - previous >= 0 ? "+" : ""}${current - previous}`
: "Sem histórico" : "Sem histórico"
const rateLabel = dashboard.resolution.rate !== null const rate = dashboard?.resolution?.rate ?? null
? `${dashboard.resolution.rate.toFixed(1)}% dos tickets foram resolvidos` const rateLabel = rate !== null
? `${rate.toFixed(1)}% dos tickets foram resolvidos`
: "Taxa indisponível" : "Taxa indisponível"
return { positive, badgeLabel, rateLabel } return { positive, badgeLabel, rateLabel }
}, [dashboard]) }, [dashboard])
@ -137,7 +138,9 @@ export function SectionCards() {
<span className="block">1ª resposta</span> <span className="block">1ª resposta</span>
</CardDescription> </CardDescription>
<CardTitle className="text-3xl font-semibold tabular-nums"> <CardTitle className="text-3xl font-semibold tabular-nums">
{dashboard ? formatMinutes(dashboard.firstResponse.averageMinutes) : <Skeleton className="h-8 w-24" />} {dashboard?.firstResponse
? formatMinutes(dashboard.firstResponse.averageMinutes)
: <Skeleton className="h-8 w-24" />}
</CardTitle> </CardTitle>
<CardAction> <CardAction>
<Badge <Badge
@ -157,7 +160,7 @@ export function SectionCards() {
</CardHeader> </CardHeader>
<CardFooter className="flex-col items-start gap-1 text-sm text-muted-foreground"> <CardFooter className="flex-col items-start gap-1 text-sm text-muted-foreground">
<span className="text-foreground"> <span className="text-foreground">
{dashboard {dashboard?.firstResponse
? `${dashboard.firstResponse.responsesCount} tickets com primeira resposta` ? `${dashboard.firstResponse.responsesCount} tickets com primeira resposta`
: "Carregando amostra"} : "Carregando amostra"}
</span> </span>
@ -169,12 +172,12 @@ export function SectionCards() {
<CardHeader className="gap-3"> <CardHeader className="gap-3">
<CardDescription>Tickets aguardando ação</CardDescription> <CardDescription>Tickets aguardando ação</CardDescription>
<CardTitle className="text-3xl font-semibold tabular-nums"> <CardTitle className="text-3xl font-semibold tabular-nums">
{dashboard ? dashboard.awaitingAction.total : <Skeleton className="h-8 w-16" />} {dashboard?.awaitingAction ? dashboard.awaitingAction.total : <Skeleton className="h-8 w-16" />}
</CardTitle> </CardTitle>
<CardAction> <CardAction>
<Badge variant="outline" className="rounded-full gap-1 px-2 py-1 text-xs"> <Badge variant="outline" className="rounded-full gap-1 px-2 py-1 text-xs">
<IconClockHour4 className="size-3.5" /> <IconClockHour4 className="size-3.5" />
{dashboard ? `${dashboard.awaitingAction.atRisk} em risco` : "—"} {dashboard?.awaitingAction ? `${dashboard.awaitingAction.atRisk} em risco` : "—"}
</Badge> </Badge>
</CardAction> </CardAction>
</CardHeader> </CardHeader>
@ -191,7 +194,7 @@ export function SectionCards() {
<span className="block">(7 dias)</span> <span className="block">(7 dias)</span>
</CardDescription> </CardDescription>
<CardTitle className="text-3xl font-semibold tabular-nums"> <CardTitle className="text-3xl font-semibold tabular-nums">
{dashboard ? dashboard.resolution.resolvedLast7d : <Skeleton className="h-8 w-12" />} {dashboard?.resolution ? dashboard.resolution.resolvedLast7d : <Skeleton className="h-8 w-12" />}
</CardTitle> </CardTitle>
<CardAction> <CardAction>
<Badge <Badge