21 lines
842 B
TypeScript
21 lines
842 B
TypeScript
import { Circle, CircleMinus, Moon } from "lucide-react";
|
|
|
|
export function OnlineStatus({
|
|
status,
|
|
...props
|
|
}: React.ComponentProps<"div"> & {
|
|
status: "online" | "dnd" | "idle" | "offline";
|
|
}) {
|
|
return (
|
|
<div className="relative">
|
|
<div {...props}></div>
|
|
<div className="absolute bottom-0 right-0 bg-background rounded-full p-0.5 size-1/2">
|
|
{status === "online" && <Circle className="size-full stroke-emerald-400 fill-emerald-400" />}
|
|
{status === "dnd" && <CircleMinus className="size-full stroke-red-400 stroke-3" />}
|
|
{status === "idle" && <Moon className="size-full stroke-amber-400 fill-amber-400" />}
|
|
{status === "offline" && <Circle className="size-full stroke-gray-400 stroke-3" />}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|