feat(web): i18n (#12471)

packages/console/app/src/routes/[...404].tsx

@@ -3,11 +3,13 @@ import { Title } from "@solidjs/meta"
 import { HttpStatusCode } from "@solidjs/start"
 import logoLight from "../asset/logo-ornate-light.svg"
 import logoDark from "../asset/logo-ornate-dark.svg"
+import { useI18n } from "~/context/i18n"
 
 export default function NotFound() {
+  const i18n = useI18n()
   return (
     <main data-page="not-found">
-      <Title>Not Found | opencode</Title>
+      <Title>{i18n.t("notFound.title")}</Title>
       <HttpStatusCode code={404} />
       <div data-component="content">
         <section data-component="top">
@@ -15,21 +17,21 @@ export default function NotFound() {
             <img data-slot="logo light" src={logoLight} alt="opencode logo light" />
             <img data-slot="logo dark" src={logoDark} alt="opencode logo dark" />
           </a>
-          <h1 data-slot="title">404 - Page Not Found</h1>
+          <h1 data-slot="title">{i18n.t("notFound.heading")}</h1>
         </section>
 
         <section data-component="actions">
           <div data-slot="action">
-            <a href="/">Home</a>
+            <a href="/">{i18n.t("notFound.home")}</a>
           </div>
           <div data-slot="action">
-            <a href="/docs">Docs</a>
+            <a href="/docs">{i18n.t("notFound.docs")}</a>
           </div>
           <div data-slot="action">
-            <a href="https://github.com/anomalyco/opencode">GitHub</a>
+            <a href="https://github.com/anomalyco/opencode">{i18n.t("notFound.github")}</a>
           </div>
           <div data-slot="action">
-            <a href="/discord">Discord</a>
+            <a href="/discord">{i18n.t("notFound.discord")}</a>
           </div>
         </section>
       </div>