From ba419bf2f1fb9bae938488b97741c3f9103d720b Mon Sep 17 00:00:00 2001
From: Aleksander Grygier <aleksander.grygier@gmail.com>
Date: Thu, 27 Aug 2026 06:44:44 +0200
Subject: [PATCH] ui: indeterminate group checkboxes and inert grayed rows

A category that is on with nothing enabled under it now shows the
mixed checkbox state instead of a checked box next to 0/N. Rows
grayed out by a disabled parent no longer stay clickable behind
opacity.

Assisted-by: pi
---
 .../ChatFormActionAdd/ChatFormActionAddSheet.svelte        | 6 +++++-
 .../ChatFormActionAdd/ChatFormActionAddToolsSubmenu.svelte | 7 ++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte
index 761ce8052c..762cc1386f 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte
@@ -252,11 +252,14 @@
 {#snippet sheetGroupRow(group: ToolGroup)}
 	{@const checked = toolsPanel.isGroupChecked(group)}
 	{@const enabledCount = toolsPanel.getEnabledToolCount(group)}
+	// parent on but nothing under it enabled, or partially enabled: show mixed state
+	{@const indeterminate =
+		group.tools.length > 0 && (enabledCount === 0 ? checked : enabledCount < group.tools.length)}
 	{@const favicon = toolsPanel.getFavicon(group)}
 	{@const groupDisabled = toolsPanel.isGroupDisabled(group)}
 
 	<button
-		class="{sheetItemRowClass} {groupDisabled ? 'opacity-50' : ''}"
+		class="{sheetItemRowClass} {groupDisabled ? 'pointer-events-none opacity-50' : ''}"
 		onclick={() => toolsPanel.toggleGroupByKey(group.key)}
 		type="button"
 	>
@@ -280,6 +283,7 @@
 		<Checkbox
 			{checked}
 			class="{ICON_CLASS_DEFAULT} shrink-0"
+			{indeterminate}
 			onCheckedChange={() => toolsPanel.toggleGroupByKey(group.key)}
 			onclick={(e) => e.stopPropagation()}
 		/>
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddToolsSubmenu.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddToolsSubmenu.svelte
index 79f533b22f..b6e539b345 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddToolsSubmenu.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddToolsSubmenu.svelte
@@ -78,6 +78,10 @@
 {#snippet groupRow(group: ToolGroup)}
 	{@const isExpanded = toolsPanel.expandedGroups.has(group.key)}
 	{@const checked = toolsPanel.isGroupChecked(group)}
+	{@const enabledCount = toolsPanel.getEnabledToolCount(group)}
+	// parent on but nothing under it enabled, or partially enabled: show mixed state
+	{@const indeterminate =
+		group.tools.length > 0 && (enabledCount === 0 ? checked : enabledCount < group.tools.length)}
 	{@const favicon = toolsPanel.getFavicon(group)}
 	{@const groupDisabled = toolsPanel.isGroupDisabled(group)}
 
@@ -85,7 +89,7 @@
 		onOpenChange={() => toolsPanel.toggleGroupExpanded(group.key)}
 		open={isExpanded}
 	>
-		<div class="flex items-center gap-1 {groupDisabled ? 'opacity-50' : ''}">
+		<div class="flex items-center gap-1 {groupDisabled ? 'pointer-events-none opacity-50' : ''}">
 			<Collapsible.Trigger
 				class="flex min-w-0 flex-1 items-center gap-2 rounded px-2 py-1.5 text-sm hover:bg-muted/50"
 			>
@@ -122,6 +126,7 @@
 							{...props}
 							{checked}
 							class="mr-2 {ICON_CLASS_DEFAULT} shrink-0"
+							{indeterminate}
 							onCheckedChange={() => toolsPanel.toggleGroupByKey(group.key)}
 						/>
 					{/snippet}