142 lines · 4.6 KB · TypeScript
RawDownload
import { FolderGit2Icon, FolderGitIcon, FolderIcon, HistoryIcon } from "lucide-react";import { memo, useMemo } from "react"; import {  resolveCurrentWorkspaceLabel,  resolveEnvModeLabel,  resolveLockedWorkspaceLabel,  type EnvMode,} from "./BranchToolbar.logic";import {  Select,  SelectGroup,  SelectGroupLabel,  SelectItem,  SelectPopup,  SelectTrigger,  SelectValue,} from "./ui/select"; export const PREVIOUS_WORKTREE_SELECT_VALUE = "previous-worktree"; interface BranchToolbarEnvModeSelectorProps {  envLocked: boolean;  effectiveEnvMode: EnvMode;  activeWorktreePath: string | null;  onEnvModeChange: (mode: EnvMode) => void;  previousWorktreeLabel?: string | null;  onUsePreviousWorktree?: () => void;} export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSelector({  envLocked,  effectiveEnvMode,  activeWorktreePath,  onEnvModeChange,  previousWorktreeLabel,  onUsePreviousWorktree,}: BranchToolbarEnvModeSelectorProps) {  const showPreviousWorktree = Boolean(previousWorktreeLabel && onUsePreviousWorktree);  const envModeItems = useMemo(    () => [      { value: "local", label: resolveCurrentWorkspaceLabel(activeWorktreePath) },      { value: "worktree", label: resolveEnvModeLabel("worktree") },      ...(showPreviousWorktree && previousWorktreeLabel        ? [{ value: PREVIOUS_WORKTREE_SELECT_VALUE, label: previousWorktreeLabel }]        : []),    ],    [activeWorktreePath, previousWorktreeLabel, showPreviousWorktree],  );   if (envLocked) {    return (      <span        className="inline-flex h-7 shrink-0 items-center gap-1 border border-transparent px-[calc(--spacing(3)-1px)] text-sm font-medium text-muted-foreground/70 sm:h-6 sm:text-xs"        data-composer-context-control      >        {activeWorktreePath ? (          <>            <FolderGitIcon className="size-3" />            {resolveLockedWorkspaceLabel(activeWorktreePath)}          </>        ) : (          <>            <FolderIcon className="size-3" />            {resolveLockedWorkspaceLabel(activeWorktreePath)}          </>        )}      </span>    );  }   return (    <Select      modal={false}      value={effectiveEnvMode}      onValueChange={(value: string | null) => {        if (value === PREVIOUS_WORKTREE_SELECT_VALUE) {          onUsePreviousWorktree?.();          return;        }        onEnvModeChange(value as EnvMode);      }}      items={envModeItems}    >      <SelectTrigger        variant="ghost"        size="xs"        className="min-w-0 shrink font-medium"        aria-label="Workspace"        data-composer-context-control      >        {effectiveEnvMode === "worktree" ? (          <FolderGit2Icon className="size-3" />        ) : activeWorktreePath ? (          <FolderGitIcon className="size-3" />        ) : (          <FolderIcon className="size-3" />        )}        <span          data-composer-label          className="min-w-0 max-w-[240px] group-data-[compact]/composer-context:max-w-0"        >          <span            data-composer-label-motion            className="block w-full min-w-0 max-w-[240px] origin-left truncate transition-[opacity,transform] duration-180 ease-[cubic-bezier(0.32,0.72,0,1)] group-data-[compact]/composer-context:[transform:translateX(-0.25rem)_scaleX(0.95)] group-data-[compact]/composer-context:opacity-0 motion-reduce:transform-none motion-reduce:transition-opacity"          >            <SelectValue />          </span>        </span>      </SelectTrigger>      <SelectPopup>        <SelectGroup>          <SelectGroupLabel>Workspace</SelectGroupLabel>          <SelectItem value="local">            <span className="inline-flex items-center gap-1.5">              {activeWorktreePath ? (                <FolderGitIcon className="size-3" />              ) : (                <FolderIcon className="size-3" />              )}              {resolveCurrentWorkspaceLabel(activeWorktreePath)}            </span>          </SelectItem>          <SelectItem value="worktree">            <span className="inline-flex items-center gap-1.5">              <FolderGit2Icon className="size-3" />              {resolveEnvModeLabel("worktree")}            </span>          </SelectItem>          {showPreviousWorktree && previousWorktreeLabel ? (            <SelectItem value={PREVIOUS_WORKTREE_SELECT_VALUE}>              <span className="inline-flex items-center gap-1.5">                <HistoryIcon className="size-3" />                {previousWorktreeLabel}              </span>            </SelectItem>          ) : null}        </SelectGroup>      </SelectPopup>    </Select>  );});