144 lines · 5.3 KB
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 (