32 lines
1008 B
TypeScript
32 lines
1008 B
TypeScript
"use client";
|
||
|
||
import { UsersIcon } from "lucide-react";
|
||
|
||
import { Badge } from "@/components/ui/badge";
|
||
import { useVisitorPresence } from "@/hooks/use-presence";
|
||
|
||
export function VisitorPresence({ guideId }: { guideId?: string }) {
|
||
const counts = useVisitorPresence(guideId ?? null);
|
||
return (
|
||
<div className="flex items-center gap-1" aria-live="polite">
|
||
<Badge
|
||
variant="secondary"
|
||
className="min-w-24 tabular-nums"
|
||
title="ผู้เข้าชมทั้งหมดที่กำลังออนไลน์"
|
||
>
|
||
<UsersIcon data-icon="inline-start" />
|
||
ทั้งหมด {counts?.global ?? "–"}
|
||
</Badge>
|
||
{guideId ? (
|
||
<Badge
|
||
variant="outline"
|
||
className="min-w-24 tabular-nums"
|
||
title="ผู้เข้าชม Guide นี้ที่กำลังออนไลน์"
|
||
>
|
||
Guide นี้ {counts?.guide ?? "–"}
|
||
</Badge>
|
||
) : null}
|
||
</div>
|
||
);
|
||
}
|