import { Link, useNavigate } from "@tanstack/react-router";
import { useState } from "react";
import { signOut } from "~/fns/auth";
import { useAction } from "~/hooks/use-action";
import { useUnreadNotifications, useViewer } from "~/hooks/use-viewer";
import { Avatar } from "~/ui/Avatar";
import { Logo } from "~/ui/Logo";
import { buttonClass } from "~/ui/Button";
import { useDismiss } from "~/hooks/use-dismiss";
import { SearchForm } from "~/components/SearchForm";
import { Icon } from "~/ui/Icon";
const MEMBER_NAV = [{ to: "/explore", label: "Explore" }] as const;
const VISITOR_NAV = [
{ to: "/features", label: "Features" },
{ to: "/self-host", label: "Self-host" },
{ to: "/explore", label: "Explore" },
] as const;
function UserMenu({ name, isAdmin }: { name: string; isAdmin: boolean }) {
const navigate = useNavigate();
const [open, setOpen] = useState(false);
const menuRef = useDismiss<HTMLDivElement>(open, () => setOpen(false));
const logout = useAction(signOut);
const items = [
{ to: "/$owner", params: { owner: name }, label: "Your profile" },
{ to: "/settings", params: {}, label: "Settings" },
{ to: "/settings/tokens", params: {}, label: "Access tokens" },
{ to: "/settings/containers", params: {}, label: "Containers" },
{ to: "/orgs/new", params: {}, label: "New organization" },
...(isAdmin ? [{ to: "/admin", params: {}, label: "Site admin" } as const] : []),
];
async function handleSignOut() {
await logout.run({});
await navigate({ to: "/" });
}
return (