Julius MarmingeAdd JJ VCS driver supporte0acfc56 months agoHistory
179 lines · 6.1 KB · TypeScript
RawDownload
import {  type EnvironmentId,  type EditorId,  type ProjectScript,  type ResolvedKeybindingsConfig,  type ThreadId,} from "@t3tools/contracts";import { scopeThreadRef } from "@t3tools/client-runtime";import { memo } from "react";import GitActionsControl from "../GitActionsControl";import { type DraftId } from "~/composerDraftStore";import { DiffIcon, TerminalSquareIcon } from "lucide-react";import { Badge } from "../ui/badge";import { Tooltip, TooltipPopup, TooltipTrigger } from "../ui/tooltip";import ProjectScriptsControl, { type NewProjectScriptInput } from "../ProjectScriptsControl";import { Toggle } from "../ui/toggle";import { SidebarTrigger } from "../ui/sidebar";import { OpenInPicker } from "./OpenInPicker";import { usePrimaryEnvironmentId } from "../../environments/primary";import { resolveVcsTerms } from "../../vcsPresentation";import type { VcsDriverKind } from "@t3tools/contracts"; interface ChatHeaderProps {  activeThreadEnvironmentId: EnvironmentId;  activeThreadId: ThreadId;  draftId?: DraftId;  activeThreadTitle: string;  activeProjectName: string | undefined;  isVcsRepo: boolean;  vcsKind: VcsDriverKind | null;  openInCwd: string | null;  activeProjectScripts: ProjectScript[] | undefined;  preferredScriptId: string | null;  keybindings: ResolvedKeybindingsConfig;  availableEditors: ReadonlyArray<EditorId>;  terminalAvailable: boolean;  terminalOpen: boolean;  terminalToggleShortcutLabel: string | null;  diffToggleShortcutLabel: string | null;  gitCwd: string | null;  diffOpen: boolean;  onRunProjectScript: (script: ProjectScript) => void;  onAddProjectScript: (input: NewProjectScriptInput) => Promise<void>;  onUpdateProjectScript: (scriptId: string, input: NewProjectScriptInput) => Promise<void>;  onDeleteProjectScript: (scriptId: string) => Promise<void>;  onToggleTerminal: () => void;  onToggleDiff: () => void;} export const ChatHeader = memo(function ChatHeader({  activeThreadEnvironmentId,  activeThreadId,  draftId,  activeThreadTitle,  activeProjectName,  isVcsRepo,  vcsKind,  openInCwd,  activeProjectScripts,  preferredScriptId,  keybindings,  availableEditors,  terminalAvailable,  terminalOpen,  terminalToggleShortcutLabel,  diffToggleShortcutLabel,  gitCwd,  diffOpen,  onRunProjectScript,  onAddProjectScript,  onUpdateProjectScript,  onDeleteProjectScript,  onToggleTerminal,  onToggleDiff,}: ChatHeaderProps) {  const primaryEnvironmentId = usePrimaryEnvironmentId();  const isRemoteEnvironment =    primaryEnvironmentId !== null && activeThreadEnvironmentId !== primaryEnvironmentId;  const vcsTerms = resolveVcsTerms(vcsKind);   return (    <div className="@container/header-actions flex min-w-0 flex-1 items-center gap-2">      <div className="flex min-w-0 flex-1 items-center gap-2 overflow-hidden sm:gap-3">        <SidebarTrigger className="size-7 shrink-0 md:hidden" />        <h2          className="min-w-0 shrink truncate text-sm font-medium text-foreground"          title={activeThreadTitle}        >          {activeThreadTitle}        </h2>        {activeProjectName && (          <Badge variant="outline" className="min-w-0 shrink overflow-hidden">            <span className="min-w-0 truncate">{activeProjectName}</span>          </Badge>        )}        {activeProjectName && !isVcsRepo && (          <Badge variant="outline" className="shrink-0 text-[10px] text-amber-700">            No repository          </Badge>        )}      </div>      <div className="flex shrink-0 items-center justify-end gap-2 @3xl/header-actions:gap-3">        {activeProjectScripts && (          <ProjectScriptsControl            scripts={activeProjectScripts}            keybindings={keybindings}            preferredScriptId={preferredScriptId}            onRunScript={onRunProjectScript}            onAddScript={onAddProjectScript}            onUpdateScript={onUpdateProjectScript}            onDeleteScript={onDeleteProjectScript}          />        )}        {activeProjectName && !isRemoteEnvironment && (          <OpenInPicker            keybindings={keybindings}            availableEditors={availableEditors}            openInCwd={openInCwd}          />        )}        {activeProjectName && (          <GitActionsControl            gitCwd={gitCwd}            activeThreadRef={scopeThreadRef(activeThreadEnvironmentId, activeThreadId)}            {...(draftId ? { draftId } : {})}          />        )}        <Tooltip>          <TooltipTrigger            render={              <Toggle                className="shrink-0"                pressed={terminalOpen}                onPressedChange={onToggleTerminal}                aria-label="Toggle terminal drawer"                variant="outline"                size="xs"                disabled={!terminalAvailable}              >                <TerminalSquareIcon className="size-3" />              </Toggle>            }          />          <TooltipPopup side="bottom">            {!terminalAvailable              ? "Terminal is unavailable until this thread has an active project."              : terminalToggleShortcutLabel                ? `Toggle terminal drawer (${terminalToggleShortcutLabel})`                : "Toggle terminal drawer"}          </TooltipPopup>        </Tooltip>        <Tooltip>          <TooltipTrigger            render={              <Toggle                className="shrink-0"                pressed={diffOpen}                onPressedChange={onToggleDiff}                aria-label="Toggle diff panel"                variant="outline"                size="xs"                disabled={!isVcsRepo && !diffOpen}              >                <DiffIcon className="size-3" />              </Toggle>            }          />          <TooltipPopup side="bottom">            {!isVcsRepo && !diffOpen              ? `Diff panel is unavailable because this project is not a supported ${vcsTerms.repositoryNoun}.`              : diffToggleShortcutLabel                ? `Toggle diff panel (${diffToggleShortcutLabel})`                : "Toggle diff panel"}          </TooltipPopup>        </Tooltip>      </div>    </div>  );});