refactor: revert tab files to main and restore tab disabling

client/src/App.tsx

@@ -509,15 +509,15 @@ const App = () => {
               className="w-full p-4"
             >
               <TabsList className="mb-4 p-0">
-                <TabsTrigger value="resources">
+                <TabsTrigger value="resources" disabled={!serverCapabilities?.resources}>
                   <Files className="w-4 h-4 mr-2" />
                   Resources
                 </TabsTrigger>
-                <TabsTrigger value="prompts">
+                <TabsTrigger value="prompts" disabled={!serverCapabilities?.prompts}>
                   <MessageSquare className="w-4 h-4 mr-2" />
                   Prompts
                 </TabsTrigger>
-                <TabsTrigger value="tools">
+                <TabsTrigger value="tools" disabled={!serverCapabilities?.tools}>
                   <Hammer className="w-4 h-4 mr-2" />
                   Tools
                 </TabsTrigger>
@@ -525,7 +525,7 @@ const App = () => {
                   <Bell className="w-4 h-4 mr-2" />
                   Ping
                 </TabsTrigger>
-                <TabsTrigger value="sampling" className="relative">
+                <TabsTrigger value="sampling" className="relative" disabled={!serverCapabilities?.sampling}>
                   <Hash className="w-4 h-4 mr-2" />
                   Sampling
                   {pendingSampleRequests.length > 0 && (
@@ -534,7 +534,7 @@ const App = () => {
                     </span>
                   )}
                 </TabsTrigger>
-                <TabsTrigger value="roots">
+                <TabsTrigger value="roots" disabled={!serverCapabilities?.roots}>
                   <FolderTree className="w-4 h-4 mr-2" />
                   Roots
                 </TabsTrigger>

client/src/components/PromptsTab.tsx

@@ -6,9 +6,8 @@ import { TabsContent } from "@/components/ui/tabs";
 import { Textarea } from "@/components/ui/textarea";
 import { ListPromptsResult } from "@modelcontextprotocol/sdk/types.js";
 import { AlertCircle } from "lucide-react";
-import { useState, useContext } from "react";
+import { useState } from "react";
 import ListPane from "./ListPane";
-import { CapabilityContext } from "@/lib/contexts";
 
 export type Prompt = {
   name: string;
@@ -41,7 +40,6 @@ const PromptsTab = ({
   nextCursor: ListPromptsResult["nextCursor"];
   error: string | null;
 }) => {
-  const capabilities = useContext(CapabilityContext);
   const [promptArgs, setPromptArgs] = useState<Record<string, string>>({});
 
   const handleInputChange = (argName: string, value: string) => {
@@ -56,16 +54,6 @@ const PromptsTab = ({
 
   return (
     <TabsContent value="prompts" className="grid grid-cols-2 gap-4">
-      {!capabilities?.prompts ? (
-        <Alert variant="destructive" className="col-span-2">
-          <AlertCircle className="h-4 w-4" />
-          <AlertTitle>Feature Not Available</AlertTitle>
-          <AlertDescription>
-            The connected server does not support prompts.
-          </AlertDescription>
-        </Alert>
-      ) : (
-        <>
       <ListPane
         items={prompts}
         listItems={listPrompts}
@@ -146,8 +134,6 @@ const PromptsTab = ({
           )}
         </div>
       </div>
-        </>
-      )}
     </TabsContent>
   );
 };

client/src/components/ResourcesTab.tsx

@@ -10,8 +10,7 @@ import {
 } from "@modelcontextprotocol/sdk/types.js";
 import { AlertCircle, ChevronRight, FileText, RefreshCw } from "lucide-react";
 import ListPane from "./ListPane";
-import { useState, useContext } from "react";
+import { useState } from "react";
-import { CapabilityContext } from "@/lib/contexts";
 
 const ResourcesTab = ({
   resources,
@@ -42,7 +41,6 @@ const ResourcesTab = ({
   nextTemplateCursor: ListResourceTemplatesResult["nextCursor"];
   error: string | null;
 }) => {
-  const capabilities = useContext(CapabilityContext);
   const [selectedTemplate, setSelectedTemplate] =
     useState<ResourceTemplate | null>(null);
   const [templateValues, setTemplateValues] = useState<Record<string, string>>(
@@ -64,22 +62,13 @@ const ResourcesTab = ({
       const uri = fillTemplate(selectedTemplate.uriTemplate, templateValues);
       readResource(uri);
       setSelectedTemplate(null);
+      // We don't have the full Resource object here, so we create a partial one
       setSelectedResource({ uri, name: uri } as Resource);
     }
   };
 
   return (
     <TabsContent value="resources" className="grid grid-cols-3 gap-4">
-      {!capabilities?.resources ? (
-        <Alert variant="destructive" className="col-span-3">
-          <AlertCircle className="h-4 w-4" />
-          <AlertTitle>Feature Not Available</AlertTitle>
-          <AlertDescription>
-            The connected server does not support resources.
-          </AlertDescription>
-        </Alert>
-      ) : (
-        <>
       <ListPane
         items={resources}
         listItems={listResources}
@@ -209,8 +198,6 @@ const ResourcesTab = ({
           )}
         </div>
       </div>
-        </>
-      )}
     </TabsContent>
   );
 };

client/src/components/ToolsTab.tsx

@@ -10,9 +10,8 @@ import {
   CallToolResultSchema,
 } from "@modelcontextprotocol/sdk/types.js";
 import { AlertCircle, Send } from "lucide-react";
-import { useEffect, useState, useContext } from "react";
+import { useEffect, useState } from "react";
 import ListPane from "./ListPane";
-import { CapabilityContext } from "@/lib/contexts";
 
 import { CompatibilityCallToolResult } from "@modelcontextprotocol/sdk/types.js";
 
@@ -37,7 +36,6 @@ const ToolsTab = ({
   nextCursor: ListToolsResult["nextCursor"];
   error: string | null;
 }) => {
-  const capabilities = useContext(CapabilityContext);
   const [params, setParams] = useState<Record<string, unknown>>({});
   useEffect(() => {
     setParams({});
@@ -112,16 +110,6 @@ const ToolsTab = ({
 
   return (
     <TabsContent value="tools" className="grid grid-cols-2 gap-4">
-      {!capabilities?.tools ? (
-        <Alert variant="destructive" className="col-span-2">
-          <AlertCircle className="h-4 w-4" />
-          <AlertTitle>Feature Not Available</AlertTitle>
-          <AlertDescription>
-            The connected server does not support tools.
-          </AlertDescription>
-        </Alert>
-      ) : (
-        <>
       <ListPane
         items={tools}
         listItems={listTools}
@@ -226,8 +214,6 @@ const ToolsTab = ({
           )}
         </div>
       </div>
-        </>
-      )}
     </TabsContent>
   );
 };