29 lines
1002 B
TypeScript
29 lines
1002 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>
|
|
);
|
|
}
|