import { Link } from "@tanstack/react-router";
import { DropdownMenu } from "@cloudflare/kumo/components/dropdown";
import {
ClockCounterClockwiseIcon,
DotsThreeIcon,
DownloadSimpleIcon,
FilePlusIcon,
GitBranchIcon,
MagnifyingGlassIcon,
PencilSimpleIcon,
TerminalIcon,
} from "@phosphor-icons/react";
import { Button, buttonClass } from "~/ui/Button";
import { Breadcrumbs } from "./RefNavigation";
import { RefSwitcher } from "./RefSwitcher";
// Kumo menu items put the icon flush against the label.
const MENU_ICON_GAP = "gap-2";
type Props = {
owner: string;
repo: string;
gitRef: { kind: string; name: string };
path: string;
branches: string[];
tags: string[];
canWrite: boolean;
containersAllowed: boolean;
};
/** Ref picker and breadcrumbs on the left; frequent actions as buttons, the rest in an overflow menu. */
export function TreeToolbar({ owner, repo, gitRef, path, branches, tags, canWrite, containersAllowed }: Props) {
const onBranch = gitRef.kind === "branch";
const refPath = path ? `${gitRef.name}/${path}` : gitRef.name;
const editParams = { owner, repo, _splat: gitRef.name };
const menuLinks = [
{
label: "Open in editor",
shortcut: ".",
icon: <PencilSimpleIcon />,