From 75d189900c1e7cf34dd5d9fa059c5d07c3b0e717 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Wed, 27 Aug 2025 18:08:23 +0700
Subject: [PATCH 1/3] fix: mcp cleanup dropodown tool availabel and sort list

---
 web-app/src/hooks/useMCPServers.ts          | 22 +++++++++++++++++++++
 web-app/src/routes/settings/mcp-servers.tsx | 20 ++++++++++++-------
 2 files changed, 35 insertions(+), 7 deletions(-)

diff --git a/web-app/src/hooks/useMCPServers.ts b/web-app/src/hooks/useMCPServers.ts
index b19130ae9..1a4c6f1d1 100644
--- a/web-app/src/hooks/useMCPServers.ts
+++ b/web-app/src/hooks/useMCPServers.ts
@@ -27,6 +27,7 @@ type MCPServerStoreState = {
   setLeftPanel: (value: boolean) => void
   addServer: (key: string, config: MCPServerConfig) => void
   editServer: (key: string, config: MCPServerConfig) => void
+  renameServer: (oldKey: string, newKey: string, config: MCPServerConfig) => void
   deleteServer: (key: string) => void
   setServers: (servers: MCPServers) => void
   syncServers: () => Promise<void>
@@ -60,6 +61,27 @@ export const useMCPServers = create<MCPServerStoreState>()((set, get) => ({
       const mcpServers = { ...state.mcpServers, [key]: config }
       return { mcpServers }
     }),
+
+  // Rename a server while preserving its position
+  renameServer: (oldKey, newKey, config) =>
+    set((state) => {
+      // Only proceed if the server exists
+      if (!state.mcpServers[oldKey]) return state
+
+      const entries = Object.entries(state.mcpServers)
+      const mcpServers: MCPServers = {}
+
+      // Rebuild the object with the same order, replacing the old key with the new key
+      entries.forEach(([key, serverConfig]) => {
+        if (key === oldKey) {
+          mcpServers[newKey] = config
+        } else {
+          mcpServers[key] = serverConfig
+        }
+      })
+
+      return { mcpServers }
+    }),
   setServers: (servers) =>
     set((state) => {
       const mcpServers = { ...state.mcpServers, ...servers }
diff --git a/web-app/src/routes/settings/mcp-servers.tsx b/web-app/src/routes/settings/mcp-servers.tsx
index c95c47a2d..f4fa28d78 100644
--- a/web-app/src/routes/settings/mcp-servers.tsx
+++ b/web-app/src/routes/settings/mcp-servers.tsx
@@ -93,6 +93,7 @@ function MCPServers() {
     mcpServers,
     addServer,
     editServer,
+    renameServer,
     deleteServer,
     syncServers,
     syncServersAndRestart,
@@ -137,22 +138,27 @@ function MCPServers() {
   }
 
   const handleSaveServer = async (name: string, config: MCPServerConfig) => {
-    toggleServer(name, false)
     if (editingKey) {
-      // If server name changed, delete old one and add new one
+      // If server name changed, rename it while preserving position
       if (editingKey !== name) {
-        deleteServer(editingKey)
-        addServer(name, config)
+        toggleServer(editingKey, false)
+        renameServer(editingKey, name, config)
+        toggleServer(name, true)
+        // Restart servers to update tool references with new server name
+        syncServersAndRestart()
       } else {
+        toggleServer(editingKey, false)
         editServer(editingKey, config)
+        toggleServer(editingKey, true)
+        syncServers()
       }
     } else {
       // Add new server
+      toggleServer(name, false)
       addServer(name, config)
+      toggleServer(name, true)
+      syncServers()
     }
-
-    syncServers()
-    toggleServer(name, true)
   }
 
   const handleEdit = (serverKey: string) => {

From 742f9c1a701ba32ea50964ca1380da1b37972dd8 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Wed, 27 Aug 2025 18:17:55 +0700
Subject: [PATCH 2/3] fix: sort list when add server

---
 web-app/src/hooks/useMCPServers.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/web-app/src/hooks/useMCPServers.ts b/web-app/src/hooks/useMCPServers.ts
index 1a4c6f1d1..cd263a60d 100644
--- a/web-app/src/hooks/useMCPServers.ts
+++ b/web-app/src/hooks/useMCPServers.ts
@@ -27,7 +27,11 @@ type MCPServerStoreState = {
   setLeftPanel: (value: boolean) => void
   addServer: (key: string, config: MCPServerConfig) => void
   editServer: (key: string, config: MCPServerConfig) => void
-  renameServer: (oldKey: string, newKey: string, config: MCPServerConfig) => void
+  renameServer: (
+    oldKey: string,
+    newKey: string,
+    config: MCPServerConfig
+  ) => void
   deleteServer: (key: string) => void
   setServers: (servers: MCPServers) => void
   syncServers: () => Promise<void>
@@ -48,7 +52,7 @@ export const useMCPServers = create<MCPServerStoreState>()((set, get) => ({
   // Add a new MCP server or update if the key already exists
   addServer: (key, config) =>
     set((state) => {
-      const mcpServers = { ...state.mcpServers, [key]: config }
+      const mcpServers = { [key]: config, ...state.mcpServers }
       return { mcpServers }
     }),
 

From d922d7454de6e41a294e279203ed239dc908081f Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Wed, 27 Aug 2025 18:25:13 +0700
Subject: [PATCH 3/3] fix: mcp sort list

---
 web-app/src/hooks/useMCPServers.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/web-app/src/hooks/useMCPServers.ts b/web-app/src/hooks/useMCPServers.ts
index cd263a60d..feae29a62 100644
--- a/web-app/src/hooks/useMCPServers.ts
+++ b/web-app/src/hooks/useMCPServers.ts
@@ -52,7 +52,10 @@ export const useMCPServers = create<MCPServerStoreState>()((set, get) => ({
   // Add a new MCP server or update if the key already exists
   addServer: (key, config) =>
     set((state) => {
-      const mcpServers = { [key]: config, ...state.mcpServers }
+      // Remove the key first if it exists to maintain insertion order
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      const { [key]: _, ...restServers } = state.mcpServers
+      const mcpServers = { [key]: config, ...restServers }
       return { mcpServers }
     }),