fix(app): missing i18n keys

8 files changed, 80 insertions, 49 deletions

diff --git a/packages/app/src/components/dialog-connect-provider.tsx b/packages/app/src/components/dialog-connect-provider.tsx
index 63f3c5dbe..66c5bd0b8 100644
--- a/packages/app/src/components/dialog-connect-provider.tsx
+++ b/packages/app/src/components/dialog-connect-provider.tsx
@@ -33,7 +33,7 @@ export function DialogConnectProvider(props: { provider: string }) {
       globalSync.data.provider_auth[props.provider] ?? [
         {
           type: "api",
-          label: "API key",
+          label: language.t("provider.connect.method.apiKey"),
         },
       ],
   )
@@ -245,7 +245,7 @@ export function DialogConnectProvider(props: { provider: string }) {
                           <div class="text-14-regular text-text-base">
                             {language.t("provider.connect.opencodeZen.visit.prefix")}
                             <Link href="https://opencode.ai/zen" tabIndex={-1}>
-                              opencode.ai/zen
+                              {language.t("provider.connect.opencodeZen.visit.link")}
                             </Link>
                             {language.t("provider.connect.opencodeZen.visit.suffix")}
                           </div>
diff --git a/packages/app/src/components/dialog-select-mcp.tsx b/packages/app/src/components/dialog-select-mcp.tsx
index 25ef8df01..b91699561 100644
--- a/packages/app/src/components/dialog-select-mcp.tsx
+++ b/packages/app/src/components/dialog-select-mcp.tsx
@@ -77,7 +77,9 @@ export const DialogSelectMcp: Component = () => {
                     <span class="text-11-regular text-text-weaker">{language.t("mcp.status.disabled")}</span>
                   </Show>
                   <Show when={loading() === i.name}>
-                    <span class="text-11-regular text-text-weak">...</span>
+                    <span class="text-11-regular text-text-weak">
+                      {language.t("common.loading.ellipsis")}
+                    </span>
                   </Show>
                 </div>
                 <Show when={error()}>
diff --git a/packages/app/src/components/dialog-select-model.tsx b/packages/app/src/components/dialog-select-model.tsx
index a030e952b..4fd8af1b3 100644
--- a/packages/app/src/components/dialog-select-model.tsx
+++ b/packages/app/src/components/dialog-select-model.tsx
@@ -115,8 +115,8 @@ export const ModelSelectorPopover: Component<{
                 variant="ghost"
                 iconSize="normal"
                 class="size-6"
-                aria-label="Manage models"
-                title="Manage models"
+                aria-label={language.t("dialog.model.manage")}
+                title={language.t("dialog.model.manage")}
                 onClick={handleManage}
               />
             }
diff --git a/packages/app/src/components/model-tooltip.tsx b/packages/app/src/components/model-tooltip.tsx
index 14b4ba799..54550cf76 100644
--- a/packages/app/src/components/model-tooltip.tsx
+++ b/packages/app/src/components/model-tooltip.tsx
@@ -1,4 +1,5 @@
 import { Show, type Component } from "solid-js"
+import { useLanguage } from "@/context/language"
 
 type InputKey = "text" | "image" | "audio" | "video" | "pdf"
 type InputMap = Record<InputKey, boolean>
@@ -22,23 +23,31 @@ type ModelInfo = {
   }
 }
 
-function sourceName(model: ModelInfo) {
-  const value = `${model.id} ${model.name}`.toLowerCase()
-
-  if (/claude|anthropic/.test(value)) return "Anthropic"
-  if (/gpt|o[1-4]|codex|openai/.test(value)) return "OpenAI"
-  if (/gemini|palm|bard|google/.test(value)) return "Google"
-  if (/grok|xai/.test(value)) return "xAI"
-  if (/llama|meta/.test(value)) return "Meta"
+export const ModelTooltip: Component<{ model: ModelInfo; latest?: boolean; free?: boolean }> = (props) => {
+  const language = useLanguage()
+  const sourceName = (model: ModelInfo) => {
+    const value = `${model.id} ${model.name}`.toLowerCase()
 
-  return model.provider.name
-}
+    if (/claude|anthropic/.test(value)) return language.t("model.provider.anthropic")
+    if (/gpt|o[1-4]|codex|openai/.test(value)) return language.t("model.provider.openai")
+    if (/gemini|palm|bard|google/.test(value)) return language.t("model.provider.google")
+    if (/grok|xai/.test(value)) return language.t("model.provider.xai")
+    if (/llama|meta/.test(value)) return language.t("model.provider.meta")
 
-export const ModelTooltip: Component<{ model: ModelInfo; latest?: boolean; free?: boolean }> = (props) => {
+    return model.provider.name
+  }
+  const inputLabel = (value: string) => {
+    if (value === "text") return language.t("model.input.text")
+    if (value === "image") return language.t("model.input.image")
+    if (value === "audio") return language.t("model.input.audio")
+    if (value === "video") return language.t("model.input.video")
+    if (value === "pdf") return language.t("model.input.pdf")
+    return value
+  }
   const title = () => {
     const tags: Array<string> = []
-    if (props.latest) tags.push("Latest")
-    if (props.free) tags.push("Free")
+    if (props.latest) tags.push(language.t("model.tag.latest"))
+    if (props.free) tags.push(language.t("model.tag.free"))
     const suffix = tags.length ? ` (${tags.join(", ")})` : ""
     return `${sourceName(props.model)} ${props.model.name}${suffix}`
   }
@@ -46,22 +55,35 @@ export const ModelTooltip: Component<{ model: ModelInfo; latest?: boolean; free?
     if (props.model.capabilities) {
       const input = props.model.capabilities.input
       const order: Array<InputKey> = ["text", "image", "audio", "video", "pdf"]
-      const entries = order.filter((key) => input[key])
+      const entries = order.filter((key) => input[key]).map((key) => inputLabel(key))
       return entries.length ? entries.join(", ") : undefined
     }
-    return props.model.modalities?.input?.join(", ")
+    const raw = props.model.modalities?.input
+    if (!raw) return
+    const entries = raw.map((value) => inputLabel(value))
+    return entries.length ? entries.join(", ") : undefined
   }
   const reasoning = () => {
-    if (props.model.capabilities) return props.model.capabilities.reasoning ? "Allows reasoning" : "No reasoning"
-    return props.model.reasoning ? "Allows reasoning" : "No reasoning"
+    if (props.model.capabilities)
+      return props.model.capabilities.reasoning
+        ? language.t("model.tooltip.reasoning.allowed")
+        : language.t("model.tooltip.reasoning.none")
+    return props.model.reasoning
+      ? language.t("model.tooltip.reasoning.allowed")
+      : language.t("model.tooltip.reasoning.none")
   }
-  const context = () => `Context limit ${props.model.limit.context.toLocaleString()}`
+  const context = () =>
+    language.t("model.tooltip.context", { limit: props.model.limit.context.toLocaleString() })
 
   return (
     <div class="flex flex-col gap-1 py-1">
       <div class="text-13-medium">{title()}</div>
       <Show when={inputs()}>
-        {(value) => <div class="text-12-regular text-text-invert-base">Allows: {value()}</div>}
+        {(value) => (
+          <div class="text-12-regular text-text-invert-base">
+            {language.t("model.tooltip.allows", { inputs: value() })}
+          </div>
+        )}
       </Show>
       <div class="text-12-regular text-text-invert-base">{reasoning()}</div>
       <div class="text-12-regular text-text-invert-base">{context()}</div>
diff --git a/packages/app/src/components/prompt-input.tsx b/packages/app/src/components/prompt-input.tsx
index 35a74f43e..d80abf0c3 100644
--- a/packages/app/src/components/prompt-input.tsx
+++ b/packages/app/src/components/prompt-input.tsx
@@ -1696,7 +1696,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                   <Match when={working()}>
                     <div class="flex items-center gap-2">
                       <span>{language.t("prompt.action.stop")}</span>
-                      <span class="text-icon-base text-12-medium text-[10px]!">ESC</span>
+                      <span class="text-icon-base text-12-medium text-[10px]!">
+                        {language.t("common.key.esc")}
+                      </span>
                     </div>
                   </Match>
                   <Match when={true}>
diff --git a/packages/app/src/components/session/session-sortable-terminal-tab.tsx b/packages/app/src/components/session/session-sortable-terminal-tab.tsx
index 63efa54a8..03f07fa56 100644
--- a/packages/app/src/components/session/session-sortable-terminal-tab.tsx
+++ b/packages/app/src/components/session/session-sortable-terminal-tab.tsx
@@ -150,11 +150,11 @@ export function SortableTerminalTab(props: { terminal: LocalPTY; onClose?: () =>
             >
               <DropdownMenu.Item onSelect={edit}>
                 <Icon name="edit" class="w-4 h-4 mr-2" />
-                Rename
+                {language.t("common.rename")}
               </DropdownMenu.Item>
               <DropdownMenu.Item onSelect={close}>
                 <Icon name="close" class="w-4 h-4 mr-2" />
-                Close
+                {language.t("common.close")}
               </DropdownMenu.Item>
             </DropdownMenu.Content>
           </DropdownMenu.Portal>
diff --git a/packages/app/src/components/settings-general.tsx b/packages/app/src/components/settings-general.tsx
index c356b269b..69d180f9d 100644
--- a/packages/app/src/components/settings-general.tsx
+++ b/packages/app/src/components/settings-general.tsx
@@ -29,18 +29,19 @@ export const SettingsGeneral: Component = () => {
   )
 
   const fontOptions = [
-    { value: "ibm-plex-mono", label: "IBM Plex Mono" },
-    { value: "cascadia-code", label: "Cascadia Code" },
-    { value: "fira-code", label: "Fira Code" },
-    { value: "hack", label: "Hack" },
-    { value: "inconsolata", label: "Inconsolata" },
-    { value: "intel-one-mono", label: "Intel One Mono" },
-    { value: "jetbrains-mono", label: "JetBrains Mono" },
-    { value: "meslo-lgs", label: "Meslo LGS" },
-    { value: "roboto-mono", label: "Roboto Mono" },
-    { value: "source-code-pro", label: "Source Code Pro" },
-    { value: "ubuntu-mono", label: "Ubuntu Mono" },
-  ]
+    { value: "ibm-plex-mono", label: "font.option.ibmPlexMono" },
+    { value: "cascadia-code", label: "font.option.cascadiaCode" },
+    { value: "fira-code", label: "font.option.firaCode" },
+    { value: "hack", label: "font.option.hack" },
+    { value: "inconsolata", label: "font.option.inconsolata" },
+    { value: "intel-one-mono", label: "font.option.intelOneMono" },
+    { value: "jetbrains-mono", label: "font.option.jetbrainsMono" },
+    { value: "meslo-lgs", label: "font.option.mesloLgs" },
+    { value: "roboto-mono", label: "font.option.robotoMono" },
+    { value: "source-code-pro", label: "font.option.sourceCodePro" },
+    { value: "ubuntu-mono", label: "font.option.ubuntuMono" },
+  ] as const
+  const fontOptionsList = [...fontOptions]
 
   const soundOptions = [...SOUND_OPTIONS]
 
@@ -137,17 +138,21 @@ export const SettingsGeneral: Component = () => {
               description={language.t("settings.general.row.font.description")}
             >
               <Select
-                options={fontOptions}
-                current={fontOptions.find((o) => o.value === settings.appearance.font())}
+                options={fontOptionsList}
+                current={fontOptionsList.find((o) => o.value === settings.appearance.font())}
                 value={(o) => o.value}
-                label={(o) => o.label}
+                label={(o) => language.t(o.label)}
                 onSelect={(option) => option && settings.appearance.setFont(option.value)}
                 variant="secondary"
                 size="small"
                 triggerVariant="settings"
                 triggerStyle={{ "font-family": monoFontFamily(settings.appearance.font()), "min-width": "180px" }}
               >
-                {(option) => <span style={{ "font-family": monoFontFamily(option?.value) }}>{option?.label}</span>}
+                {(option) => (
+                  <span style={{ "font-family": monoFontFamily(option?.value) }}>
+                    {option ? language.t(option.label) : ""}
+                  </span>
+                )}
               </Select>
             </SettingsRow>
           </div>
@@ -203,7 +208,7 @@ export const SettingsGeneral: Component = () => {
                 options={soundOptions}
                 current={soundOptions.find((o) => o.id === settings.sounds.agent())}
                 value={(o) => o.id}
-                label={(o) => o.label}
+                label={(o) => language.t(o.label)}
                 onHighlight={(option) => {
                   if (!option) return
                   playSound(option.src)
@@ -227,7 +232,7 @@ export const SettingsGeneral: Component = () => {
                 options={soundOptions}
                 current={soundOptions.find((o) => o.id === settings.sounds.permissions())}
                 value={(o) => o.id}
-                label={(o) => o.label}
+                label={(o) => language.t(o.label)}
                 onHighlight={(option) => {
                   if (!option) return
                   playSound(option.src)
@@ -251,7 +256,7 @@ export const SettingsGeneral: Component = () => {
                 options={soundOptions}
                 current={soundOptions.find((o) => o.id === settings.sounds.errors())}
                 value={(o) => o.id}
-                label={(o) => o.label}
+                label={(o) => language.t(o.label)}
                 onHighlight={(option) => {
                   if (!option) return
                   playSound(option.src)
diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx
index a5103d90d..877fe8492 100644
--- a/packages/app/src/components/titlebar.tsx
+++ b/packages/app/src/components/titlebar.tsx
@@ -94,7 +94,7 @@ export function Titlebar() {
               variant="ghost"
               class="size-8 rounded-md"
               onClick={layout.mobileSidebar.toggle}
-              aria-label="Toggle menu"
+              aria-label={language.t("sidebar.menu.toggle")}
             />
           </div>
         </Show>
@@ -105,7 +105,7 @@ export function Titlebar() {
               variant="ghost"
               class="size-8 rounded-md"
               onClick={layout.mobileSidebar.toggle}
-              aria-label="Toggle menu"
+              aria-label={language.t("sidebar.menu.toggle")}
             />
           </div>
         </Show>
@@ -119,7 +119,7 @@ export function Titlebar() {
             variant="ghost"
             class="group/sidebar-toggle size-6 p-0"
             onClick={layout.sidebar.toggle}
-            aria-label="Toggle sidebar"
+            aria-label={language.t("command.sidebar.toggle")}
             aria-expanded={layout.sidebar.opened()}
           >
             <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">