Address PR #1212 code review feedback

- Fix hasAnyAnnotation checking annotations.title which is never rendered
- Reset formValues when switching tools via onSelectTool handler
- Extract ToolProgress type from ToolDetailPanel, reuse in ToolsScreen
- Fix contradictory readOnlyHint + destructiveHint in story fixture
- Replace listMaxHeight function with LIST_MAX_HEIGHT constant

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

clients/web/src/components/groups/ToolControls/ToolControls.tsx

@@ -12,9 +12,8 @@ export interface ToolControlsProps {
   onSelectTool: (name: string) => void;
 }
 
-function listMaxHeight(): string {
+const LIST_MAX_HEIGHT =
-  return "calc(100vh - var(--app-shell-header-height, 0px) - var(--mantine-spacing-xl) * 2 - 160px)";
+  "calc(100vh - var(--app-shell-header-height, 0px) - var(--mantine-spacing-xl) * 2 - 160px)";
-}
 
 export function ToolControls({
   tools,
@@ -44,7 +43,7 @@ export function ToolControls({
         value={searchText}
         onChange={(e) => setSearchText(e.currentTarget.value)}
       />
-      <ScrollArea.Autosize mah={listMaxHeight()}>
+      <ScrollArea.Autosize mah={LIST_MAX_HEIGHT}>
         <Stack gap="xs">
           {filteredTools.map((tool) => (
             <ToolListItem

clients/web/src/components/groups/ToolDetailPanel/ToolDetailPanel.stories.tsx

@@ -50,7 +50,6 @@ const deleteRecordsTool: Tool = {
   name: "delete_records",
   description: "Deletes records matching the given criteria",
   annotations: {
-    readOnlyHint: true,
     destructiveHint: true,
   },
   inputSchema: {

clients/web/src/components/groups/ToolDetailPanel/ToolDetailPanel.tsx

@@ -8,14 +8,16 @@ import { AnnotationBadge } from "../../elements/AnnotationBadge/AnnotationBadge"
 import { ProgressDisplay } from "../../elements/ProgressDisplay/ProgressDisplay";
 import { SchemaForm } from "../SchemaForm/SchemaForm";
 
+export type ToolProgress = Pick<
+  ProgressNotification["params"],
+  "progress" | "total" | "message"
+>;
+
 export interface ToolDetailPanelProps {
   tool: Tool;
   formValues: Record<string, unknown>;
   isExecuting: boolean;
-  progress?: Pick<
+  progress?: ToolProgress;
-    ProgressNotification["params"],
-    "progress" | "total" | "message"
-  >;
   onFormChange: (values: Record<string, unknown>) => void;
   onExecute: () => void;
   onCancel: () => void;
@@ -44,8 +46,7 @@ function resolveTitle(name: string, title?: string): string {
 function hasAnyAnnotation(annotations?: ToolAnnotations): boolean {
   return !!(
     annotations &&
-    (annotations.title ||
+    (annotations.readOnlyHint ||
-      annotations.readOnlyHint ||
       annotations.destructiveHint ||
       annotations.idempotentHint ||
       annotations.openWorldHint)

clients/web/src/components/screens/ToolsScreen/ToolsScreen.tsx

@@ -1,22 +1,18 @@
 import { useState } from "react";
 import { Card, Flex, Stack, Text } from "@mantine/core";
-import type {
+import type { CallToolResult, Tool } from "@modelcontextprotocol/sdk/types.js";
-  CallToolResult,
-  ProgressNotification,
-  Tool,
-} from "@modelcontextprotocol/sdk/types.js";
 import { ToolControls } from "../../groups/ToolControls/ToolControls";
-import { ToolDetailPanel } from "../../groups/ToolDetailPanel/ToolDetailPanel";
+import {
+  ToolDetailPanel,
+  type ToolProgress,
+} from "../../groups/ToolDetailPanel/ToolDetailPanel";
 import { ToolResultPanel } from "../../groups/ToolResultPanel/ToolResultPanel";
 
 export interface ToolCallState {
   status: "idle" | "pending" | "ok" | "error";
   result?: CallToolResult;
   error?: string;
-  progress?: Pick<
+  progress?: ToolProgress;
-    ProgressNotification["params"],
-    "progress" | "total" | "message"
-  >;
 }
 
 export interface ToolsScreenProps {
@@ -86,7 +82,10 @@ export function ToolsScreen({
             selectedName={selectedToolName}
             listChanged={listChanged}
             onRefreshList={onRefreshList}
-            onSelectTool={onSelectTool}
+            onSelectTool={(name) => {
+              setFormValues({});
+              onSelectTool(name);
+            }}
           />
         </SidebarCard>
       </Sidebar>