diff --git a/mcpjam-inspector/client/src/components/ServersTab.tsx b/mcpjam-inspector/client/src/components/ServersTab.tsx
index 6af5c193e..06c0e20e3 100644
--- a/mcpjam-inspector/client/src/components/ServersTab.tsx
+++ b/mcpjam-inspector/client/src/components/ServersTab.tsx
@@ -4,6 +4,7 @@ import { Button } from "./ui/button";
import {
Plus,
FileText,
+ FileSymlink,
Cable,
Link,
Loader2,
@@ -47,6 +48,7 @@ import {
import { CollapsedPanelStrip } from "./ui/collapsed-panel-strip";
import { LoggerView } from "./logger-view";
import { useJsonRpcPanelVisibility } from "@/hooks/use-json-rpc-panel";
+import { formatJsonConfig } from "@/lib/json-config-parser";
import { Skeleton } from "./ui/skeleton";
interface ServersTabProps {
@@ -155,6 +157,35 @@ export function ServersTab({
setIsActionMenuOpen(false);
};
+ const downloadJson = (filename: string, data: any) => {
+ const blob = new Blob([JSON.stringify(data, null, 2)], {
+ type: "application/json;charset=utf-8",
+ });
+ const url = URL.createObjectURL(blob);
+ const a = document.createElement("a");
+ a.href = url;
+ a.download = filename;
+ document.body.appendChild(a);
+ a.click();
+ document.body.removeChild(a);
+ URL.revokeObjectURL(url);
+ };
+
+ const handleExportAsJsonClick = () => {
+ posthog.capture("export_servers_to_json_button_clicked", {
+ location: "servers_tab",
+ platform: detectPlatform(),
+ environment: detectEnvironment(),
+ });
+ const formattedJson = formatJsonConfig(connectedServerConfigs);
+ const timestamp = new Date()
+ .toISOString()
+ .split(".")[0]
+ .replace(/[T:]/g, "-");
+ const fileName = `mcp-servers-config-${timestamp}.json`;
+ downloadJson(fileName, formattedJson);
+ };
+
const handleCreateTunnel = () => {
posthog.capture("create_tunnel_button_clicked", {
location: "servers_tab",
@@ -309,43 +340,56 @@ export function ServersTab({
};
const renderServerActionsMenu = () => (
-
-
+ <>
+ {Object.keys(connectedServerConfigs ?? {}).length > 0 && (
-
-
-
+ )}
+
+
-
-
-
-
+
+
+
+
+
+
+
+
+ >
);
const renderConnectedContent = () => (
@@ -472,6 +516,7 @@ export function ServersTab({
: connectedCount > 0
? renderConnectedContent()
: renderEmptyContent()}
+ {connectedCount > 0 ? renderConnectedContent() : renderEmptyContent()}
{/* Add Server Modal */}
onSwitchWorkspace(workspace.id)}
>
-
- {workspace.name}
-
+ {workspace.name}