24 lines
745 B
TypeScript
24 lines
745 B
TypeScript
 
|
"use client";
|
||
|
|
|
||
|
|
import { useButtplugStore } from "@/lib/buttplug/store";
|
||
|
|
import { cn } from "@/lib/utils";
|
||
|
|
|
||
|
|
export function ConnectionStatus() {
|
||
|
|
const connected = useButtplugStore((s) => s.connected);
|
||
|
|
const deviceCount = useButtplugStore((s) => Object.keys(s.devices).length);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex items-center gap-2 rounded-full border border-border bg-card/60 px-3 py-1 text-xs">
|
||
|
|
<span
|
||
|
|
className={cn(
|
||
|
|
"size-2 rounded-full",
|
||
|
|
connected ? "bg-primary bp-pulse" : "bg-muted-foreground/50",
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
<span className="text-muted-foreground">
|
||
|
|
{connected ? `${deviceCount} device${deviceCount === 1 ? "" : "s"} connected` : "Not connected"}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|