feat: núcleo de tickets com Convex (CRUD, play, comentários com anexos) + auth placeholder; docs em AGENTS.md; toasts e updates otimistas; mapeadores Zod; refinos PT-BR e layout do painel de detalhes

This commit is contained in:
esdrasrenan 2025-10-04 00:31:44 -03:00
parent 2230590e57
commit 27b103cb46
97 changed files with 15117 additions and 15715 deletions

View file

@ -1,47 +1,55 @@
import { queueSummaries } from "@/lib/mocks/tickets"
"use client"
import { useQuery } from "convex/react"
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
import { api } from "../../../convex/_generated/api"
import { DEFAULT_TENANT_ID } from "@/lib/constants"
import type { TicketQueueSummary } from "@/lib/schemas/ticket"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Progress } from "@/components/ui/progress"
interface TicketQueueSummaryProps {
queues?: TicketQueueSummary[]
}
export function TicketQueueSummaryCards({ queues = queueSummaries }: TicketQueueSummaryProps) {
interface TicketQueueSummaryProps {
queues?: TicketQueueSummary[]
}
export function TicketQueueSummaryCards({ queues }: TicketQueueSummaryProps) {
const fromServer = useQuery(api.queues.summary, { tenantId: DEFAULT_TENANT_ID }) ?? []
const data: TicketQueueSummary[] = (queues ?? fromServer) as any
return (
<div className="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
{queues.map((queue) => {
{data.map((queue) => {
const total = queue.pending + queue.waiting
const breachPercent = total === 0 ? 0 : Math.round((queue.breached / total) * 100)
return (
<Card key={queue.id} className="border border-border/60 bg-gradient-to-br from-background to-card p-4">
<CardHeader className="pb-2">
<CardDescription>Fila</CardDescription>
<CardTitle className="text-lg font-semibold">{queue.name}</CardTitle>
</CardHeader>
<CardContent className="flex flex-col gap-3 text-sm">
<div className="flex justify-between text-muted-foreground">
<span>Pendentes</span>
<span className="font-medium text-foreground">{queue.pending}</span>
</div>
<div className="flex justify-between text-muted-foreground">
<span>Aguardando resposta</span>
<span className="font-medium text-foreground">{queue.waiting}</span>
</div>
<div className="flex items-center justify-between text-muted-foreground">
<span>Violados</span>
<span className="font-medium text-destructive">{queue.breached}</span>
</div>
<div className="pt-1.5">
<Progress value={breachPercent} className="h-1.5" />
<span className="mt-2 block text-xs text-muted-foreground">
{breachPercent}% com SLA violado nesta fila
</span>
</div>
</CardContent>
</Card>
)
})}
</div>
)
}
<Card key={queue.id} className="border border-border/60 bg-gradient-to-br from-background to-card p-4">
<CardHeader className="pb-2">
<CardDescription>Fila</CardDescription>
<CardTitle className="text-lg font-semibold">{queue.name}</CardTitle>
</CardHeader>
<CardContent className="flex flex-col gap-3 text-sm">
<div className="flex justify-between text-muted-foreground">
<span>Pendentes</span>
<span className="font-medium text-foreground">{queue.pending}</span>
</div>
<div className="flex justify-between text-muted-foreground">
<span>Aguardando resposta</span>
<span className="font-medium text-foreground">{queue.waiting}</span>
</div>
<div className="flex items-center justify-between text-muted-foreground">
<span>Violados</span>
<span className="font-medium text-destructive">{queue.breached}</span>
</div>
<div className="pt-1.5">
<Progress value={breachPercent} className="h-1.5" />
<span className="mt-2 block text-xs text-muted-foreground">
{breachPercent}% com SLA violado nesta fila
</span>
</div>
</CardContent>
</Card>
)
})}
</div>
)
}