From efd623cde899541909b5ee14dcbb2dd05f5403bc Mon Sep 17 00:00:00 2001
From: Anna Effort <anna.effort@ibm.com>
Date: Fri, 14 Aug 2026 16:35:40 -0700
Subject: [PATCH] fix: align MCP server table with light theme and localize its
 copy
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The MCP servers table painted rows bg-neutral-50, which is the same
oklch(0.985) as the bg-main page beneath it, so in light mode the rows
had no visible surface at all. Match the treatment Users/Teams/Tokens
already use — white rows on the off-white page, bg-main header — and
swap the hardcoded neutrals for semantic tokens so both themes follow
the palette. Status colors gain light-mode pairs; emerald-400 and
amber-400 are tuned for a dark row and fall under 3:1 on white.

ServersTable was also the only one of the four tables with hardcoded
English. Localize it along with the rest of the MCP servers surface —
the page chrome, the connect/edit form, AdvancedSettings, and the six
auth components — adding mcpServer.* keys across en-US, es-ES and pt-BR.
Three messages needed rich text (the catalog link, the security
checklist link, the bolded security warning) so translations can move
the embedded element within the sentence.

Also align "View Details" to "View details" in the tools and resources
namespaces, which were the last two spellings out of step.

locales.test.ts checked key parity but not whether messages parse or
whether translations keep the same placeholders and tags. A translation
that drops {count} or renames a rich-text tag passes CI and then throws
or silently drops content at render time, so add both checks.

Signed-off-by: Anna Effort <anna.effort@ibm.com>
---
 e2e/resources.spec.ts                         |  24 ++--
 e2e/servers.spec.ts                           |  12 +-
 e2e/tools.spec.ts                             |  32 ++---
 .../mcp-servers/AdvancedSettings.tsx          |  42 +++---
 .../mcp-servers/AuthComponents.test.tsx       |   3 +-
 src/components/mcp-servers/BasicAuth.tsx      |  17 ++-
 .../mcp-servers/BearerTokenAuth.tsx           |   9 +-
 .../mcp-servers/CACertificateUpload.test.tsx  |   2 +-
 .../mcp-servers/CACertificateUpload.tsx       |  25 +++-
 .../mcp-servers/CustomHeadersAuth.test.tsx    |   3 +-
 .../mcp-servers/CustomHeadersAuth.tsx         |  41 ++++--
 src/components/mcp-servers/MCPServerForm.tsx  |  95 +++++++------
 src/components/mcp-servers/NoneAuth.tsx       |  30 ++--
 .../mcp-servers/OAuth2Auth.test.tsx           |   3 +-
 src/components/mcp-servers/OAuth2Auth.tsx     | 102 ++++++++------
 .../mcp-servers/QueryParameterAuth.tsx        |  27 ++--
 .../servers/ServerActionsMenu.test.tsx        |   2 +-
 src/components/servers/ServerActionsMenu.tsx  |  24 +++-
 src/components/servers/ServersTable.tsx       |  91 +++++++-----
 src/i18n/locales.test.ts                      |  82 +++++++++++
 src/i18n/locales/en-US/mcpServer.json         | 133 +++++++++++++++++-
 src/i18n/locales/en-US/resources.json         |   2 +-
 src/i18n/locales/en-US/tools.json             |   2 +-
 src/i18n/locales/es-ES/mcpServer.json         | 133 +++++++++++++++++-
 src/i18n/locales/pt-BR/mcpServer.json         | 133 +++++++++++++++++-
 src/pages/Resources.test.tsx                  |  30 ++--
 src/pages/Servers.test.tsx                    |   2 +-
 src/pages/Servers.tsx                         |  51 ++++---
 src/pages/Tools.test.tsx                      |  42 +++---
 29 files changed, 896 insertions(+), 298 deletions(-)

diff --git a/e2e/resources.spec.ts b/e2e/resources.spec.ts
index 4470dcd..44dc004 100644
--- a/e2e/resources.spec.ts
+++ b/e2e/resources.spec.ts
@@ -156,7 +156,7 @@ test.describe("Resources page", () => {
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
 
-    await expect(page.getByRole("menuitem", { name: "View Details" })).toBeVisible();
+    await expect(page.getByRole("menuitem", { name: "View details" })).toBeVisible();
   });
 
   test("truncates a long gateway name and keeps the overflow menu visible", async ({ page }) => {
@@ -197,7 +197,7 @@ test.describe("Resources page", () => {
     expect(kebabBox!.x + kebabBox!.width).toBeLessThanOrEqual(cardBox!.x + cardBox!.width + 1);
 
     await kebab.click();
-    await expect(page.getByRole("menuitem", { name: "View Details" })).toBeVisible();
+    await expect(page.getByRole("menuitem", { name: "View details" })).toBeVisible();
   });
 
   test("opens details panel when View Details is clicked", async ({ page }) => {
@@ -213,7 +213,7 @@ test.describe("Resources page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Resources for github-server/i });
     await expect(panel).toBeVisible();
@@ -235,7 +235,7 @@ test.describe("Resources page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Resources for github-server/i });
     await expect(panel).toBeVisible();
@@ -259,7 +259,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for github-server" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for github-server/i });
       await panel.getByRole("button", { name: "More options" }).first().click();
@@ -302,7 +302,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for github-server" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for github-server/i });
       await expect(panel).toBeVisible();
@@ -350,7 +350,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for github-server" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for github-server/i });
       await expect(panel).toBeVisible();
@@ -394,7 +394,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for solo-gateway" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for solo-gateway/i });
       await expect(panel).toBeVisible();
@@ -441,7 +441,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for multi-gw" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for multi-gw/i });
       await expect(panel).toBeVisible();
@@ -491,7 +491,7 @@ test.describe("Resources page", () => {
       await expect(page.getByText("github-server")).toBeVisible();
 
       await page.getByRole("button", { name: "More options for lone-gateway" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for lone-gateway/i });
       await expect(panel).toBeVisible();
@@ -546,7 +546,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for github-server" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for github-server/i });
       await expect(panel).toBeVisible();
@@ -602,7 +602,7 @@ test.describe("Resources page", () => {
       await page.waitForLoadState("networkidle");
 
       await page.getByRole("button", { name: "More options for github-server" }).click();
-      await page.getByRole("menuitem", { name: "View Details" }).click();
+      await page.getByRole("menuitem", { name: "View details" }).click();
 
       const panel = page.getByRole("region", { name: /Resources for github-server/i });
       await panel.getByRole("button", { name: "More options" }).first().click();
diff --git a/e2e/servers.spec.ts b/e2e/servers.spec.ts
index 94485e9..d9576c9 100644
--- a/e2e/servers.spec.ts
+++ b/e2e/servers.spec.ts
@@ -173,7 +173,7 @@ test.describe("MCP Servers page", () => {
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
 
-    await expect(page.getByRole("menuitem", { name: "View Details" })).toBeVisible();
+    await expect(page.getByRole("menuitem", { name: "View details" })).toBeVisible();
     await expect(page.getByRole("menuitem", { name: "Edit" })).toBeVisible();
     await expect(page.getByRole("menuitem", { name: "Deactivate" })).toBeVisible();
     await expect(page.getByRole("menuitem", { name: "Delete" })).toBeVisible();
@@ -336,7 +336,7 @@ test.describe("MCP Servers page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
     await expect(page.getByRole("heading", { name: "GitHub MCP Server" })).toBeVisible();
     await page.keyboard.press("Escape"); // drawer is a full-height overlay; must close it before clicking table row actions
     await expect(page.getByRole("button", { name: /close mcp server details/i })).not.toBeVisible();
@@ -402,7 +402,7 @@ test.describe("MCP Servers page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
     await expect(page.getByRole("heading", { name: "GitHub MCP Server" })).toBeVisible();
     await page.keyboard.press("Escape"); // drawer is a full-height overlay; must close it before clicking table row actions
     await expect(page.getByRole("button", { name: /close mcp server details/i })).not.toBeVisible();
@@ -469,7 +469,7 @@ test.describe("MCP Servers page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
     await expect(page.getByRole("heading", { name: "GitHub MCP Server" })).toBeVisible();
     await page.keyboard.press("Escape"); // drawer is a full-height overlay; must close it before clicking table row actions
     await expect(page.getByRole("button", { name: /close mcp server details/i })).not.toBeVisible();
@@ -484,7 +484,7 @@ test.describe("MCP Servers page", () => {
     await expect(page.getByRole("row").filter({ hasText: "Slack MCP Server" })).not.toBeVisible();
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
     await expect(page.getByRole("heading", { name: "GitHub MCP Server" })).toBeVisible();
   });
 
@@ -531,7 +531,7 @@ test.describe("MCP Servers page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "Actions for GitHub MCP Server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     // Wait for the details panel to open (heading "GitHub MCP Server" appears in the panel header)
     await expect(page.getByRole("heading", { name: "GitHub MCP Server" })).toBeVisible();
diff --git a/e2e/tools.spec.ts b/e2e/tools.spec.ts
index 518ea7f..6fc4422 100644
--- a/e2e/tools.spec.ts
+++ b/e2e/tools.spec.ts
@@ -225,7 +225,7 @@ test.describe("Tools page", () => {
 
     // And it remains functional.
     await kebab.click();
-    await expect(page.getByRole("menuitem", { name: "View Details" })).toBeVisible();
+    await expect(page.getByRole("menuitem", { name: "View details" })).toBeVisible();
   });
 
   test("opens more options dropdown and shows View Details item", async ({ page }) => {
@@ -242,7 +242,7 @@ test.describe("Tools page", () => {
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
 
-    await expect(page.getByRole("menuitem", { name: "View Details" })).toBeVisible();
+    await expect(page.getByRole("menuitem", { name: "View details" })).toBeVisible();
   });
 
   test("opens details panel when View Details is clicked", async ({ page }) => {
@@ -258,7 +258,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for github-server/i });
     await expect(panel).toBeVisible();
@@ -280,7 +280,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for github-server/i });
     await expect(panel).toBeVisible();
@@ -315,7 +315,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for github-server/i });
     await expect(panel).toBeVisible();
@@ -366,7 +366,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for github-server/i });
     await expect(panel).toBeVisible();
@@ -399,7 +399,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for github-server" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for github-server/i });
     await panel.getByRole("button", { name: "More options" }).first().click();
@@ -438,7 +438,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for solo-gateway" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for solo-gateway/i });
     await expect(panel).toBeVisible();
@@ -485,7 +485,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for multi-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for multi-gw/i });
     await expect(panel).toBeVisible();
@@ -535,7 +535,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for rb-gateway" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for rb-gateway/i });
     await expect(panel).toBeVisible();
@@ -583,7 +583,7 @@ test.describe("Tools page", () => {
     await expect(page.getByText("github-server")).toBeVisible();
 
     await page.getByRole("button", { name: "More options for lone-gateway" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for lone-gateway/i });
     await expect(panel).toBeVisible();
@@ -845,7 +845,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for edit-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for edit-gw/i });
     await expect(panel).toBeVisible();
@@ -885,7 +885,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for schema-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for schema-gw/i });
     await expect(panel).toBeVisible();
@@ -936,7 +936,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for toggle-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for toggle-gw/i });
     await expect(panel).toBeVisible();
@@ -985,7 +985,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for activate-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for activate-gw/i });
     await expect(panel).toBeVisible();
@@ -1034,7 +1034,7 @@ test.describe("Tools page", () => {
     await page.waitForLoadState("networkidle");
 
     await page.getByRole("button", { name: "More options for fail-gw" }).click();
-    await page.getByRole("menuitem", { name: "View Details" }).click();
+    await page.getByRole("menuitem", { name: "View details" }).click();
 
     const panel = page.getByRole("region", { name: /Tools for fail-gw/i });
     await expect(panel).toBeVisible();
diff --git a/src/components/mcp-servers/AdvancedSettings.tsx b/src/components/mcp-servers/AdvancedSettings.tsx
index bd53ec3..dc544f5 100644
--- a/src/components/mcp-servers/AdvancedSettings.tsx
+++ b/src/components/mcp-servers/AdvancedSettings.tsx
@@ -220,7 +220,9 @@ export function AdvancedSettings({
             id="visibility"
             className="h-10 w-full border-neutral-300 dark:border-neutral-700"
           >
-            <SelectValue placeholder="Select visibility" />
+            <SelectValue
+              placeholder={intl.formatMessage({ id: "mcpServer.advanced.visibilityPlaceholder" })}
+            />
           </SelectTrigger>
           <SelectContent>
             <SelectItem value="public">
@@ -236,9 +238,11 @@ export function AdvancedSettings({
         </Select>
         {visibility === "team" && (
           <p className="text-sm text-neutral-600 dark:text-neutral-400">
-            {selectedTeamId
-              ? "This server will be scoped to your currently selected team"
-              : "Please select a team using the team switcher in the sidebar"}
+            {intl.formatMessage({
+              id: selectedTeamId
+                ? "mcpServer.advanced.teamScoped"
+                : "mcpServer.advanced.teamNotSelected",
+            })}
           </p>
         )}
       </div>
@@ -246,26 +250,15 @@ export function AdvancedSettings({
       {/* Authentication type */}
       <div className="space-y-3">
         <label className="text-sm font-medium text-neutral-950 dark:text-white">
-          Authentication type
+          {intl.formatMessage({ id: "mcpServer.advanced.authTypeLabel" })}
         </label>
         <div
           role="radiogroup"
-          aria-label="Authentication type"
+          aria-label={intl.formatMessage({ id: "mcpServer.advanced.authTypeLabel" })}
           className="flex w-full flex-nowrap gap-1 rounded-md bg-neutral-100 p-1 dark:bg-neutral-800"
         >
           {(["none", "basic", "bearer", "custom", "oauth", "query"] as AuthType[]).map((type) => {
-            const label =
-              type === "none"
-                ? "None"
-                : type === "basic"
-                  ? "Basic"
-                  : type === "bearer"
-                    ? "Bearer token"
-                    : type === "custom"
-                      ? "Custom headers"
-                      : type === "oauth"
-                        ? "OAuth 2.0"
-                        : "Query parameter";
+            const label = intl.formatMessage({ id: `mcpServer.advanced.authType.${type}` });
             const isLongerLabel = type === "custom" || type === "query";
             return (
               <div key={type} className={isLongerLabel ? "flex-[1.3] min-w-0" : "flex-1 min-w-0"}>
@@ -300,7 +293,7 @@ export function AdvancedSettings({
             htmlFor="one-time-auth"
             className="text-sm font-medium text-neutral-950 dark:text-white"
           >
-            One-time authentication
+            {intl.formatMessage({ id: "mcpServer.advanced.oneTimeAuthLabel" })}
           </label>
           <Info className="h-4 w-4 text-neutral-400 dark:text-neutral-500" />
         </div>
@@ -309,14 +302,14 @@ export function AdvancedSettings({
           <p
             className={`text-sm ${oneTimeAuth ? "text-neutral-900 dark:text-neutral-100" : "text-neutral-600 dark:text-neutral-400"}`}
           >
-            {"Use credentials once, don't store them. Health checks will be disabled."}
+            {intl.formatMessage({ id: "mcpServer.advanced.oneTimeAuthDescription" })}
           </p>
         </div>
         {oneTimeAuth && (
           <div className="mt-3 flex items-start gap-3 rounded-md bg-neutral-50 p-3 dark:bg-neutral-800">
             <TriangleAlert className="text-yellow-300 mt-0.5 h-4 w-4 shrink-0" />
             <p className="text-sm text-neutral-600 dark:text-neutral-400">
-              Add passthrough headers when one-time authentication is enabled.
+              {intl.formatMessage({ id: "mcpServer.advanced.oneTimeAuthWarning" })}
             </p>
           </div>
         )}
@@ -328,17 +321,16 @@ export function AdvancedSettings({
           htmlFor="passthrough-headers"
           className="text-sm font-medium text-neutral-950 dark:text-white"
         >
-          Passthrough headers
+          {intl.formatMessage({ id: "mcpServer.advanced.passthroughLabel" })}
         </label>
         <p className="text-sm text-neutral-600 dark:text-neutral-400">
-          Add comma-separate headers to forward from client requests. Leave empty to use global
-          defaults.
+          {intl.formatMessage({ id: "mcpServer.advanced.passthroughDescription" })}
         </p>
         <Textarea
           id="passthrough-headers"
           value={passthroughHeaders}
           onChange={(e) => onPassthroughHeadersChange(e.target.value)}
-          placeholder="e.g. Authorization, X-Tenant-Id, X-Trace-Id..."
+          placeholder={intl.formatMessage({ id: "mcpServer.advanced.passthroughPlaceholder" })}
           className="min-h-20 focus-visible:ring-1 focus-visible:ring-offset-0"
         />
       </div>
diff --git a/src/components/mcp-servers/AuthComponents.test.tsx b/src/components/mcp-servers/AuthComponents.test.tsx
index 015575f..ae91621 100644
--- a/src/components/mcp-servers/AuthComponents.test.tsx
+++ b/src/components/mcp-servers/AuthComponents.test.tsx
@@ -1,4 +1,5 @@
-import { render, screen, fireEvent } from "@testing-library/react";
+import { screen, fireEvent } from "@testing-library/react";
+import { renderWithProviders as render } from "@/test/test-utils";
 import { describe, expect, it, vi } from "vitest";
 
 import { NoneAuth } from "./NoneAuth";
diff --git a/src/components/mcp-servers/BasicAuth.tsx b/src/components/mcp-servers/BasicAuth.tsx
index 198a862..083fd0c 100644
--- a/src/components/mcp-servers/BasicAuth.tsx
+++ b/src/components/mcp-servers/BasicAuth.tsx
@@ -1,3 +1,4 @@
+import { useIntl } from "react-intl";
 import { Input } from "@/components/ui/input";
 
 interface BasicAuthProps {
@@ -13,6 +14,8 @@ export function BasicAuth({
   onUsernameChange,
   onPasswordChange,
 }: BasicAuthProps) {
+  const intl = useIntl();
+
   return (
     <div className="space-y-4">
       <div className="space-y-1">
@@ -20,15 +23,16 @@ export function BasicAuth({
           htmlFor="basic-auth-username"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Username<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.basic.usernameLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="basic-auth-username"
           type="text"
           value={username}
           onChange={(e) => onUsernameChange(e.target.value)}
-          placeholder="Add username for basic authentication..."
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.basic.usernamePlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
       </div>
@@ -38,15 +42,16 @@ export function BasicAuth({
           htmlFor="basic-auth-password"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Password<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.basic.passwordLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="basic-auth-password"
           type="password"
           value={password}
           onChange={(e) => onPasswordChange(e.target.value)}
-          placeholder="Add password..."
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.basic.passwordPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
       </div>
diff --git a/src/components/mcp-servers/BearerTokenAuth.tsx b/src/components/mcp-servers/BearerTokenAuth.tsx
index 1ff6ca4..28d9224 100644
--- a/src/components/mcp-servers/BearerTokenAuth.tsx
+++ b/src/components/mcp-servers/BearerTokenAuth.tsx
@@ -1,3 +1,4 @@
+import { useIntl } from "react-intl";
 import { Input } from "@/components/ui/input";
 
 interface BearerTokenAuthProps {
@@ -6,6 +7,8 @@ interface BearerTokenAuthProps {
 }
 
 export function BearerTokenAuth({ token, onTokenChange }: BearerTokenAuthProps) {
+  const intl = useIntl();
+
   return (
     <div className="space-y-4">
       <div className="space-y-1">
@@ -13,10 +16,10 @@ export function BearerTokenAuth({ token, onTokenChange }: BearerTokenAuthProps)
           htmlFor="bearer-token"
           className="text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Bearer token
+          {intl.formatMessage({ id: "mcpServer.auth.bearer.label" })}
         </label>
         <p className="text-sm text-neutral-600 dark:text-neutral-400">
-          Add the API key or token issued by the server.
+          {intl.formatMessage({ id: "mcpServer.auth.bearer.description" })}
         </p>
       </div>
 
@@ -25,7 +28,7 @@ export function BearerTokenAuth({ token, onTokenChange }: BearerTokenAuthProps)
         type="password"
         value={token}
         onChange={(e) => onTokenChange(e.target.value)}
-        placeholder="Paste bearer token..."
+        placeholder={intl.formatMessage({ id: "mcpServer.auth.bearer.placeholder" })}
         className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
       />
     </div>
diff --git a/src/components/mcp-servers/CACertificateUpload.test.tsx b/src/components/mcp-servers/CACertificateUpload.test.tsx
index 5a683f3..bf2739d 100644
--- a/src/components/mcp-servers/CACertificateUpload.test.tsx
+++ b/src/components/mcp-servers/CACertificateUpload.test.tsx
@@ -56,7 +56,7 @@ describe("CACertificateUpload", () => {
 
     await userEvent.upload(input, file);
 
-    expect(screen.getByText(/1 file\(s\) selected successfully\./)).toBeInTheDocument();
+    expect(screen.getByText(/1 file selected successfully\./)).toBeInTheDocument();
     expect(screen.getByText(/certificate.pem/)).toBeInTheDocument();
     expect(onFilesSelected).toHaveBeenCalledWith([file]);
   });
diff --git a/src/components/mcp-servers/CACertificateUpload.tsx b/src/components/mcp-servers/CACertificateUpload.tsx
index 68f3d3f..d43d583 100644
--- a/src/components/mcp-servers/CACertificateUpload.tsx
+++ b/src/components/mcp-servers/CACertificateUpload.tsx
@@ -1,5 +1,6 @@
 import { useState, useRef, type DragEvent, type ChangeEvent } from "react";
 import { Upload } from "lucide-react";
+import { useIntl } from "react-intl";
 import { Button } from "@/components/ui/button";
 
 interface CACertificateUploadProps {
@@ -7,6 +8,7 @@ interface CACertificateUploadProps {
 }
 
 export function CACertificateUpload({ onFilesSelected }: CACertificateUploadProps) {
+  const intl = useIntl();
   const [isDragging, setIsDragging] = useState(false);
   const [selectedFiles, setSelectedFiles] = useState<File[]>([]);
   const [feedback, setFeedback] = useState<{ type: "error" | "success"; message: string } | null>(
@@ -40,12 +42,18 @@ export function CACertificateUpload({ onFilesSelected }: CACertificateUploadProp
     if (invalidFiles.length > 0) {
       setFeedback({
         type: "error",
-        message: `Invalid file type(s): ${invalidFiles.join(", ")}. Only .pem, .crt, .cer, .cert files are allowed.`,
+        message: intl.formatMessage(
+          { id: "mcpServer.caCert.invalidFiles" },
+          { count: invalidFiles.length, files: invalidFiles.join(", ") },
+        ),
       });
     } else if (validFiles.length > 0) {
       setFeedback({
         type: "success",
-        message: `${validFiles.length} file(s) selected successfully.`,
+        message: intl.formatMessage(
+          { id: "mcpServer.caCert.filesSelected" },
+          { count: validFiles.length },
+        ),
       });
     } else {
       setFeedback(null);
@@ -104,7 +112,9 @@ export function CACertificateUpload({ onFilesSelected }: CACertificateUploadProp
 
   return (
     <div className="space-y-2">
-      <label className="text-sm font-medium text-neutral-950 dark:text-white">CA certificate</label>
+      <label className="text-sm font-medium text-neutral-950 dark:text-white">
+        {intl.formatMessage({ id: "mcpServer.caCert.label" })}
+      </label>
 
       <input
         ref={fileInputRef}
@@ -133,10 +143,10 @@ export function CACertificateUpload({ onFilesSelected }: CACertificateUploadProp
           className="h-7 gap-2 border border-neutral-700 bg-neutral-800 text-white hover:bg-neutral-700 dark:border-neutral-800 dark:bg-neutral-950 dark:hover:bg-neutral-800"
         >
           <Upload className="h-3 w-3" />
-          Upload
+          {intl.formatMessage({ id: "mcpServer.caCert.upload" })}
         </Button>
         <p className="pt-1 text-xs text-neutral-500 dark:text-neutral-400">
-          Public certificate files only (.pem, .crt, .cer, .cert)
+          {intl.formatMessage({ id: "mcpServer.caCert.hint" })}
         </p>
       </div>
 
@@ -154,7 +164,10 @@ export function CACertificateUpload({ onFilesSelected }: CACertificateUploadProp
 
       {selectedFiles.length > 0 && (
         <div className="text-xs text-neutral-600 dark:text-neutral-400">
-          Selected: {selectedFiles.map((f) => f.name).join(", ")}
+          {intl.formatMessage(
+            { id: "mcpServer.caCert.selected" },
+            { files: selectedFiles.map((f) => f.name).join(", ") },
+          )}
         </div>
       )}
     </div>
diff --git a/src/components/mcp-servers/CustomHeadersAuth.test.tsx b/src/components/mcp-servers/CustomHeadersAuth.test.tsx
index a6ac547..9172c81 100644
--- a/src/components/mcp-servers/CustomHeadersAuth.test.tsx
+++ b/src/components/mcp-servers/CustomHeadersAuth.test.tsx
@@ -1,5 +1,6 @@
 import { describe, it, expect, vi } from "vitest";
-import { render, screen, fireEvent } from "@testing-library/react";
+import { screen, fireEvent } from "@testing-library/react";
+import { renderWithProviders as render } from "@/test/test-utils";
 import { CustomHeadersAuth, type CustomHeader } from "./CustomHeadersAuth";
 
 const makeHeader = (overrides: Partial<CustomHeader> = {}): CustomHeader => ({
diff --git a/src/components/mcp-servers/CustomHeadersAuth.tsx b/src/components/mcp-servers/CustomHeadersAuth.tsx
index 57ddd40..4d3f7f1 100644
--- a/src/components/mcp-servers/CustomHeadersAuth.tsx
+++ b/src/components/mcp-servers/CustomHeadersAuth.tsx
@@ -1,4 +1,5 @@
 import { Plus, Trash2 } from "lucide-react";
+import { useIntl } from "react-intl";
 import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
 
@@ -19,6 +20,8 @@ export function CustomHeadersAuth({
   onHeadersChange,
   maxHeaders,
 }: CustomHeadersAuthProps) {
+  const intl = useIntl();
+
   const addHeader = () => {
     onHeadersChange([...headers, { id: crypto.randomUUID(), key: "", value: "" }]);
   };
@@ -38,9 +41,12 @@ export function CustomHeadersAuth({
   return (
     <div className="space-y-4">
       <p className="text-sm text-neutral-600 dark:text-neutral-400">
-        {maxHeaders === 1
-          ? "Send one custom header with every request."
-          : "Send one or more custom headers with every request."}
+        {intl.formatMessage({
+          id:
+            maxHeaders === 1
+              ? "mcpServer.auth.custom.descriptionOne"
+              : "mcpServer.auth.custom.descriptionMany",
+        })}
       </p>
 
       <div className="space-y-3">
@@ -51,17 +57,23 @@ export function CustomHeadersAuth({
                 htmlFor={`header-key-${index}`}
                 className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
               >
-                Header key<span className="text-red-500">*</span>
-                <span className="sr-only">(required)</span>
+                {intl.formatMessage({ id: "mcpServer.auth.custom.keyLabel" })}
+                <span className="text-red-500">*</span>
+                <span className="sr-only">
+                  {intl.formatMessage({ id: "mcpServer.form.required" })}
+                </span>
               </label>
               <Input
                 id={`header-key-${index}`}
                 type="text"
                 value={header.key}
                 onChange={(e) => updateHeader(index, "key", e.target.value)}
-                placeholder={
-                  index === 0 && headers.length === 1 ? "e.g. X-API-Key..." : "Add header key..."
-                }
+                placeholder={intl.formatMessage({
+                  id:
+                    index === 0 && headers.length === 1
+                      ? "mcpServer.auth.custom.keyPlaceholderExample"
+                      : "mcpServer.auth.custom.keyPlaceholder",
+                })}
                 className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
               />
             </div>
@@ -71,15 +83,18 @@ export function CustomHeadersAuth({
                 htmlFor={`header-value-${index}`}
                 className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
               >
-                Value<span className="text-red-500">*</span>
-                <span className="sr-only">(required)</span>
+                {intl.formatMessage({ id: "mcpServer.auth.custom.valueLabel" })}
+                <span className="text-red-500">*</span>
+                <span className="sr-only">
+                  {intl.formatMessage({ id: "mcpServer.form.required" })}
+                </span>
               </label>
               <Input
                 id={`header-value-${index}`}
                 type="password"
                 value={header.value}
                 onChange={(e) => updateHeader(index, "value", e.target.value)}
-                placeholder={"Add header value..."}
+                placeholder={intl.formatMessage({ id: "mcpServer.auth.custom.valuePlaceholder" })}
                 className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
               />
             </div>
@@ -92,7 +107,7 @@ export function CustomHeadersAuth({
               className="h-10 gap-2 text-red-600 hover:bg-red-50 hover:text-red-700 dark:text-red-400 dark:hover:bg-red-950/50 dark:hover:text-red-300"
             >
               <Trash2 className="h-4 w-4" />
-              Remove
+              {intl.formatMessage({ id: "common.button.remove" })}
             </Button>
           </div>
         ))}
@@ -107,7 +122,7 @@ export function CustomHeadersAuth({
         className="gap-1.5 border-neutral-200 dark:border-neutral-600"
       >
         <Plus className="h-3.5 w-3.5" />
-        Add header
+        {intl.formatMessage({ id: "mcpServer.auth.custom.addHeader" })}
       </Button>
     </div>
   );
diff --git a/src/components/mcp-servers/MCPServerForm.tsx b/src/components/mcp-servers/MCPServerForm.tsx
index 9d63516..a4141a5 100644
--- a/src/components/mcp-servers/MCPServerForm.tsx
+++ b/src/components/mcp-servers/MCPServerForm.tsx
@@ -1,4 +1,5 @@
-import { useState } from "react";
+import { useState, type ReactNode } from "react";
+import { useIntl } from "react-intl";
 import { ChevronDown, CircleAlert } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { InlineNotification } from "@/components/ui/inline-notification";
@@ -23,6 +24,7 @@ interface CreatedGatewayInfo {
 }
 
 export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServerFormProps) {
+  const intl = useIntl();
   const { navigate } = useRouter();
   const [createdGateway, setCreatedGateway] = useState<CreatedGatewayInfo | null>(null);
   const {
@@ -154,33 +156,38 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                 <MCPIcon className="h-4 w-4" />
               </div>
               <h2 className="text-lg font-semibold tracking-tight text-neutral-950 dark:text-neutral-50">
-                {serverId ? "Edit MCP server" : "Connect MCP server"}
+                {intl.formatMessage({
+                  id: serverId ? "mcpServer.form.editTitle" : "mcpServer.form.connectTitle",
+                })}
               </h2>
             </div>
 
             <p className="text-sm leading-6 text-neutral-600 dark:text-neutral-400">
-              {
-                "Context Forge will discover the server's tools, resources, and prompts. The MCP server should be running and reachable. Or, choose a server from the"
-              }{" "}
-              <Button
-                type="button"
-                variant="link"
-                onClick={() => {
-                  onToggle();
-                  navigate("/app/server-catalog");
-                }}
-                className="font-medium text-cyan-700 underline decoration-cyan-300 underline-offset-4 transition hover:text-cyan-800 dark:text-cyan-400 dark:decoration-cyan-700 dark:hover:text-cyan-300"
-              >
-                mcp server catalog
-              </Button>
-              .
+              {intl.formatMessage(
+                { id: "mcpServer.form.intro" },
+                {
+                  catalog: (chunks: ReactNode) => (
+                    <Button
+                      type="button"
+                      variant="link"
+                      onClick={() => {
+                        onToggle();
+                        navigate("/app/server-catalog");
+                      }}
+                      className="font-medium text-cyan-700 underline decoration-cyan-300 underline-offset-4 transition hover:text-cyan-800 dark:text-cyan-400 dark:decoration-cyan-700 dark:hover:text-cyan-300"
+                    >
+                      {chunks}
+                    </Button>
+                  ),
+                },
+              )}
             </p>
           </div>
 
           {fetchError && serverId && (
             <div className="rounded-md border border-red-200 bg-red-50 p-3 dark:border-red-900/50 dark:bg-red-950/50">
               <p className="text-sm text-red-600 dark:text-red-400">
-                Failed to load server data: {fetchError}
+                {intl.formatMessage({ id: "mcpServer.form.fetchError" }, { error: fetchError })}
               </p>
             </div>
           )}
@@ -188,11 +195,11 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
           <form className="space-y-6" onSubmit={onSubmit}>
             <div className="space-y-3">
               <label className="text-sm font-medium text-neutral-950 dark:text-white">
-                Server transport type
+                {intl.formatMessage({ id: "mcpServer.form.transportLabel" })}
               </label>
               <div
                 role="radiogroup"
-                aria-label="Server transport type"
+                aria-label={intl.formatMessage({ id: "mcpServer.form.transportLabel" })}
                 className="flex gap-2 rounded-md bg-neutral-100 p-1 dark:bg-neutral-800"
               >
                 {(["STREAMABLEHTTP", "SSE"] as TransportType[]).map((type) => {
@@ -225,14 +232,17 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                 htmlFor="server-name"
                 className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
               >
-                Name<span className="text-red-500">*</span>
-                <span className="sr-only">(required)</span>
+                {intl.formatMessage({ id: "mcpServer.form.nameLabel" })}
+                <span className="text-red-500">*</span>
+                <span className="sr-only">
+                  {intl.formatMessage({ id: "mcpServer.form.required" })}
+                </span>
               </label>
               <Input
                 id="server-name"
                 value={name}
                 onChange={(event) => setName(event.target.value)}
-                placeholder="Add MCP server name..."
+                placeholder={intl.formatMessage({ id: "mcpServer.form.namePlaceholder" })}
                 className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
                 aria-invalid={!!errors.name}
                 aria-describedby={errors.name ? "name-error" : undefined}
@@ -249,15 +259,18 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                 htmlFor="server-url"
                 className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
               >
-                URL<span className="text-red-500">*</span>
-                <span className="sr-only">(required)</span>
+                {intl.formatMessage({ id: "mcpServer.form.urlLabel" })}
+                <span className="text-red-500">*</span>
+                <span className="sr-only">
+                  {intl.formatMessage({ id: "mcpServer.form.required" })}
+                </span>
                 <CircleAlert className="h-4 w-4 text-neutral-400 dark:text-neutral-500" />
               </label>
               <Input
                 id="server-url"
                 value={url}
                 onChange={(event) => setUrl(event.target.value)}
-                placeholder="Add URL for a running MCP server..."
+                placeholder={intl.formatMessage({ id: "mcpServer.form.urlPlaceholder" })}
                 className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
                 aria-invalid={!!errors.url}
                 aria-describedby={errors.url ? "url-error" : undefined}
@@ -271,13 +284,13 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
 
             <div className="space-y-1">
               <label htmlFor="server-description" className="sr-only">
-                Description
+                {intl.formatMessage({ id: "mcpServer.form.descriptionLabel" })}
               </label>
               <Textarea
                 id="server-description"
                 value={description}
                 onChange={(event) => setDescription(event.target.value)}
-                placeholder="Add an optional description..."
+                placeholder={intl.formatMessage({ id: "mcpServer.form.descriptionPlaceholder" })}
                 className="min-h-28 focus-visible:ring-1 focus-visible:ring-offset-0"
                 aria-invalid={!!errors.description}
                 aria-describedby={errors.description ? "description-error" : undefined}
@@ -298,7 +311,7 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                 aria-expanded={advancedOpen}
               >
                 <ChevronDown className={`h-4 w-4 transition ${advancedOpen ? "rotate-180" : ""}`} />
-                Advanced settings
+                {intl.formatMessage({ id: "mcpServer.form.advancedSettings" })}
               </Button>
 
               {advancedOpen && (
@@ -371,7 +384,7 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                   className="rounded-md border border-blue-200 bg-blue-50 p-3 dark:border-blue-900/50 dark:bg-blue-950/50"
                 >
                   <p className="text-sm text-blue-700 dark:text-blue-300">
-                    Waiting for OAuth authorization in the popup window…
+                    {intl.formatMessage({ id: "mcpServer.form.oauthPending" })}
                   </p>
                 </div>
               )}
@@ -381,7 +394,7 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                   type={oauthNotification.type}
                   message={oauthNotification.message}
                   onDismiss={clearOAuthNotification}
-                  dismissLabel="Dismiss OAuth notification"
+                  dismissLabel={intl.formatMessage({ id: "mcpServer.form.dismissOAuth" })}
                 />
               )}
 
@@ -390,7 +403,7 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                   type={fetchToolsNotification.type}
                   message={fetchToolsNotification.message}
                   onDismiss={clearFetchToolsNotification}
-                  dismissLabel="Dismiss fetch tools notification"
+                  dismissLabel={intl.formatMessage({ id: "mcpServer.form.dismissFetchTools" })}
                 />
               )}
 
@@ -401,20 +414,22 @@ export function MCPServerForm({ isOpen, onToggle, serverId, onSuccess }: MCPServ
                   onClick={() => handleCancel()}
                   className="h-10 rounded-md px-3 text-sm font-medium text-neutral-700 hover:bg-neutral-100 hover:text-neutral-950 dark:text-neutral-300 dark:hover:bg-neutral-800 dark:hover:text-neutral-100"
                 >
-                  Cancel
+                  {intl.formatMessage({ id: "common.button.cancel" })}
                 </Button>
                 <Button
                   type="submit"
                   disabled={!isValid || isSubmitting || oauthPending}
                   className="h-10 rounded-md bg-neutral-950 px-4 text-sm font-medium text-white hover:enabled:bg-neutral-800 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-neutral-100 dark:text-neutral-950 dark:hover:enabled:bg-neutral-200"
                 >
-                  {isSubmitting
-                    ? "Connecting..."
-                    : oauthPending
-                      ? "Waiting for OAuth…"
-                      : serverId
-                        ? "Save changes"
-                        : "Connect server"}
+                  {intl.formatMessage({
+                    id: isSubmitting
+                      ? "mcpServer.form.connecting"
+                      : oauthPending
+                        ? "mcpServer.form.waitingOAuth"
+                        : serverId
+                          ? "mcpServer.form.saveChanges"
+                          : "mcpServer.form.connectServer",
+                  })}
                 </Button>
               </div>
             </div>
diff --git a/src/components/mcp-servers/NoneAuth.tsx b/src/components/mcp-servers/NoneAuth.tsx
index 482606b..20b3677 100644
--- a/src/components/mcp-servers/NoneAuth.tsx
+++ b/src/components/mcp-servers/NoneAuth.tsx
@@ -1,22 +1,30 @@
 import { Zap } from "lucide-react";
+import { useIntl } from "react-intl";
+import type { ReactNode } from "react";
 
 export function NoneAuth() {
+  const intl = useIntl();
+
   return (
     <div className="flex gap-3 items-center rounded-md bg-neutral-50 px-3 py-5 dark:bg-neutral-800">
       <Zap className="h-5 w-5 shrink-0 text-neutral-500 dark:text-neutral-400" />
       <div className="space-y-1 text-sm text-neutral-600 dark:text-neutral-400">
         <p>
-          No credentials are required to connect. Add authentication before using this server in
-          production. Learn about best practices from the{" "}
-          <a
-            href="https://ibm.github.io/mcp-context-forge/1.0.0-RC3/manage/securing/"
-            target="_blank"
-            rel="noopener noreferrer"
-            className="text-cyan-700 underline hover:text-cyan-800 dark:text-cyan-400 dark:hover:text-cyan-300"
-          >
-            Production Security Checklist
-          </a>
-          .
+          {intl.formatMessage(
+            { id: "mcpServer.auth.none.description" },
+            {
+              checklist: (chunks: ReactNode) => (
+                <a
+                  href="https://ibm.github.io/mcp-context-forge/1.0.0-RC3/manage/securing/"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-cyan-700 underline hover:text-cyan-800 dark:text-cyan-400 dark:hover:text-cyan-300"
+                >
+                  {chunks}
+                </a>
+              ),
+            },
+          )}
         </p>
       </div>
     </div>
diff --git a/src/components/mcp-servers/OAuth2Auth.test.tsx b/src/components/mcp-servers/OAuth2Auth.test.tsx
index 16e6727..cc83de6 100644
--- a/src/components/mcp-servers/OAuth2Auth.test.tsx
+++ b/src/components/mcp-servers/OAuth2Auth.test.tsx
@@ -1,5 +1,6 @@
 import { describe, it, expect, vi } from "vitest";
-import { render, screen, fireEvent } from "@testing-library/react";
+import { screen, fireEvent } from "@testing-library/react";
+import { renderWithProviders as render } from "@/test/test-utils";
 import { OAuth2Auth } from "./OAuth2Auth";
 
 describe("OAuth2Auth", () => {
diff --git a/src/components/mcp-servers/OAuth2Auth.tsx b/src/components/mcp-servers/OAuth2Auth.tsx
index bd0fc8a..60e83a6 100644
--- a/src/components/mcp-servers/OAuth2Auth.tsx
+++ b/src/components/mcp-servers/OAuth2Auth.tsx
@@ -1,3 +1,4 @@
+import { useIntl } from "react-intl";
 import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -64,6 +65,8 @@ export function OAuth2Auth({
   onPasswordChange,
   errors,
 }: OAuth2AuthProps) {
+  const intl = useIntl();
+
   return (
     <div className="space-y-4">
       <div className="space-y-1">
@@ -71,22 +74,29 @@ export function OAuth2Auth({
           htmlFor="oauth-grant-type"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Grant type<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.grantTypeLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Select value={grantType} onValueChange={onGrantTypeChange}>
           <SelectTrigger
             id="oauth-grant-type"
             className="h-10 w-full border-neutral-300 dark:border-neutral-700"
           >
-            <SelectValue placeholder="Select grant type" />
+            <SelectValue
+              placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.grantTypePlaceholder" })}
+            />
           </SelectTrigger>
           <SelectContent>
-            <SelectItem value="authorization_code">Authorization code (user login)</SelectItem>
+            <SelectItem value="authorization_code">
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.grantType.authorizationCode" })}
+            </SelectItem>
             <SelectItem value="client_credentials">
-              Client credentials (machine to machine)
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.grantType.clientCredentials" })}
+            </SelectItem>
+            <SelectItem value="password">
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.grantType.password" })}
             </SelectItem>
-            <SelectItem value="password">Resource owner password (legacy)</SelectItem>
           </SelectContent>
         </Select>
       </div>
@@ -96,21 +106,20 @@ export function OAuth2Auth({
           htmlFor="oauth-issuer-url"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Issuer URL<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.issuerUrlLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="oauth-issuer-url"
           type="text"
           value={issuerUrl}
           onChange={(e) => onIssuerUrlChange(e.target.value)}
-          placeholder="e.g. https://auth.example.com"
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.issuerUrlPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
         <p className="text-xs text-neutral-600 dark:text-neutral-500">
-          {
-            "Authorization server's base URL for endpoint discovery and Dynamic Client Registration (DCR)"
-          }
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.issuerUrlHelp" })}
         </p>
       </div>
 
@@ -120,19 +129,20 @@ export function OAuth2Auth({
             htmlFor="oauth-redirect-uri"
             className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
           >
-            Redirect URI<span className="text-red-500">*</span>
-            <span className="sr-only">(required)</span>
+            {intl.formatMessage({ id: "mcpServer.auth.oauth.redirectUriLabel" })}
+            <span className="text-red-500">*</span>
+            <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
           </label>
           <Input
             id="oauth-redirect-uri"
             type="text"
             value={redirectUri}
             onChange={(e) => onRedirectUriChange(e.target.value)}
-            placeholder="e.g. https://gateway.example.com/oauth/callback"
+            placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.redirectUriPlaceholder" })}
             className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
           />
           <p className="text-xs text-neutral-600 dark:text-neutral-500">
-            {"Copy URI into the OAuth application's allowed redirect URI"}
+            {intl.formatMessage({ id: "mcpServer.auth.oauth.redirectUriHelp" })}
           </p>
         </div>
       )}
@@ -144,15 +154,18 @@ export function OAuth2Auth({
               htmlFor="oauth-username"
               className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
             >
-              Username<span className="text-red-500">*</span>
-              <span className="sr-only">(required)</span>
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.usernameLabel" })}
+              <span className="text-red-500">*</span>
+              <span className="sr-only">
+                {intl.formatMessage({ id: "mcpServer.form.required" })}
+              </span>
             </label>
             <Input
               id="oauth-username"
               type="text"
               value={username}
               onChange={(e) => onUsernameChange(e.target.value)}
-              placeholder="e.g. service-account"
+              placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.usernamePlaceholder" })}
               aria-invalid={!!errors?.username}
               aria-describedby={errors?.username ? "oauth-username-error" : undefined}
               className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
@@ -168,8 +181,11 @@ export function OAuth2Auth({
               htmlFor="oauth-password"
               className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
             >
-              Password<span className="text-red-500">*</span>
-              <span className="sr-only">(required)</span>
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.passwordLabel" })}
+              <span className="text-red-500">*</span>
+              <span className="sr-only">
+                {intl.formatMessage({ id: "mcpServer.form.required" })}
+              </span>
             </label>
             <Input
               id="oauth-password"
@@ -195,18 +211,18 @@ export function OAuth2Auth({
           htmlFor="oauth-client-id"
           className="text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Client ID
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.clientIdLabel" })}
         </label>
         <Input
           id="oauth-client-id"
           type="text"
           value={clientId}
           onChange={(e) => onClientIdChange(e.target.value)}
-          placeholder="e.g. 8f3a2c1d-4b5e-4f6a-9c8d-1e2f3a4b5c6"
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.clientIdPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
         <p className="text-xs text-neutral-600 dark:text-neutral-500">
-          Not required for servers that support Dynamic Client Registration (DCR)
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.dcrHelp" })}
         </p>
       </div>
 
@@ -215,18 +231,18 @@ export function OAuth2Auth({
           htmlFor="oauth-client-secret"
           className="text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Client Secret
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.clientSecretLabel" })}
         </label>
         <Input
           id="oauth-client-secret"
           type="password"
           value={clientSecret}
           onChange={(e) => onClientSecretChange(e.target.value)}
-          placeholder="e.g. a1b2c3d4e5f6"
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.clientSecretPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
         <p className="text-xs text-neutral-600 dark:text-neutral-500">
-          Not required for servers that support Dynamic Client Registration (DCR)
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.dcrHelp" })}
         </p>
       </div>
 
@@ -235,19 +251,20 @@ export function OAuth2Auth({
           htmlFor="oauth-token-url"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Token URL<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.tokenUrlLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="oauth-token-url"
           type="text"
           value={tokenUrl}
           onChange={(e) => onTokenUrlChange(e.target.value)}
-          placeholder="e.g. https://oauth.example.com/token"
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.tokenUrlPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
         <p className="text-xs text-neutral-600 dark:text-neutral-500">
-          Exchanges authorization codes or credentials for access tokens
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.tokenUrlHelp" })}
         </p>
       </div>
 
@@ -257,19 +274,22 @@ export function OAuth2Auth({
             htmlFor="oauth-authorization-url"
             className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
           >
-            Authorization URL<span className="text-red-500">*</span>
-            <span className="sr-only">(required)</span>
+            {intl.formatMessage({ id: "mcpServer.auth.oauth.authorizationUrlLabel" })}
+            <span className="text-red-500">*</span>
+            <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
           </label>
           <Input
             id="oauth-authorization-url"
             type="text"
             value={authorizationUrl}
             onChange={(e) => onAuthorizationUrlChange(e.target.value)}
-            placeholder="e.g. https://oauth.example.com/authorize"
+            placeholder={intl.formatMessage({
+              id: "mcpServer.auth.oauth.authorizationUrlPlaceholder",
+            })}
             className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
           />
           <p className="text-xs text-neutral-600 dark:text-neutral-500">
-            Where users are redirected to log in and grant access
+            {intl.formatMessage({ id: "mcpServer.auth.oauth.authorizationUrlHelp" })}
           </p>
         </div>
       )}
@@ -279,23 +299,23 @@ export function OAuth2Auth({
           htmlFor="oauth-scopes"
           className="text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Scopes
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.scopesLabel" })}
         </label>
         <p className="text-sm text-neutral-600 dark:text-neutral-400">
-          Space-separated list of OAuth scopes
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.scopesDescription" })}
         </p>
         <Textarea
           id="oauth-scopes"
           value={scopes}
           onChange={(e) => onScopesChange(e.target.value)}
-          placeholder="e.g. repo read:user..."
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.oauth.scopesPlaceholder" })}
           className="min-h-20 focus-visible:ring-1 focus-visible:ring-offset-0"
         />
       </div>
 
       <div className="space-y-2">
         <label className="text-sm font-medium text-neutral-900 dark:text-neutral-100">
-          Token management
+          {intl.formatMessage({ id: "mcpServer.auth.oauth.tokenManagement" })}
         </label>
         <div className="space-y-2">
           <div className="flex items-center gap-2">
@@ -308,7 +328,7 @@ export function OAuth2Auth({
               htmlFor="store-tokens"
               className="text-sm text-neutral-900 dark:text-neutral-100 cursor-pointer"
             >
-              Store access tokens for reuse
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.storeTokens" })}
             </label>
           </div>
           <div className="flex items-center gap-2">
@@ -321,7 +341,7 @@ export function OAuth2Auth({
               htmlFor="auto-refresh"
               className="text-sm text-neutral-900 dark:text-neutral-100 cursor-pointer"
             >
-              Automatically refresh expired tokens
+              {intl.formatMessage({ id: "mcpServer.auth.oauth.autoRefresh" })}
             </label>
           </div>
         </div>
diff --git a/src/components/mcp-servers/QueryParameterAuth.tsx b/src/components/mcp-servers/QueryParameterAuth.tsx
index da96556..0a4753a 100644
--- a/src/components/mcp-servers/QueryParameterAuth.tsx
+++ b/src/components/mcp-servers/QueryParameterAuth.tsx
@@ -1,4 +1,6 @@
 import { AlertTriangle } from "lucide-react";
+import { useIntl } from "react-intl";
+import type { ReactNode } from "react";
 import { Input } from "@/components/ui/input";
 
 interface QueryParameterAuthProps {
@@ -14,15 +16,20 @@ export function QueryParameterAuth({
   onParameterNameChange,
   onApiKeyChange,
 }: QueryParameterAuthProps) {
+  const intl = useIntl();
+
   return (
     <div className="space-y-4">
       {/* Security Warning */}
       <div className="flex items-center gap-3 rounded-md bg-neutral-50 px-3 py-5 dark:bg-neutral-800">
         <AlertTriangle className="h-5 w-5 shrink-0 text-yellow-600 dark:text-yellow-500" />
         <p className="text-sm text-neutral-700 dark:text-neutral-300">
-          <span className="font-semibold">Security Warning:</span> API keys in URLs will be visible
-          in proxy logs, browser history, and server access logs. Use only when the upstream server
-          does not support header-based authentication.
+          {intl.formatMessage(
+            { id: "mcpServer.auth.query.warning" },
+            {
+              strong: (chunks: ReactNode) => <span className="font-semibold">{chunks}</span>,
+            },
+          )}
         </p>
       </div>
 
@@ -32,15 +39,16 @@ export function QueryParameterAuth({
           htmlFor="query-param-name"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          Query parameter name<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.query.nameLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="query-param-name"
           type="text"
           value={parameterName}
           onChange={(e) => onParameterNameChange(e.target.value)}
-          placeholder="e.g. api_key..."
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.query.namePlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
       </div>
@@ -51,15 +59,16 @@ export function QueryParameterAuth({
           htmlFor="query-param-api-key"
           className="inline-flex items-center gap-0.5 text-sm font-medium text-neutral-900 dark:text-neutral-100"
         >
-          API key<span className="text-red-500">*</span>
-          <span className="sr-only">(required)</span>
+          {intl.formatMessage({ id: "mcpServer.auth.query.apiKeyLabel" })}
+          <span className="text-red-500">*</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.form.required" })}</span>
         </label>
         <Input
           id="query-param-api-key"
           type="password"
           value={apiKey}
           onChange={(e) => onApiKeyChange(e.target.value)}
-          placeholder="e.g. a1b2c3d4e5f6789..."
+          placeholder={intl.formatMessage({ id: "mcpServer.auth.query.apiKeyPlaceholder" })}
           className="rounded-md border-neutral-300 px-4 text-sm text-neutral-900 shadow-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 placeholder:text-neutral-400 dark:border-neutral-700 dark:text-neutral-100 dark:placeholder:text-neutral-500"
         />
       </div>
diff --git a/src/components/servers/ServerActionsMenu.test.tsx b/src/components/servers/ServerActionsMenu.test.tsx
index f346a3d..172622b 100644
--- a/src/components/servers/ServerActionsMenu.test.tsx
+++ b/src/components/servers/ServerActionsMenu.test.tsx
@@ -1,7 +1,7 @@
 import { describe, it, expect, vi } from "vitest";
 import { screen, waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { render } from "@testing-library/react";
+import { renderWithProviders as render } from "@/test/test-utils";
 import { ServerActionsMenu } from "./ServerActionsMenu";
 import type { MCPServer } from "@/types/server";
 
diff --git a/src/components/servers/ServerActionsMenu.tsx b/src/components/servers/ServerActionsMenu.tsx
index 7bc6c2c..196a6df 100644
--- a/src/components/servers/ServerActionsMenu.tsx
+++ b/src/components/servers/ServerActionsMenu.tsx
@@ -1,4 +1,5 @@
 import { MoreVertical } from "lucide-react";
+import { useIntl } from "react-intl";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -23,6 +24,8 @@ export function ServerActionsMenu({
   onViewDetails,
   onToggleEnabled,
 }: ServerActionsMenuProps) {
+  const intl = useIntl();
+
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
@@ -30,28 +33,37 @@ export function ServerActionsMenu({
           variant="ghost"
           size="sm"
           className="h-8 w-8 p-0"
-          aria-label={`Actions for ${server.name}`}
+          aria-label={intl.formatMessage(
+            { id: "mcpServer.table.actions.label" },
+            { name: server.name },
+          )}
           aria-haspopup="menu"
         >
           <MoreVertical className="h-4 w-4" aria-hidden="true" />
-          <span className="sr-only">Open menu for {server.name}</span>
+          <span className="sr-only">
+            {intl.formatMessage({ id: "mcpServer.table.actions.openMenu" }, { name: server.name })}
+          </span>
         </Button>
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end" role="menu">
         {onViewDetails && (
           <DropdownMenuItem onClick={() => onViewDetails(server.id)} role="menuitem">
-            View Details
+            {intl.formatMessage({ id: "mcpServer.table.actions.viewDetails" })}
           </DropdownMenuItem>
         )}
         <DropdownMenuItem onClick={() => onEdit(server.id)} role="menuitem">
-          Edit
+          {intl.formatMessage({ id: "mcpServer.table.actions.edit" })}
         </DropdownMenuItem>
         {onToggleEnabled && (
           <DropdownMenuItem
             onClick={() => onToggleEnabled(server.id, !server.enabled)}
             role="menuitem"
           >
-            {server.enabled ? "Deactivate" : "Activate"}
+            {intl.formatMessage({
+              id: server.enabled
+                ? "mcpServer.table.actions.deactivate"
+                : "mcpServer.table.actions.activate",
+            })}
           </DropdownMenuItem>
         )}
         <DropdownMenuItem
@@ -59,7 +71,7 @@ export function ServerActionsMenu({
           className="text-red-600 dark:text-red-400"
           role="menuitem"
         >
-          Delete
+          {intl.formatMessage({ id: "mcpServer.table.actions.delete" })}
         </DropdownMenuItem>
       </DropdownMenuContent>
     </DropdownMenu>
diff --git a/src/components/servers/ServersTable.tsx b/src/components/servers/ServersTable.tsx
index 97ad6b0..9754af0 100644
--- a/src/components/servers/ServersTable.tsx
+++ b/src/components/servers/ServersTable.tsx
@@ -68,27 +68,27 @@ function getStatusConfig(status: ServerStatus) {
   switch (status) {
     case "active":
       return {
-        label: "Active",
+        labelId: "mcpServer.status.active",
         Icon: Activity,
-        className: "text-emerald-400",
+        className: "text-emerald-600 dark:text-emerald-400",
       };
     case "warning":
       return {
-        label: "Warning",
+        labelId: "mcpServer.status.warning",
         Icon: TriangleAlert,
-        className: "text-amber-400",
+        className: "text-amber-600 dark:text-amber-400",
       };
     case "offline":
       return {
-        label: "Offline",
+        labelId: "mcpServer.status.offline",
         Icon: CircleSlash,
-        className: "text-neutral-500",
+        className: "text-muted-foreground",
       };
     default:
       return {
-        label: "Draft",
+        labelId: "mcpServer.status.draft",
         Icon: CircleDashed,
-        className: "text-neutral-500",
+        className: "text-muted-foreground",
       };
   }
 }
@@ -151,7 +151,7 @@ export function ServersTable({
         aria-busy="true"
       >
         <Loading />
-        <span className="sr-only">Loading servers, please wait...</span>
+        <span className="sr-only">{intl.formatMessage({ id: "mcpServer.loading" })}</span>
       </div>
     );
   }
@@ -159,29 +159,31 @@ export function ServersTable({
   return (
     <div className="overflow-hidden">
       <Table className="min-w-full border-separate border-spacing-y-1.5">
-        <TableCaption className="sr-only">List of MCP servers with status and actions</TableCaption>
-        <TableHeader className="bg-white dark:bg-transparent">
+        <TableCaption className="sr-only">
+          {intl.formatMessage({ id: "mcpServer.table.caption" })}
+        </TableCaption>
+        <TableHeader className="bg-main">
           <TableRow className="border-none hover:bg-transparent">
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              Name
+              {intl.formatMessage({ id: "mcpServer.table.name" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              Components
+              {intl.formatMessage({ id: "mcpServer.table.components" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              Last response
+              {intl.formatMessage({ id: "mcpServer.table.lastResponse" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              UUID
+              {intl.formatMessage({ id: "mcpServer.table.uuid" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              Visibility
+              {intl.formatMessage({ id: "mcpServer.table.visibility" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium">
-              Status
+              {intl.formatMessage({ id: "mcpServer.table.status" })}
             </TableHead>
             <TableHead className="border-b border-border h-12 px-4 text-xs font-medium text-right">
-              Actions
+              {intl.formatMessage({ id: "mcpServer.table.actions" })}
             </TableHead>
           </TableRow>
         </TableHeader>
@@ -200,26 +202,39 @@ export function ServersTable({
             return (
               <TableRow
                 key={server.id}
-                className="bg-neutral-50 dark:bg-neutral-800 hover:bg-neutral-100 dark:hover:bg-neutral-700/60 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg"
+                className="border-0 bg-white dark:bg-neutral-800 hover:bg-neutral-100 dark:hover:bg-neutral-700/60 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg"
               >
                 <TableCell className="px-4 py-2.5">
                   <div className="flex items-center gap-3">
                     <ServerIcon name={server.name} size="md" />
-                    <span className="font-medium text-neutral-900 dark:text-neutral-100">
-                      {server.name}
-                    </span>
+                    <span className="font-medium text-card-foreground">{server.name}</span>
                   </div>
                 </TableCell>
                 <TableCell className="px-4 py-2.5">
-                  <div className="flex flex-wrap items-center gap-2 text-xs text-neutral-600 dark:text-neutral-400">
-                    <span>{toolCount} tools</span>
+                  <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
+                    <span>
+                      {intl.formatMessage(
+                        { id: "mcpServer.table.components.tools" },
+                        { count: toolCount },
+                      )}
+                    </span>
                     <span>•</span>
-                    <span>{resourcesCount} resources</span>
+                    <span>
+                      {intl.formatMessage(
+                        { id: "mcpServer.table.components.resources" },
+                        { count: resourcesCount },
+                      )}
+                    </span>
                     <span>•</span>
-                    <span>{promptsCount} prompts</span>
+                    <span>
+                      {intl.formatMessage(
+                        { id: "mcpServer.table.components.prompts" },
+                        { count: promptsCount },
+                      )}
+                    </span>
                   </div>
                 </TableCell>
-                <TableCell className="px-4 py-2.5 text-xs text-neutral-600 dark:text-neutral-400">
+                <TableCell className="px-4 py-2.5 text-xs text-muted-foreground">
                   {formatLocalDateTime(lastSeen, intl.formatMessage({ id: "mcpServer.neverUsed" }))}
                 </TableCell>
                 <TableCell className="px-4 py-2.5">
@@ -228,14 +243,22 @@ export function ServersTable({
                     variant="ghost"
                     size="sm"
                     onClick={() => handleCopy(server.id)}
-                    className="inline-flex items-center gap-2 text-xs text-neutral-600 dark:text-neutral-400 transition hover:text-neutral-900 dark:hover:text-neutral-200"
-                    aria-label={`Copy UUID for ${server.name}`}
+                    className="inline-flex items-center gap-2 text-xs text-muted-foreground transition hover:text-foreground"
+                    aria-label={intl.formatMessage(
+                      { id: "mcpServer.table.copyUuid" },
+                      { name: server.name },
+                    )}
                   >
                     <span className="max-w-[180px] truncate">{server.id}</span>
                     {copiedId === server.id ? (
                       <>
-                        <Check className="h-3.5 w-3.5 text-emerald-400" aria-hidden="true" />
-                        <span className="sr-only">Copied!</span>
+                        <Check
+                          className="h-3.5 w-3.5 text-emerald-600 dark:text-emerald-400"
+                          aria-hidden="true"
+                        />
+                        <span className="sr-only">
+                          {intl.formatMessage({ id: "mcpServer.table.copied" })}
+                        </span>
                       </>
                     ) : (
                       <Copy className="h-3.5 w-3.5" aria-hidden="true" />
@@ -243,7 +266,7 @@ export function ServersTable({
                   </Button>
                 </TableCell>
                 <TableCell className="px-4 py-2.5">
-                  <div className="inline-flex items-center gap-1.5 text-xs text-neutral-600 dark:text-neutral-400">
+                  <div className="inline-flex items-center gap-1.5 text-xs text-muted-foreground">
                     <VisibilityIcon className="h-3.5 w-3.5" aria-hidden="true" focusable="false" />
                     <span>{intl.formatMessage({ id: visibility.labelId })}</span>
                   </div>
@@ -253,8 +276,8 @@ export function ServersTable({
                     className={`inline-flex items-center gap-1.5 text-xs ${statusConfig.className}`}
                   >
                     <StatusIcon className="h-3.5 w-3.5" />
-                    <span className="text-neutral-600 dark:text-neutral-400">
-                      {statusConfig.label}
+                    <span className="text-muted-foreground">
+                      {intl.formatMessage({ id: statusConfig.labelId })}
                     </span>
                   </div>
                 </TableCell>
diff --git a/src/i18n/locales.test.ts b/src/i18n/locales.test.ts
index 9c9eb33..3edc170 100644
--- a/src/i18n/locales.test.ts
+++ b/src/i18n/locales.test.ts
@@ -1,4 +1,5 @@
 import { describe, expect, it } from "vitest";
+import { parse, TYPE, type MessageFormatElement } from "@formatjs/icu-messageformat-parser";
 
 import enUS from "./locales/en-US";
 import esES from "./locales/es-ES";
@@ -17,6 +18,49 @@ const messages: Record<SupportedLocale, LocaleMessages> = {
 const baseKeys = Object.keys(messages[BASE_LOCALE]);
 const translatedLocales = SUPPORTED_LOCALES.filter((locale) => locale !== BASE_LOCALE);
 
+/**
+ * Collects every placeholder name and rich-text tag a message references,
+ * descending into plural/select branches so `{count, plural, one {# of {total}}}`
+ * reports both arguments.
+ */
+function collectShape(
+  elements: MessageFormatElement[],
+  shape: { args: Set<string>; tags: Set<string> } = { args: new Set(), tags: new Set() },
+) {
+  for (const element of elements) {
+    switch (element.type) {
+      case TYPE.argument:
+      case TYPE.number:
+      case TYPE.date:
+      case TYPE.time:
+        shape.args.add(element.value);
+        break;
+      case TYPE.select:
+      case TYPE.plural:
+        shape.args.add(element.value);
+        for (const option of Object.values(element.options)) {
+          collectShape(option.value, shape);
+        }
+        break;
+      case TYPE.tag:
+        shape.tags.add(element.value);
+        collectShape(element.children, shape);
+        break;
+      default:
+        break;
+    }
+  }
+  return shape;
+}
+
+function describeMessage(message: string) {
+  const shape = collectShape(parse(message));
+  return {
+    args: [...shape.args].sort().join(","),
+    tags: [...shape.tags].sort().join(","),
+  };
+}
+
 describe("locale messages", () => {
   it("provides a bundle for every supported locale", () => {
     expect(Object.keys(messages).sort()).toEqual([...SUPPORTED_LOCALES].sort());
@@ -41,4 +85,42 @@ describe("locale messages", () => {
 
     expect(blank).toEqual([]);
   });
+
+  it.each([...SUPPORTED_LOCALES])("%s messages are valid ICU syntax", (locale) => {
+    const invalid = Object.entries(messages[locale])
+      .map(([key, message]) => {
+        try {
+          parse(message);
+          return null;
+        } catch (error) {
+          return `${key}: ${(error as Error).message}`;
+        }
+      })
+      .filter((entry): entry is string => entry !== null);
+
+    expect(invalid).toEqual([]);
+  });
+
+  // A translation that drops {count}, renames a rich-text tag, or invents an
+  // argument compiles fine but breaks at render time — react-intl throws on a
+  // missing value and silently drops an unhandled tag. Key parity alone misses
+  // both, so compare the shape of each message against the en-US original.
+  it.each(translatedLocales)("%s messages use the same arguments and tags as en-US", (locale) => {
+    const mismatches = baseKeys
+      .map((key) => {
+        const base = describeMessage(messages[BASE_LOCALE][key]);
+        const translated = describeMessage(messages[locale][key]);
+
+        if (base.args !== translated.args) {
+          return `${key}: args en-US=[${base.args}] ${locale}=[${translated.args}]`;
+        }
+        if (base.tags !== translated.tags) {
+          return `${key}: tags en-US=[${base.tags}] ${locale}=[${translated.tags}]`;
+        }
+        return null;
+      })
+      .filter((entry): entry is string => entry !== null);
+
+    expect(mismatches).toEqual([]);
+  });
 });
diff --git a/src/i18n/locales/en-US/mcpServer.json b/src/i18n/locales/en-US/mcpServer.json
index 7215ead..b942370 100644
--- a/src/i18n/locales/en-US/mcpServer.json
+++ b/src/i18n/locales/en-US/mcpServer.json
@@ -3,6 +3,63 @@
   "mcpServer.delete.success": "{name} deleted.",
   "mcpServer.delete.errorTitle": "Error deleting MCP server",
   "mcpServer.neverUsed": "Never used",
+  "mcpServer.loading": "Loading servers...",
+  "mcpServer.connect": "Connect",
+  "mcpServer.error.loadingTitle": "Error loading servers",
+  "mcpServer.empty.title": "Connect MCP server",
+  "mcpServer.empty.description": "Register a MCP server to federate its tools, resources, and prompts to use with a virtual server.",
+  "mcpServer.delete.title": "Delete MCP Server",
+  "mcpServer.delete.description": "Are you sure you want to delete this MCP server? This action cannot be undone.",
+  "mcpServer.tags.addError": "Failed to add tag. Please try again.",
+  "mcpServer.form.connectTitle": "Connect MCP server",
+  "mcpServer.form.editTitle": "Edit MCP server",
+  "mcpServer.form.intro": "Context Forge will discover the server's tools, resources, and prompts. The MCP server should be running and reachable. Or, choose a server from the <catalog>mcp server catalog</catalog>.",
+  "mcpServer.form.fetchError": "Failed to load server data: {error}",
+  "mcpServer.form.transportLabel": "Server transport type",
+  "mcpServer.form.nameLabel": "Name",
+  "mcpServer.form.namePlaceholder": "Add MCP server name...",
+  "mcpServer.form.urlLabel": "URL",
+  "mcpServer.form.urlPlaceholder": "Add URL for a running MCP server...",
+  "mcpServer.form.descriptionLabel": "Description",
+  "mcpServer.form.descriptionPlaceholder": "Add an optional description...",
+  "mcpServer.form.required": "(required)",
+  "mcpServer.form.advancedSettings": "Advanced settings",
+  "mcpServer.form.oauthPending": "Waiting for OAuth authorization in the popup window…",
+  "mcpServer.form.dismissOAuth": "Dismiss OAuth notification",
+  "mcpServer.form.dismissFetchTools": "Dismiss fetch tools notification",
+  "mcpServer.form.connecting": "Connecting...",
+  "mcpServer.form.waitingOAuth": "Waiting for OAuth…",
+  "mcpServer.form.saveChanges": "Save changes",
+  "mcpServer.form.connectServer": "Connect server",
+  "mcpServer.table.caption": "List of MCP servers with status and actions",
+  "mcpServer.table.name": "Name",
+  "mcpServer.table.components": "Components",
+  "mcpServer.table.lastResponse": "Last response",
+  "mcpServer.table.uuid": "UUID",
+  "mcpServer.table.visibility": "Visibility",
+  "mcpServer.table.status": "Status",
+  "mcpServer.table.actions": "Actions",
+  "mcpServer.table.components.tools": "{count, plural, one {# tool} other {# tools}}",
+  "mcpServer.table.components.resources": "{count, plural, one {# resource} other {# resources}}",
+  "mcpServer.table.components.prompts": "{count, plural, one {# prompt} other {# prompts}}",
+  "mcpServer.table.copyUuid": "Copy UUID for {name}",
+  "mcpServer.table.copied": "Copied!",
+  "mcpServer.table.actions.label": "Actions for {name}",
+  "mcpServer.table.actions.openMenu": "Open menu for {name}",
+  "mcpServer.table.actions.viewDetails": "View details",
+  "mcpServer.table.actions.edit": "Edit",
+  "mcpServer.table.actions.activate": "Activate",
+  "mcpServer.table.actions.deactivate": "Deactivate",
+  "mcpServer.table.actions.delete": "Delete",
+  "mcpServer.status.active": "Active",
+  "mcpServer.status.warning": "Warning",
+  "mcpServer.status.offline": "Offline",
+  "mcpServer.status.draft": "Draft",
+  "mcpServer.list.showing": "{count, plural, one {Showing # server} other {Showing # servers}}",
+  "mcpServer.list.perPage": "Per page:",
+  "mcpServer.list.loadMore": "Load More",
+  "mcpServer.list.loadingMore": "Loading...",
+  "mcpServer.list.loadMoreLabel": "Load more servers",
   "mcpServer.catalog.title": "Server catalog",
   "mcpServer.catalog.all": "All",
   "mcpServer.catalog.searchPlaceholder": "Search MCP servers...",
@@ -36,5 +93,79 @@
   "mcpServer.catalog.noneConnected": "No MCP server catalog options are connected.",
   "mcpServer.catalog.disabled": "Server catalog is disabled for this gateway.",
   "mcpServer.catalog.error": "Unable to load server catalog. Try again.",
-  "mcpServer.catalog.retry": "Retry"
+  "mcpServer.catalog.retry": "Retry",
+  "mcpServer.advanced.visibilityPlaceholder": "Select visibility",
+  "mcpServer.advanced.teamScoped": "This server will be scoped to your currently selected team",
+  "mcpServer.advanced.teamNotSelected": "Please select a team using the team switcher in the sidebar",
+  "mcpServer.advanced.authTypeLabel": "Authentication type",
+  "mcpServer.advanced.authType.none": "None",
+  "mcpServer.advanced.authType.basic": "Basic",
+  "mcpServer.advanced.authType.bearer": "Bearer token",
+  "mcpServer.advanced.authType.custom": "Custom headers",
+  "mcpServer.advanced.authType.oauth": "OAuth 2.0",
+  "mcpServer.advanced.authType.query": "Query parameter",
+  "mcpServer.advanced.oneTimeAuthLabel": "One-time authentication",
+  "mcpServer.advanced.oneTimeAuthDescription": "Use credentials once, don't store them. Health checks will be disabled.",
+  "mcpServer.advanced.oneTimeAuthWarning": "Add passthrough headers when one-time authentication is enabled.",
+  "mcpServer.advanced.passthroughLabel": "Passthrough headers",
+  "mcpServer.advanced.passthroughDescription": "Add comma-separated headers to forward from client requests. Leave empty to use global defaults.",
+  "mcpServer.advanced.passthroughPlaceholder": "e.g. Authorization, X-Tenant-Id, X-Trace-Id...",
+  "mcpServer.auth.none.description": "No credentials are required to connect. Add authentication before using this server in production. Learn about best practices from the <checklist>Production Security Checklist</checklist>.",
+  "mcpServer.auth.basic.usernameLabel": "Username",
+  "mcpServer.auth.basic.usernamePlaceholder": "Add username for basic authentication...",
+  "mcpServer.auth.basic.passwordLabel": "Password",
+  "mcpServer.auth.basic.passwordPlaceholder": "Add password...",
+  "mcpServer.auth.bearer.label": "Bearer token",
+  "mcpServer.auth.bearer.description": "Add the API key or token issued by the server.",
+  "mcpServer.auth.bearer.placeholder": "Paste bearer token...",
+  "mcpServer.auth.custom.descriptionOne": "Send one custom header with every request.",
+  "mcpServer.auth.custom.descriptionMany": "Send one or more custom headers with every request.",
+  "mcpServer.auth.custom.keyLabel": "Header key",
+  "mcpServer.auth.custom.keyPlaceholderExample": "e.g. X-API-Key...",
+  "mcpServer.auth.custom.keyPlaceholder": "Add header key...",
+  "mcpServer.auth.custom.valueLabel": "Value",
+  "mcpServer.auth.custom.valuePlaceholder": "Add header value...",
+  "mcpServer.auth.custom.addHeader": "Add header",
+  "mcpServer.auth.query.warning": "<strong>Security Warning:</strong> API keys in URLs will be visible in proxy logs, browser history, and server access logs. Use only when the upstream server does not support header-based authentication.",
+  "mcpServer.auth.query.nameLabel": "Query parameter name",
+  "mcpServer.auth.query.namePlaceholder": "e.g. api_key...",
+  "mcpServer.auth.query.apiKeyLabel": "API key",
+  "mcpServer.auth.query.apiKeyPlaceholder": "e.g. a1b2c3d4e5f6789...",
+  "mcpServer.auth.oauth.grantTypeLabel": "Grant type",
+  "mcpServer.auth.oauth.grantTypePlaceholder": "Select grant type",
+  "mcpServer.auth.oauth.grantType.authorizationCode": "Authorization code (user login)",
+  "mcpServer.auth.oauth.grantType.clientCredentials": "Client credentials (machine to machine)",
+  "mcpServer.auth.oauth.grantType.password": "Resource owner password (legacy)",
+  "mcpServer.auth.oauth.issuerUrlLabel": "Issuer URL",
+  "mcpServer.auth.oauth.issuerUrlPlaceholder": "e.g. https://auth.example.com",
+  "mcpServer.auth.oauth.issuerUrlHelp": "Authorization server's base URL for endpoint discovery and Dynamic Client Registration (DCR)",
+  "mcpServer.auth.oauth.redirectUriLabel": "Redirect URI",
+  "mcpServer.auth.oauth.redirectUriPlaceholder": "e.g. https://gateway.example.com/oauth/callback",
+  "mcpServer.auth.oauth.redirectUriHelp": "Copy URI into the OAuth application's allowed redirect URI",
+  "mcpServer.auth.oauth.usernameLabel": "Username",
+  "mcpServer.auth.oauth.usernamePlaceholder": "e.g. service-account",
+  "mcpServer.auth.oauth.passwordLabel": "Password",
+  "mcpServer.auth.oauth.clientIdLabel": "Client ID",
+  "mcpServer.auth.oauth.clientIdPlaceholder": "e.g. 8f3a2c1d-4b5e-4f6a-9c8d-1e2f3a4b5c6",
+  "mcpServer.auth.oauth.clientSecretLabel": "Client Secret",
+  "mcpServer.auth.oauth.clientSecretPlaceholder": "e.g. a1b2c3d4e5f6",
+  "mcpServer.auth.oauth.dcrHelp": "Not required for servers that support Dynamic Client Registration (DCR)",
+  "mcpServer.auth.oauth.tokenUrlLabel": "Token URL",
+  "mcpServer.auth.oauth.tokenUrlPlaceholder": "e.g. https://oauth.example.com/token",
+  "mcpServer.auth.oauth.tokenUrlHelp": "Exchanges authorization codes or credentials for access tokens",
+  "mcpServer.auth.oauth.authorizationUrlLabel": "Authorization URL",
+  "mcpServer.auth.oauth.authorizationUrlPlaceholder": "e.g. https://oauth.example.com/authorize",
+  "mcpServer.auth.oauth.authorizationUrlHelp": "Where users are redirected to log in and grant access",
+  "mcpServer.auth.oauth.scopesLabel": "Scopes",
+  "mcpServer.auth.oauth.scopesDescription": "Space-separated list of OAuth scopes",
+  "mcpServer.auth.oauth.scopesPlaceholder": "e.g. repo read:user...",
+  "mcpServer.auth.oauth.tokenManagement": "Token management",
+  "mcpServer.auth.oauth.storeTokens": "Store access tokens for reuse",
+  "mcpServer.auth.oauth.autoRefresh": "Automatically refresh expired tokens",
+  "mcpServer.caCert.label": "CA certificate",
+  "mcpServer.caCert.upload": "Upload",
+  "mcpServer.caCert.hint": "Public certificate files only (.pem, .crt, .cer, .cert)",
+  "mcpServer.caCert.invalidFiles": "{count, plural, one {Invalid file type: {files}.} other {Invalid file types: {files}.}} Only .pem, .crt, .cer, .cert files are allowed.",
+  "mcpServer.caCert.filesSelected": "{count, plural, one {# file selected successfully.} other {# files selected successfully.}}",
+  "mcpServer.caCert.selected": "Selected: {files}"
 }
diff --git a/src/i18n/locales/en-US/resources.json b/src/i18n/locales/en-US/resources.json
index 3dc84bc..b5d69b9 100644
--- a/src/i18n/locales/en-US/resources.json
+++ b/src/i18n/locales/en-US/resources.json
@@ -6,7 +6,7 @@
   "resources.addResources.description": "Resources will appear automatically when you connect a MCP server. Or, register a standalone resource endpoint.",
   "resources.restResourcesGroup": "REST resources",
   "resources.card.moreOptionsFor": "More options for {name}",
-  "resources.card.viewDetails": "View Details",
+  "resources.card.viewDetails": "View details",
   "resources.card.resourceCount": "{count, plural, one {# resource} other {# resources}}",
   "resources.card.moreResources": "{count} more {count, plural, one {resource} other {resources}}",
   "resources.form.title": "Add resources",
diff --git a/src/i18n/locales/en-US/tools.json b/src/i18n/locales/en-US/tools.json
index e3365f8..48e8c04 100644
--- a/src/i18n/locales/en-US/tools.json
+++ b/src/i18n/locales/en-US/tools.json
@@ -6,7 +6,7 @@
   "tools.card.toolCount": "{count, plural, one {# tool} other {# tools}}",
   "tools.card.moreToolsTitle": "{count, plural, one {# more tool} other {# more tools}}",
   "tools.card.moreOptionsFor": "More options for {name}",
-  "tools.card.viewDetails": "View Details",
+  "tools.card.viewDetails": "View details",
   "tools.add.title": "Add tools",
   "tools.add.description": "Tools will appear automatically when you connect a MCP server. Or, register a REST endpoint as a standalone tool.",
   "tools.delete.confirm.title": "Delete tool",
diff --git a/src/i18n/locales/es-ES/mcpServer.json b/src/i18n/locales/es-ES/mcpServer.json
index 5d7d329..734c191 100644
--- a/src/i18n/locales/es-ES/mcpServer.json
+++ b/src/i18n/locales/es-ES/mcpServer.json
@@ -3,6 +3,63 @@
   "mcpServer.delete.success": "{name} eliminado.",
   "mcpServer.delete.errorTitle": "Error al eliminar el servidor MCP",
   "mcpServer.neverUsed": "Nunca usado",
+  "mcpServer.loading": "Cargando servidores...",
+  "mcpServer.connect": "Conectar",
+  "mcpServer.error.loadingTitle": "Error al cargar los servidores",
+  "mcpServer.empty.title": "Conectar servidor MCP",
+  "mcpServer.empty.description": "Registra un servidor MCP para federar sus herramientas, recursos y prompts y usarlos con un servidor virtual.",
+  "mcpServer.delete.title": "Eliminar servidor MCP",
+  "mcpServer.delete.description": "¿Seguro que quieres eliminar este servidor MCP? Esta acción no se puede deshacer.",
+  "mcpServer.tags.addError": "No se pudo agregar la etiqueta. Inténtalo de nuevo.",
+  "mcpServer.form.connectTitle": "Conectar servidor MCP",
+  "mcpServer.form.editTitle": "Editar servidor MCP",
+  "mcpServer.form.intro": "Context Forge descubrirá las herramientas, los recursos y los prompts del servidor. El servidor MCP debe estar en ejecución y ser accesible. O elige un servidor del <catalog>catálogo de servidores MCP</catalog>.",
+  "mcpServer.form.fetchError": "No se pudieron cargar los datos del servidor: {error}",
+  "mcpServer.form.transportLabel": "Tipo de transporte del servidor",
+  "mcpServer.form.nameLabel": "Nombre",
+  "mcpServer.form.namePlaceholder": "Agrega el nombre del servidor MCP...",
+  "mcpServer.form.urlLabel": "URL",
+  "mcpServer.form.urlPlaceholder": "Agrega la URL de un servidor MCP en ejecución...",
+  "mcpServer.form.descriptionLabel": "Descripción",
+  "mcpServer.form.descriptionPlaceholder": "Agrega una descripción opcional...",
+  "mcpServer.form.required": "(obligatorio)",
+  "mcpServer.form.advancedSettings": "Configuración avanzada",
+  "mcpServer.form.oauthPending": "Esperando la autorización de OAuth en la ventana emergente…",
+  "mcpServer.form.dismissOAuth": "Descartar la notificación de OAuth",
+  "mcpServer.form.dismissFetchTools": "Descartar la notificación de obtención de herramientas",
+  "mcpServer.form.connecting": "Conectando...",
+  "mcpServer.form.waitingOAuth": "Esperando OAuth…",
+  "mcpServer.form.saveChanges": "Guardar cambios",
+  "mcpServer.form.connectServer": "Conectar servidor",
+  "mcpServer.table.caption": "Lista de servidores MCP con estado y acciones",
+  "mcpServer.table.name": "Nombre",
+  "mcpServer.table.components": "Componentes",
+  "mcpServer.table.lastResponse": "Última respuesta",
+  "mcpServer.table.uuid": "UUID",
+  "mcpServer.table.visibility": "Visibilidad",
+  "mcpServer.table.status": "Estado",
+  "mcpServer.table.actions": "Acciones",
+  "mcpServer.table.components.tools": "{count, plural, one {# herramienta} other {# herramientas}}",
+  "mcpServer.table.components.resources": "{count, plural, one {# recurso} other {# recursos}}",
+  "mcpServer.table.components.prompts": "{count, plural, one {# prompt} other {# prompts}}",
+  "mcpServer.table.copyUuid": "Copiar UUID de {name}",
+  "mcpServer.table.copied": "¡Copiado!",
+  "mcpServer.table.actions.label": "Acciones para {name}",
+  "mcpServer.table.actions.openMenu": "Abrir menú de {name}",
+  "mcpServer.table.actions.viewDetails": "Ver detalles",
+  "mcpServer.table.actions.edit": "Editar",
+  "mcpServer.table.actions.activate": "Activar",
+  "mcpServer.table.actions.deactivate": "Desactivar",
+  "mcpServer.table.actions.delete": "Eliminar",
+  "mcpServer.status.active": "Activo",
+  "mcpServer.status.warning": "Advertencia",
+  "mcpServer.status.offline": "Sin conexión",
+  "mcpServer.status.draft": "Borrador",
+  "mcpServer.list.showing": "{count, plural, one {Se muestra # servidor} other {Se muestran # servidores}}",
+  "mcpServer.list.perPage": "Por página:",
+  "mcpServer.list.loadMore": "Cargar más",
+  "mcpServer.list.loadingMore": "Cargando...",
+  "mcpServer.list.loadMoreLabel": "Cargar más servidores",
   "mcpServer.catalog.title": "Catálogo de servidores",
   "mcpServer.catalog.all": "Todos",
   "mcpServer.catalog.searchPlaceholder": "Buscar servidores MCP...",
@@ -36,5 +93,79 @@
   "mcpServer.catalog.noneConnected": "Ninguna opción del catálogo de servidores MCP está conectada.",
   "mcpServer.catalog.disabled": "El catálogo de servidores está deshabilitado para esta puerta de enlace.",
   "mcpServer.catalog.error": "No se pudo cargar el catálogo de servidores. Inténtalo de nuevo.",
-  "mcpServer.catalog.retry": "Reintentar"
+  "mcpServer.catalog.retry": "Reintentar",
+  "mcpServer.advanced.visibilityPlaceholder": "Selecciona la visibilidad",
+  "mcpServer.advanced.teamScoped": "Este servidor se limitará al equipo que tienes seleccionado",
+  "mcpServer.advanced.teamNotSelected": "Selecciona un equipo con el selector de equipos de la barra lateral",
+  "mcpServer.advanced.authTypeLabel": "Tipo de autenticación",
+  "mcpServer.advanced.authType.none": "Ninguna",
+  "mcpServer.advanced.authType.basic": "Básica",
+  "mcpServer.advanced.authType.bearer": "Token bearer",
+  "mcpServer.advanced.authType.custom": "Encabezados personalizados",
+  "mcpServer.advanced.authType.oauth": "OAuth 2.0",
+  "mcpServer.advanced.authType.query": "Parámetro de consulta",
+  "mcpServer.advanced.oneTimeAuthLabel": "Autenticación de un solo uso",
+  "mcpServer.advanced.oneTimeAuthDescription": "Usa las credenciales una vez, sin almacenarlas. Las comprobaciones de estado se desactivarán.",
+  "mcpServer.advanced.oneTimeAuthWarning": "Agrega encabezados de reenvío cuando la autenticación de un solo uso esté habilitada.",
+  "mcpServer.advanced.passthroughLabel": "Encabezados de reenvío",
+  "mcpServer.advanced.passthroughDescription": "Agrega encabezados separados por comas para reenviar desde las solicitudes del cliente. Déjalo vacío para usar los valores predeterminados globales.",
+  "mcpServer.advanced.passthroughPlaceholder": "p. ej. Authorization, X-Tenant-Id, X-Trace-Id...",
+  "mcpServer.auth.none.description": "No se requieren credenciales para conectarse. Agrega autenticación antes de usar este servidor en producción. Consulta las prácticas recomendadas en la <checklist>lista de verificación de seguridad para producción</checklist>.",
+  "mcpServer.auth.basic.usernameLabel": "Nombre de usuario",
+  "mcpServer.auth.basic.usernamePlaceholder": "Agrega el nombre de usuario para la autenticación básica...",
+  "mcpServer.auth.basic.passwordLabel": "Contraseña",
+  "mcpServer.auth.basic.passwordPlaceholder": "Agrega la contraseña...",
+  "mcpServer.auth.bearer.label": "Token bearer",
+  "mcpServer.auth.bearer.description": "Agrega la clave de API o el token emitido por el servidor.",
+  "mcpServer.auth.bearer.placeholder": "Pega el token bearer...",
+  "mcpServer.auth.custom.descriptionOne": "Envía un encabezado personalizado con cada solicitud.",
+  "mcpServer.auth.custom.descriptionMany": "Envía uno o más encabezados personalizados con cada solicitud.",
+  "mcpServer.auth.custom.keyLabel": "Clave del encabezado",
+  "mcpServer.auth.custom.keyPlaceholderExample": "p. ej. X-API-Key...",
+  "mcpServer.auth.custom.keyPlaceholder": "Agrega la clave del encabezado...",
+  "mcpServer.auth.custom.valueLabel": "Valor",
+  "mcpServer.auth.custom.valuePlaceholder": "Agrega el valor del encabezado...",
+  "mcpServer.auth.custom.addHeader": "Agregar encabezado",
+  "mcpServer.auth.query.warning": "<strong>Advertencia de seguridad:</strong> las claves de API en las URL serán visibles en los registros del proxy, el historial del navegador y los registros de acceso del servidor. Úsalas solo cuando el servidor de origen no admita la autenticación basada en encabezados.",
+  "mcpServer.auth.query.nameLabel": "Nombre del parámetro de consulta",
+  "mcpServer.auth.query.namePlaceholder": "p. ej. api_key...",
+  "mcpServer.auth.query.apiKeyLabel": "Clave de API",
+  "mcpServer.auth.query.apiKeyPlaceholder": "p. ej. a1b2c3d4e5f6789...",
+  "mcpServer.auth.oauth.grantTypeLabel": "Tipo de concesión",
+  "mcpServer.auth.oauth.grantTypePlaceholder": "Selecciona el tipo de concesión",
+  "mcpServer.auth.oauth.grantType.authorizationCode": "Código de autorización (inicio de sesión de usuario)",
+  "mcpServer.auth.oauth.grantType.clientCredentials": "Credenciales de cliente (máquina a máquina)",
+  "mcpServer.auth.oauth.grantType.password": "Contraseña del propietario del recurso (heredado)",
+  "mcpServer.auth.oauth.issuerUrlLabel": "URL del emisor",
+  "mcpServer.auth.oauth.issuerUrlPlaceholder": "p. ej. https://auth.example.com",
+  "mcpServer.auth.oauth.issuerUrlHelp": "URL base del servidor de autorización para el descubrimiento de endpoints y el registro dinámico de clientes (DCR)",
+  "mcpServer.auth.oauth.redirectUriLabel": "URI de redirección",
+  "mcpServer.auth.oauth.redirectUriPlaceholder": "p. ej. https://gateway.example.com/oauth/callback",
+  "mcpServer.auth.oauth.redirectUriHelp": "Copia la URI en las URI de redirección permitidas de la aplicación OAuth",
+  "mcpServer.auth.oauth.usernameLabel": "Nombre de usuario",
+  "mcpServer.auth.oauth.usernamePlaceholder": "p. ej. service-account",
+  "mcpServer.auth.oauth.passwordLabel": "Contraseña",
+  "mcpServer.auth.oauth.clientIdLabel": "ID de cliente",
+  "mcpServer.auth.oauth.clientIdPlaceholder": "p. ej. 8f3a2c1d-4b5e-4f6a-9c8d-1e2f3a4b5c6",
+  "mcpServer.auth.oauth.clientSecretLabel": "Secreto de cliente",
+  "mcpServer.auth.oauth.clientSecretPlaceholder": "p. ej. a1b2c3d4e5f6",
+  "mcpServer.auth.oauth.dcrHelp": "No es necesario para los servidores que admiten el registro dinámico de clientes (DCR)",
+  "mcpServer.auth.oauth.tokenUrlLabel": "URL del token",
+  "mcpServer.auth.oauth.tokenUrlPlaceholder": "p. ej. https://oauth.example.com/token",
+  "mcpServer.auth.oauth.tokenUrlHelp": "Intercambia códigos de autorización o credenciales por tokens de acceso",
+  "mcpServer.auth.oauth.authorizationUrlLabel": "URL de autorización",
+  "mcpServer.auth.oauth.authorizationUrlPlaceholder": "p. ej. https://oauth.example.com/authorize",
+  "mcpServer.auth.oauth.authorizationUrlHelp": "Adonde se redirige a los usuarios para iniciar sesión y otorgar acceso",
+  "mcpServer.auth.oauth.scopesLabel": "Ámbitos",
+  "mcpServer.auth.oauth.scopesDescription": "Lista de ámbitos de OAuth separados por espacios",
+  "mcpServer.auth.oauth.scopesPlaceholder": "p. ej. repo read:user...",
+  "mcpServer.auth.oauth.tokenManagement": "Gestión de tokens",
+  "mcpServer.auth.oauth.storeTokens": "Almacenar los tokens de acceso para reutilizarlos",
+  "mcpServer.auth.oauth.autoRefresh": "Actualizar automáticamente los tokens caducados",
+  "mcpServer.caCert.label": "Certificado de CA",
+  "mcpServer.caCert.upload": "Subir",
+  "mcpServer.caCert.hint": "Solo archivos de certificado público (.pem, .crt, .cer, .cert)",
+  "mcpServer.caCert.invalidFiles": "{count, plural, one {Tipo de archivo no válido: {files}.} other {Tipos de archivo no válidos: {files}.}} Solo se permiten archivos .pem, .crt, .cer y .cert.",
+  "mcpServer.caCert.filesSelected": "{count, plural, one {# archivo seleccionado correctamente.} other {# archivos seleccionados correctamente.}}",
+  "mcpServer.caCert.selected": "Seleccionados: {files}"
 }
diff --git a/src/i18n/locales/pt-BR/mcpServer.json b/src/i18n/locales/pt-BR/mcpServer.json
index 5eaa49f..e7014f9 100644
--- a/src/i18n/locales/pt-BR/mcpServer.json
+++ b/src/i18n/locales/pt-BR/mcpServer.json
@@ -3,6 +3,63 @@
   "mcpServer.delete.success": "{name} excluído.",
   "mcpServer.delete.errorTitle": "Erro ao excluir o servidor MCP",
   "mcpServer.neverUsed": "Nunca usado",
+  "mcpServer.loading": "Carregando servidores...",
+  "mcpServer.connect": "Conectar",
+  "mcpServer.error.loadingTitle": "Erro ao carregar os servidores",
+  "mcpServer.empty.title": "Conectar servidor MCP",
+  "mcpServer.empty.description": "Registre um servidor MCP para federar suas ferramentas, recursos e prompts e usá-los com um servidor virtual.",
+  "mcpServer.delete.title": "Excluir servidor MCP",
+  "mcpServer.delete.description": "Tem certeza de que deseja excluir este servidor MCP? Esta ação não pode ser desfeita.",
+  "mcpServer.tags.addError": "Falha ao adicionar a tag. Tente novamente.",
+  "mcpServer.form.connectTitle": "Conectar servidor MCP",
+  "mcpServer.form.editTitle": "Editar servidor MCP",
+  "mcpServer.form.intro": "O Context Forge vai descobrir as ferramentas, os recursos e os prompts do servidor. O servidor MCP deve estar em execução e acessível. Ou escolha um servidor no <catalog>catálogo de servidores MCP</catalog>.",
+  "mcpServer.form.fetchError": "Falha ao carregar os dados do servidor: {error}",
+  "mcpServer.form.transportLabel": "Tipo de transporte do servidor",
+  "mcpServer.form.nameLabel": "Nome",
+  "mcpServer.form.namePlaceholder": "Adicione o nome do servidor MCP...",
+  "mcpServer.form.urlLabel": "URL",
+  "mcpServer.form.urlPlaceholder": "Adicione a URL de um servidor MCP em execução...",
+  "mcpServer.form.descriptionLabel": "Descrição",
+  "mcpServer.form.descriptionPlaceholder": "Adicione uma descrição opcional...",
+  "mcpServer.form.required": "(obrigatório)",
+  "mcpServer.form.advancedSettings": "Configurações avançadas",
+  "mcpServer.form.oauthPending": "Aguardando a autorização OAuth na janela pop-up…",
+  "mcpServer.form.dismissOAuth": "Dispensar a notificação do OAuth",
+  "mcpServer.form.dismissFetchTools": "Dispensar a notificação de busca de ferramentas",
+  "mcpServer.form.connecting": "Conectando...",
+  "mcpServer.form.waitingOAuth": "Aguardando OAuth…",
+  "mcpServer.form.saveChanges": "Salvar alterações",
+  "mcpServer.form.connectServer": "Conectar servidor",
+  "mcpServer.table.caption": "Lista de servidores MCP com status e ações",
+  "mcpServer.table.name": "Nome",
+  "mcpServer.table.components": "Componentes",
+  "mcpServer.table.lastResponse": "Última resposta",
+  "mcpServer.table.uuid": "UUID",
+  "mcpServer.table.visibility": "Visibilidade",
+  "mcpServer.table.status": "Status",
+  "mcpServer.table.actions": "Ações",
+  "mcpServer.table.components.tools": "{count, plural, one {# ferramenta} other {# ferramentas}}",
+  "mcpServer.table.components.resources": "{count, plural, one {# recurso} other {# recursos}}",
+  "mcpServer.table.components.prompts": "{count, plural, one {# prompt} other {# prompts}}",
+  "mcpServer.table.copyUuid": "Copiar UUID de {name}",
+  "mcpServer.table.copied": "Copiado!",
+  "mcpServer.table.actions.label": "Ações para {name}",
+  "mcpServer.table.actions.openMenu": "Abrir menu de {name}",
+  "mcpServer.table.actions.viewDetails": "Ver detalhes",
+  "mcpServer.table.actions.edit": "Editar",
+  "mcpServer.table.actions.activate": "Ativar",
+  "mcpServer.table.actions.deactivate": "Desativar",
+  "mcpServer.table.actions.delete": "Excluir",
+  "mcpServer.status.active": "Ativo",
+  "mcpServer.status.warning": "Atenção",
+  "mcpServer.status.offline": "Offline",
+  "mcpServer.status.draft": "Rascunho",
+  "mcpServer.list.showing": "{count, plural, one {# servidor exibido} other {# servidores exibidos}}",
+  "mcpServer.list.perPage": "Por página:",
+  "mcpServer.list.loadMore": "Carregar mais",
+  "mcpServer.list.loadingMore": "Carregando...",
+  "mcpServer.list.loadMoreLabel": "Carregar mais servidores",
   "mcpServer.catalog.title": "Catálogo de servidores",
   "mcpServer.catalog.all": "Todos",
   "mcpServer.catalog.searchPlaceholder": "Pesquisar servidores MCP...",
@@ -36,5 +93,79 @@
   "mcpServer.catalog.noneConnected": "Nenhuma opção do catálogo de servidores MCP está conectada.",
   "mcpServer.catalog.disabled": "O catálogo de servidores está desabilitado para este gateway.",
   "mcpServer.catalog.error": "Não foi possível carregar o catálogo de servidores. Tente novamente.",
-  "mcpServer.catalog.retry": "Tentar novamente"
+  "mcpServer.catalog.retry": "Tentar novamente",
+  "mcpServer.advanced.visibilityPlaceholder": "Selecione a visibilidade",
+  "mcpServer.advanced.teamScoped": "Este servidor ficará restrito à equipe selecionada no momento",
+  "mcpServer.advanced.teamNotSelected": "Selecione uma equipe usando o seletor de equipes na barra lateral",
+  "mcpServer.advanced.authTypeLabel": "Tipo de autenticação",
+  "mcpServer.advanced.authType.none": "Nenhuma",
+  "mcpServer.advanced.authType.basic": "Básica",
+  "mcpServer.advanced.authType.bearer": "Token bearer",
+  "mcpServer.advanced.authType.custom": "Cabeçalhos personalizados",
+  "mcpServer.advanced.authType.oauth": "OAuth 2.0",
+  "mcpServer.advanced.authType.query": "Parâmetro de consulta",
+  "mcpServer.advanced.oneTimeAuthLabel": "Autenticação de uso único",
+  "mcpServer.advanced.oneTimeAuthDescription": "Use as credenciais uma vez, sem armazená-las. As verificações de integridade serão desativadas.",
+  "mcpServer.advanced.oneTimeAuthWarning": "Adicione cabeçalhos de encaminhamento quando a autenticação de uso único estiver ativada.",
+  "mcpServer.advanced.passthroughLabel": "Cabeçalhos de encaminhamento",
+  "mcpServer.advanced.passthroughDescription": "Adicione cabeçalhos separados por vírgula para encaminhar das requisições do cliente. Deixe vazio para usar os padrões globais.",
+  "mcpServer.advanced.passthroughPlaceholder": "ex.: Authorization, X-Tenant-Id, X-Trace-Id...",
+  "mcpServer.auth.none.description": "Não são necessárias credenciais para conectar. Adicione autenticação antes de usar este servidor em produção. Conheça as práticas recomendadas na <checklist>lista de verificação de segurança para produção</checklist>.",
+  "mcpServer.auth.basic.usernameLabel": "Nome de usuário",
+  "mcpServer.auth.basic.usernamePlaceholder": "Adicione o nome de usuário para a autenticação básica...",
+  "mcpServer.auth.basic.passwordLabel": "Senha",
+  "mcpServer.auth.basic.passwordPlaceholder": "Adicione a senha...",
+  "mcpServer.auth.bearer.label": "Token bearer",
+  "mcpServer.auth.bearer.description": "Adicione a chave de API ou o token emitido pelo servidor.",
+  "mcpServer.auth.bearer.placeholder": "Cole o token bearer...",
+  "mcpServer.auth.custom.descriptionOne": "Envie um cabeçalho personalizado em cada requisição.",
+  "mcpServer.auth.custom.descriptionMany": "Envie um ou mais cabeçalhos personalizados em cada requisição.",
+  "mcpServer.auth.custom.keyLabel": "Chave do cabeçalho",
+  "mcpServer.auth.custom.keyPlaceholderExample": "ex.: X-API-Key...",
+  "mcpServer.auth.custom.keyPlaceholder": "Adicione a chave do cabeçalho...",
+  "mcpServer.auth.custom.valueLabel": "Valor",
+  "mcpServer.auth.custom.valuePlaceholder": "Adicione o valor do cabeçalho...",
+  "mcpServer.auth.custom.addHeader": "Adicionar cabeçalho",
+  "mcpServer.auth.query.warning": "<strong>Aviso de segurança:</strong> chaves de API em URLs ficam visíveis em logs de proxy, no histórico do navegador e nos logs de acesso do servidor. Use apenas quando o servidor de origem não oferecer suporte à autenticação por cabeçalho.",
+  "mcpServer.auth.query.nameLabel": "Nome do parâmetro de consulta",
+  "mcpServer.auth.query.namePlaceholder": "ex.: api_key...",
+  "mcpServer.auth.query.apiKeyLabel": "Chave de API",
+  "mcpServer.auth.query.apiKeyPlaceholder": "ex.: a1b2c3d4e5f6789...",
+  "mcpServer.auth.oauth.grantTypeLabel": "Tipo de concessão",
+  "mcpServer.auth.oauth.grantTypePlaceholder": "Selecione o tipo de concessão",
+  "mcpServer.auth.oauth.grantType.authorizationCode": "Código de autorização (login do usuário)",
+  "mcpServer.auth.oauth.grantType.clientCredentials": "Credenciais do cliente (máquina a máquina)",
+  "mcpServer.auth.oauth.grantType.password": "Senha do proprietário do recurso (legado)",
+  "mcpServer.auth.oauth.issuerUrlLabel": "URL do emissor",
+  "mcpServer.auth.oauth.issuerUrlPlaceholder": "ex.: https://auth.example.com",
+  "mcpServer.auth.oauth.issuerUrlHelp": "URL base do servidor de autorização para descoberta de endpoints e registro dinâmico de clientes (DCR)",
+  "mcpServer.auth.oauth.redirectUriLabel": "URI de redirecionamento",
+  "mcpServer.auth.oauth.redirectUriPlaceholder": "ex.: https://gateway.example.com/oauth/callback",
+  "mcpServer.auth.oauth.redirectUriHelp": "Copie a URI para as URIs de redirecionamento permitidas do aplicativo OAuth",
+  "mcpServer.auth.oauth.usernameLabel": "Nome de usuário",
+  "mcpServer.auth.oauth.usernamePlaceholder": "ex.: service-account",
+  "mcpServer.auth.oauth.passwordLabel": "Senha",
+  "mcpServer.auth.oauth.clientIdLabel": "ID do cliente",
+  "mcpServer.auth.oauth.clientIdPlaceholder": "ex.: 8f3a2c1d-4b5e-4f6a-9c8d-1e2f3a4b5c6",
+  "mcpServer.auth.oauth.clientSecretLabel": "Segredo do cliente",
+  "mcpServer.auth.oauth.clientSecretPlaceholder": "ex.: a1b2c3d4e5f6",
+  "mcpServer.auth.oauth.dcrHelp": "Não é necessário para servidores que oferecem suporte ao registro dinâmico de clientes (DCR)",
+  "mcpServer.auth.oauth.tokenUrlLabel": "URL do token",
+  "mcpServer.auth.oauth.tokenUrlPlaceholder": "ex.: https://oauth.example.com/token",
+  "mcpServer.auth.oauth.tokenUrlHelp": "Troca códigos de autorização ou credenciais por tokens de acesso",
+  "mcpServer.auth.oauth.authorizationUrlLabel": "URL de autorização",
+  "mcpServer.auth.oauth.authorizationUrlPlaceholder": "ex.: https://oauth.example.com/authorize",
+  "mcpServer.auth.oauth.authorizationUrlHelp": "Para onde os usuários são redirecionados para fazer login e conceder acesso",
+  "mcpServer.auth.oauth.scopesLabel": "Escopos",
+  "mcpServer.auth.oauth.scopesDescription": "Lista de escopos OAuth separados por espaços",
+  "mcpServer.auth.oauth.scopesPlaceholder": "ex.: repo read:user...",
+  "mcpServer.auth.oauth.tokenManagement": "Gerenciamento de tokens",
+  "mcpServer.auth.oauth.storeTokens": "Armazenar tokens de acesso para reutilização",
+  "mcpServer.auth.oauth.autoRefresh": "Atualizar automaticamente os tokens expirados",
+  "mcpServer.caCert.label": "Certificado da AC",
+  "mcpServer.caCert.upload": "Enviar",
+  "mcpServer.caCert.hint": "Somente arquivos de certificado público (.pem, .crt, .cer, .cert)",
+  "mcpServer.caCert.invalidFiles": "{count, plural, one {Tipo de arquivo inválido: {files}.} other {Tipos de arquivo inválidos: {files}.}} Somente arquivos .pem, .crt, .cer e .cert são permitidos.",
+  "mcpServer.caCert.filesSelected": "{count, plural, one {# arquivo selecionado com sucesso.} other {# arquivos selecionados com sucesso.}}",
+  "mcpServer.caCert.selected": "Selecionados: {files}"
 }
diff --git a/src/pages/Resources.test.tsx b/src/pages/Resources.test.tsx
index 9b3bf84..92143ad 100644
--- a/src/pages/Resources.test.tsx
+++ b/src/pages/Resources.test.tsx
@@ -446,7 +446,7 @@ describe("Resources", () => {
       await user.click(moreOptionsButton);
 
       await waitFor(() => {
-        expect(screen.getByText("View Details")).toBeInTheDocument();
+        expect(screen.getByText("View details")).toBeInTheDocument();
       });
     });
 
@@ -468,7 +468,7 @@ describe("Resources", () => {
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
 
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -494,7 +494,7 @@ describe("Resources", () => {
 
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -527,7 +527,7 @@ describe("Resources", () => {
 
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -563,7 +563,7 @@ describe("Resources", () => {
 
       const moreOptionsButton = screen.getByLabelText("More options for multi-resource-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -595,7 +595,7 @@ describe("Resources", () => {
 
       const moreOptionsButtonA = screen.getByLabelText("More options for gateway-a");
       await user.click(moreOptionsButtonA);
-      let viewDetailsItem = await screen.findByText("View Details");
+      let viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -615,7 +615,7 @@ describe("Resources", () => {
 
       const moreOptionsButtonB = screen.getByLabelText("More options for gateway-b");
       await user.click(moreOptionsButtonB);
-      viewDetailsItem = await screen.findByText("View Details");
+      viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -631,7 +631,7 @@ describe("Resources", () => {
       await waitFor(() => expect(screen.getByText("test-gateway")).toBeInTheDocument());
 
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
 
       await waitFor(() => {
         expect(
@@ -716,7 +716,7 @@ describe("Resources", () => {
       renderWithRouter(<Resources />);
       await waitFor(() => expect(screen.getByText("test-gateway")).toBeInTheDocument());
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await user.click(await screen.findByLabelText("More options for Resource 1"));
       await user.click(await screen.findByText("Edit"));
 
@@ -736,7 +736,7 @@ describe("Resources", () => {
       renderWithRouter(<Resources />);
       await waitFor(() => expect(screen.getByText("test-gateway")).toBeInTheDocument());
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await user.click(await screen.findByLabelText("More options for Resource 1"));
       await user.click(await screen.findByText("Edit"));
 
@@ -869,7 +869,7 @@ describe("Resources", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText(`More options for ${gatewaySlug}`));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(
           screen.getByRole("region", { name: new RegExp(`Resources for ${gatewaySlug}`, "i") }),
@@ -906,7 +906,7 @@ describe("Resources", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText("More options for opt-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(
           screen.getByRole("region", { name: /Resources for opt-gateway/i }),
@@ -942,7 +942,7 @@ describe("Resources", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText("More options for rollback-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(
           screen.getByRole("region", { name: /Resources for rollback-gateway/i }),
@@ -1178,7 +1178,7 @@ describe("Resources", () => {
       const listCallsAfterLoad = resourcesListCalls;
 
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
 
       const drawer = await screen.findByRole("region", { name: /Resources for test-gateway/i });
       expect(within(drawer).queryByText("alerts")).not.toBeInTheDocument();
@@ -1208,7 +1208,7 @@ describe("Resources", () => {
       await waitFor(() => expect(screen.getByText("test-gateway")).toBeInTheDocument());
 
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       const drawer = await screen.findByRole("region", { name: /Resources for test-gateway/i });
 
       await user.click(within(drawer).getByRole("button", { name: "Add tags" }));
diff --git a/src/pages/Servers.test.tsx b/src/pages/Servers.test.tsx
index 20ee2ca..3e31397 100644
--- a/src/pages/Servers.test.tsx
+++ b/src/pages/Servers.test.tsx
@@ -211,7 +211,7 @@ describe("Servers", () => {
 
     renderWithRouter(<Servers />);
 
-    expect(screen.getByText("Loading servers, please wait...")).toBeInTheDocument();
+    expect(screen.getByText("Loading servers...")).toBeInTheDocument();
   });
 
   it("shows error alert when query fails", async () => {
diff --git a/src/pages/Servers.tsx b/src/pages/Servers.tsx
index 9f5c3f3..52ca231 100644
--- a/src/pages/Servers.tsx
+++ b/src/pages/Servers.tsx
@@ -209,11 +209,11 @@ export function Servers() {
         setAllServers((prev) => prev.map((s) => (s.id === updated.id ? updated : s)));
       } catch (err) {
         const detail = err instanceof ApiError ? extractApiErrorDetail(err.body) : null;
-        toast.error(detail || "Failed to add tag. Please try again.");
+        toast.error(detail || intl.formatMessage({ id: "mcpServer.tags.addError" }));
         throw err;
       }
     },
-    [setDetailsServer],
+    [setDetailsServer, intl],
   );
 
   useEffect(() => {
@@ -277,7 +277,7 @@ export function Servers() {
           className="flex items-center justify-center p-12"
         >
           <Loading />
-          <span className="sr-only">Loading servers, please wait...</span>
+          <span className="sr-only">{intl.formatMessage({ id: "mcpServer.loading" })}</span>
         </div>
       ) : (
         <>
@@ -288,7 +288,9 @@ export function Servers() {
               aria-live="assertive"
               aria-atomic="true"
             >
-              <h3 className="font-semibold mb-1">Error loading servers</h3>
+              <h3 className="font-semibold mb-1">
+                {intl.formatMessage({ id: "mcpServer.error.loadingTitle" })}
+              </h3>
               <p className="text-red-800 dark:text-red-200">{error}</p>
             </div>
           )}
@@ -325,7 +327,7 @@ export function Servers() {
                     onClick={() => setIsFormOpen(true)}
                   >
                     <Plus className="h-4 w-4" />
-                    Connect
+                    {intl.formatMessage({ id: "mcpServer.connect" })}
                   </Button>
                 </div>
               </div>
@@ -346,21 +348,21 @@ export function Servers() {
 
               <div className="flex items-center justify-between mt-6">
                 <div className="flex items-center gap-4">
-                  <div className="text-sm text-gray-600 dark:text-gray-400">
-                    Showing {filteredServers.length} server{filteredServers.length !== 1 ? "s" : ""}
+                  <div className="text-sm text-muted-foreground">
+                    {intl.formatMessage(
+                      { id: "mcpServer.list.showing" },
+                      { count: filteredServers.length },
+                    )}
                   </div>
                   <div className="flex items-center gap-2">
-                    <label
-                      htmlFor="limit-select"
-                      className="text-sm text-gray-600 dark:text-gray-400"
-                    >
-                      Per page:
+                    <label htmlFor="limit-select" className="text-sm text-muted-foreground">
+                      {intl.formatMessage({ id: "mcpServer.list.perPage" })}
                     </label>
                     <select
                       id="limit-select"
                       value={limit}
                       onChange={(e) => handleLimitChange(Number(e.target.value))}
-                      className="rounded-md border border-gray-300 dark:border-gray-700 bg-white dark:bg-gray-800 px-2 py-1 text-sm"
+                      className="rounded-md border border-border bg-background px-2 py-1 text-sm"
                     >
                       <option value={10}>10</option>
                       <option value={25}>25</option>
@@ -375,9 +377,11 @@ export function Servers() {
                     size="sm"
                     onClick={handleLoadMore}
                     disabled={loadingMore}
-                    aria-label="Load more servers"
+                    aria-label={intl.formatMessage({ id: "mcpServer.list.loadMoreLabel" })}
                   >
-                    {loadingMore ? "Loading..." : "Load More"}
+                    {intl.formatMessage({
+                      id: loadingMore ? "mcpServer.list.loadingMore" : "mcpServer.list.loadMore",
+                    })}
                   </Button>
                 )}
               </div>
@@ -388,13 +392,14 @@ export function Servers() {
                 <div className="flex size-6 shrink-0 items-center justify-center rounded-sm bg-orange-500">
                   <MCPIcon className="size-4 [&_path]:fill-black" />
                 </div>
-                <h2 className="text-base font-medium">Connect MCP server</h2>
+                <h2 className="text-base font-medium">
+                  {intl.formatMessage({ id: "mcpServer.empty.title" })}
+                </h2>
               </div>
 
               <div className="py-5">
                 <p className="text-sm text-foreground">
-                  Register a MCP server to federate its tools, resources, and prompts to use with a
-                  virtual server.
+                  {intl.formatMessage({ id: "mcpServer.empty.description" })}
                 </p>
               </div>
 
@@ -403,7 +408,7 @@ export function Servers() {
                 onClick={() => setIsFormOpen(true)}
               >
                 <Plus className="size-3" />
-                Connect
+                {intl.formatMessage({ id: "mcpServer.connect" })}
               </Button>
             </div>
           )}
@@ -413,10 +418,10 @@ export function Servers() {
       <ConfirmDialog
         open={deleteDialogOpen}
         onOpenChange={setDeleteDialogOpen}
-        title="Delete MCP Server"
-        description="Are you sure you want to delete this MCP server? This action cannot be undone."
-        confirmLabel="Delete"
-        cancelLabel="Cancel"
+        title={intl.formatMessage({ id: "mcpServer.delete.title" })}
+        description={intl.formatMessage({ id: "mcpServer.delete.description" })}
+        confirmLabel={intl.formatMessage({ id: "common.button.delete" })}
+        cancelLabel={intl.formatMessage({ id: "common.button.cancel" })}
         variant="destructive"
         onConfirm={confirmDelete}
       />
diff --git a/src/pages/Tools.test.tsx b/src/pages/Tools.test.tsx
index 575bfc7..2916979 100644
--- a/src/pages/Tools.test.tsx
+++ b/src/pages/Tools.test.tsx
@@ -146,7 +146,7 @@ describe("Tools", () => {
     });
 
     await user.click(screen.getByLabelText("More options for inactive-gateway"));
-    await user.click(await screen.findByText("View Details"));
+    await user.click(await screen.findByText("View details"));
 
     await waitFor(() => {
       expect(
@@ -182,7 +182,7 @@ describe("Tools", () => {
 
     await waitFor(() => expect(screen.getByText("described-gateway")).toBeInTheDocument());
     await user.click(screen.getByLabelText("More options for described-gateway"));
-    await user.click(await screen.findByText("View Details"));
+    await user.click(await screen.findByText("View details"));
 
     expect(await screen.findByText("Tools for repository automation")).toBeInTheDocument();
   });
@@ -647,7 +647,7 @@ describe("Tools", () => {
 
       // Dropdown menu should be visible
       await waitFor(() => {
-        expect(screen.getByText("View Details")).toBeInTheDocument();
+        expect(screen.getByText("View details")).toBeInTheDocument();
       });
     });
 
@@ -671,7 +671,7 @@ describe("Tools", () => {
       await user.click(moreOptionsButton);
 
       // Click View Details
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       // Details panel should be visible
@@ -698,7 +698,7 @@ describe("Tools", () => {
       // Open details panel
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       // Wait for panel to open
@@ -733,7 +733,7 @@ describe("Tools", () => {
       // Open details panel
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       // Wait for panel to open
@@ -771,7 +771,7 @@ describe("Tools", () => {
       // Open details panel
       const moreOptionsButton = screen.getByLabelText("More options for multi-tool-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       // Wait for panel to open
@@ -808,7 +808,7 @@ describe("Tools", () => {
       // Open details panel
       const moreOptionsButton = screen.getByLabelText("More options for mcp-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       // "MCP Server" appears in both the panel subtitle and Component details Type row
@@ -832,7 +832,7 @@ describe("Tools", () => {
       // Open details for gateway-a
       const moreOptionsButtonA = screen.getByLabelText("More options for gateway-a");
       await user.click(moreOptionsButtonA);
-      let viewDetailsItem = await screen.findByText("View Details");
+      let viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -852,7 +852,7 @@ describe("Tools", () => {
       // Open details for gateway-b
       const moreOptionsButtonB = screen.getByLabelText("More options for gateway-b");
       await user.click(moreOptionsButtonB);
-      viewDetailsItem = await screen.findByText("View Details");
+      viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -866,7 +866,7 @@ describe("Tools", () => {
     async function openDetailsPanel(gatewaySlug: string) {
       const user = userEvent.setup();
       await user.click(screen.getByLabelText(`More options for ${gatewaySlug}`));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() => {
         expect(
           screen.getByRole("region", { name: new RegExp(`Tools for ${gatewaySlug}`, "i") }),
@@ -1002,7 +1002,7 @@ describe("Tools", () => {
       const user = userEvent.setup();
       const moreOptionsButton = screen.getByLabelText(`More options for ${gatewaySlug}`);
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
       await waitFor(() => {
         expect(
@@ -1217,7 +1217,7 @@ describe("Tools", () => {
     async function openDetailsPanel(gatewaySlug: string) {
       const user = userEvent.setup();
       await user.click(screen.getByLabelText(`More options for ${gatewaySlug}`));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() => {
         expect(
           screen.getByRole("region", { name: new RegExp(`Tools for ${gatewaySlug}`, "i") }),
@@ -1404,7 +1404,7 @@ describe("Tools", () => {
       // Open details panel to see URL
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -1432,7 +1432,7 @@ describe("Tools", () => {
       // Open details panel to see visibility
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -1460,7 +1460,7 @@ describe("Tools", () => {
       // Open details panel to see version
       const moreOptionsButton = screen.getByLabelText("More options for test-gateway");
       await user.click(moreOptionsButton);
-      const viewDetailsItem = await screen.findByText("View Details");
+      const viewDetailsItem = await screen.findByText("View details");
       await user.click(viewDetailsItem);
 
       await waitFor(() => {
@@ -1559,7 +1559,7 @@ describe("Tools", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText(`More options for ${gatewaySlug}`));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(
           screen.getByRole("region", { name: new RegExp(`Tools for ${gatewaySlug}`, "i") }),
@@ -1596,7 +1596,7 @@ describe("Tools", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText("More options for opt-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(screen.getByRole("region", { name: /Tools for opt-gateway/i })).toBeInTheDocument(),
       );
@@ -1630,7 +1630,7 @@ describe("Tools", () => {
 
       const user = userEvent.setup();
       await user.click(screen.getByLabelText("More options for rollback-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       await waitFor(() =>
         expect(
           screen.getByRole("region", { name: /Tools for rollback-gateway/i }),
@@ -1887,7 +1887,7 @@ describe("Tools", () => {
       const listCallsAfterLoad = toolsListCalls;
 
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
 
       const drawer = await screen.findByRole("region", { name: /Tools for test-gateway/i });
       expect(within(drawer).queryByText("alerts")).not.toBeInTheDocument();
@@ -1915,7 +1915,7 @@ describe("Tools", () => {
       await waitFor(() => expect(screen.getByText("test-gateway")).toBeInTheDocument());
 
       await user.click(screen.getByLabelText("More options for test-gateway"));
-      await user.click(await screen.findByText("View Details"));
+      await user.click(await screen.findByText("View details"));
       const drawer = await screen.findByRole("region", { name: /Tools for test-gateway/i });
 
       await user.click(within(drawer).getByRole("button", { name: "Add tags" }));