63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import { IdCard, Mail } from "lucide-react";
|
|
import { useNavigate } from "react-router";
|
|
import { createChannel } from "~/lib/api/client/user";
|
|
import type { UserId } from "~/lib/api/types";
|
|
import { useUsersStore } from "~/stores/users-store";
|
|
import {
|
|
ContextMenu,
|
|
ContextMenuContent,
|
|
ContextMenuItem,
|
|
ContextMenuSeparator,
|
|
ContextMenuTrigger,
|
|
} from "./ui/context-menu";
|
|
|
|
interface UserContextMenuProps {
|
|
userId: UserId;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export default function UserContextMenu({
|
|
userId,
|
|
children,
|
|
}: UserContextMenuProps) {
|
|
const currentUser = useUsersStore((state) => state.getCurrentUser());
|
|
const navigate = useNavigate();
|
|
|
|
const onMessage = async () => {
|
|
const reponse = await createChannel([userId]);
|
|
|
|
navigate(`/app/@me/channels/${reponse.id}`);
|
|
};
|
|
|
|
const onCopyId = () => {
|
|
navigator.clipboard.writeText(userId);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<ContextMenu>
|
|
<ContextMenuTrigger asChild>{children}</ContextMenuTrigger>
|
|
<ContextMenuContent>
|
|
{currentUser?.id !== userId && (
|
|
<>
|
|
<ContextMenuItem asChild onClick={onMessage}>
|
|
<div className="flex justify-between gap-2">
|
|
Message
|
|
<Mail />
|
|
</div>
|
|
</ContextMenuItem>
|
|
<ContextMenuSeparator />
|
|
</>
|
|
)}
|
|
<ContextMenuItem asChild onClick={onCopyId}>
|
|
<div className="flex justify-between gap-2">
|
|
Copy ID
|
|
<IdCard />
|
|
</div>
|
|
</ContextMenuItem>
|
|
</ContextMenuContent>
|
|
</ContextMenu>
|
|
</>
|
|
);
|
|
}
|