@h-ai/cli 0.1.0-alpha.67 → 0.1.0-alpha.68

package/templates/apps/fullstack/packages/{{projectName}}-shared/messages/ja-JP.json.hbs

@@ -0,0 +1,105 @@
+{{! @skipIfEmpty }}
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "settings_title": "個人設定",
+  "settings_language": "言語",
+  "settings_theme": "テーマ",
+  "home_refresh": "更新",
+  "home_loading": "読み込み中…",
+  "home_error": "APIサービスに接続できません",
+  "nav_users": "ユーザー",
+  "nav_roles": "ロール",
+  "nav_audit": "監査ログ",
+  "navigation": "メインナビゲーション",
+  "open_menu": "ナビゲーションを開く",
+  "close_menu": "ナビゲーションを閉じる",
+  "logout": "ログアウト",
+  "login_title": "ログイン",
+  "login_description": "ログインしてアカウントとワークスペースを管理します",
+  "login_invalid": "アカウントまたはパスワードが正しくありません。再試行してください。",
+  "session_expired": "セッションの有効期限が切れています。再度ログインしてください。",
+  "saved": "変更を保存しました",
+  "save": "保存",
+  "edit": "編集",
+  "delete": "削除",
+  "cancel": "キャンセル",
+  "search": "検索",
+  "details": "詳細",
+  "created_at": "作成日時",
+  "enabled": "有効",
+  "disabled": "無効",
+  "all_statuses": "すべての状態",
+  "operation_failed": "操作を完了できませんでした。再試行してください。",
+  "network_error": "接続に失敗しました。ネットワークを確認して再試行してください。",
+  "forbidden": "この操作を行う権限がありません。",
+  "conflict": "このアカウントは既に存在するか、変更が現在のデータと競合しています。",
+  "validation_failed": "入力内容を確認して再試行してください。",
+  "settings_description": "プロフィール、環境設定、アカウントのセキュリティを管理します",
+  "profile_title": "プロフィール",
+  "preferences_title": "環境設定",
+  "preferences_description": "言語と外観の設定は、端末にかかわらずアカウントに適用されます。",
+  "password_title": "パスワードを変更",
+  "password_rules": "現在と異なるパスワードを選んでください。",
+  "password_changed": "パスワードを更新しました。新しいパスワードでログインしてください。",
+  "avatar_hint": "PNG、JPEG、WebPの画像をアップロードしてください。最大512KBです。",
+  "avatar_invalid": "512KB以下のPNG、JPEG、WebP画像を選択してください。",
+  "avatar_saved": "アバターを更新しました",
+  "avatar_upload": "アバターをアップロード",
+  "users_description": "アカウントの作成、ロールの割り当て、アクセスを管理します",
+  "users_search": "ユーザー名、名前、メールアドレスを検索",
+  "user_account": "アカウント",
+  "user_username": "ユーザー名",
+  "user_display_name": "表示名",
+  "user_email": "メールアドレス",
+  "user_password": "初期パスワード",
+  "user_role": "ロール",
+  "user_status": "状態",
+  "user_create": "ユーザーを追加",
+  "initial_password_rules": "{min}文字以上で入力してください。",
+  "account_enabled": "ログインを許可",
+  "users_empty": "一致するアカウントがありません。検索条件を変更するか、ユーザーを作成してください。",
+  "user_edit": "ユーザーを編集",
+  "user_deleted": "ユーザーを削除しました",
+  "user_delete_title": "ユーザーを削除",
+  "user_delete_confirm": "{name}を削除しますか？アカウントとアクセス権は完全に削除されます。",
+  "roles_description": "2つのロールでアクセスを管理します。ロールはユーザー管理から割り当ててください。",
+  "role_admin": "管理者",
+  "role_user": "ユーザー",
+  "role_admin_capabilities": "ユーザー、ロールの説明、監査ログを管理し、個人設定を更新できます。",
+  "role_user_capabilities": "プロフィール、アバター、言語、外観、パスワードを更新できます。",
+  "role_members": "メンバー{count}人",
+  "role_edit": "説明を編集",
+  "role_description": "説明",
+  "audit_description": "アカウントと管理操作の履歴を確認します",
+  "audit_actor": "実行者",
+  "audit_action": "操作",
+  "audit_resource": "リソース",
+  "audit_resource_id": "リソースID",
+  "audit_ip": "IPアドレス",
+  "audit_start": "開始",
+  "audit_end": "終了",
+  "audit_action_placeholder": "すべての操作",
+  "audit_resource_placeholder": "すべてのリソース",
+  "audit_system": "システム",
+  "audit_details": "監査ログの詳細",
+  "audit_date_invalid": "終了日は開始日以降にしてください。",
+  "api_not_configured": "サービスへの接続が設定されていません。管理者にお問い合わせください。",
+  "guide_overview_title": "管理ワークスペースを見てみましょう",
+  "guide_overview_description": "簡単な手順でワークスペース、個人設定、ヘルプを紹介します。いつでも終了でき、ヘルプセンターから再開できます。",
+  "guide_content_title": "ワークスペース",
+  "guide_content_description": "現在のページがここに表示されます。ナビゲーションで機能を切り替えます。利用できる操作は権限に応じて変わります。",
+  "guide_theme_title": "外観",
+  "guide_theme_description": "ライトとダークの表示を切り替えます。設定でさらに多くのテーマを選択できます。",
+  "guide_profile_title": "プロフィール",
+  "guide_profile_description": "アバターからプロフィールや設定を開き、個人情報やパスワードを管理できます。",
+  "guide_help_title": "ヘルプセンター",
+  "guide_help_description": "困ったときは、ここで説明を検索したり、製品ツアーを再生したりできます。",
+  "guide_profile_tour_title": "プロフィールを設定",
+  "guide_profile_tour_description": "個人情報、環境設定、パスワード設定の場所を紹介します。ツアーでは変更を送信しません。",
+  "guide_profile_form_description": "プロフィールの表示や編集、アバターの選択、変更の保存ができます。アップロードするファイルは、画面に表示された形式とサイズの条件を満たす必要があります。",
+  "guide_preferences_description": "言語とテーマの設定を保存します。画面とヘルプの言語は選択に従います。",
+  "guide_password_title": "パスワードを変更",
+  "guide_password_description": "現在のパスワード、新しいパスワード、確認用パスワードを入力します。送信前にパスワードのルールを確認してください。",
+  "guide_overview_article": "## はじめに\n\n- ナビゲーションから各機能を開きます。メニューと操作は現在の権限に応じて変わります。\n- ワークスペースには一覧、詳細、設定が表示されます。画面の説明に従い、送信前に入力内容を確認してください。\n- アバターからプロフィールと設定を開きます。\n- ヘルプボタンで説明を検索したり、ツアーを再生したりできます。\n\n## 初回ツアー\n\n「後で通知」を選ぶと1日間通知を停止します。「今後通知しない」は設定を保存します。完了したツアーは自動で表示されなくなりますが、手動で再生できます。",
+  "guide_profile_article": "## プロフィールと環境設定\n\nプロフィールを開くと個人情報やアバターを確認・更新できます。ファイルの条件を確認し、変更を保存して結果のメッセージを確認してください。外観と言語は設定で変更できます。\n\n## パスワード\n\nパスワードの変更には、現在のパスワード、新しいパスワード、確認用パスワードが必要です。画面のルールに従い、送信後に結果を確認してください。\n\n「ツアーを開始」で関連するページを開きます。ツアーが自動でフォームを保存したり、アカウントを変更したりすることはありません。"
+}

package/templates/apps/fullstack/packages/{{projectName}}-shared/src/lib/components/AdminWorkspace.svelte.hbs

@@ -59,7 +59,7 @@
 
 {#key store.locale}
   {#if store.initializing}
-    <div class='grid min-h-dvh place-items-center bg-base-200/50'><div class='w-72 space-y-4'><Skeleton variant='title' /><Skeleton count={3} /><p class='text-center text-sm text-base-content/50'>{m.home_loading()}</p></div></div>
+    <div role='status' aria-live='polite' class='grid min-h-dvh place-items-center bg-base-200/50'><div class='w-72 space-y-4'><Skeleton variant='title' /><Skeleton count={3} /><p class='text-center text-sm text-base-content/50'>{m.home_loading()}</p></div></div>
   {:else if !store.user || resetToken}
     <header class='border-b border-base-content/8 bg-base-100 px-6 py-3 text-sm font-medium'>{store.info?.name}</header>
     <main data-testid='login-page'>
@@ -78,11 +78,11 @@
     </main>
   {:else}
     <AppShell {platform} {store} onhelp={() => guide.openHelp()}>
-      <div class='space-y-5'>
+      <div class='flex min-h-0 flex-1 flex-col gap-5'>
         {#if store.error}<Alert variant='error' data-testid='error'>{store.error}</Alert>{/if}
         {#if store.notice}<Alert variant='success' data-testid='notice'>{store.notice}</Alert>{/if}
         {#await pageComponent}
-          <div class='space-y-4'><Skeleton variant='title' /><Skeleton count={3} /></div>
+          <div role='status' aria-label={m.home_loading()} class='space-y-4'><Skeleton variant='title' /><Skeleton count={3} /></div>
         {:then { default: Page }}
           <Page {store} />
         {/await}

package/templates/apps/fullstack/packages/{{projectName}}-shared/src/lib/components/AppShell.svelte.hbs

@@ -30,7 +30,7 @@
   }
 </script>
 
-<div class="flex min-h-dvh bg-base-200/50 text-base-content" class:hai-safe-area={platform === 'app'}>
+<div class="flex h-dvh overflow-hidden bg-base-200/50 text-base-content" class:hai-safe-area={platform === 'app'}>
   {#if menuOpen}
     <BareButton class="fixed inset-0 z-30 bg-black/30 lg:hidden" ariaLabel={m.close_menu()} onclick={() => { menuOpen = false }} />
   {/if}
@@ -48,8 +48,8 @@
     </nav>
     <div class="border-t border-base-content/8 p-4 text-xs text-base-content/40"><span data-testid="app-version">v{store.info?.version}</span></div>
   </aside>
-  <div class="flex min-w-0 flex-1 flex-col">
-    <header class="sticky top-0 z-20 flex h-16 items-center justify-between gap-2 border-b border-base-content/8 bg-base-100/95 px-3 backdrop-blur sm:px-4 lg:px-6">
+  <div class="flex min-h-0 min-w-0 flex-1 flex-col">
+    <header class="sticky top-0 z-20 flex h-16 shrink-0 items-center justify-between gap-2 border-b border-base-content/8 bg-base-100/95 px-3 backdrop-blur sm:px-4 lg:px-6">
       <div class="flex min-w-0 flex-1 items-center gap-2 sm:gap-3">
         <BareButton class="rounded-lg p-2 hover:bg-base-content/5 lg:hidden" ariaLabel={m.open_menu()} onclick={() => { menuOpen = !menuOpen }} data-testid="mobile-menu"><span class="icon-[tabler--menu-2] size-5"></span></BareButton>
         <span class="truncate text-sm font-medium">{title}</span>
@@ -66,7 +66,7 @@
         <Button variant="ghost" size="sm" loading={store.saving} onclick={() => void store.logout()} data-testid="logout">{m.logout()}</Button>
       </div>
     </header>
-    <main class="w-full min-w-0 flex-1 p-4 pb-8 sm:p-6 lg:p-8" data-guide="admin-content">{@render children()}</main>
-    <footer class="border-t border-base-content/8 px-6 py-3 text-center text-xs text-base-content/35">{store.info?.name} · v{store.info?.version}</footer>
+    <main class="flex min-h-0 w-full min-w-0 flex-1 flex-col overflow-auto p-4 pb-8 sm:p-6 lg:p-8" data-guide="admin-content">{@render children()}</main>
+    <footer class="shrink-0 border-t border-base-content/8 px-6 py-3 text-center text-xs text-base-content/35">{store.info?.name} · v{store.info?.version}</footer>
   </div>
 </div>

package/templates/apps/fullstack/packages/{{projectName}}-shared/src/lib/pages/audit.svelte.hbs

@@ -17,10 +17,10 @@
   ])
 </script>
 
-<section class="space-y-5" data-testid="audit-page">
-  <div><h1 class="text-xl font-semibold tracking-tight">{m.nav_audit()}</h1><p class="mt-1 text-sm text-base-content/50">{m.audit_description()}</p></div>
-  <div class="rounded-xl border border-base-content/8 bg-base-100">
-    <form class="grid items-end gap-3 border-b border-base-content/8 p-4 sm:grid-cols-2 xl:grid-cols-[repeat(4,minmax(0,1fr))_auto] [&_.fieldset]:p-0" onsubmit={(event) => {
+<section class="flex min-h-0 flex-1 flex-col gap-5" data-testid="audit-page">
+  <div class="shrink-0"><h1 class="text-xl font-semibold tracking-tight">{m.nav_audit()}</h1><p class="mt-1 text-sm text-base-content/50">{m.audit_description()}</p></div>
+  <div class="flex min-h-0 flex-1 flex-col overflow-hidden rounded-xl border border-base-content/8 bg-base-100">
+    <form class="grid shrink-0 items-end gap-3 border-b border-base-content/8 p-4 sm:grid-cols-2 xl:grid-cols-[repeat(4,minmax(0,1fr))_auto] [&_.fieldset]:p-0" onsubmit={(event) => {
       event.preventDefault()
       void store.loadAudit()
     }}>
@@ -30,8 +30,8 @@
       <div class="min-w-0 space-y-1"><label class="block text-xs text-base-content/60" for="audit-end">{m.audit_end()}</label><input id="audit-end" type="date" class="input block h-10 min-w-0 w-full" bind:value={store.auditEndDate} /></div>
       <Button type="submit" variant="outline" disabled={store.loading} class="h-10 w-full">{m.search()}</Button>
     </form>
-    <div class="overflow-x-auto">
-      <DataTable data={store.audit} {columns} keyField="id" loading={store.loading} striped={false}>
+    <div class="flex min-h-0 flex-1 flex-col overflow-auto">
+      <DataTable data={store.audit} {columns} keyField="id" loading={store.loading} striped={false} class="min-h-0 flex-1 overflow-auto">
         {#snippet cell(entry, key)}
           {#if key === 'createdAt'}<span class="whitespace-nowrap text-xs">{store.formatDate(entry.createdAt)}</span>
           {:else if key === 'username'}{entry.username || m.audit_system()}
@@ -42,7 +42,7 @@
         {#snippet actions(entry)}<Button size="xs" variant="ghost" onclick={() => { selected = entry }}>{m.details()}</Button>{/snippet}
       </DataTable>
     </div>
-    <div class="border-t border-base-content/8 p-4"><Pagination page={store.auditPage} total={store.auditTotal} pageSize={store.pageSize} onchange={page => void store.loadAudit(page)} /></div>
+    <div class="mt-auto shrink-0 border-t border-base-content/8 p-4"><Pagination page={store.auditPage} total={store.auditTotal} pageSize={store.pageSize} onchange={page => void store.loadAudit(page)} /></div>
   </div>
 </section>
 

package/templates/apps/fullstack/packages/{{projectName}}-shared/src/lib/pages/settings.svelte.hbs

@@ -10,7 +10,7 @@
 
   interface Props { store: ManagementStore }
   const { store }: Props = $props()
-  const languageOptions = $derived(locales.filter(locale => store.info?.supportedLocales.includes(locale)).map(locale => ({ value: locale, label: locale === 'zh-CN' ? '简体中文' : 'English' })))
+  const languageOptions = $derived(locales.filter(locale => store.info?.supportedLocales.includes(locale)).map(locale => ({ value: locale, label: locale === 'zh-CN' ? '简体中文' : locale === 'ja-JP' ? '日本語' : 'English' })))
   const themeOptions = AVAILABLE_THEMES.map(theme => ({ value: theme, label: getThemeInfo(theme)?.name ?? theme }))
 </script>
 

package/templates/apps/fullstack/packages/{{projectName}}-shared/src/lib/pages/users.svelte.hbs

@@ -63,16 +63,16 @@
   }
 </script>
 
-<section class="space-y-5" data-testid="users-page">
-  <div class="flex flex-wrap items-center justify-between gap-3">
+<section class="flex min-h-0 flex-1 flex-col gap-5" data-testid="users-page">
+  <div class="flex shrink-0 flex-wrap items-center justify-between gap-3">
     <div>
       <h1 class="text-xl font-semibold tracking-tight">{m.nav_users()}</h1>
       <p class="mt-1 text-sm text-base-content/50">{m.users_description()}</p>
     </div>
     <Button variant="primary" onclick={() => openEditor(null)} data-testid="create-user">{m.user_create()}</Button>
   </div>
-  <div class="rounded-xl border border-base-content/8 bg-base-100">
-    <form class="flex flex-wrap items-center gap-3 border-b border-base-content/8 p-4" onsubmit={(event) => {
+  <div class="flex min-h-0 flex-1 flex-col overflow-hidden rounded-xl border border-base-content/8 bg-base-100">
+    <form class="flex shrink-0 flex-wrap items-center gap-3 border-b border-base-content/8 p-4" onsubmit={(event) => {
       event.preventDefault()
       void store.loadUsers()
     }}>
@@ -82,8 +82,8 @@
       <div class="w-40"><Select bind:value={store.usersStatus} options={statusOptions} /></div>
       <Button type="submit" variant="outline" disabled={store.loading}>{m.search()}</Button>
     </form>
-    <div class="hidden overflow-x-auto md:block">
-      <DataTable data={store.users} {columns} keyField="id" loading={store.loading} striped={false}>
+    <div class="hidden min-h-0 flex-1 overflow-auto md:flex md:flex-col">
+      <DataTable data={store.users} {columns} keyField="id" loading={store.loading} striped={false} class="min-h-0 flex-1 overflow-auto">
         {#snippet cell(user, key)}
           {#if key === 'username'}
             <div class="flex items-center gap-3">
@@ -105,7 +105,7 @@
         {/snippet}
       </DataTable>
     </div>
-    <div class="space-y-3 p-4 md:hidden" data-testid="user-cards">
+    <div class="min-h-0 flex-1 space-y-3 overflow-auto p-4 md:hidden" data-testid="user-cards">
       {#if store.loading}
         <Skeleton count={3} />
       {:else if store.users.length === 0}
@@ -127,7 +127,7 @@
         {/each}
       {/if}
     </div>
-    <div class="border-t border-base-content/8 p-4">
+    <div class="mt-auto shrink-0 border-t border-base-content/8 p-4">
       <Pagination page={store.usersPage} total={store.usersTotal} pageSize={store.pageSize} onchange={page => void store.loadUsers(page)} />
     </div>
   </div>

package/templates/apps/fullstack/packages/{{projectName}}-shared/tests/api-client.test.ts.hbs

@@ -1,6 +1,5 @@
-import type { EncryptedPayload } from '@h-ai/crypto'
 import { HaiApiClientError } from '@h-ai/api-client'
-import { crypto, TRANSPORT_PROTOCOL } from '@h-ai/crypto'
+import { authenticateTransportRequest, createInMemoryKeyStore, crypto, TRANSPORT_PROTOCOL } from '@h-ai/crypto'
 import { afterAll, beforeAll, describe, expect, it, vi } from 'vitest'
 import { initializeManagementApi, managementApi, resolveAvatarUrl } from '../src/lib/api/api-client.js'
 
@@ -16,7 +15,10 @@ const runtimeInfo = {
 
 /** 使用真实 crypto 公共入口模拟对端，覆盖握手及双向加解密。 */
 function createServerFetch() {
-  const created = crypto.transport.createServer()
+  const key = crypto.asymmetric.generateKeyPair()
+  if (!key.success)
+    throw new Error(key.error.message)
+  const created = crypto.transport.createServer({ serverKeyRing: { activeKeyId: 'test-v1', keys: { 'test-v1': key.data } }, keyStore: createInMemoryKeyStore() })
   if (!created.success)
     throw new Error(created.error.message)
   const server = created.data
@@ -29,25 +31,22 @@ function createServerFetch() {
     if (url.pathname.endsWith('/_hai/key-exchange')) {
       const body = await request.json() as { clientPublicKey: string }
       const clientId = await server.registerClientKey(body.clientPublicKey)
-      return Response.json({ serverPublicKey: server.getServerPublicKey(), clientId })
+      return Response.json({ serverKeyId: server.getServerKeyId(), serverPublicKey: server.getServerPublicKey(), clientId })
     }
     const clientId = request.headers.get(TRANSPORT_PROTOCOL.CLIENT_ID_HEADER)
     if (!clientId)
       return Response.json({ success: false }, { status: 400 })
+    const verified = await authenticateTransportRequest(server, request)
+    if (!verified.success)
+      throw new Error(verified.error.message)
     let data: unknown = runtimeInfo
     if (url.pathname.endsWith('/app/echo')) {
       expect(request.headers.get(TRANSPORT_PROTOCOL.ENCRYPTED_HEADER)).toBe(TRANSPORT_PROTOCOL.ENCRYPTED_HEADER_VALUE)
-      const encrypted = await request.json() as EncryptedPayload
-      expect(JSON.stringify(encrypted)).not.toContain('private message')
-      const decrypted = server.decryptRequest(encrypted)
-      expect(decrypted.success).toBe(true)
-      if (!decrypted.success)
-        throw new Error(decrypted.error.message)
-      const payload = JSON.parse(decrypted.data) as { message: string }
+      const payload = JSON.parse(verified.data.plaintext) as { message: string }
       messages.push(payload.message)
       data = { message: payload.message, echoedAt: '2026-01-01T00:00:00.000Z', requestId: 'test-request' }
     }
-    const response = await server.encryptResponse(clientId, JSON.stringify({ success: true, data }))
+    const response = await server.encryptResponse(verified.data.context, JSON.stringify({ success: true, data }), 200)
     if (!response.success)
       throw new Error(response.error.message)
     return Response.json(response.data, { headers: { [TRANSPORT_PROTOCOL.ENCRYPTED_HEADER]: TRANSPORT_PROTOCOL.ENCRYPTED_HEADER_VALUE } })

package/templates/apps/fullstack/playwright.config.ts.hbs

@@ -1,5 +1,6 @@
 import process from 'node:process'
 import { defineConfig } from '@playwright/test'
+import { createE2eNotificationEnv, createE2eServerEnv, createE2eTransportRing } from './scripts/e2e-env.js'
 
 const defaultBaseURL = '{{#if fullstack.e2eFrontend}}http://127.0.0.1:{{fullstack.e2eFrontend.port}}{{else}}http://127.0.0.1:3000{{/if}}'
 const defaultServiceBaseURL = 'http://127.0.0.1:3000'
@@ -49,32 +50,39 @@ function resolvePortFromBaseUrl(urlString: string, fallbackPort: string): string
 
 export default defineConfig({
   testDir: './e2e',
+  // 多个界面验收共用管理员资料与引导状态，保留串行以免互相覆盖。
   fullyParallel: false,
   forbidOnly: !!process.env.CI,
-  retries: process.env.CI ? 2 : 0,
+  retries: 0,
   workers: 1,
   reporter: 'list',
   timeout: 30_000,
   use: {
     baseURL,
     channel: 'chrome',
-    trace: 'on-first-retry',
+    trace: 'retain-on-failure',
     screenshot: 'only-on-failure',
   },
   webServer: [
     {
       name: '{{fullstack.servPackageName}}',
-      command: 'pnpm --filter {{fullstack.servPackageName}} start',
-      env: {
+      command: 'pnpm --filter {{fullstack.servPackageName}} exec node dist/index.js',
+      env: createE2eServerEnv({
+        ...createE2eNotificationEnv(),
+        HAI_DB: JSON.stringify({ type: 'sqlite', database: `${process.env.HAI_E2E_DATA_ROOT}/fullstack.db` }),
+        HAI_CACHE: JSON.stringify({ type: 'memory' }),
+        HAI_STORAGE: JSON.stringify({ type: 'local', root: `${process.env.HAI_E2E_DATA_ROOT}/uploads` }),
+        HAI_VECDB: JSON.stringify({ type: 'lancedb', path: `${process.env.HAI_E2E_DATA_ROOT}/vecdb` }),
+        HAI_CRYPTO_TRANSPORT_SERVERKEYRING: createE2eTransportRing(),
         HOST: serviceHost,
         PORT: servicePort,
         // 仅供脚手架验收：生产启动必须由部署环境提供初始管理员密码。
         HAI_ADMIN_DEFAULT_PASSWORD: process.env.E2E_ADMIN_PASSWORD || 'Scaffold-test-Admin123!',
         HAI_CORE_NAME: process.env.HAI_CORE_NAME || 'Configured scaffold',
         HAI_CORE_VERSION: process.env.HAI_CORE_VERSION || '9.8.7',
-        HAI_CORE_ENV: process.env.HAI_CORE_ENV || 'test',
+        HAI_CORE_ENV: 'test',
         HAI_CORE_LOGGING_LEVEL: 'warn',
-      },
+      }),
       url: `${serviceBaseURL}/health`,
       reuseExistingServer: false,
       timeout: 120_000,
@@ -84,6 +92,7 @@ export default defineConfig({
       return {
         name: frontend.name,
         command: `pnpm --filter ${frontend.name} exec vite preview --host ${resolveHostFromBaseUrl(url, '127.0.0.1')} --port ${resolvePortFromBaseUrl(url, '3000')} --strictPort`,
+        env: createE2eServerEnv({ PUBLIC_API_BASE: serviceBaseURL }),
         url,
         reuseExistingServer: false,
         timeout: 120_000,

package/templates/apps/h5/messages/ja-JP.json

@@ -0,0 +1,40 @@
+{
+  "app_title": "H5アプリ",
+  "app_description": "hai Agent Frameworkで構築したH5モバイルアプリ",
+  "nav_home": "ホーム",
+  "nav_discover": "見つける",
+  "nav_profile": "プロフィール",
+  "page_home_title": "ホーム",
+  "page_home_desc": "H5アプリへようこそ",
+  "page_home_search": "検索...",
+  "page_home_feature1": "機能1",
+  "page_home_feature2": "機能2",
+  "page_home_feature3": "機能3",
+  "page_home_feature4": "機能4",
+  "page_home_latest": "最新情報",
+  "page_home_welcome": "H5アプリへようこそ",
+  "page_discover_title": "見つける",
+  "page_discover_desc": "さらに多くのコンテンツを探す。",
+  "page_profile_title": "プロフィール",
+  "page_profile_desc": "個人情報を管理します",
+  "page_profile_username": "ユーザー名",
+  "page_profile_login_hint": "タップしてログイン",
+  "page_profile_info": "個人情報",
+  "page_profile_settings": "設定",
+  "page_profile_about": "会社概要",
+  "auth_login_title": "ログイン",
+  "auth_login_submit": "ログイン",
+  "auth_login_loading": "ログイン中...",
+  "auth_login_failed": "ログインに失敗しました",
+  "auth_login_to_register": "アカウントをお持ちでない方は新規登録",
+  "auth_register_title": "登録",
+  "auth_register_submit": "登録",
+  "auth_register_loading": "登録中...",
+  "auth_register_failed": "登録に失敗しました",
+  "auth_register_to_login": "既にアカウントをお持ちの方はログイン",
+  "auth_label_username": "ユーザー名",
+  "auth_label_password": "パスワード",
+  "auth_label_confirm_password": "パスワードの確認",
+  "auth_error_network": "ネットワークエラー",
+  "auth_error_password_mismatch": "パスワードが一致しません"
+}

package/templates/apps/h5/src/routes/+layout.svelte.hbs

@@ -13,8 +13,8 @@
   import { page } from '$app/state'
 {{#if hasI18n}}
   import * as m from '$lib/paraglide/messages'
-  import { getLocale } from '$lib/paraglide/runtime.js'
-  import { AppBar, BottomNav, setGlobalLocale } from '@h-ai/ui'
+  import { getLocale, setLocale } from '$lib/paraglide/runtime.js'
+  import { AppBar, BottomNav, LanguageSwitch, setGlobalLocale } from '@h-ai/ui'
 {{else}}
   import { AppBar, BottomNav } from '@h-ai/ui'
 {{/if}}
@@ -49,6 +49,11 @@
   }
 {{#if hasI18n}}
 
+  function handleLanguageChange(language: string) {
+    setGlobalLocale(language)
+    setLocale(language as Parameters<typeof setLocale>[0])
+  }
+
   if (browser) {
     const paraglideLocale = getLocale()
     setGlobalLocale(paraglideLocale)
@@ -62,7 +67,13 @@
 
 <div class='hai-mobile-viewport'>
   <div class='hai-mobile-shell min-w-0'>
-    <AppBar title={page.data.appConfig.name} safeArea fixed={false} />
+    <AppBar title={page.data.appConfig.name} safeArea fixed={false}>
+{{#if hasI18n}}
+      {#snippet trailing()}
+        <LanguageSwitch currentLanguage={getLocale()} onchange={handleLanguageChange} compact />
+      {/snippet}
+{{/if}}
+    </AppBar>
     <main class='hai-mobile-main'>{@render children()}</main>
     <footer class='border-t border-base-300 bg-base-100 p-2 text-center text-xs text-base-content/60'>
       {page.data.appConfig.name} · {page.data.appConfig.version} · {page.data.appConfig.env}

package/templates/apps/mobile-app/messages/ja-JP.json

@@ -0,0 +1,36 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "app_title": "モバイルワークスペース",
+  "app_description": "hai Agent Framework + Capacitor + Svelte 5で構築したモバイルアプリ",
+  "boot_failed_title": "起動に失敗しました",
+  "common_retry": "再試行",
+  "common_refresh": "更新",
+  "common_enabled": "有効",
+  "common_disabled": "無効",
+  "nav_home": "ワークスペース",
+  "nav_tasks": "タスク",
+  "nav_profile": "プロフィール",
+  "hero_eyebrow": "モバイルワークスペース",
+  "hero_title": "モバイルを中心にした実用的な出発点",
+  "hero_subtitle": "Capacitorのネイティブ機能、安全なトークン保存、共通APIクライアント、@h-ai/uiのモバイルコンポーネントを組み込んでいます。",
+  "feature_native_title": "ネイティブ対応",
+  "feature_native_desc": "ステータスバー、セーフエリア、デバイスランタイムを設定済み。プッシュ通知やカメラなどのプラグインを追加できます。",
+  "feature_api_title": "共通API",
+  "feature_api_desc": "PUBLIC_API_BASEでバックエンドに接続します。ネイティブ端末ではトークンを安全なストレージに保存します。",
+  "status_title": "実行状態",
+  "status_api_label": "APIベースURL",
+  "status_runtime_label": "実行環境",
+  "status_runtime_native": "ネイティブアプリ",
+  "status_runtime_web": "ブラウザープレビュー",
+  "status_token_label": "トークン保存",
+  "status_token_native": "安全なストレージ",
+  "status_token_memory": "メモリー内保存",
+  "tasks_title": "本日のタスク",
+  "tasks_sync": "バックエンドAPIを接続",
+  "tasks_polish": "モバイルUXを改善",
+  "tasks_release": "ネイティブのパッケージ化を準備",
+  "profile_title": "アプリ設定",
+  "profile_language": "言語はParaglideに従います",
+  "profile_theme": "テーマは@h-ai/uiに従います",
+  "profile_secure": "機密トークンはlocalStorageに保存しません"
+}

package/templates/apps/mobile-app/src/App.svelte.hbs

@@ -6,7 +6,7 @@
 {{#if features.iam}}
   import { apiClient } from '@h-ai/api-client'
 {{/if}}
-  import { applyTheme, getSavedTheme, setGlobalLocale } from '@h-ai/ui'
+  import { applyTheme, getSavedTheme, LanguageSwitch, setGlobalLocale } from '@h-ai/ui'
 {{#if features.iam}}
   import { AuthPanel } from '@h-ai/ui/components/scenes/iam/index'
 {{/if}}
@@ -17,7 +17,7 @@
   import { initCapacitor, isNativeApp } from './lib/capacitor.js'
   import { HashRouter } from './lib/navigation/hash-router.svelte.js'
   import * as m from './lib/paraglide/messages.js'
-  import { getLocale } from './lib/paraglide/runtime.js'
+  import { getLocale, setLocale } from './lib/paraglide/runtime.js'
 
 {{#if features.iam}}
   const authActions = apiClient.createAuthActions(apiClient)
@@ -57,6 +57,7 @@
       document.title = appConfig.name
       applyTheme(getSavedTheme(), false)
       setGlobalLocale(getLocale())
+      document.documentElement.lang = getLocale()
       await initCapacitor()
       await initApi()
 {{#if features.iam}}
@@ -80,6 +81,11 @@
     }
   }
 
+  function handleLanguageChange(language: string): void {
+    setGlobalLocale(language)
+    setLocale(language as Parameters<typeof setLocale>[0])
+  }
+
   /** 切换底部导航；例如 handleTabChange('tasks') 会写入 #/tasks。 */
   function handleTabChange(id: string): void {
     router.navigate(`/${id}`)
@@ -101,7 +107,11 @@
 
 <div class='hai-mobile-viewport'>
   <div class='hai-mobile-shell min-w-0'>
-    <AppBar title={appConfig.name} safeArea fixed={false} class='bg-base-100/95 backdrop-blur border-base-content/8' />
+    <AppBar title={appConfig.name} safeArea fixed={false} class='bg-base-100/95 backdrop-blur border-base-content/8'>
+      {#snippet trailing()}
+        <LanguageSwitch currentLanguage={getLocale()} onchange={handleLanguageChange} compact />
+      {/snippet}
+    </AppBar>
     <main class='hai-mobile-main'>
       {#if booting}
         <div class='grid min-h-64 place-items-center'><span class='loading loading-spinner loading-lg'></span></div>