mcp: add icons

client/src/components/ToolsTab.tsx

@@ -39,6 +39,7 @@ import JsonView from "./JsonView";
 import ToolResults from "./ToolResults";
 import { useToast } from "@/lib/hooks/useToast";
 import useCopy from "@/lib/hooks/useCopy";
+import IconDisplay, { WithIcons } from "./IconDisplay";
 
 // Type guard to safely detect the optional _meta field without using `any`
 const hasMeta = (tool: Tool): tool is Tool & { _meta: unknown } =>
@@ -120,6 +121,7 @@ const ToolsTab = ({
           setSelectedItem={setSelectedTool}
           renderItem={(tool) => (
             <div className="flex flex-col items-start">
+              <IconDisplay icons={(tool as WithIcons).icons} size="sm" />
               <span className="flex-1">{tool.name}</span>
               <span className="text-sm text-gray-500 text-left line-clamp-3">
                 {tool.description}
@@ -136,6 +138,17 @@ const ToolsTab = ({
             <h3 className="font-semibold">
               {selectedTool ? selectedTool.name : "Select a tool"}
             </h3>
+            <div className="flex items-center gap-2">
+              {selectedTool && (
+                <IconDisplay
+                  icons={(selectedTool as WithIcons).icons}
+                  size="md"
+                />
+              )}
+              <h3 className="font-semibold">
+                {selectedTool ? selectedTool.name : "Select a tool"}
+              </h3>
+            </div>
           </div>
           <div className="p-4">
             {selectedTool ? (