add mcp sdk (#3)

Signed-off-by: Jintao Zhang <zhangjintao9020@gmail.com>

package-lock.json

@@ -8,12 +8,15 @@
       "name": "thinking-model-client",
       "version": "0.1.1",
       "dependencies": {
+        "@modelcontextprotocol/sdk": "^1.8.0",
         "cors": "^2.8.5",
+        "eventsource": "^3.0.6",
         "express": "^4.18.2",
         "node-fetch": "^3.3.2",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
-        "react-markdown": "^10.0.0"
+        "react-markdown": "^10.0.0",
+        "zod": "^3.24.2"
       },
       "devDependencies": {
         "@testing-library/cypress": "^10.0.3",
@@ -905,6 +908,274 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@modelcontextprotocol/sdk": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.8.0.tgz",
+      "integrity": "sha512-e06W7SwrontJDHwCawNO5SGxG+nU9AAx+jpHHZqGl/WrDBdWOpvirC+s58VpJTB5QemI4jTRcjWT4Pt3Q1NPQQ==",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "cors": "^2.8.5",
+        "cross-spawn": "^7.0.3",
+        "eventsource": "^3.0.2",
+        "express": "^5.0.1",
+        "express-rate-limit": "^7.5.0",
+        "pkce-challenge": "^4.1.0",
+        "raw-body": "^3.0.0",
+        "zod": "^3.23.8",
+        "zod-to-json-schema": "^3.24.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/accepts": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
+      "integrity": "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==",
+      "dependencies": {
+        "mime-types": "^3.0.0",
+        "negotiator": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/body-parser": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-2.2.0.tgz",
+      "integrity": "sha512-02qvAaxv8tp7fBa/mw1ga98OGm+eCbqzJOKoRt70sLmfEEi+jyBYVTDGfCL/k06/4EMk/z01gCe7HoCH/f2LTg==",
+      "dependencies": {
+        "bytes": "^3.1.2",
+        "content-type": "^1.0.5",
+        "debug": "^4.4.0",
+        "http-errors": "^2.0.0",
+        "iconv-lite": "^0.6.3",
+        "on-finished": "^2.4.1",
+        "qs": "^6.14.0",
+        "raw-body": "^3.0.0",
+        "type-is": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/content-disposition": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.0.0.tgz",
+      "integrity": "sha512-Au9nRL8VNUut/XSzbQA38+M78dzP4D+eqg3gfJHMIHHYa3bg067xj1KxMUWj+VULbiZMowKngFFbKczUrNJ1mg==",
+      "dependencies": {
+        "safe-buffer": "5.2.1"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/cookie-signature": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
+      "integrity": "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==",
+      "engines": {
+        "node": ">=6.6.0"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/express": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/express/-/express-5.1.0.tgz",
+      "integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
+      "dependencies": {
+        "accepts": "^2.0.0",
+        "body-parser": "^2.2.0",
+        "content-disposition": "^1.0.0",
+        "content-type": "^1.0.5",
+        "cookie": "^0.7.1",
+        "cookie-signature": "^1.2.1",
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "finalhandler": "^2.1.0",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "merge-descriptors": "^2.0.0",
+        "mime-types": "^3.0.0",
+        "on-finished": "^2.4.1",
+        "once": "^1.4.0",
+        "parseurl": "^1.3.3",
+        "proxy-addr": "^2.0.7",
+        "qs": "^6.14.0",
+        "range-parser": "^1.2.1",
+        "router": "^2.2.0",
+        "send": "^1.1.0",
+        "serve-static": "^2.2.0",
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/finalhandler": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-2.1.0.tgz",
+      "integrity": "sha512-/t88Ty3d5JWQbWYgaOGCCYfXRwV1+be02WqYYlL6h0lEiUAMPM8o8qKGO01YIkOHzka2up08wvgYD0mDiI+q3Q==",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "on-finished": "^2.4.1",
+        "parseurl": "^1.3.3",
+        "statuses": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/fresh": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/merge-descriptors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-2.0.0.tgz",
+      "integrity": "sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/mime-types": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.1.tgz",
+      "integrity": "sha512-xRc4oEhT6eaBpU1XF7AjpOFD+xQmXNB5OVKwp4tqCuBpHLS/ZbBDrc07mYTDqVMg6PfxUjjNp85O6Cd2Z/5HWA==",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/negotiator": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
+      "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/qs": {
+      "version": "6.14.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
+      "integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/raw-body": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.0.tgz",
+      "integrity": "sha512-RmkhL8CAyCRPXCE28MMH0z2PNWQBNk2Q09ZdxM9IOOXwxwZbN+qbWaatPkdkWIKL2ZVDImrN/pK5HTRz2PcS4g==",
+      "dependencies": {
+        "bytes": "3.1.2",
+        "http-errors": "2.0.0",
+        "iconv-lite": "0.6.3",
+        "unpipe": "1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/send": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/send/-/send-1.2.0.tgz",
+      "integrity": "sha512-uaW0WwXKpL9blXE2o0bRhoL2EGXIrZxQ2ZQ4mgcfoBxdFmQold+qWsD2jLrfZ0trjKL6vOw0j//eAwcALFjKSw==",
+      "dependencies": {
+        "debug": "^4.3.5",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "mime-types": "^3.0.1",
+        "ms": "^2.1.3",
+        "on-finished": "^2.4.1",
+        "range-parser": "^1.2.1",
+        "statuses": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/serve-static": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.0.tgz",
+      "integrity": "sha512-61g9pCh0Vnh7IutZjtLGGpTA355+OPn2TyDv/6ivP2h/AdAVX9azsoxmg2/M6nZeQZNYBEwIcsne1mJd9oQItQ==",
+      "dependencies": {
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "parseurl": "^1.3.3",
+        "send": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/@modelcontextprotocol/sdk/node_modules/type-is": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.0.1.tgz",
+      "integrity": "sha512-OZs6gsjF4vMp32qrCbiVSkrFmXtG/AZhY3t0iAMrMBiAZyV9oALtXO8hsrHbMXF9x6L3grlFuwW2oAz7cav+Gw==",
+      "dependencies": {
+        "content-type": "^1.0.5",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -2074,7 +2345,6 @@
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
       "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
-      "dev": true,
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -2553,6 +2823,25 @@
       "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
       "dev": true
     },
+    "node_modules/eventsource": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-3.0.6.tgz",
+      "integrity": "sha512-l19WpE2m9hSuyP06+FbuUUf1G+R0SFLrtQfbRb9PRr+oimOfxQhgGCbVaXg5IvZyyTThJsxh6L/srkMiCeBPDA==",
+      "dependencies": {
+        "eventsource-parser": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/eventsource-parser": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.0.1.tgz",
+      "integrity": "sha512-VARTJ9CYeuQYb0pZEPbzi740OWFgpHe7AYJ2WFZVnUDUQp5Dk2yJUgF36YsZ81cOyxT0QxmXD2EQpapAouzWVA==",
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
     "node_modules/execa": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/execa/-/execa-4.1.0.tgz",
@@ -2639,6 +2928,20 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/express-rate-limit": {
+      "version": "7.5.0",
+      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-7.5.0.tgz",
+      "integrity": "sha512-eB5zbQh5h+VenMPM3fh+nw1YExi5nMr6HUCR62ELSP11huvxm/Uir1H1QEyTkk5QX6A58pX6NmaTMceKZ0Eodg==",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/express-rate-limit"
+      },
+      "peerDependencies": {
+        "express": "^4.11 || 5 || ^5.0.0-beta.1"
+      }
+    },
     "node_modules/express/node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -3515,6 +3818,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-promise": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-4.0.0.tgz",
+      "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ=="
+    },
     "node_modules/is-stream": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
@@ -3548,8 +3856,7 @@
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
-      "dev": true
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
     },
     "node_modules/isstream": {
       "version": "0.1.2",
@@ -4934,7 +5241,6 @@
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "dev": true,
       "dependencies": {
         "wrappy": "1"
       }
@@ -5025,7 +5331,6 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
       "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -5120,6 +5425,14 @@
         "node": ">= 6"
       }
     },
+    "node_modules/pkce-challenge": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/pkce-challenge/-/pkce-challenge-4.1.0.tgz",
+      "integrity": "sha512-ZBmhE1C9LcPoH9XZSdwiPtbPHZROwAnMy+kIFQVrnMCxY4Cudlz3gBOpzilgc0jOgRaiT3sIWfpMomW2ar2orQ==",
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
     "node_modules/portfinder": {
       "version": "1.0.35",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.35.tgz",
@@ -5660,6 +5973,29 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/router": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
+      "integrity": "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "is-promise": "^4.0.0",
+        "parseurl": "^1.3.3",
+        "path-to-regexp": "^8.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/router/node_modules/path-to-regexp": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.2.0.tgz",
+      "integrity": "sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ==",
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -5806,7 +6142,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
       "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "dev": true,
       "dependencies": {
         "shebang-regex": "^3.0.0"
       },
@@ -5818,7 +6153,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -6770,7 +7104,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
       "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "dev": true,
       "dependencies": {
         "isexe": "^2.0.0"
       },
@@ -6819,8 +7152,7 @@
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "dev": true
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
     },
     "node_modules/y18n": {
       "version": "5.0.8",
@@ -6886,6 +7218,22 @@
         "fd-slicer": "~1.1.0"
       }
     },
+    "node_modules/zod": {
+      "version": "3.24.2",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-3.24.2.tgz",
+      "integrity": "sha512-lY7CDW43ECgW9u1TcT3IoXHflywfVqDYze4waEz812jR/bZ8FHDsl7pFQoSZTz5N+2NqRXs8GBwnAwo3ZNxqhQ==",
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
+    },
+    "node_modules/zod-to-json-schema": {
+      "version": "3.24.5",
+      "resolved": "https://registry.npmjs.org/zod-to-json-schema/-/zod-to-json-schema-3.24.5.tgz",
+      "integrity": "sha512-/AuWwMP+YqiPbsJx5D6TfgRTc4kTLjsh5SOcd4bLsfUg2RcEXrFMJl1DGgdHy2aCfsIA/cr/1JM0xcB2GZji8g==",
+      "peerDependencies": {
+        "zod": "^3.24.1"
+      }
+    },
     "node_modules/zwitch": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-2.0.4.tgz",

package.json

@@ -18,12 +18,15 @@
     "test:build": "start-server-and-test serve:build http://localhost:5173 'cypress run --spec cypress/e2e/message-routing-simple.cy.js'"
   },
   "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.8.0",
     "cors": "^2.8.5",
+    "eventsource": "^3.0.6",
     "express": "^4.18.2",
     "node-fetch": "^3.3.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-markdown": "^10.0.0"
+    "react-markdown": "^10.0.0",
+    "zod": "^3.24.2"
   },
   "devDependencies": {
     "@testing-library/cypress": "^10.0.3",

server/index.js

@@ -4,11 +4,16 @@ import fetch from 'node-fetch';
 import path from 'path'
 import { fileURLToPath } from 'url'
 import { callMcpServer, discoverMcpServerTools, executeMcpTool } from './mcp.js';
-
-// Note: Run the mock MCP server separately with: node server/start-mock-mcp.js
+import {
+  getAvailableMcpServers,
+  startMcpServer,
+  stopMcpServer,
+  getMcpServerStatus,
+  stopAllMcpServers
+} from './mcp-manager.js';
 
 const app = express();
-const port = 7860;
+const port = process.env.PORT || 7860;
 
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
@@ -196,6 +201,155 @@ app.post('/api/mcp/execute', async (req, res) => {
   }
 });
 
+// MCP 服务器管理端点
+app.get('/api/mcp/servers/available', (req, res) => {
+  console.log('Received request for available MCP servers');
+  try {
+    const servers = getAvailableMcpServers();
+    console.log('Available MCP servers:', servers);
+    res.json({ servers });
+  } catch (error) {
+    console.error('Error getting available MCP servers:', error);
+    res.status(500).json({ error: error.message });
+  }
+});
+
+app.post('/api/mcp/servers/start', async (req, res) => {
+  const { serverId } = req.body;
+
+  if (!serverId) {
+    return res.status(400).json({ error: 'Server ID is required' });
+  }
+
+  try {
+    const result = await startMcpServer(serverId);
+
+    if (result.success) {
+      res.json({
+        success: true,
+        serverId,
+        port: result.port,
+        endpoint: `http://localhost:${result.port}`
+      });
+    } else {
+      res.status(500).json({
+        success: false,
+        serverId,
+        error: result.error
+      });
+    }
+  } catch (error) {
+    console.error(`Error starting MCP server ${serverId}:`, error);
+    res.status(500).json({
+      success: false,
+      serverId,
+      error: error.message
+    });
+  }
+});
+
+app.post('/api/mcp/servers/stop', async (req, res) => {
+  const { serverId } = req.body;
+
+  if (!serverId) {
+    return res.status(400).json({ error: 'Server ID is required' });
+  }
+
+  try {
+    const result = await stopMcpServer(serverId);
+
+    if (result.success) {
+      res.json({
+        success: true,
+        serverId
+      });
+    } else {
+      res.status(500).json({
+        success: false,
+        serverId,
+        error: result.error
+      });
+    }
+  } catch (error) {
+    console.error(`Error stopping MCP server ${serverId}:`, error);
+    res.status(500).json({
+      success: false,
+      serverId,
+      error: error.message
+    });
+  }
+});
+
+app.get('/api/mcp/servers/status/:serverId', (req, res) => {
+  const { serverId } = req.params;
+
+  try {
+    const status = getMcpServerStatus(serverId);
+    res.json({
+      serverId,
+      ...status,
+      endpoint: status.isRunning ? `http://localhost:${status.port}` : null
+    });
+  } catch (error) {
+    console.error(`Error getting MCP server status for ${serverId}:`, error);
+    res.status(500).json({ error: error.message });
+  }
+});
+
+// 测试 MCP 服务器连接
+app.post('/api/mcp/servers/test-connection', async (req, res) => {
+  const { endpoint, authToken } = req.body;
+
+  if (!endpoint) {
+    return res.status(400).json({ error: 'Endpoint is required' });
+  }
+
+  try {
+    // 创建一个临时服务器对象
+    const server = {
+      id: 'test-connection',
+      name: 'Test Connection',
+      endpoint,
+      authToken
+    };
+
+    // 尝试发现工具
+    const toolsInfo = await discoverMcpServerTools(server);
+
+    res.json({
+      success: true,
+      tools: toolsInfo.tools || [],
+      message: `Successfully connected to MCP server at ${endpoint}`
+    });
+  } catch (error) {
+    console.error(`Error testing connection to MCP server at ${endpoint}:`, error);
+    res.status(500).json({
+      success: false,
+      error: error.message,
+      message: `Failed to connect to MCP server at ${endpoint}: ${error.message}`
+    });
+  }
+});
+
+console.log('Starting server...');
 app.listen(port, () => {
   console.log(`Server running at http://localhost:${port}`);
 });
+console.log('Server started!');
+
+// 确保在进程退出时停止所有 MCP 服务器
+process.on('exit', () => {
+  stopAllMcpServers();
+});
+
+// 处理未捕获的异常
+process.on('uncaughtException', (error) => {
+  console.error('Uncaught exception:', error);
+  stopAllMcpServers();
+  process.exit(1);
+});
+
+// 处理未处理的 Promise 拒绝
+process.on('unhandledRejection', (reason, promise) => {
+  console.error('Unhandled rejection at:', promise, 'reason:', reason);
+});

server/mcp-manager.js

@@ -0,0 +1,245 @@
+// MCP 服务器管理器
+import { spawn } from 'child_process';
+import path from 'path';
+import fs from 'fs';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const MCP_SERVERS_DIR = path.join(__dirname, 'mcp-servers');
+
+// 确保 MCP 服务器目录存在
+if (!fs.existsSync(MCP_SERVERS_DIR)) {
+  fs.mkdirSync(MCP_SERVERS_DIR, { recursive: true });
+}
+
+// 存储运行中的 MCP 服务器进程
+const runningServers = new Map();
+
+/**
+ * 获取可用的内置 MCP 服务器列表
+ */
+export function getAvailableMcpServers() {
+  try {
+    // 读取 mcp-servers 目录中的所有 .js 文件
+    const files = fs.readdirSync(MCP_SERVERS_DIR).filter(file => file.endsWith('.js'));
+    
+    return files.map(file => {
+      const name = file.replace('.js', '');
+      const isRunning = runningServers.has(name);
+      
+      return {
+        id: name,
+        name: formatServerName(name),
+        description: `Built-in MCP server: ${formatServerName(name)}`,
+        isBuiltIn: true,
+        isRunning
+      };
+    });
+  } catch (error) {
+    console.error('Error getting available MCP servers:', error);
+    return [];
+  }
+}
+
+/**
+ * 格式化服务器名称，将连字符和下划线替换为空格，并将每个单词首字母大写
+ */
+function formatServerName(name) {
+  return name
+    .replace(/[-_]/g, ' ')
+    .replace(/\w\S*/g, txt => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase());
+}
+
+/**
+ * 启动 MCP 服务器
+ * @param {string} serverId - 服务器 ID
+ * @returns {Promise<{success: boolean, port: number, error: string|null}>}
+ */
+export async function startMcpServer(serverId) {
+  try {
+    // 如果服务器已经在运行，返回成功
+    if (runningServers.has(serverId)) {
+      const serverInfo = runningServers.get(serverId);
+      return { 
+        success: true, 
+        port: serverInfo.port,
+        error: null
+      };
+    }
+    
+    // 检查服务器文件是否存在
+    const serverFile = path.join(MCP_SERVERS_DIR, `${serverId}.js`);
+    if (!fs.existsSync(serverFile)) {
+      return { 
+        success: false, 
+        port: null,
+        error: `Server file not found: ${serverFile}`
+      };
+    }
+    
+    // 分配一个端口（这里简单地使用 8000-8999 范围内的随机端口）
+    const port = 8000 + Math.floor(Math.random() * 1000);
+    
+    // 启动服务器进程
+    const serverProcess = spawn('node', [serverFile], {
+      env: { ...process.env, PORT: port.toString() },
+      detached: true
+    });
+    
+    // 等待服务器启动
+    const startPromise = new Promise((resolve, reject) => {
+      let output = '';
+      let errorOutput = '';
+      
+      serverProcess.stdout.on('data', (data) => {
+        output += data.toString();
+        if (output.includes('MCP server running')) {
+          resolve();
+        }
+      });
+      
+      serverProcess.stderr.on('data', (data) => {
+        errorOutput += data.toString();
+        console.error(`MCP server ${serverId} error:`, data.toString());
+      });
+      
+      serverProcess.on('error', (error) => {
+        reject(new Error(`Failed to start MCP server: ${error.message}`));
+      });
+      
+      serverProcess.on('exit', (code) => {
+        if (code !== 0 && !output.includes('MCP server running')) {
+          reject(new Error(`MCP server exited with code ${code}: ${errorOutput}`));
+        }
+      });
+      
+      // 设置超时
+      setTimeout(() => {
+        if (!output.includes('MCP server running')) {
+          reject(new Error('Timeout waiting for MCP server to start'));
+        }
+      }, 5000);
+    });
+    
+    try {
+      await startPromise;
+      
+      // 存储服务器信息
+      runningServers.set(serverId, {
+        process: serverProcess,
+        port
+      });
+      
+      console.log(`MCP server ${serverId} started on port ${port}`);
+      
+      return { 
+        success: true, 
+        port,
+        error: null
+      };
+    } catch (error) {
+      // 如果启动失败，杀死进程
+      serverProcess.kill();
+      return { 
+        success: false, 
+        port: null,
+        error: error.message
+      };
+    }
+  } catch (error) {
+    console.error(`Error starting MCP server ${serverId}:`, error);
+    return { 
+      success: false, 
+      port: null,
+      error: error.message
+    };
+  }
+}
+
+/**
+ * 停止 MCP 服务器
+ * @param {string} serverId - 服务器 ID
+ * @returns {Promise<{success: boolean, error: string|null}>}
+ */
+export async function stopMcpServer(serverId) {
+  try {
+    if (!runningServers.has(serverId)) {
+      return { 
+        success: false, 
+        error: `Server ${serverId} is not running`
+      };
+    }
+    
+    const serverInfo = runningServers.get(serverId);
+    
+    // 杀死进程
+    serverInfo.process.kill();
+    runningServers.delete(serverId);
+    
+    console.log(`MCP server ${serverId} stopped`);
+    
+    return { 
+      success: true, 
+      error: null
+    };
+  } catch (error) {
+    console.error(`Error stopping MCP server ${serverId}:`, error);
+    return { 
+      success: false, 
+      error: error.message
+    };
+  }
+}
+
+/**
+ * 获取 MCP 服务器状态
+ * @param {string} serverId - 服务器 ID
+ * @returns {{isRunning: boolean, port: number|null}}
+ */
+export function getMcpServerStatus(serverId) {
+  if (runningServers.has(serverId)) {
+    const serverInfo = runningServers.get(serverId);
+    return {
+      isRunning: true,
+      port: serverInfo.port
+    };
+  }
+  
+  return {
+    isRunning: false,
+    port: null
+  };
+}
+
+/**
+ * 停止所有运行中的 MCP 服务器
+ */
+export function stopAllMcpServers() {
+  for (const [serverId, serverInfo] of runningServers.entries()) {
+    try {
+      serverInfo.process.kill();
+      console.log(`MCP server ${serverId} stopped`);
+    } catch (error) {
+      console.error(`Error stopping MCP server ${serverId}:`, error);
+    }
+  }
+  
+  runningServers.clear();
+}
+
+// 确保在进程退出时停止所有 MCP 服务器
+process.on('exit', () => {
+  stopAllMcpServers();
+});
+
+// 处理未捕获的异常
+process.on('uncaughtException', (error) => {
+  console.error('Uncaught exception:', error);
+  stopAllMcpServers();
+  process.exit(1);
+});
+
+// 处理未处理的 Promise 拒绝
+process.on('unhandledRejection', (reason, promise) => {
+  console.error('Unhandled rejection at:', promise, 'reason:', reason);
+});

server/mcp-servers/time-service.js

@@ -0,0 +1,363 @@
+// 时间服务 MCP 服务器 - 使用 MCP SDK 实现
+import express from 'express';
+import cors from 'cors';
+import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';
+import { SSEServerTransport } from '@modelcontextprotocol/sdk/server/sse.js';
+import { z } from 'zod';
+
+const app = express();
+const port = process.env.PORT || 8004;
+
+app.use(cors());
+app.use(express.json());
+
+// 创建 MCP 服务器实例
+const server = new McpServer({
+  name: 'Time Service',
+  version: '1.0.0'
+});
+
+// 时区列表
+const timezones = [
+  { code: 'UTC', name: 'Coordinated Universal Time', offset: 0 },
+  { code: 'GMT', name: 'Greenwich Mean Time', offset: 0 },
+  { code: 'EST', name: 'Eastern Standard Time', offset: -5 },
+  { code: 'CST', name: 'Central Standard Time', offset: -6 },
+  { code: 'MST', name: 'Mountain Standard Time', offset: -7 },
+  { code: 'PST', name: 'Pacific Standard Time', offset: -8 },
+  { code: 'EDT', name: 'Eastern Daylight Time', offset: -4 },
+  { code: 'CDT', name: 'Central Daylight Time', offset: -5 },
+  { code: 'MDT', name: 'Mountain Daylight Time', offset: -6 },
+  { code: 'PDT', name: 'Pacific Daylight Time', offset: -7 },
+  { code: 'CET', name: 'Central European Time', offset: 1 },
+  { code: 'CEST', name: 'Central European Summer Time', offset: 2 },
+  { code: 'EET', name: 'Eastern European Time', offset: 2 },
+  { code: 'EEST', name: 'Eastern European Summer Time', offset: 3 },
+  { code: 'JST', name: 'Japan Standard Time', offset: 9 },
+  { code: 'CST-China', name: 'China Standard Time', offset: 8 },
+  { code: 'IST', name: 'India Standard Time', offset: 5.5 },
+  { code: 'AEST', name: 'Australian Eastern Standard Time', offset: 10 },
+  { code: 'AEDT', name: 'Australian Eastern Daylight Time', offset: 11 },
+  { code: 'NZST', name: 'New Zealand Standard Time', offset: 12 },
+  { code: 'NZDT', name: 'New Zealand Daylight Time', offset: 13 }
+];
+
+// 根据时区代码获取时区信息
+function getTimezoneByCode(code) {
+  // 处理中国标准时间的特殊情况
+  if (code === 'CST-China') {
+    return timezones.find(tz => tz.code === 'CST-China');
+  }
+
+  return timezones.find(tz => tz.code === code);
+}
+
+// 获取当前时间
+function getCurrentTime(timezone = 'UTC') {
+  const now = new Date();
+  const tz = getTimezoneByCode(timezone);
+
+  if (!tz) {
+    return {
+      error: `Unknown timezone: ${timezone}`
+    };
+  }
+
+  // 计算指定时区的时间
+  const utcTime = now.getTime() + (now.getTimezoneOffset() * 60000);
+  const tzTime = new Date(utcTime + (3600000 * tz.offset));
+
+  return {
+    timezone: tz.code,
+    timezoneName: tz.name,
+    offset: tz.offset,
+    time: tzTime.toISOString(),
+    formattedTime: tzTime.toLocaleString('en-US', {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      timeZone: 'UTC'
+    }),
+    timestamp: tzTime.getTime()
+  };
+}
+
+// 转换时区
+function convertTimezone(time, fromTimezone, toTimezone) {
+  const fromTz = getTimezoneByCode(fromTimezone);
+  const toTz = getTimezoneByCode(toTimezone);
+
+  if (!fromTz) {
+    return {
+      error: `Unknown source timezone: ${fromTimezone}`
+    };
+  }
+
+  if (!toTz) {
+    return {
+      error: `Unknown target timezone: ${toTimezone}`
+    };
+  }
+
+  let dateTime;
+
+  // 如果提供了时间，则使用它；否则使用当前时间
+  if (time) {
+    try {
+      dateTime = new Date(time);
+      if (isNaN(dateTime.getTime())) {
+        // 尝试解析其他格式
+        const parts = time.split(/[- :]/);
+        if (parts.length >= 3) {
+          // 假设格式为 YYYY-MM-DD 或 YYYY-MM-DD HH:MM:SS
+          const year = parseInt(parts[0]);
+          const month = parseInt(parts[1]) - 1; // 月份从0开始
+          const day = parseInt(parts[2]);
+          const hour = parts.length > 3 ? parseInt(parts[3]) : 0;
+          const minute = parts.length > 4 ? parseInt(parts[4]) : 0;
+          const second = parts.length > 5 ? parseInt(parts[5]) : 0;
+
+          dateTime = new Date(Date.UTC(year, month, day, hour, minute, second));
+        }
+
+        if (isNaN(dateTime.getTime())) {
+          return {
+            error: `Invalid time format: ${time}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD HH:MM:SS.`
+          };
+        }
+      }
+    } catch (error) {
+      return {
+        error: `Invalid time format: ${time}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD HH:MM:SS.`
+      };
+    }
+  } else {
+    dateTime = new Date();
+  }
+
+  // 将时间转换为 UTC
+  const utcTime = dateTime.getTime() - (fromTz.offset * 3600000);
+
+  // 将 UTC 时间转换为目标时区时间
+  const targetTime = new Date(utcTime + (toTz.offset * 3600000));
+
+  return {
+    originalTime: dateTime.toISOString(),
+    originalTimezone: fromTz.code,
+    originalTimezoneName: fromTz.name,
+    targetTimezone: toTz.code,
+    targetTimezoneName: toTz.name,
+    targetTime: targetTime.toISOString(),
+    formattedTargetTime: targetTime.toLocaleString('en-US', {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      timeZone: 'UTC'
+    }),
+    timeDifference: `${toTz.offset - fromTz.offset} hours`
+  };
+}
+
+// 计算两个日期之间的差异
+function calculateDateDifference(startDate, endDate) {
+  let start, end;
+
+  try {
+    start = new Date(startDate);
+    if (isNaN(start.getTime())) {
+      return {
+        error: `Invalid start date format: ${startDate}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD.`
+      };
+    }
+  } catch (error) {
+    return {
+      error: `Invalid start date format: ${startDate}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD.`
+    };
+  }
+
+  try {
+    end = endDate ? new Date(endDate) : new Date();
+    if (isNaN(end.getTime())) {
+      return {
+        error: `Invalid end date format: ${endDate}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD.`
+      };
+    }
+  } catch (error) {
+    return {
+      error: `Invalid end date format: ${endDate}. Please use ISO format (YYYY-MM-DDTHH:MM:SS) or YYYY-MM-DD.`
+    };
+  }
+
+  // 计算差异（毫秒）
+  const diffMs = Math.abs(end - start);
+
+  // 转换为天、小时、分钟和秒
+  const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));
+  const diffHours = Math.floor((diffMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+  const diffMinutes = Math.floor((diffMs % (1000 * 60 * 60)) / (1000 * 60));
+  const diffSeconds = Math.floor((diffMs % (1000 * 60)) / 1000);
+
+  // 计算年和月（近似值）
+  const diffYears = Math.floor(diffDays / 365);
+  const diffMonths = Math.floor((diffDays % 365) / 30);
+
+  return {
+    startDate: start.toISOString(),
+    endDate: end.toISOString(),
+    difference: {
+      milliseconds: diffMs,
+      seconds: Math.floor(diffMs / 1000),
+      minutes: Math.floor(diffMs / (1000 * 60)),
+      hours: Math.floor(diffMs / (1000 * 60 * 60)),
+      days: diffDays,
+      months: diffYears * 12 + diffMonths,
+      years: diffYears
+    },
+    formatted: `${diffYears > 0 ? diffYears + ' years, ' : ''}${diffMonths > 0 ? diffMonths + ' months, ' : ''}${diffDays % 30 > 0 ? (diffDays % 30) + ' days, ' : ''}${diffHours > 0 ? diffHours + ' hours, ' : ''}${diffMinutes > 0 ? diffMinutes + ' minutes, ' : ''}${diffSeconds > 0 ? diffSeconds + ' seconds' : ''}`
+  };
+}
+
+// 定义 get-current-time 工具
+server.tool(
+  'get-current-time',
+  { timezone: z.string().optional().describe('The timezone code (e.g., UTC, GMT, EST, CST, PST, JST, etc.)') },
+  async ({ timezone = 'UTC' }) => {
+    console.log(`Executing get-current-time tool with timezone: ${timezone}`);
+    const result = getCurrentTime(timezone);
+
+    if (result.error) {
+      throw new Error(result.error);
+    }
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify(result, null, 2)
+      }]
+    };
+  }
+);
+
+// 定义 convert-timezone 工具
+server.tool(
+  'convert-timezone',
+  {
+    time: z.string().optional().describe('The time to convert (ISO format or YYYY-MM-DD HH:MM:SS). If not provided, current time will be used.'),
+    fromTimezone: z.string().describe('The source timezone code'),
+    toTimezone: z.string().describe('The target timezone code')
+  },
+  async ({ time, fromTimezone, toTimezone }) => {
+    console.log(`Executing convert-timezone tool with parameters:`, { time, fromTimezone, toTimezone });
+
+    if (!fromTimezone || !toTimezone) {
+      throw new Error('Both fromTimezone and toTimezone are required');
+    }
+
+    const result = convertTimezone(time, fromTimezone, toTimezone);
+
+    if (result.error) {
+      throw new Error(result.error);
+    }
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify(result, null, 2)
+      }]
+    };
+  }
+);
+
+// 定义 calculate-date-difference 工具
+server.tool(
+  'calculate-date-difference',
+  {
+    startDate: z.string().describe('The start date (ISO format or YYYY-MM-DD)'),
+    endDate: z.string().optional().describe('The end date (ISO format or YYYY-MM-DD). If not provided, current date will be used.')
+  },
+  async ({ startDate, endDate }) => {
+    console.log(`Executing calculate-date-difference tool with parameters:`, { startDate, endDate });
+
+    if (!startDate) {
+      throw new Error('startDate is required');
+    }
+
+    const result = calculateDateDifference(startDate, endDate);
+
+    if (result.error) {
+      throw new Error(result.error);
+    }
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify(result, null, 2)
+      }]
+    };
+  }
+);
+
+// 定义 list-timezones 工具
+server.tool(
+  'list-timezones',
+  {},
+  async () => {
+    console.log('Executing list-timezones tool');
+
+    const tzList = timezones.map(tz => ({
+      code: tz.code,
+      name: tz.name,
+      offset: tz.offset
+    }));
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify({ timezones: tzList }, null, 2)
+      }]
+    };
+  }
+);
+
+// 存储活跃的 SSE 传输连接
+const transports = {};
+
+// 设置 SSE 端点
+app.get('/sse', async (_, res) => {
+  const transport = new SSEServerTransport('/messages', res);
+  transports[transport.sessionId] = transport;
+
+  res.on('close', () => {
+    delete transports[transport.sessionId];
+    console.log(`Connection closed for session ${transport.sessionId}`);
+  });
+
+  console.log(`New SSE connection established with session ID: ${transport.sessionId}`);
+  await server.connect(transport);
+});
+
+// 设置消息处理端点
+app.post('/messages', async (req, res) => {
+  const sessionId = req.query.sessionId;
+  const transport = transports[sessionId];
+
+  if (transport) {
+    await transport.handlePostMessage(req, res);
+  } else {
+    res.status(400).send('No transport found for sessionId');
+  }
+});
+
+// 启动服务器
+app.listen(port, () => {
+  console.log(`Time MCP server running at http://localhost:${port}`);
+  console.log(`Connect to SSE endpoint at http://localhost:${port}/sse`);
+});

server/mcp-servers/weather-service.js

@@ -0,0 +1,152 @@
+// 天气服务 MCP 服务器 - 使用 MCP SDK 实现
+import express from 'express';
+import cors from 'cors';
+import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';
+import { SSEServerTransport } from '@modelcontextprotocol/sdk/server/sse.js';
+import { z } from 'zod';
+
+const app = express();
+const port = process.env.PORT || 8001;
+
+app.use(cors());
+app.use(express.json());
+
+// 创建 MCP 服务器实例
+const server = new McpServer({
+  name: 'Weather Service',
+  version: '1.0.0'
+});
+
+// 模拟天气数据
+const weatherData = {
+  'New York': {
+    temperature: '15°C',
+    condition: 'Partly Cloudy',
+    humidity: '65%',
+    wind: '10 km/h'
+  },
+  'London': {
+    temperature: '12°C',
+    condition: 'Rainy',
+    humidity: '80%',
+    wind: '15 km/h'
+  },
+  'Tokyo': {
+    temperature: '20°C',
+    condition: 'Sunny',
+    humidity: '50%',
+    wind: '8 km/h'
+  },
+  'Paris': {
+    temperature: '14°C',
+    condition: 'Cloudy',
+    humidity: '70%',
+    wind: '12 km/h'
+  },
+  'Sydney': {
+    temperature: '25°C',
+    condition: 'Sunny',
+    humidity: '45%',
+    wind: '20 km/h'
+  }
+};
+
+// 默认天气数据
+const defaultWeather = {
+  temperature: '18°C',
+  condition: 'Clear',
+  humidity: '60%',
+  wind: '10 km/h'
+};
+
+// 定义 get-weather 工具
+server.tool(
+  'get-weather',
+  { location: z.string().describe('The location to get weather for') },
+  async ({ location }) => {
+    console.log(`Executing get-weather tool with location: ${location}`);
+    const weather = weatherData[location] || defaultWeather;
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify({
+          location,
+          ...weather,
+          timestamp: new Date().toISOString()
+        }, null, 2)
+      }]
+    };
+  }
+);
+
+// 定义 get-forecast 工具
+server.tool(
+  'get-forecast',
+  { location: z.string().describe('The location to get forecast for') },
+  async ({ location }) => {
+    console.log(`Executing get-forecast tool with location: ${location}`);
+    const weather = weatherData[location] || defaultWeather;
+
+    // 生成简单的 5 天预报
+    const forecast = Array.from({ length: 5 }, (_, i) => {
+      const date = new Date();
+      date.setDate(date.getDate() + i + 1);
+
+      return {
+        date: date.toISOString().split('T')[0],
+        temperature: `${Math.round(parseInt(weather.temperature) + (Math.random() * 6 - 3))}°C`,
+        condition: ['Sunny', 'Cloudy', 'Rainy', 'Partly Cloudy', 'Clear'][Math.floor(Math.random() * 5)],
+        humidity: `${Math.round(parseInt(weather.humidity) + (Math.random() * 10 - 5))}%`,
+        wind: `${Math.round(parseInt(weather.wind) + (Math.random() * 8 - 4))} km/h`
+      };
+    });
+
+    return {
+      content: [{
+        type: 'text',
+        text: JSON.stringify({
+          location,
+          current: weather,
+          forecast,
+          timestamp: new Date().toISOString()
+        }, null, 2)
+      }]
+    };
+  }
+);
+
+// 存储活跃的 SSE 传输连接
+const transports = {};
+
+// 设置 SSE 端点
+app.get('/sse', async (_, res) => {
+  const transport = new SSEServerTransport('/messages', res);
+  transports[transport.sessionId] = transport;
+
+  res.on('close', () => {
+    delete transports[transport.sessionId];
+    console.log(`Connection closed for session ${transport.sessionId}`);
+  });
+
+  console.log(`New SSE connection established with session ID: ${transport.sessionId}`);
+  await server.connect(transport);
+});
+
+// 设置消息处理端点
+app.post('/messages', async (req, res) => {
+  const sessionId = req.query.sessionId;
+  const transport = transports[sessionId];
+
+  if (transport) {
+    await transport.handlePostMessage(req, res);
+  } else {
+    res.status(400).send('No transport found for sessionId');
+  }
+});
+
+// 启动服务器
+app.listen(port, () => {
+  console.log(`Weather MCP server running at http://localhost:${port}`);
+  console.log(`Connect to SSE endpoint at http://localhost:${port}/sse`);
+});

src/App.jsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useMemo } from 'react';
 import ChatList from './components/ChatList';
 import ChatWindow from './components/ChatWindow';
 import Settings from './components/Settings';
@@ -23,7 +23,13 @@ function App() {
     model: 'DeepSeek-R1'
   });
 
-  const [mcpServers, setMcpServers] = useLocalStorage('mcpServers', []);
+  const [mcpServers, setMcpServers] = useLocalStorage('mcpServers', [], { disableCache: false });
+
+  // 过滤出正在运行的 MCP 服务器
+  const activeMcpServers = useMemo(() => {
+    console.log('Filtering active MCP servers:', mcpServers);
+    return mcpServers.filter(server => !server.isBuiltIn || server.isRunning);
+  }, [mcpServers]);
 
   const [activeProfileId, setActiveProfileId] = useLocalStorage('activeProfileId', 'default');
 
@@ -230,7 +236,7 @@ function App() {
               isStreamingChat={isStreamingChat}
               allChats={chats}
               currentChatId={currentChatId}
-              mcpServers={mcpServers}
+              mcpServers={activeMcpServers}
             />
           ) : (
             <div className="flex flex-col items-center justify-center h-full p-5 text-center">

src/components/ChatWindow.jsx

@@ -54,6 +54,12 @@ function ChatWindow({
       'percentage', 'factorial', 'exponent', 'logarithm'
     ];
 
+    const timeQuestions = [
+      'current time', 'time now', 'what time', 'current date', 'today date', 'what date',
+      'time in', 'time at', 'time zone', 'timezone', 'convert time', 'time difference',
+      'date difference', 'days between', 'time between', 'how long since', 'how many days'
+    ];
+
     // 检查用户输入是否包含这些问题类型的关键词
     const input = userInput.toLowerCase();
 
@@ -66,8 +72,14 @@ function ChatWindow({
     // 检查是否是计算类型的问题
     const isCalculationQuestion = calculationQuestions.some(keyword => input.includes(keyword.toLowerCase()));
 
+    // 检查是否是时间相关的问题
+    const isTimeQuestion = timeQuestions.some(keyword => input.includes(keyword.toLowerCase()));
+
+    // 检查是否包含时区代码
+    const containsTimezoneCode = /\b([A-Z]{3,4}(?:-[A-Za-z]+)?)\b/i.test(input);
+
     // 如果是任何一种类型的问题，则可能需要使用MCP工具
-    return isInformationQuestion || isWeatherQuestion || isCalculationQuestion;
+    return isInformationQuestion || isWeatherQuestion || isCalculationQuestion || isTimeQuestion || containsTimezoneCode;
   };
 
   // Scroll to bottom when messages change
@@ -243,6 +255,114 @@ function ChatWindow({
 
           return { expression: '' };
         }
+      },
+      'get-current-time': {
+        intents: ['current time', 'time now', 'what time', 'current date', 'today date', 'what date'],
+        paramExtractor: (input) => {
+          // 尝试提取时区
+          const timezonePatterns = [
+            /(?:in|at)\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i,
+            /([A-Z]{3,4}(?:-[A-Za-z]+)?)\s+(?:time|timezone)/i
+          ];
+
+          for (const pattern of timezonePatterns) {
+            const match = input.match(pattern);
+            if (match && match[1]) {
+              return { timezone: match[1].toUpperCase() };
+            }
+          }
+
+          // 如果没有指定时区，使用 UTC
+          return { timezone: 'UTC' };
+        }
+      },
+      'convert-timezone': {
+        intents: ['convert time', 'timezone conversion', 'time difference', 'what time is it in', 'convert timezone'],
+        paramExtractor: (input) => {
+          // 尝试提取源时区和目标时区
+          const fromTimezonePattern = /from\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+          const toTimezonePattern = /to\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+
+          // 尝试提取时间
+          const timePattern = /(\d{4}-\d{2}-\d{2}(?:T|\s+)\d{2}:\d{2}(?::\d{2})?)/i;
+
+          const params = {};
+
+          // 提取时间
+          const timeMatch = input.match(timePattern);
+          if (timeMatch && timeMatch[1]) {
+            params.time = timeMatch[1];
+          }
+
+          // 提取源时区
+          const fromMatch = input.match(fromTimezonePattern);
+          if (fromMatch && fromMatch[1]) {
+            params.fromTimezone = fromMatch[1].toUpperCase();
+          } else {
+            // 如果没有指定源时区，使用 UTC
+            params.fromTimezone = 'UTC';
+          }
+
+          // 提取目标时区
+          const toMatch = input.match(toTimezonePattern);
+          if (toMatch && toMatch[1]) {
+            params.toTimezone = toMatch[1].toUpperCase();
+          } else {
+            // 尝试从“在...”的形式中提取目标时区
+            const inTimezonePattern = /(?:in|at)\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+            const inMatch = input.match(inTimezonePattern);
+            if (inMatch && inMatch[1]) {
+              params.toTimezone = inMatch[1].toUpperCase();
+            }
+          }
+
+          return params;
+        }
+      },
+      'calculate-date-difference': {
+        intents: ['date difference', 'days between', 'time between', 'how long since', 'how many days', 'date calculation'],
+        paramExtractor: (input) => {
+          // 尝试提取两个日期
+          const datePattern = /(\d{4}-\d{2}-\d{2})/g;
+          const dates = [];
+          let match;
+
+          while ((match = datePattern.exec(input)) !== null) {
+            dates.push(match[1]);
+          }
+
+          if (dates.length >= 2) {
+            return {
+              startDate: dates[0],
+              endDate: dates[1]
+            };
+          } else if (dates.length === 1) {
+            return {
+              startDate: dates[0]
+              // 不指定结束日期，将使用当前日期
+            };
+          }
+
+          // 如果没有找到日期，尝试从“自...”的形式中提取
+          const sincePattern = /(?:since|from)\s+(\w+\s+\d{1,2}(?:st|nd|rd|th)?(?:,\s+\d{4})?)/i;
+          const sinceMatch = input.match(sincePattern);
+
+          if (sinceMatch && sinceMatch[1]) {
+            // 尝试将文本日期转换为 ISO 格式
+            try {
+              const date = new Date(sinceMatch[1]);
+              if (!isNaN(date.getTime())) {
+                return {
+                  startDate: date.toISOString().split('T')[0]
+                };
+              }
+            } catch (e) {
+              // 忽略解析错误
+            }
+          }
+
+          return {};
+        }
       }
     };
 
@@ -327,6 +447,132 @@ function ChatWindow({
             parameters: { expression }
           };
         }
+      } else if (userInput.toLowerCase().includes('time') ||
+                 userInput.toLowerCase().includes('date') ||
+                 userInput.toLowerCase().includes('timezone') ||
+                 userInput.toLowerCase().includes('time zone') ||
+                 /\b([A-Z]{3,4}(?:-[A-Za-z]+)?)\b/i.test(userInput)) {
+        // 时间相关问题
+
+        // 检查是否是时区转换请求
+        if (userInput.toLowerCase().includes('convert') ||
+            userInput.toLowerCase().includes('difference') ||
+            userInput.toLowerCase().includes('what time is it in') ||
+            (userInput.toLowerCase().includes('time') && userInput.toLowerCase().includes('in'))) {
+          const convertTool = availableTools.find(tool => tool.name === 'convert-timezone');
+          if (convertTool) {
+            // 提取源时区和目标时区
+            const fromTimezonePattern = /from\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+            const toTimezonePattern = /to\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+            const inTimezonePattern = /(?:in|at)\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+
+            const params = {};
+
+            // 提取源时区
+            const fromMatch = userInput.match(fromTimezonePattern);
+            if (fromMatch && fromMatch[1]) {
+              params.fromTimezone = fromMatch[1].toUpperCase();
+            } else {
+              params.fromTimezone = 'UTC';
+            }
+
+            // 提取目标时区
+            const toMatch = userInput.match(toTimezonePattern);
+            if (toMatch && toMatch[1]) {
+              params.toTimezone = toMatch[1].toUpperCase();
+            } else {
+              const inMatch = userInput.match(inTimezonePattern);
+              if (inMatch && inMatch[1]) {
+                params.toTimezone = inMatch[1].toUpperCase();
+              } else {
+                // 如果没有指定目标时区，尝试从文本中提取时区代码
+                const timezoneCodeMatch = userInput.match(/\b([A-Z]{3,4}(?:-[A-Za-z]+)?)\b/i);
+                if (timezoneCodeMatch && timezoneCodeMatch[1] && timezoneCodeMatch[1].toUpperCase() !== params.fromTimezone) {
+                  params.toTimezone = timezoneCodeMatch[1].toUpperCase();
+                } else {
+                  // 如果还是没有找到，使用 CST-China
+                  params.toTimezone = 'CST-China';
+                }
+              }
+            }
+
+            toolRequest = {
+              tool: convertTool,
+              parameters: params
+            };
+          }
+        } else if (userInput.toLowerCase().includes('date difference') ||
+                   userInput.toLowerCase().includes('days between') ||
+                   userInput.toLowerCase().includes('time between') ||
+                   userInput.toLowerCase().includes('how long since')) {
+          // 日期差异计算
+          const dateDiffTool = availableTools.find(tool => tool.name === 'calculate-date-difference');
+          if (dateDiffTool) {
+            // 提取日期
+            const datePattern = /(\d{4}-\d{2}-\d{2})/g;
+            const dates = [];
+            let match;
+
+            while ((match = datePattern.exec(userInput)) !== null) {
+              dates.push(match[1]);
+            }
+
+            const params = {};
+
+            if (dates.length >= 2) {
+              params.startDate = dates[0];
+              params.endDate = dates[1];
+            } else if (dates.length === 1) {
+              params.startDate = dates[0];
+            } else {
+              // 如果没有找到日期，尝试从“自...”的形式中提取
+              const sincePattern = /(?:since|from)\s+(\w+\s+\d{1,2}(?:st|nd|rd|th)?(?:,\s+\d{4})?)/i;
+              const sinceMatch = userInput.match(sincePattern);
+
+              if (sinceMatch && sinceMatch[1]) {
+                try {
+                  const date = new Date(sinceMatch[1]);
+                  if (!isNaN(date.getTime())) {
+                    params.startDate = date.toISOString().split('T')[0];
+                  }
+                } catch (e) {
+                  // 忽略解析错误
+                }
+              }
+            }
+
+            if (params.startDate) {
+              toolRequest = {
+                tool: dateDiffTool,
+                parameters: params
+              };
+            }
+          }
+        } else {
+          // 获取当前时间
+          const timeTool = availableTools.find(tool => tool.name === 'get-current-time');
+          if (timeTool) {
+            // 提取时区
+            const timezonePattern = /(?:in|at)\s+([A-Z]{3,4}(?:-[A-Za-z]+)?)/i;
+            const timezoneMatch = userInput.match(timezonePattern);
+
+            let timezone = 'UTC';
+            if (timezoneMatch && timezoneMatch[1]) {
+              timezone = timezoneMatch[1].toUpperCase();
+            } else {
+              // 尝试从文本中提取时区代码
+              const timezoneCodeMatch = userInput.match(/\b([A-Z]{3,4}(?:-[A-Za-z]+)?)\b/i);
+              if (timezoneCodeMatch && timezoneCodeMatch[1]) {
+                timezone = timezoneCodeMatch[1].toUpperCase();
+              }
+            }
+
+            toolRequest = {
+              tool: timeTool,
+              parameters: { timezone }
+            };
+          }
+        }
       } else {
         // 其他信息查询问题
         const searchTool = availableTools.find(tool => tool.name === 'web-search');
@@ -373,6 +619,13 @@ function ChatWindow({
             result.links.forEach((link, index) => {
               formattedResult += `${index + 1}. [${link.title}](${link.url})\n`;
             });
+          } else if (result.results && Array.isArray(result.results)) {
+            result.results.forEach((item, index) => {
+              formattedResult += `${index + 1}. [${item.title}](${item.url})\n`;
+              if (item.snippet) {
+                formattedResult += `   ${item.snippet}\n\n`;
+              }
+            });
           } else {
             formattedResult += result.result || JSON.stringify(result, null, 2);
           }
@@ -385,6 +638,39 @@ function ChatWindow({
           formattedResult = `**Calculation Result:**\n\n`;
           formattedResult += `Expression: ${result.expression || toolRequest.parameters.expression}\n`;
           formattedResult += `Result: ${result.result !== undefined ? result.result : 'Error in calculation'}\n`;
+        } else if (toolRequest.tool.name === 'get-current-time') {
+          formattedResult = `**Current Time in ${result.timezoneName || result.timezone || 'the requested timezone'}:**\n\n`;
+          formattedResult += `- Time: ${result.formattedTime || result.time || 'N/A'}\n`;
+          formattedResult += `- Timezone: ${result.timezoneName || result.timezone || 'N/A'} (UTC${result.offset >= 0 ? '+' : ''}${result.offset})\n`;
+          formattedResult += `- Date: ${new Date(result.time || result.timestamp).toDateString()}\n`;
+        } else if (toolRequest.tool.name === 'convert-timezone') {
+          formattedResult = `**Time Conversion Result:**\n\n`;
+          formattedResult += `- From: ${result.originalTimezoneName || result.originalTimezone || 'N/A'} (${new Date(result.originalTime).toLocaleString()})\n`;
+          formattedResult += `- To: ${result.targetTimezoneName || result.targetTimezone || 'N/A'} (${new Date(result.targetTime).toLocaleString()})\n`;
+          formattedResult += `- Converted Time: ${result.formattedTargetTime || new Date(result.targetTime).toLocaleString()}\n`;
+          formattedResult += `- Time Difference: ${result.timeDifference || 'N/A'}\n`;
+        } else if (toolRequest.tool.name === 'calculate-date-difference') {
+          formattedResult = `**Date Difference Calculation:**\n\n`;
+          formattedResult += `- Start Date: ${new Date(result.startDate).toDateString()}\n`;
+          formattedResult += `- End Date: ${new Date(result.endDate).toDateString()}\n`;
+          formattedResult += `- Difference: ${result.formatted || 'N/A'}\n`;
+
+          if (result.difference) {
+            formattedResult += `\n**Detailed Difference:**\n`;
+            formattedResult += `- Years: ${result.difference.years || 0}\n`;
+            formattedResult += `- Months: ${result.difference.months || 0}\n`;
+            formattedResult += `- Days: ${result.difference.days || 0}\n`;
+            formattedResult += `- Hours: ${result.difference.hours || 0}\n`;
+          }
+        } else if (toolRequest.tool.name === 'list-timezones') {
+          formattedResult = `**Available Timezones:**\n\n`;
+          if (result.timezones && Array.isArray(result.timezones)) {
+            result.timezones.forEach((tz) => {
+              formattedResult += `- ${tz.code}: ${tz.name} (UTC${tz.offset >= 0 ? '+' : ''}${tz.offset})\n`;
+            });
+          } else {
+            formattedResult += JSON.stringify(result, null, 2);
+          }
         } else {
           // 其他工具类型的默认格式
           formattedResult = JSON.stringify(result, null, 2);

src/components/Settings.jsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 
 function Settings({
   profiles,
@@ -19,14 +19,64 @@ function Settings({
     model: 'DeepSeek-R1'
   });
   const [localMcpServers, setLocalMcpServers] = useState(mcpServers || []);
+
+  // 当 mcpServers 变化时更新本地状态
+  useEffect(() => {
+    console.log('mcpServers changed:', mcpServers);
+    setLocalMcpServers(mcpServers || []);
+  }, [mcpServers]);
   const [editingProfileId, setEditingProfileId] = useState(activeProfileId);
   const [editingMcpServerId, setEditingMcpServerId] = useState(null);
   const [isHintExpanded, setIsHintExpanded] = useState(false);
   const [isMcpHintExpanded, setIsMcpHintExpanded] = useState(false);
+  const [builtInServers, setBuiltInServers] = useState([]);
+  const [isLoadingServers, setIsLoadingServers] = useState(false);
+  const [serverTestResult, setServerTestResult] = useState(null);
+  const [isTestingConnection, setIsTestingConnection] = useState(false);
 
   const editingProfile = localProfiles.find(p => p.id === editingProfileId) || localProfiles[0];
   const editingMcpServer = localMcpServers.find(s => s.id === editingMcpServerId) || null;
 
+  // 获取可用的内置 MCP 服务器
+  useEffect(() => {
+    const fetchBuiltInServers = async () => {
+      setIsLoadingServers(true);
+      try {
+        console.log('Fetching built-in MCP servers...');
+        const response = await fetch('/api/mcp/servers/available', {
+          method: 'GET',
+          headers: {
+            'Cache-Control': 'no-cache',
+            'Pragma': 'no-cache'
+          }
+        });
+
+        if (response.ok) {
+          const data = await response.json();
+          console.log('Received built-in MCP servers:', data);
+          setBuiltInServers(data.servers || []);
+        } else {
+          console.error('Failed to fetch built-in MCP servers:', response.status, response.statusText);
+          // 尝试读取错误消息
+          const errorText = await response.text();
+          console.error('Error details:', errorText);
+        }
+      } catch (error) {
+        console.error('Error fetching built-in MCP servers:', error);
+      } finally {
+        setIsLoadingServers(false);
+      }
+    };
+
+    fetchBuiltInServers();
+
+    // 每 5 秒刷新一次服务器状态
+    const intervalId = setInterval(fetchBuiltInServers, 5000);
+
+    // 清理定时器
+    return () => clearInterval(intervalId);
+  }, []);
+
   const handleProfileChange = (updatedProfile) => {
     setLocalProfiles(localProfiles.map(p =>
       p.id === updatedProfile.id ? updatedProfile : p
@@ -72,6 +122,143 @@ function Settings({
     }
   };
 
+  // 测试 MCP 服务器连接
+  const testMcpServerConnection = async (endpoint, authToken) => {
+    if (!endpoint) return;
+
+    setIsTestingConnection(true);
+    setServerTestResult(null);
+
+    try {
+      const response = await fetch('/api/mcp/servers/test-connection', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({ endpoint, authToken })
+      });
+
+      const result = await response.json();
+      setServerTestResult(result);
+      return result.success;
+    } catch (error) {
+      console.error('Error testing MCP server connection:', error);
+      setServerTestResult({
+        success: false,
+        message: `Connection error: ${error.message}`,
+        error: error.message
+      });
+      return false;
+    } finally {
+      setIsTestingConnection(false);
+    }
+  };
+
+  // 启动内置 MCP 服务器
+  const startBuiltInServer = async (serverId) => {
+    try {
+      const response = await fetch('/api/mcp/servers/start', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({ serverId })
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        // 检查是否已经添加了这个服务器
+        const existingServer = localMcpServers.find(s =>
+          s.isBuiltIn && s.builtInId === serverId
+        );
+
+        if (!existingServer) {
+          // 添加到本地 MCP 服务器列表
+          const builtInServer = builtInServers.find(s => s.id === serverId);
+          const newServer = {
+            id: `built-in-${serverId}-${Date.now()}`,
+            name: builtInServer ? builtInServer.name : `Built-in Server ${serverId}`,
+            endpoint: result.endpoint,
+            authToken: '',
+            description: builtInServer ? builtInServer.description : 'Built-in MCP server',
+            isBuiltIn: true,
+            builtInId: serverId,
+            isRunning: true
+          };
+
+          const updatedServers = [...localMcpServers, newServer];
+          setLocalMcpServers(updatedServers);
+          setEditingMcpServerId(newServer.id);
+        } else {
+          // 更新现有服务器的端点
+          const updatedServers = localMcpServers.map(s =>
+            s.id === existingServer.id
+              ? { ...s, endpoint: result.endpoint, isRunning: true }
+              : s
+          );
+          setLocalMcpServers(updatedServers);
+          setEditingMcpServerId(existingServer.id);
+        }
+
+        // 刷新内置服务器列表
+        const response = await fetch('/api/mcp/servers/available');
+        if (response.ok) {
+          const data = await response.json();
+          setBuiltInServers(data.servers || []);
+        }
+
+        return true;
+      } else {
+        console.error('Failed to start built-in MCP server:', result.error);
+        return false;
+      }
+    } catch (error) {
+      console.error('Error starting built-in MCP server:', error);
+      return false;
+    }
+  };
+
+  // 停止内置 MCP 服务器
+  const stopBuiltInServer = async (serverId) => {
+    try {
+      const response = await fetch('/api/mcp/servers/stop', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({ serverId })
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        // 更新内置服务器的状态
+        const updatedServers = localMcpServers.map(s =>
+          s.isBuiltIn && s.builtInId === serverId
+            ? { ...s, isRunning: false }
+            : s
+        );
+        setLocalMcpServers(updatedServers);
+
+        // 刷新内置服务器列表
+        const response = await fetch('/api/mcp/servers/available');
+        if (response.ok) {
+          const data = await response.json();
+          setBuiltInServers(data.servers || []);
+        }
+
+        return true;
+      } else {
+        console.error('Failed to stop built-in MCP server:', result.error);
+        return false;
+      }
+    } catch (error) {
+      console.error('Error stopping built-in MCP server:', error);
+      return false;
+    }
+  };
+
   const handleAddMcpServer = () => {
     const newId = `mcp-server-${Date.now()}`;
     const newServer = {
@@ -79,7 +266,8 @@ function Settings({
       name: `MCP Server ${localMcpServers.length + 1}`,
       endpoint: '',
       authToken: '',
-      description: ''
+      description: '',
+      isBuiltIn: false
     };
 
     const updatedServers = [...localMcpServers, newServer];
@@ -281,14 +469,91 @@ function Settings({
             </button>
           </div>
 
+          {/* Built-in MCP Servers */}
+          <div className="built-in-servers-section">
+            <h4>Built-in MCP Servers</h4>
+            <div className="built-in-servers-list">
+              {isLoadingServers ? (
+                <div className="loading-indicator">Loading built-in servers...</div>
+              ) : builtInServers.length > 0 ? (
+                builtInServers.map(server => {
+                  // 检查这个内置服务器是否已经添加到用户的服务器列表中
+                  const isAdded = localMcpServers.some(s => s.isBuiltIn && s.builtInId === server.id);
+
+                  return (
+                    <div key={server.id} className="built-in-server-item">
+                      <div className="server-info">
+                        <span className="server-name">{server.name}</span>
+                        <span className={`server-status ${server.isRunning ? 'running' : 'stopped'}`}>
+                          {server.isRunning ? 'Running' : 'Stopped'}
+                        </span>
+                      </div>
+                      <div className="server-actions">
+                        {isAdded ? (
+                          <button
+                            className="server-action-button"
+                            onClick={() => {
+                              const addedServer = localMcpServers.find(s => s.isBuiltIn && s.builtInId === server.id);
+                              if (addedServer) {
+                                setEditingMcpServerId(addedServer.id);
+                              }
+                            }}
+                          >
+                            View
+                          </button>
+                        ) : (
+                          <button
+                            className="server-action-button"
+                            onClick={() => startBuiltInServer(server.id)}
+                            disabled={server.isRunning}
+                          >
+                            Add & Start
+                          </button>
+                        )}
+
+                        {server.isRunning ? (
+                          <button
+                            className="server-action-button stop"
+                            onClick={() => stopBuiltInServer(server.id)}
+                          >
+                            Stop
+                          </button>
+                        ) : (
+                          <button
+                            className="server-action-button start"
+                            onClick={() => startBuiltInServer(server.id)}
+                          >
+                            Start
+                          </button>
+                        )}
+                      </div>
+                    </div>
+                  );
+                })
+              ) : (
+                <div className="empty-state">
+                  <p>No built-in MCP servers available.</p>
+                </div>
+              )}
+            </div>
+          </div>
+
+          {/* User-added MCP Servers */}
+          <h4>Your MCP Servers</h4>
           <div className="profiles-list">
             {localMcpServers.map(server => (
               <div
                 key={server.id}
-                className={`profile-item ${server.id === editingMcpServerId ? 'active' : ''}`}
+                className={`profile-item ${server.id === editingMcpServerId ? 'active' : ''} ${server.isBuiltIn && server.isRunning ? 'running' : ''}`}
                 onClick={() => setEditingMcpServerId(server.id)}
               >
                 <span>{server.name}</span>
+                {server.isBuiltIn && server.isRunning && (
+                  <span className="server-badge running">Running</span>
+                )}
+                {server.isBuiltIn && !server.isRunning && (
+                  <span className="server-badge stopped">Stopped</span>
+                )}
                 <button
                   className="delete-profile-button"
                   onClick={(e) => {
@@ -321,20 +586,47 @@ function Settings({
                     name: e.target.value
                   })}
                   placeholder="Enter server name"
+                  disabled={editingMcpServer.isBuiltIn}
                 />
               </div>
 
               <div className="setting-item">
                 <label>Endpoint URL:</label>
-                <input
-                  type="text"
-                  value={editingMcpServer.endpoint}
-                  onChange={(e) => handleMcpServerChange({
-                    ...editingMcpServer,
-                    endpoint: e.target.value
-                  })}
-                  placeholder="Enter MCP server endpoint URL"
-                />
+                <div className="input-with-button">
+                  <input
+                    type="text"
+                    value={editingMcpServer.endpoint}
+                    onChange={(e) => handleMcpServerChange({
+                      ...editingMcpServer,
+                      endpoint: e.target.value
+                    })}
+                    placeholder="Enter MCP server endpoint URL"
+                    disabled={editingMcpServer.isBuiltIn}
+                  />
+                  <button
+                    type="button"
+                    className="test-connection-button"
+                    onClick={() => testMcpServerConnection(editingMcpServer.endpoint, editingMcpServer.authToken)}
+                    disabled={!editingMcpServer.endpoint || isTestingConnection}
+                  >
+                    {isTestingConnection ? 'Testing...' : 'Test Connection'}
+                  </button>
+                </div>
+                {serverTestResult && (
+                  <div className={`connection-test-result ${serverTestResult.success ? 'success' : 'error'}`}>
+                    {serverTestResult.message}
+                    {serverTestResult.success && serverTestResult.tools && (
+                      <div className="available-tools">
+                        <p>Available tools: {serverTestResult.tools.length}</p>
+                        <ul>
+                          {serverTestResult.tools.map((tool, index) => (
+                            <li key={index}>{tool.name} - {tool.description}</li>
+                          ))}
+                        </ul>
+                      </div>
+                    )}
+                  </div>
+                )}
               </div>
 
               <div className="setting-item">
@@ -347,6 +639,7 @@ function Settings({
                     authToken: e.target.value
                   })}
                   placeholder="Enter authentication token (if required)"
+                  disabled={editingMcpServer.isBuiltIn}
                 />
               </div>
 
@@ -360,9 +653,38 @@ function Settings({
                   })}
                   placeholder="Enter server description"
                   rows="3"
+                  disabled={editingMcpServer.isBuiltIn}
                 />
               </div>
 
+              {editingMcpServer.isBuiltIn && (
+                <div className="built-in-server-controls">
+                  <p className="built-in-server-note">
+                    This is a built-in MCP server managed by the application.
+                    {editingMcpServer.isRunning
+                      ? ' It is currently running.'
+                      : ' It is currently stopped.'}
+                  </p>
+                  {editingMcpServer.isRunning ? (
+                    <button
+                      type="button"
+                      className="server-control-button stop"
+                      onClick={() => stopBuiltInServer(editingMcpServer.builtInId)}
+                    >
+                      Stop Server
+                    </button>
+                  ) : (
+                    <button
+                      type="button"
+                      className="server-control-button start"
+                      onClick={() => startBuiltInServer(editingMcpServer.builtInId)}
+                    >
+                      Start Server
+                    </button>
+                  )}
+                </div>
+              )}
+
               <div className="setting-hint">
                 <button
                   type="button"

src/hooks/useLocalStorage.js

@@ -1,6 +1,7 @@
 import { useState, useEffect } from 'react';
 
-function useLocalStorage(key, initialValue) {
+function useLocalStorage(key, initialValue, options = {}) {
+  const { disableCache = false } = options;
   // 获取初始值
   const [storedValue, setStoredValue] = useState(() => {
     try {
@@ -14,14 +15,16 @@ function useLocalStorage(key, initialValue) {
 
   // 监听值的变化并更新到 localStorage
   useEffect(() => {
-    try {
-      window.localStorage.setItem(key, JSON.stringify(storedValue));
-    } catch (error) {
-      console.error(error);
+    if (!disableCache) {
+      try {
+        window.localStorage.setItem(key, JSON.stringify(storedValue));
+      } catch (error) {
+        console.error(error);
+      }
     }
-  }, [key, storedValue]);
+  }, [key, storedValue, disableCache]);
 
   return [storedValue, setStoredValue];
 }
 
-export default useLocalStorage; 
+export default useLocalStorage;

src/index.css

@@ -1,5 +1,6 @@
 /* Import MCP styles */
 @import './styles/mcp.css';
+@import './styles/mcp-settings.css';
 
 @tailwind base;
 @tailwind components;

src/styles/mcp-settings.css

@@ -0,0 +1,248 @@
+/* MCP 服务器管理样式 */
+
+/* 内置服务器部分 */
+.built-in-servers-section {
+  margin-bottom: 20px;
+}
+
+.built-in-servers-section h4 {
+  font-size: 14px;
+  font-weight: 600;
+  margin-bottom: 10px;
+  color: var(--text-color);
+}
+
+.built-in-servers-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  margin-bottom: 15px;
+}
+
+.built-in-server-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 12px;
+  background-color: #f9f9f9;
+  border: 1px solid #e0e0e0;
+  border-radius: 4px;
+}
+
+.server-info {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.server-name {
+  font-weight: 500;
+  font-size: 14px;
+}
+
+.server-status {
+  font-size: 12px;
+  padding: 2px 6px;
+  border-radius: 10px;
+  display: inline-block;
+  width: fit-content;
+}
+
+.server-status.running {
+  background-color: #e6f7e6;
+  color: #2e7d32;
+}
+
+.server-status.stopped {
+  background-color: #f5f5f5;
+  color: #757575;
+}
+
+.server-actions {
+  display: flex;
+  gap: 8px;
+}
+
+.server-action-button {
+  padding: 4px 10px;
+  font-size: 12px;
+  border-radius: 4px;
+  border: 1px solid #e0e0e0;
+  background-color: white;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.server-action-button:hover {
+  background-color: #f0f0f0;
+}
+
+.server-action-button.start {
+  border-color: #4caf50;
+  color: #2e7d32;
+}
+
+.server-action-button.start:hover {
+  background-color: #e8f5e9;
+}
+
+.server-action-button.stop {
+  border-color: #f44336;
+  color: #d32f2f;
+}
+
+.server-action-button.stop:hover {
+  background-color: #ffebee;
+}
+
+.server-action-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+/* 用户服务器列表 */
+.profiles-list h4 {
+  font-size: 14px;
+  font-weight: 600;
+  margin-bottom: 10px;
+  color: var(--text-color);
+}
+
+.profile-item.running {
+  border-left: 3px solid #4caf50;
+}
+
+.server-badge {
+  font-size: 11px;
+  padding: 2px 6px;
+  border-radius: 10px;
+  margin-left: 8px;
+}
+
+.server-badge.running {
+  background-color: #e6f7e6;
+  color: #2e7d32;
+}
+
+.server-badge.stopped {
+  background-color: #f5f5f5;
+  color: #757575;
+}
+
+/* 连接测试 */
+.input-with-button {
+  display: flex;
+  gap: 8px;
+}
+
+.input-with-button input {
+  flex: 1;
+}
+
+.test-connection-button {
+  padding: 6px 12px;
+  font-size: 12px;
+  border-radius: 4px;
+  border: 1px solid #e0e0e0;
+  background-color: white;
+  cursor: pointer;
+  white-space: nowrap;
+}
+
+.test-connection-button:hover {
+  background-color: #f0f0f0;
+}
+
+.test-connection-button:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.connection-test-result {
+  margin-top: 8px;
+  padding: 8px 12px;
+  border-radius: 4px;
+  font-size: 13px;
+}
+
+.connection-test-result.success {
+  background-color: #e8f5e9;
+  color: #2e7d32;
+  border: 1px solid #c8e6c9;
+}
+
+.connection-test-result.error {
+  background-color: #ffebee;
+  color: #c62828;
+  border: 1px solid #ffcdd2;
+}
+
+.available-tools {
+  margin-top: 8px;
+}
+
+.available-tools p {
+  font-weight: 500;
+  margin-bottom: 4px;
+}
+
+.available-tools ul {
+  margin-left: 20px;
+  font-size: 12px;
+}
+
+.available-tools li {
+  margin-bottom: 2px;
+}
+
+/* 内置服务器控制 */
+.built-in-server-controls {
+  margin-top: 15px;
+  padding: 12px;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+  border: 1px solid #e0e0e0;
+}
+
+.built-in-server-note {
+  font-size: 13px;
+  color: #555;
+  margin-bottom: 10px;
+}
+
+.server-control-button {
+  padding: 6px 12px;
+  font-size: 13px;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.server-control-button.start {
+  background-color: #4caf50;
+  color: white;
+  border: none;
+}
+
+.server-control-button.start:hover {
+  background-color: #388e3c;
+}
+
+.server-control-button.stop {
+  background-color: #f44336;
+  color: white;
+  border: none;
+}
+
+.server-control-button.stop:hover {
+  background-color: #d32f2f;
+}
+
+/* 加载指示器 */
+.loading-indicator {
+  padding: 10px;
+  text-align: center;
+  color: #757575;
+  font-style: italic;
+  font-size: 13px;
+}

vite.config.js

@@ -2,6 +2,8 @@ import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 
 export default defineConfig({
+  // 启用详细日志
+  logLevel: 'info',
   plugins: [react()],
   server: {
     proxy: {
@@ -15,7 +17,18 @@ export default defineConfig({
       },
       '/api': {
         target: 'http://localhost:7860',
-        changeOrigin: true
+        changeOrigin: true,
+        configure: (proxy, options) => {
+          proxy.on('error', (err, req, res) => {
+            console.log('proxy error', err);
+          });
+          proxy.on('proxyReq', (proxyReq, req, res) => {
+            console.log('Sending Request to the Target:', req.method, req.url);
+          });
+          proxy.on('proxyRes', (proxyRes, req, res) => {
+            console.log('Received Response from the Target:', proxyRes.statusCode, req.url);
+          });
+        }
       }
     }
   }