diff --git a/src/agentMode/ui/ModelEnableList.tsx b/src/agentMode/ui/ModelEnableList.tsx index 532295b3..3594b752 100644 --- a/src/agentMode/ui/ModelEnableList.tsx +++ b/src/agentMode/ui/ModelEnableList.tsx @@ -1,12 +1,13 @@ import { Badge } from "@/components/ui/badge"; import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible"; import { FreeModelWarningIcon } from "@/components/ui/FreeModelWarningIcon"; +import { HelpTooltip } from "@/components/ui/help-tooltip"; import { ModelCapabilityIcons, hasCapabilityIcons } from "@/components/ui/model-display"; import { SearchBar } from "@/components/ui/SearchBar"; import { SettingSwitch } from "@/components/ui/setting-switch"; import type { ModelCapability } from "@/constants"; import { cn } from "@/lib/utils"; -import { ChevronRight } from "lucide-react"; +import { ChevronRight, KeyRound } from "lucide-react"; import React from "react"; /** A single toggleable model row. */ @@ -39,11 +40,17 @@ export interface ModelEnableGroup { /** Group heading — a provider display name (no glyphs/avatars). */ label: string; /** - * Origin badge (e.g. "BYOK", "Agent Provided"). Set only when the list spans - * multiple origins, so it actually disambiguates. Copilot Plus carries no - * badge — its label already reads "Copilot Plus". + * Short badge shown after the label. For most origins it's an origin tag + * (e.g. "BYOK", "Agent Provided") set only when the list spans multiple + * origins, so it actually disambiguates. Copilot Plus instead carries a + * "privacy" badge. */ badge?: string; + /** + * Optional hover hint rendered as a small icon after the badge (e.g. + * "Copilot license required" for the Copilot Plus group). + */ + tooltip?: string; /** * Visually emphasize the group header (accent color). Set for Copilot Plus, * which the caller also floats to the top of the list. @@ -126,7 +133,7 @@ export const ModelEnableList: React.FC = ({
-
+
{!hasRows ? (
{emptyState ?? (searching ? `No models match “${query.trim()}”.` : "No models.")} @@ -162,6 +169,11 @@ export const ModelEnableList: React.FC = ({ {group.badge} )} + {group.tooltip && ( + + + + )}
diff --git a/src/settings/v2/components/configuredModelGrouping.test.ts b/src/settings/v2/components/configuredModelGrouping.test.ts index 021449cb..c36a01e8 100644 --- a/src/settings/v2/components/configuredModelGrouping.test.ts +++ b/src/settings/v2/components/configuredModelGrouping.test.ts @@ -439,7 +439,7 @@ describe("buildModelEnableGroups", () => { expect(groups.find((g) => g.label === "opencode")?.badge).toBe("Agent Provided"); }); - it("floats Copilot Plus to the top, highlights it, and gives it no redundant badge", () => { + it("floats Copilot Plus to the top, highlights it, and gives it the privacy badge + license tooltip", () => { const plusProvider: Provider = { providerId: "plus-1", providerType: "anthropic", @@ -472,7 +472,8 @@ describe("buildModelEnableGroups", () => { // Copilot Plus is first regardless of candidate order. expect(groups[0].key).toBe("byok:plus-1"); expect(groups[0].highlight).toBe(true); - expect(groups[0].badge).toBeUndefined(); + expect(groups[0].badge).toBe("privacy"); + expect(groups[0].tooltip).toBe("Copilot license required"); // Non-Plus groups are not highlighted. expect(groups.find((g) => g.key === "byok:byok-1")?.highlight).toBeUndefined(); }); diff --git a/src/settings/v2/components/configuredModelGrouping.ts b/src/settings/v2/components/configuredModelGrouping.ts index 71c1e20b..a631f15b 100644 --- a/src/settings/v2/components/configuredModelGrouping.ts +++ b/src/settings/v2/components/configuredModelGrouping.ts @@ -214,12 +214,15 @@ export function buildModelEnableGroups( } // Copilot Plus is highlighted and floated to the top; its provider name - // already reads "Copilot Plus", so it carries no disambiguating badge. Every - // other origin gets a badge only when the list actually mixes origins. + // already reads "Copilot Plus", so instead of a disambiguating origin badge + // it carries a "privacy" badge plus a license-required hover hint. Every + // other origin gets an origin badge only when the list mixes origins. const mixed = new Set(out.map((o) => o.kind)).size > 1; for (const o of out) { if (o.kind === "copilot-plus") { o.group.highlight = true; + o.group.badge = "privacy"; + o.group.tooltip = "Copilot license required"; } else if (mixed) { o.group.badge = originBadgeLabel(o.kind); }