astral/buzz-sheet
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat : imrpove admin comment
CI / Verify (push) Successful in 1m50s
Details
CI / Build immutable images and deploy (push) Successful in 3m47s
Details

Browse Source
This commit is contained in:
gunshiz
2026-10-08 15:06:19 +07:00 Unverified
parent 721e2e5cf8
commit b9601b739d
11 changed files with 215 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/comments/comment-skeleton.tsx
+18 -15
View File
@@ -1,23 +1,26 @@
import { Skeleton } from "@/components/ui/skeleton";
import { Separator } from "@/components/ui/separator";
import { Table, TableBody, TableCell, TableRow } from "@/components/ui/table";
export function AdminCommentRowsSkeleton({ count = 3 }: { count?: number }) {
return <div role="status" aria-label="กำลังโหลดความคิดเห็น" className="flex min-w-0 flex-col">
<span className="sr-only">กำลังโหลดความคิดเห็น…</span>
<div aria-hidden="true">{Array.from({ length: count }, (_, index) => <div key={index}>
<div className="grid min-w-0 grid-cols-1 items-start gap-3 py-5 md:grid-cols-[minmax(0,1fr)_280px] md:gap-6">
<div className="flex min-w-0 flex-col gap-3 py-2">
<div className="flex items-center gap-3"><Skeleton className="size-10 shrink-0 rounded-full" /><Skeleton className="h-4 w-36 max-w-full" /></div>
<Skeleton className="h-4 w-4/5" /><Skeleton className="h-4 w-3/5" />
<div className="flex gap-3"><Skeleton className="h-11 w-16 rounded-full md:h-7" /><Skeleton className="h-11 w-11 rounded-full md:h-7" /><Skeleton className="h-11 w-11 rounded-full md:h-7" /></div>
</div>
<div className="flex items-start gap-2 py-2 md:justify-end">
<Skeleton className="size-11 shrink-0 rounded-full md:size-7" />
<Skeleton className="size-28 shrink-0 rounded-lg" />
</div>
</div>
<Separator />
</div>)}</div>
<Table className="table-fixed max-md:block" aria-hidden="true">
<TableBody className="max-md:block">{Array.from({ length: count }, (_, index) => <TableRow key={index} className="max-md:block">
<TableCell className="px-0 py-5 align-top whitespace-normal max-md:block max-md:pb-3 md:pr-6">
<div className="flex min-w-0 flex-col gap-3 py-2">
<div className="flex items-center gap-3"><Skeleton className="size-10 shrink-0 rounded-full" /><Skeleton className="h-4 w-36 max-w-full" /></div>
<Skeleton className="h-4 w-4/5" /><Skeleton className="h-4 w-3/5" />
<div className="flex gap-3"><Skeleton className="h-11 w-16 rounded-full md:h-7" /><Skeleton className="h-11 w-11 rounded-full md:h-7" /><Skeleton className="h-11 w-11 rounded-full md:h-7" /></div>
</div>
</TableCell>
<TableCell className="px-0 py-5 align-top whitespace-normal max-md:block max-md:pt-0 md:w-[280px]">
<div className="flex items-start gap-2 md:justify-end">
<Skeleton className="size-11 shrink-0 rounded-full md:size-7" />
<Skeleton className="size-28 shrink-0 rounded-lg" />
</div>
</TableCell>
</TableRow>)}</TableBody>
</Table>
</div>;
}