Add bidirectional navigation between inspector and server details

Author: icholy

apps/frontend/app/[locale]/(sidebar)/mcp-inspector/page.tsx

@@ -2,7 +2,7 @@
 
 import { McpServer, McpServerTypeEnum } from "@repo/zod-types";
 import { useMemoizedFn } from "ahooks";
-import { ChevronDown, Edit, SearchCode, Server } from "lucide-react";
+import { ChevronDown, Edit, Eye, SearchCode, Server } from "lucide-react";
 import { useRouter, useSearchParams } from "next/navigation";
 import React, { Suspense, useMemo, useState } from "react";
 
@@ -267,6 +267,16 @@ function McpInspectorContent() {
                   ? t("inspector:reconnectButton")
                   : t("inspector:connectButton")}
               </Button>
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() =>
+                  router.push(`/mcp-servers/${selectedServerUuid}`)
+                }
+              >
+                <Eye className="h-4 w-4 mr-2" />
+                {t("mcp-servers:list.viewDetails")}
+              </Button>
               <Button
                 variant="outline"
                 size="sm"

apps/frontend/app/[locale]/(sidebar)/mcp-servers/[uuid]/page.tsx

@@ -5,7 +5,15 @@ import {
   McpServerErrorStatusEnum,
   McpServerTypeEnum,
 } from "@repo/zod-types";
-import { ArrowLeft, Edit, Eye, EyeOff, Plug, Server } from "lucide-react";
+import {
+  ArrowLeft,
+  Edit,
+  Eye,
+  EyeOff,
+  Plug,
+  SearchCode,
+  Server,
+} from "lucide-react";
 import Link from "next/link";
 import { notFound, useRouter } from "next/navigation";
 import { use, useEffect, useState } from "react";
@@ -314,6 +322,16 @@ export default function McpServerDetailPage({
           </Button>
         </Link>
         <div className="flex items-center gap-2">
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() =>
+              router.push(`/mcp-inspector?server=${encodeURIComponent(uuid)}`)
+            }
+          >
+            <SearchCode className="h-4 w-4 mr-2" />
+            {t("mcp-servers:list.inspect")}
+          </Button>
           <Button
             variant="outline"
             size="sm"