Clear error states when clicking around

This commit is contained in:
Justin Spahr-Summers
2024-11-12 13:50:06 +00:00
parent 3bae26723a
commit da2ac8d423
2 changed files with 46 additions and 10 deletions

View File

@@ -84,6 +84,10 @@ const App = () => {
prompts: null, prompts: null,
tools: null, tools: null,
}); });
const clearError = (tabKey: keyof typeof errors) => {
setErrors((prev) => ({ ...prev, [tabKey]: null }));
};
const [command, setCommand] = useState<string>(() => { const [command, setCommand] = useState<string>(() => {
return localStorage.getItem("lastCommand") || "mcp-server-everything"; return localStorage.getItem("lastCommand") || "mcp-server-everything";
}); });
@@ -529,11 +533,23 @@ const App = () => {
<ResourcesTab <ResourcesTab
resources={resources} resources={resources}
resourceTemplates={resourceTemplates} resourceTemplates={resourceTemplates}
listResources={listResources} listResources={() => {
listResourceTemplates={listResourceTemplates} clearError("resources");
readResource={readResource} listResources();
}}
listResourceTemplates={() => {
clearError("resources");
listResourceTemplates();
}}
readResource={(uri) => {
clearError("resources");
readResource(uri);
}}
selectedResource={selectedResource} selectedResource={selectedResource}
setSelectedResource={setSelectedResource} setSelectedResource={(resource) => {
clearError("resources");
setSelectedResource(resource);
}}
resourceContent={resourceContent} resourceContent={resourceContent}
nextCursor={nextResourceCursor} nextCursor={nextResourceCursor}
nextTemplateCursor={nextResourceTemplateCursor} nextTemplateCursor={nextResourceTemplateCursor}
@@ -541,20 +557,36 @@ const App = () => {
/> />
<PromptsTab <PromptsTab
prompts={prompts} prompts={prompts}
listPrompts={listPrompts} listPrompts={() => {
getPrompt={getPrompt} clearError("prompts");
listPrompts();
}}
getPrompt={(name, args) => {
clearError("prompts");
getPrompt(name, args);
}}
selectedPrompt={selectedPrompt} selectedPrompt={selectedPrompt}
setSelectedPrompt={setSelectedPrompt} setSelectedPrompt={(prompt) => {
clearError("prompts");
setSelectedPrompt(prompt);
}}
promptContent={promptContent} promptContent={promptContent}
nextCursor={nextPromptCursor} nextCursor={nextPromptCursor}
error={errors.prompts} error={errors.prompts}
/> />
<ToolsTab <ToolsTab
tools={tools} tools={tools}
listTools={listTools} listTools={() => {
callTool={callTool} clearError("tools");
listTools();
}}
callTool={(name, params) => {
clearError("tools");
callTool(name, params);
}}
selectedTool={selectedTool} selectedTool={selectedTool}
setSelectedTool={(tool) => { setSelectedTool={(tool) => {
clearError("tools");
setSelectedTool(tool); setSelectedTool(tool);
setToolResult(null); setToolResult(null);
}} }}

View File

@@ -3,7 +3,11 @@ import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label"; import { Label } from "@/components/ui/label";
import { TabsContent } from "@/components/ui/tabs"; import { TabsContent } from "@/components/ui/tabs";
import { CallToolResult, ListToolsResult, Tool } from "@modelcontextprotocol/sdk/types.js"; import {
CallToolResult,
ListToolsResult,
Tool,
} from "@modelcontextprotocol/sdk/types.js";
import { AlertCircle, Send } from "lucide-react"; import { AlertCircle, Send } from "lucide-react";
import { useState } from "react"; import { useState } from "react";
import ListPane from "./ListPane"; import ListPane from "./ListPane";