fix: StableText uses both en+zh references for stable button width

StableText previously used a single reference (either hardcoded English
or dynamic t()), so buttons always jumped width on language switch.
Now uses both translations.en[key] and translations.zh[key] as invisible
grid references — width is always max(en, zh), never changes.

Also fix self-update: run git checkout -- . before git pull to discard
local modifications (e.g. package-lock.json drift) that block the pull.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/self-update.ts

@@ -311,6 +311,8 @@ export async function applyProxySelfUpdate(): Promise<{ started: boolean; restar
 
   try {
     console.log("[SelfUpdate] Pulling latest code...");
+    // Discard local modifications (e.g. package-lock.json drift) that would block git pull
+    await execFileAsync("git", ["checkout", "--", "."], { cwd, timeout: 10000 }).catch(() => {});
     await execFileAsync("git", ["pull", "origin", "master"], { cwd, timeout: 60000 });
 
     console.log("[SelfUpdate] Installing dependencies...");

web/src/components/Header.tsx

@@ -1,4 +1,5 @@
 import { useI18n } from "../../../shared/i18n/context";
+import { translations, type TranslationKey } from "../../../shared/i18n/translations";
 import { useTheme } from "../../../shared/theme/context";
 
 const SVG_MOON = (
@@ -13,11 +14,15 @@ const SVG_SUN = (
   </svg>
 );
 
-/** Stable-width text: invisible reference sets min-width, visible text overlays it. */
-function StableText({ reference, children, class: cls }: { reference: string; children: string; class?: string }) {
+/**
+ * Stable-width text: two invisible references (en + zh) set min-width via grid overlap.
+ * The visible text overlays them, so the button never changes width on language switch.
+ */
+function StableText({ tKey, children, class: cls }: { tKey: TranslationKey; children: string; class?: string }) {
   return (
     <span class={`inline-grid ${cls ?? ""}`}>
-      <span class="invisible col-start-1 row-start-1 whitespace-nowrap">{reference}</span>
+      <span class="invisible col-start-1 row-start-1 whitespace-nowrap">{translations.en[tKey]}</span>
+      <span class="invisible col-start-1 row-start-1 whitespace-nowrap">{translations.zh[tKey]}</span>
       <span class="col-start-1 row-start-1 whitespace-nowrap">{children}</span>
     </span>
   );
@@ -74,7 +79,7 @@ export function Header({ onAddAccount, onCheckUpdate, onOpenUpdateModal, checkin
                 <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75" />
                 <span class="relative inline-flex rounded-full h-2.5 w-2.5 bg-primary" />
               </span>
-              <StableText reference={t("serverOnline")} class="text-xs font-semibold text-primary">{t("serverOnline")}</StableText>
+              <StableText tKey="serverOnline" class="text-xs font-semibold text-primary">{t("serverOnline")}</StableText>
               {version && (
                 <span class="text-[0.65rem] font-mono text-primary/70 whitespace-nowrap">v{version}</span>
               )}
@@ -92,7 +97,7 @@ export function Header({ onAddAccount, onCheckUpdate, onOpenUpdateModal, checkin
               <svg class="size-3.5" viewBox="0 0 24 24" fill="currentColor">
                 <path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
               </svg>
-              <StableText reference={t("starOnGithub")} class="text-xs font-semibold">{t("starOnGithub")}</StableText>
+              <StableText tKey="starOnGithub" class="text-xs font-semibold">{t("starOnGithub")}</StableText>
             </a>
             {/* Check for Updates */}
             <button
@@ -103,7 +108,7 @@ export function Header({ onAddAccount, onCheckUpdate, onOpenUpdateModal, checkin
               <svg class={`size-3.5 ${checking ? "animate-spin" : ""}`} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.992 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182M20.985 4.356v4.992" />
               </svg>
-              <StableText reference={t("checkForUpdates")} class="text-xs font-semibold">{checking ? t("checkingUpdates") : t("checkForUpdates")}</StableText>
+              <StableText tKey="checkForUpdates" class="text-xs font-semibold">{checking ? t("checkingUpdates") : t("checkForUpdates")}</StableText>
             </button>
             {/* Update status message */}
             {updateStatusMsg && !checking && (
@@ -140,7 +145,7 @@ export function Header({ onAddAccount, onCheckUpdate, onOpenUpdateModal, checkin
                   <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 11-3 0m3 0a1.5 1.5 0 10-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 01-3 0m3 0a1.5 1.5 0 00-3 0m-9.75 0h9.75" />
                   </svg>
-                  <StableText reference={t("proxySettings")} class="text-xs font-semibold">{t("proxySettings")}</StableText>
+                  <StableText tKey="proxySettings" class="text-xs font-semibold">{t("proxySettings")}</StableText>
                 </a>
                 <button
                   onClick={onAddAccount}
@@ -149,7 +154,7 @@ export function Header({ onAddAccount, onCheckUpdate, onOpenUpdateModal, checkin
                   <svg class="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
                   </svg>
-                  <StableText reference={t("addAccount")}>{t("addAccount")}</StableText>
+                  <StableText tKey="addAccount">{t("addAccount")}</StableText>
                 </button>
               </>
             )}