Function ToolGroupRow

packages/react/src/components/tool-tree.tsx:631–689

(props: {
  path: string;
  segment: string;
  depth: number;
  count: number;
  open: boolean;
  onToggle: () => void;
  search: string;
  onSetPolicy?: (pattern: string, action: ToolPolicyAction) => void;
  onClearPolicy?: (pattern: string) => void;
  patternForDisplay: (displayPattern: string) => string;
  exactRule?: ToolPolicyAction;
})

}

function ToolGroupRow(props: {
  path: string;
  segment: string;
  depth: number;
  count: number;
  open: boolean;
  onToggle: () => void;
  search: string;
  onSetPolicy?: (pattern: string, action: ToolPolicyAction) => void;
  onClearPolicy?: (pattern: string) => void;
  patternForDisplay: (displayPattern: string) => string;
  exactRule?: ToolPolicyAction;
}) {
  const showActions = !!props.onSetPolicy;
  return (
    <div className="group/tt-row relative flex items-stretch hover:bg-accent/60">
      <Button
        variant="ghost"
        aria-expanded={props.open}
        onClick={props.onToggle}
        className={cn(rowBaseClasses, "hover:bg-transparent")}
        style={{
          paddingLeft: rowIndent(props.depth),
          paddingRight: showActions ? 36 : 12,
        }}
      >
        <ChevronRightIcon
          aria-hidden
          className={cn(
            "size-3.5 shrink-0 text-muted-foreground transition-transform duration-150",
            props.open && "rotate-90",
          )}
        />
        <span className="min-w-0 flex-1 truncate text-left font-mono text-xs text-foreground">
          {highlightMatch(props.segment, props.search)}
        </span>
        <span className="shrink-0 tabular-nums text-xs text-muted-foreground">{props.count}</span>
      </Button>
      {showActions && (
        <div
          className={cn(
            "absolute right-1.5 top-1/2 -translate-y-1/2 transition-opacity",
            props.exactRule
              ? "opacity-100"
              : "opacity-0 group-hover/tt-row:opacity-100 focus-within:opacity-100",
          )}
        >
          <PolicyActionMenu
            pattern={props.patternForDisplay(`${props.path}.*`)}
            current={props.exactRule}
            onSet={props.onSetPolicy!}
            onClear={props.onClearPolicy}
            triggerLabel={`Set policy for ${props.path}.*`}
          />
        </div>
      )}
    </div>
  );