feat: timeline 'Comentário adicionado' com autor; skeletons na página de detalhe; skeleton nas filas; alias de Convex já padronizado; mutation addComment inclui authorName/avatar
This commit is contained in:
parent
da1633a30e
commit
9b0c0bd80a
5 changed files with 128 additions and 4 deletions
|
|
@ -7,6 +7,9 @@ import { api } from "@/convex/_generated/api";
|
|||
import { DEFAULT_TENANT_ID } from "@/lib/constants";
|
||||
import { mapTicketWithDetailsFromServer } from "@/lib/mappers/ticket";
|
||||
import { getTicketById } from "@/lib/mocks/tickets";
|
||||
import { Card, CardContent } from "@/components/ui/card";
|
||||
import { Separator } from "@/components/ui/separator";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
import { TicketComments } from "@/components/tickets/ticket-comments";
|
||||
import { TicketDetailsPanel } from "@/components/tickets/ticket-details-panel";
|
||||
import { TicketSummaryHeader } from "@/components/tickets/ticket-summary-header";
|
||||
|
|
@ -21,7 +24,34 @@ export function TicketDetailView({ id }: { id: string }) {
|
|||
} else if (isMockId) {
|
||||
ticket = getTicketById(id) ?? null;
|
||||
}
|
||||
if (!ticket) return <div className="px-4 py-8 text-sm text-muted-foreground">Carregando ticket...</div>;
|
||||
if (!ticket) return (
|
||||
<div className="flex flex-col gap-6 px-4 lg:px-6">
|
||||
<Card className="rounded-xl border bg-card shadow-sm">
|
||||
<CardContent className="space-y-3 p-6">
|
||||
<div className="flex items-center gap-2"><Skeleton className="h-5 w-24" /><Skeleton className="h-5 w-20" /></div>
|
||||
<Skeleton className="h-7 w-2/3" />
|
||||
<Skeleton className="h-4 w-1/2" />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<div className="grid gap-6 lg:grid-cols-[2fr_1fr]">
|
||||
<Card className="rounded-xl border bg-card shadow-sm">
|
||||
<CardContent className="space-y-4 p-6">
|
||||
{Array.from({ length: 3 }).map((_, i) => (
|
||||
<div key={i} className="space-y-2">
|
||||
<div className="flex items-center gap-2"><Skeleton className="h-4 w-28" /><Skeleton className="h-3 w-24" /></div>
|
||||
<Skeleton className="h-16 w-full" />
|
||||
</div>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="rounded-xl border bg-card shadow-sm">
|
||||
<CardContent className="space-y-3 p-6">
|
||||
{Array.from({ length: 5 }).map((_, i) => (<Skeleton key={i} className="h-3 w-full" />))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<div className="flex flex-col gap-6 px-4 lg:px-6">
|
||||
<TicketSummaryHeader ticket={ticket as any} />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue