@makefinks/daemon 0.2.0 → 0.3.0

package/src/app/components/AppOverlays.tsx

@@ -7,6 +7,7 @@ import { OnboardingOverlay } from "../../components/OnboardingOverlay";
 import { ProviderMenu } from "../../components/ProviderMenu";
 import { SessionMenu } from "../../components/SessionMenu";
 import { SettingsMenu } from "../../components/SettingsMenu";
+import { ToolsMenu } from "../../components/ToolsMenu";
 import { UrlMenu } from "../../components/UrlMenu";
 import { useUrlMenuItems } from "../../hooks/use-url-menu-items";
 import { useAppContext } from "../../state/app-context";
@@ -120,6 +121,13 @@ function AppOverlaysImpl({ conversationHistory, currentContentBlocks }: AppOverl
 
 			{menus.showUrlMenu && <UrlMenu items={urlMenuItems} onClose={() => menus.setShowUrlMenu(false)} />}
 
+			{menus.showToolsMenu && (
+				<ToolsMenu
+					onClose={() => menus.setShowToolsMenu(false)}
+					persistPreferences={(updates) => settings.persistPreferences(updates)}
+				/>
+			)}
+
 			{onboarding.onboardingActive && (
 				<OnboardingOverlay
 					step={onboarding.onboardingStep}

package/src/components/HotkeysPane.tsx

@@ -36,7 +36,7 @@ export function HotkeysPane({ onClose }: HotkeysPaneProps) {
 		{
 			title: "SESSION",
 			items: [
-				{ key: "T", label: "Toggle full reasoning previews" },
+				{ key: "R", label: "Toggle full reasoning previews" },
 				{ key: "O", label: "Toggle tool output previews" },
 				{ key: "N", label: "New session" },
 				{ key: "G", label: "Open Grounding Menu" },
@@ -51,6 +51,7 @@ export function HotkeysPane({ onClose }: HotkeysPaneProps) {
 				{ key: "M", label: "Models" },
 				{ key: "P", label: "Providers" },
 				{ key: "L", label: "Sessions" },
+				{ key: "T", label: "Tools" },
 				{ key: "S", label: "Settings" },
 			],
 		},

package/src/components/ToolsMenu.tsx

@@ -0,0 +1,235 @@
+import { useEffect, useMemo, useState } from "react";
+
+import { invalidateDaemonToolsCache } from "../ai/tools/index";
+import { invalidateSubagentToolsCache } from "../ai/tools/subagents";
+import {
+	buildMenuItems,
+	getDefaultToolOrder,
+	getToolLabels,
+	resolveToolAvailability,
+} from "../ai/tools/tool-registry";
+import { useMenuKeyboard } from "../hooks/use-menu-keyboard";
+import { getDaemonManager } from "../state/daemon-state";
+import type { ToolToggleId, ToolToggles } from "../types";
+import { DEFAULT_TOOL_TOGGLES } from "../types";
+import { COLORS } from "../ui/constants";
+
+interface ToolsMenuProps {
+	persistPreferences: (updates: Partial<{ toolToggles: ToolToggles }>) => void;
+	onClose: () => void;
+}
+
+type MenuToolItem = {
+	id: ToolToggleId;
+	label: string;
+	envAvailable: boolean;
+	disabledReason?: string;
+};
+
+function getToolLabel(id: ToolToggleId): string {
+	switch (id) {
+		case "readFile":
+			return "readFile";
+		case "runBash":
+			return "runBash";
+		case "webSearch":
+			return "webSearch";
+		case "fetchUrls":
+			return "fetchUrls";
+		case "renderUrl":
+			return "renderUrl";
+		case "todoManager":
+			return "todoManager";
+		case "groundingManager":
+			return "groundingManager";
+		case "subagent":
+			return "subagent";
+		default:
+			return id;
+	}
+}
+
+export function ToolsMenu({ persistPreferences, onClose }: ToolsMenuProps) {
+	const manager = getDaemonManager();
+	const [toggles, setToggles] = useState<ToolToggles>(manager.toolToggles ?? { ...DEFAULT_TOOL_TOGGLES });
+
+	const [toolAvailability, setToolAvailability] = useState<Record<ToolToggleId, MenuToolItem> | null>(null);
+
+	useEffect(() => {
+		let cancelled = false;
+		const loadAvailability = async () => {
+			const toggles = manager.toolToggles ?? { ...DEFAULT_TOOL_TOGGLES };
+			const availability = await resolveToolAvailability(toggles);
+			const map = buildMenuItems(availability) as Record<ToolToggleId, MenuToolItem>;
+
+			if (cancelled) return;
+			setToolAvailability(map);
+		};
+
+		void loadAvailability();
+		return () => {
+			cancelled = true;
+		};
+	}, [manager, toggles]);
+
+	const items = useMemo((): MenuToolItem[] => {
+		const labels = getToolLabels();
+		const order = getDefaultToolOrder();
+		if (!toolAvailability) {
+			return order.map((id) => ({
+				id,
+				label: labels[id],
+				envAvailable: true,
+			}));
+		}
+
+		return order.map((id) => toolAvailability[id]).filter((item): item is MenuToolItem => Boolean(item));
+	}, [toolAvailability]);
+
+	const { selectedIndex } = useMenuKeyboard({
+		itemCount: items.length,
+		onClose,
+		closeOnSelect: false,
+		onSelect: (idx) => {
+			const item = items[idx];
+			if (!item) return;
+
+			const current = manager.toolToggles ?? { ...DEFAULT_TOOL_TOGGLES };
+
+			// If env-unavailable, block enabling, but allow disabling.
+			if (!item.envAvailable && current[item.id]) {
+				return;
+			}
+
+			const next: ToolToggles = {
+				...DEFAULT_TOOL_TOGGLES,
+				...current,
+				[item.id]: !current[item.id],
+			};
+			manager.toolToggles = next;
+			setToggles(next);
+			persistPreferences({ toolToggles: next });
+
+			invalidateDaemonToolsCache();
+			invalidateSubagentToolsCache();
+			resolveToolAvailability(next)
+				.then((availability) => {
+					const map = buildMenuItems(availability) as Record<ToolToggleId, MenuToolItem>;
+					setToolAvailability(map);
+				})
+				.catch(() => {
+					setToolAvailability(null);
+				});
+		},
+	});
+
+	const showReasonColumn = useMemo(() => {
+		return items.some((item) => !item.envAvailable);
+	}, [items]);
+
+	const labelWidth = useMemo(() => {
+		const raw = items.reduce((max, item) => Math.max(max, item.label.length), 0);
+		// When no env-disabled tools exist, keep the menu compact.
+		return showReasonColumn ? raw : Math.min(raw, 16);
+	}, [items, showReasonColumn]);
+
+	const statusWidth = 8;
+
+	function truncateText(text: string, maxLen: number): string {
+		if (text.length <= maxLen) return text;
+		return text.slice(0, Math.max(0, maxLen - 1)) + "…";
+	}
+
+	return (
+		<box
+			position="absolute"
+			left={0}
+			top={0}
+			width="100%"
+			height="100%"
+			flexDirection="column"
+			alignItems="center"
+			justifyContent="center"
+			zIndex={100}
+		>
+			<box
+				flexDirection="column"
+				backgroundColor={COLORS.MENU_BG}
+				borderStyle="single"
+				borderColor={COLORS.MENU_BORDER}
+				paddingLeft={2}
+				paddingRight={2}
+				paddingTop={1}
+				paddingBottom={1}
+				width={showReasonColumn ? "70%" : "52%"}
+				minWidth={showReasonColumn ? 70 : 48}
+				maxWidth={showReasonColumn ? 150 : 90}
+			>
+				<box marginBottom={1}>
+					<text>
+						<span fg={COLORS.DAEMON_LABEL}>[ TOOLS ]</span>
+					</text>
+				</box>
+				<box marginBottom={1}>
+					<text>
+						<span fg={COLORS.USER_LABEL}>↑/↓ or j/k to navigate, ENTER to toggle, ESC to close</span>
+					</text>
+				</box>
+
+				{showReasonColumn && (
+					<box marginBottom={1}>
+						<text>
+							<span fg={COLORS.REASONING_DIM}>
+								{"TOOL".padEnd(labelWidth)} {"STATUS".padEnd(statusWidth)} REASON
+							</span>
+						</text>
+					</box>
+				)}
+
+				<box flexDirection="column">
+					{items.map((item, idx) => {
+						const isSelected = idx === selectedIndex;
+						const isEnabled = Boolean(toggles[item.id]);
+						const canEnable = item.envAvailable;
+						const statusLabel = !canEnable ? "DISABLED" : isEnabled ? "ON" : "OFF";
+						const reason = !canEnable && item.disabledReason ? item.disabledReason : "";
+
+						const labelColor = isSelected ? COLORS.DAEMON_LABEL : COLORS.MENU_TEXT;
+						const statusColor = !canEnable
+							? COLORS.REASONING_DIM
+							: isEnabled
+								? COLORS.DAEMON_TEXT
+								: COLORS.REASONING_DIM;
+						const reasonColor = COLORS.REASONING_DIM;
+
+						const labelText = truncateText(item.label, labelWidth).padEnd(labelWidth);
+						const statusText = statusLabel.padEnd(statusWidth);
+						const reasonText = reason ? truncateText(reason, 60) : "";
+
+						return (
+							<box
+								key={item.id}
+								backgroundColor={isSelected ? COLORS.MENU_SELECTED_BG : COLORS.MENU_BG}
+								paddingLeft={1}
+								paddingRight={1}
+							>
+								<text>
+									<span fg={labelColor}>{isSelected ? "▶ " : "  "}</span>
+									<span fg={labelColor}>{labelText}</span>
+									<span fg={COLORS.REASONING_DIM}> </span>
+									<span fg={statusColor}>{statusText}</span>
+									{showReasonColumn && reasonText ? (
+										<>
+											<span fg={COLORS.REASONING_DIM}> </span>
+											<span fg={reasonColor}>{reasonText}</span>
+										</>
+									) : null}
+								</text>
+							</box>
+						);
+					})}
+				</box>
+			</box>
+		</box>
+	);
+}

package/src/hooks/use-app-context-builder.ts

@@ -41,6 +41,8 @@ export interface UseAppContextBuilderParams {
 		setShowGroundingMenu: React.Dispatch<React.SetStateAction<boolean>>;
 		showUrlMenu: boolean;
 		setShowUrlMenu: React.Dispatch<React.SetStateAction<boolean>>;
+		showToolsMenu: boolean;
+		setShowToolsMenu: React.Dispatch<React.SetStateAction<boolean>>;
 	};
 
 	device: {