wip(app): i18n

packages/app/src/components/dialog-select-server.tsx

@@ -10,6 +10,7 @@ import { normalizeServerUrl, serverDisplayName, useServer } from "@/context/serv
 import { usePlatform } from "@/context/platform"
 import { createOpencodeClient } from "@opencode-ai/sdk/v2/client"
 import { useNavigate } from "@solidjs/router"
+import { useLanguage } from "@/context/language"
 
 type ServerStatus = { healthy: boolean; version?: string }
 
@@ -30,6 +31,7 @@ export function DialogSelectServer() {
   const dialog = useDialog()
   const server = useServer()
   const platform = usePlatform()
+  const language = useLanguage()
   const [store, setStore] = createStore({
     url: "",
     adding: false,
@@ -109,7 +111,7 @@ export function DialogSelectServer() {
     setStore("adding", false)
 
     if (!result.healthy) {
-      setStore("error", "Could not connect to server")
+      setStore("error", language.t("dialog.server.add.error"))
       return
     }
 
@@ -122,11 +124,11 @@ export function DialogSelectServer() {
   }
 
   return (
-    <Dialog title="Servers" description="Switch which OpenCode server this app connects to.">
+    <Dialog title={language.t("dialog.server.title")} description={language.t("dialog.server.description")}>
       <div class="flex flex-col gap-4 pb-4">
         <List
-          search={{ placeholder: "Search servers", autofocus: true }}
-          emptyMessage="No servers yet"
+          search={{ placeholder: language.t("dialog.server.search.placeholder"), autofocus: true }}
+          emptyMessage={language.t("dialog.server.empty")}
           items={sortedItems}
           key={(x) => x}
           current={current()}
@@ -168,14 +170,14 @@ export function DialogSelectServer() {
 
         <div class="mt-6 px-3 flex flex-col gap-1.5">
           <div class="px-3">
-            <h3 class="text-14-regular text-text-weak">Add a server</h3>
+            <h3 class="text-14-regular text-text-weak">{language.t("dialog.server.add.title")}</h3>
           </div>
           <form onSubmit={handleSubmit}>
             <div class="flex items-start gap-2">
               <div class="flex-1 min-w-0 h-auto">
                 <TextField
                   type="text"
-                  label="Server URL"
+                  label={language.t("dialog.server.add.url")}
                   hideLabel
                   placeholder="http://localhost:4096"
                   value={store.url}
@@ -188,7 +190,7 @@ export function DialogSelectServer() {
                 />
               </div>
               <Button type="submit" variant="secondary" icon="plus-small" size="large" disabled={store.adding}>
-                {store.adding ? "Checking..." : "Add"}
+                {store.adding ? language.t("dialog.server.add.checking") : language.t("dialog.server.add.button")}
               </Button>
             </div>
           </form>
@@ -197,9 +199,9 @@ export function DialogSelectServer() {
         <Show when={isDesktop}>
           <div class="mt-6 px-3 flex flex-col gap-1.5">
             <div class="px-3">
-              <h3 class="text-14-regular text-text-weak">Default server</h3>
+              <h3 class="text-14-regular text-text-weak">{language.t("dialog.server.default.title")}</h3>
               <p class="text-12-regular text-text-weak mt-1">
-                Connect to this server on app launch instead of starting a local server. Requires restart.
+                {language.t("dialog.server.default.description")}
               </p>
             </div>
             <div class="flex items-center gap-2 px-3 py-2">
@@ -208,7 +210,7 @@ export function DialogSelectServer() {
                 fallback={
                   <Show
                     when={server.url}
-                    fallback={<span class="text-14-regular text-text-weak">No server selected</span>}
+                    fallback={<span class="text-14-regular text-text-weak">{language.t("dialog.server.default.none")}</span>}
                   >
                     <Button
                       variant="secondary"
@@ -218,7 +220,7 @@ export function DialogSelectServer() {
                         defaultUrlActions.refetch(server.url)
                       }}
                     >
-                      Set current server as default
+                      {language.t("dialog.server.default.set")}
                     </Button>
                   </Show>
                 }
@@ -234,7 +236,7 @@ export function DialogSelectServer() {
                     defaultUrlActions.refetch()
                   }}
                 >
-                  Clear
+                  {language.t("dialog.server.default.clear")}
                 </Button>
               </Show>
             </div>