From 2f6d8e4dfb51c3dbed65ea3fba8cbeb956fc280a Mon Sep 17 00:00:00 2001
From: os-zhuang <jack@objectstack.ai>
Date: Thu, 11 Jun 2026 13:04:54 +0500
Subject: [PATCH] fix(i18n): localize the remaining hardcoded screen headers
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Found on the iPhone 17 simulator: the Language screen showed a hardcoded
English "Language" header while the rest of the app was Chinese. The same gap
existed on the Account, Packages, and Flow-detail screens. Route their
ScreenHeader titles through i18next (reusing `common.language`,
`more.sectionAccount`, `more.flows`; new `common.packages` in en/zh/ar).

Verified on device: the Language header now reads "语言". 1298 tests pass,
typecheck + lint clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 app/(app)/packages.tsx     | 4 +++-
 app/account.tsx            | 4 +++-
 app/flows/[name]/index.tsx | 4 ++--
 app/language.tsx           | 4 +++-
 locales/ar.json            | 3 ++-
 locales/en.json            | 3 ++-
 locales/zh.json            | 3 ++-
 7 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/app/(app)/packages.tsx b/app/(app)/packages.tsx
index df63e0b..f96f2c1 100644
--- a/app/(app)/packages.tsx
+++ b/app/(app)/packages.tsx
@@ -6,6 +6,7 @@ import {
   TouchableOpacity,
 } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
+import { useTranslation } from "react-i18next";
 import { Package, ToggleLeft, ToggleRight, Trash2 } from "lucide-react-native";
 import { usePackageManagement } from "~/hooks/usePackageManagement";
 import { Card, CardHeader, CardTitle, CardContent } from "~/components/ui/Card";
@@ -20,6 +21,7 @@ import { useConfirm } from "~/components/ui/ConfirmDialog";
  * Route: app/(app)/packages.tsx
  */
 export default function PackagesScreen() {
+  const { t } = useTranslation();
   const { packages, isLoading, error, refetch, enable, disable, uninstall } =
     usePackageManagement();
   const confirm = useConfirm();
@@ -53,7 +55,7 @@ export default function PackagesScreen() {
 
   return (
     <SafeAreaView className="flex-1 bg-background" edges={["left", "right"]}>
-      <ScreenHeader title="Packages" />
+      <ScreenHeader title={t("common.packages")} />
       <ScrollView className="flex-1 bg-background" contentContainerClassName="pb-4">
         {isLoading && !packages.length ? (
           <View className="p-4">
diff --git a/app/account.tsx b/app/account.tsx
index be51239..a6495ba 100644
--- a/app/account.tsx
+++ b/app/account.tsx
@@ -1,6 +1,7 @@
 import { useState } from "react";
 import { View, Text, ScrollView } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
+import { useTranslation } from "react-i18next";
 import { authClient } from "~/lib/auth-client";
 import { useAccount } from "~/hooks/useAccount";
 import { useTwoFactor } from "~/hooks/useTwoFactor";
@@ -40,6 +41,7 @@ function Section({ title, children }: { title: string; children: React.ReactNode
  * resend the verification email. Backed by `useAccount` → `client.auth.*`.
  */
 export default function AccountScreen() {
+  const { t } = useTranslation();
   const { data: session } = authClient.useSession();
   const user = session?.user;
   const { updateProfile, changePassword, changeEmail, resendVerification, isSaving } =
@@ -157,7 +159,7 @@ export default function AccountScreen() {
 
   return (
     <SafeAreaView className="flex-1 bg-background" edges={["left", "right"]}>
-      <ScreenHeader title="Account" />
+      <ScreenHeader title={t("more.sectionAccount")} />
 
       <ScrollView className="flex-1" showsVerticalScrollIndicator={false}>
         <Section title="Profile">
diff --git a/app/flows/[name]/index.tsx b/app/flows/[name]/index.tsx
index 1a5e920..8cf0028 100644
--- a/app/flows/[name]/index.tsx
+++ b/app/flows/[name]/index.tsx
@@ -68,7 +68,7 @@ export default function FlowDetailScreen() {
   if (isLoading) {
     return (
       <SafeAreaView className="flex-1 bg-background" edges={["left", "right"]}>
-        <ScreenHeader title="Flow" backFallback="/flows" />
+        <ScreenHeader title={t("more.flows")} backFallback="/flows" />
         <ListSkeleton count={5} />
       </SafeAreaView>
     );
@@ -77,7 +77,7 @@ export default function FlowDetailScreen() {
   if (error || !flow) {
     return (
       <SafeAreaView className="flex-1 bg-background" edges={["left", "right"]}>
-        <ScreenHeader title="Flow" backFallback="/flows" />
+        <ScreenHeader title={t("more.flows")} backFallback="/flows" />
         <EmptyState
           icon={Workflow}
           variant={error ? "error" : "default"}
diff --git a/app/language.tsx b/app/language.tsx
index 5021d89..537f8e2 100644
--- a/app/language.tsx
+++ b/app/language.tsx
@@ -1,5 +1,6 @@
 import { ScrollView } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
+import { useTranslation } from "react-i18next";
 import { ScreenHeader } from "~/components/common/ScreenHeader";
 import { LanguageSelector } from "~/components/common/LanguageSelector";
 
@@ -8,9 +9,10 @@ import { LanguageSelector } from "~/components/common/LanguageSelector";
  * (`setLanguage` → i18next), so the change applies live across every screen.
  */
 export default function LanguageScreen() {
+  const { t } = useTranslation();
   return (
     <SafeAreaView className="flex-1 bg-background" edges={["left", "right"]}>
-      <ScreenHeader title="Language" />
+      <ScreenHeader title={t("common.language")} />
       <ScrollView className="flex-1" contentContainerClassName="px-5 pt-4">
         <LanguageSelector />
       </ScrollView>
diff --git a/locales/ar.json b/locales/ar.json
index c186dfa..fab6bf7 100644
--- a/locales/ar.json
+++ b/locales/ar.json
@@ -23,7 +23,8 @@
     "refresh": "تحديث",
     "more": "المزيد",
     "settings": "الإعدادات",
-    "language": "اللغة"
+    "language": "اللغة",
+    "packages": "الحزم"
   },
   "auth": {
     "signIn": "تسجيل الدخول",
diff --git a/locales/en.json b/locales/en.json
index 496c2e5..0c3ab2e 100644
--- a/locales/en.json
+++ b/locales/en.json
@@ -23,7 +23,8 @@
     "refresh": "Refresh",
     "more": "More",
     "settings": "Settings",
-    "language": "Language"
+    "language": "Language",
+    "packages": "Packages"
   },
   "auth": {
     "signIn": "Sign In",
diff --git a/locales/zh.json b/locales/zh.json
index 069ed3c..6784f44 100644
--- a/locales/zh.json
+++ b/locales/zh.json
@@ -23,7 +23,8 @@
     "refresh": "刷新",
     "more": "更多",
     "settings": "设置",
-    "language": "语言"
+    "language": "语言",
+    "packages": "应用包"
   },
   "auth": {
     "signIn": "登录",