@h-ai/cli 0.1.0-alpha.56 → 0.1.0-alpha.58

package/templates/apps/fullstack/apps/{{projectName}}-desktop/src/App.svelte.hbs

@@ -1,152 +1,21 @@
 {{! @skipIfEmpty }}
 {{#if fullstack.frontends.desktop}}
 <script lang="ts">
-  import type { AppInfo } from '{{fullstack.sharedPackageName}}'
-  import * as appM from './lib/paraglide/messages.js'
+  import type { ManagementApiOptions } from '{{fullstack.sharedPackageName}}'
+  import { apiClient } from '@h-ai/api-client'
+  import { AdminWorkspace } from '{{fullstack.sharedPackageName}}'
   import { setLocale } from './lib/paraglide/runtime.js'
-  import { Alert, Button, Card, Skeleton } from '@h-ai/ui'
-  import { onMount } from 'svelte'
-  import { AppShell, fetchAppInfo, messages as sharedM } from '{{fullstack.sharedPackageName}}'
 
-  let info = $state<AppInfo | null>(null)
-  let loading = $state(true)
-  let errorMessage = $state('')
-
-  function syncLocale(locale: string) {
-    setLocale(locale as Parameters<typeof setLocale>[0])
+  const native = '__TAURI_INTERNALS__' in globalThis
+  const apiOptions: ManagementApiOptions = {
+    clientName: '{{projectName}}-desktop',
+    ...(native ? { requireApiBase: true, tokenStorage: apiClient.tokenStorage.memory(), headers: { 'X-HAI-Token-Transport': 'body' } } : {}),
   }
 
-  async function refreshStatus() {
-    loading = true
-    errorMessage = ''
-    try {
-      info = await fetchAppInfo({ clientName: '{{projectName}}-desktop' })
-    }
-    catch {
-      info = null
-      errorMessage = sharedM.home_error()
-    }
-    finally {
-      loading = false
-    }
+  function syncLocale(locale: string) {
+    setLocale(locale as Parameters<typeof setLocale>[0], { reload: false })
   }
-
-  onMount(() => {
-    document.title = appM.page_title({ name: sharedM.app_name() })
-    void refreshStatus()
-  })
 </script>
 
-<AppShell platform="desktop" onLocaleChange={syncLocale}>
-  <section class="space-y-8">
-    <div class="grid gap-6 lg:grid-cols-[1.2fr_0.8fr]">
-      <section class="relative overflow-hidden rounded-[1.5rem] border border-base-300/70 bg-base-100 p-6 shadow-xl lg:p-10">
-        <div class="max-w-2xl space-y-6">
-          <span class="badge badge-primary badge-lg gap-2">
-            <span class="icon-[tabler--device-desktop] size-4"></span>
-            {appM.hero_badge()}
-          </span>
-          <div class="space-y-4">
-            <h1 class="text-4xl font-black tracking-tight text-base-content sm:text-5xl">
-              {appM.hero_title({ name: sharedM.app_name() })}
-            </h1>
-            <p class="max-w-xl text-lg leading-8 text-base-content/70">
-              {appM.hero_subtitle()}
-            </p>
-          </div>
-          <div class="flex flex-wrap gap-3">
-            <a class="btn btn-primary" href="#status">
-              <span class="icon-[tabler--activity-heartbeat] size-5"></span>
-              {appM.hero_primary_action()}
-            </a>
-            <a class="btn btn-ghost" href="#customize">
-              <span class="icon-[tabler--adjustments] size-5"></span>
-              {appM.hero_secondary_action()}
-            </a>
-          </div>
-        </div>
-      </section>
-
-      <aside class="rounded-[1.5rem] border border-base-300/70 bg-base-100 p-5 shadow-lg">
-        <div class="mockup-window border border-base-300 bg-base-200/70">
-          <div class="space-y-4 bg-base-100 p-5">
-            <div class="flex items-center justify-between">
-              <div>
-                <p class="text-sm font-semibold">{appM.preview_title()}</p>
-                <p class="text-xs text-base-content/55">{appM.preview_body()}</p>
-              </div>
-              <span class="badge badge-success badge-outline">{appM.platform_name()}</span>
-            </div>
-            <div class="grid gap-3 text-sm">
-              <div class="rounded-2xl bg-primary/10 p-4">
-                <span class="icon-[tabler--components] mb-2 size-6 text-primary"></span>
-                <p class="font-semibold">{appM.preview_metric_shared()}</p>
-              </div>
-              <div class="grid grid-cols-2 gap-3">
-                <div class="rounded-2xl bg-secondary/10 p-4">
-                  <span class="icon-[tabler--language] mb-2 size-6 text-secondary"></span>
-                  <p class="font-semibold">{appM.preview_metric_local()}</p>
-                </div>
-                <div class="rounded-2xl bg-accent/10 p-4">
-                  <span class="icon-[tabler--palette] mb-2 size-6 text-accent"></span>
-                  <p class="font-semibold">{appM.preview_metric_theme()}</p>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </aside>
-    </div>
-
-    <div class="grid gap-6 lg:grid-cols-[0.95fr_1.05fr]">
-      <div id="status">
-        <Card title={appM.status_title()} bordered shadow="md" class="bg-base-100">
-          <p class="mb-5 text-sm text-base-content/65">{appM.status_description()}</p>
-          {#if loading}
-            <Skeleton variant="title" class="mb-3" />
-            <Skeleton count={3} />
-            <p class="sr-only" data-testid="service-status">{sharedM.home_loading()}</p>
-          {:else if info}
-            <Alert variant="success" title={appM.status_online({ name: info.name })}>
-              <p data-testid="service-status">{info.name}</p>
-            </Alert>
-            <dl class="mt-5 grid gap-3 text-sm sm:grid-cols-2">
-              <div class="rounded-box border border-base-300/70 bg-base-200/60 p-4">
-                <dt class="text-xs text-base-content/55">{appM.status_version()}</dt>
-                <dd class="mt-1 font-semibold">{info.version}</dd>
-              </div>
-              <div class="rounded-box border border-base-300/70 bg-base-200/60 p-4">
-                <dt class="text-xs text-base-content/55">{appM.status_started({ time: info.startedAt })}</dt>
-                <dd class="mt-1 font-semibold">{appM.status_frontends_count({ count: String(info.frontends.length) })}</dd>
-              </div>
-            </dl>
-          {:else}
-            <Alert variant="error" title={sharedM.home_error()}>
-              <p data-testid="service-status">{errorMessage}</p>
-            </Alert>
-          {/if}
-
-          <div class="mt-5">
-            <Button type="button" variant="primary" loading={loading} onclick={refreshStatus}>
-              {sharedM.home_refresh()}
-            </Button>
-          </div>
-        </Card>
-      </div>
-
-      <section id="customize" class="grid gap-4 sm:grid-cols-2">
-        <div class="rounded-[1.5rem] border border-base-300/70 bg-base-100 p-5 shadow-md">
-          <span class="icon-[tabler--package] mb-4 size-7 text-primary"></span>
-          <h2 class="text-lg font-bold">{appM.custom_shared_title()}</h2>
-          <p class="mt-2 text-sm leading-6 text-base-content/65">{appM.custom_shared_body()}</p>
-        </div>
-        <div class="rounded-[1.5rem] border border-base-300/70 bg-base-100 p-5 shadow-md">
-          <span class="icon-[tabler--message-language] mb-4 size-7 text-secondary"></span>
-          <h2 class="text-lg font-bold">{appM.custom_local_title()}</h2>
-          <p class="mt-2 text-sm leading-6 text-base-content/65">{appM.custom_local_body()}</p>
-        </div>
-      </section>
-    </div>
-  </section>
-</AppShell>
+<AdminWorkspace platform="desktop" {apiOptions} onLocaleChange={syncLocale} />
 {{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-desktop/src-tauri/Cargo.toml.hbs

@@ -19,11 +19,11 @@ panic = "abort"
 strip = true
 
 [build-dependencies]
-tauri-build = { version = "2", features = [] }
+tauri-build = { version = "2.7.2", features = [] }
 
 [dependencies]
-tauri = { version = "2", features = [] }
-tauri-plugin-shell = "2"
-serde = { version = "1", features = ["derive"] }
-serde_json = "1"
+tauri = { version = "2.12.3", features = [] }
+tauri-plugin-shell = "2.5.0"
+serde = { version = "1.0.229", features = ["derive"] }
+serde_json = "1.0.152"
 {{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-desktop/src-tauri/tauri.conf.json.hbs

@@ -2,7 +2,7 @@
 {{#if fullstack.frontends.desktop}}
 {
   "$schema": "https://schema.tauri.app/config/2",
-  "productName": "{{projectName}} Desktop",
+  "productName": {{json fullstack.appName}},
   "version": "0.1.0",
   "identifier": "com.hai.{{fullstack.nativeAppIdSegment}}.desktop",
   "build": {
@@ -14,7 +14,7 @@
   "app": {
     "windows": [
       {
-        "title": "{{projectName}} Desktop",
+        "title": {{json fullstack.appName}},
         "width": 1280,
         "height": 800,
         "resizable": true,
@@ -28,7 +28,7 @@
         "Cross-Origin-Embedder-Policy": "require-corp",
         "Cross-Origin-Resource-Policy": "same-origin"
       },
-      "csp": "default-src 'self'; img-src 'self' data: https:; style-src 'self' 'unsafe-inline'; script-src 'self' 'wasm-unsafe-eval'; worker-src 'self' blob:; connect-src 'self' http://localhost:3000 http://127.0.0.1:3000 ws://localhost:* ws://127.0.0.1:*; font-src 'self' data:"
+      "csp": "default-src 'self'; img-src 'self' data: https: http://localhost:3000 http://127.0.0.1:3000; style-src 'self' 'unsafe-inline'; script-src 'self' 'wasm-unsafe-eval'; worker-src 'self' blob:; connect-src 'self' http://localhost:3000 http://127.0.0.1:3000 ws://localhost:* ws://127.0.0.1:*; font-src 'self' data:"
     }
   },
   "bundle": {

package/templates/apps/fullstack/apps/{{projectName}}-desktop/vite.config.ts.hbs

@@ -1,6 +1,7 @@
 {{! @skipIfEmpty }}
 {{#if fullstack.frontends.desktop}}
 import process from 'node:process'
+import { fileURLToPath } from 'node:url'
 import { haiOptimizeExclude, haiPrebundledDeps } from '@h-ai/ui/vite'
 import { paraglideVitePlugin } from '@inlang/paraglide-js'
 import { svelte } from '@sveltejs/vite-plugin-svelte'
@@ -9,12 +10,29 @@ import { loadEnv } from 'vite'
 import { defineConfig } from 'vitest/config'
 
 const host = process.env.TAURI_DEV_HOST
+const envDir = fileURLToPath(new URL('../../', import.meta.url))
 
 export default defineConfig(({ mode }) => {
-  const env = loadEnv(mode, process.cwd(), '')
-  Object.assign(process.env, env)
+  const env = loadEnv(mode, envDir, 'PUBLIC_')
+  const target = (env.PUBLIC_API_BASE || process.env.SERVICE_BASE_URL || 'http://127.0.0.1:3000').replace(/\/api\/v1\/?$/, '')
+  const proxy = { '/api': { target, changeOrigin: true } }
 
   return {
+    envDir,
+    preview: { proxy },
+    build: {
+      rolldownOptions: {
+        output: {
+          codeSplitting: {
+            groups: [
+              { name: 'vendor-ui', test: /node_modules\/(?:@h-ai\/ui|bits-ui|svelte)\// },
+              { name: 'vendor-crypto', test: /node_modules\/(?:@h-ai\/(?:core|crypto)|sm-crypto(?:-v2)?)\// },
+              { name: 'vendor-api', test: /node_modules\/(?:@orpc\/|zod\/)/ },
+            ],
+          },
+        },
+      },
+    },
     plugins: [
       svelte(),
       tailwindcss(),
@@ -26,6 +44,7 @@ export default defineConfig(({ mode }) => {
     ],
     clearScreen: false,
     server: {
+      proxy,
       port: {{fullstack.ports.desktop}},
       strictPort: true,
       host: host || false,

package/templates/apps/fullstack/apps/{{projectName}}-web/README.md.hbs

@@ -2,13 +2,13 @@
 {{#if fullstack.frontends.web}}
 # {{projectName}}-web
 
-Web 前端工程，通过 `packages/{{fullstack.sharedPackageName}}` 调用后端 API，并通过 `@h-ai/ui` 组件搭建页面。
+响应式 mini 后台 Web 前端，通过 `packages/{{fullstack.sharedPackageName}}` 调用后端 API，并通过 `@h-ai/ui` 组件搭建页面。
 
 ## i18n 与 shared 协同
 
 - 本端页面文案：`messages/{locale}.json` + `project.inlang/settings.json`
 - 共享 Shell/主题/语言/API：`packages/{{fullstack.sharedPackageName}}`
-- 语言切换由 shared 的 `LanguageSwitcher` 触发，并同步本端 `$lib/paraglide/runtime.js`
+- 个人设置保存语言与风格偏好到 IAM 元数据，并同步 shared 和本端 Paraglide runtime
 
 自定义建议：Web 独有文案放在本目录 `messages/`；跨端通用文案或组件放到 shared。
 

package/templates/apps/fullstack/apps/{{projectName}}-web/eslint.config.js.hbs

@@ -1,18 +1,15 @@
 {{! @skipIfEmpty }}
 {{#if fullstack.frontends.web}}
-import antfu from '@antfu/eslint-config'
+import antfu, { GLOB_SRC } from '@antfu/eslint-config'
+import { haiQualityConfig } from '../../eslint-rules.js'
 
 export default antfu({
+  // unused-imports 使用 TS 规则，JS 同样使用 TS parser 以保持 scope 契约一致。
+  typescript: { files: [GLOB_SRC] },
   formatters: true,
   ignores: ['**/build/**', '**/dist/**', '**/*.d.ts', '**/project.inlang/**', '**/src/lib/paraglide/**'],
   svelte: true,
-}, {
-  files: ['**/*.ts', '**/*.svelte'],
-  rules: {
-    'no-console': 'error',
-    'ts/no-explicit-any': 'error',
-  },
-}, {
+}, haiQualityConfig, {
   files: ['**/*.svelte'],
   rules: {
     'svelte/html-quotes': 'off',

package/templates/apps/fullstack/apps/{{projectName}}-web/index.html.hbs

@@ -5,7 +5,12 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>{{projectName}} Web</title>
+    <title>{{html fullstack.appName}}</title>
+    <link
+      rel="icon"
+      type="image/svg+xml"
+      href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%234438df'/%3E%3Cpath d='M10 8v16M22 8v16M10 16h12' fill='none' stroke='white' stroke-width='3'/%3E%3C/svg%3E"
+    />
     <script src="/runtime-config.js"></script>
   </head>
   <body>

package/templates/apps/fullstack/apps/{{projectName}}-web/messages/en-US.json.hbs

@@ -2,33 +2,6 @@
 {{#if fullstack.frontends.web}}
 {
   "$schema": "https://inlang.com/schema/inlang-message-format",
-  "page_title": "{name} · Web",
-  "platform_name": "Web",
-  "hero_badge": "Web workspace",
-  "hero_title": "{name} Web Console",
-  "hero_subtitle": "A browser-first product landing page. Page copy comes from this app's messages, while shared provides the shell, theme, locale switcher and API client.",
-  "hero_primary_action": "View service status",
-  "hero_secondary_action": "Customize the starter",
-  "preview_title": "Responsive web experience",
-  "preview_body": "Ready for websites, consoles and admin entry points",
-  "preview_metric_shared": "Shared components and API client",
-  "preview_metric_local": "Web-owned messages",
-  "preview_metric_theme": "Configurable themes",
-  "status_title": "Service connectivity",
-  "status_description": "This page calls the backend service to verify contract, service, shared and the Web frontend are wired together.",
-  "status_online": "{name} is connected",
-  "status_version": "Service version",
-  "status_started": "Started at: {time}",
-  "status_frontends": "Service frontends: {list}",
-  "status_frontends_count": "{count} frontend targets",
-  "custom_shared_title": "Shared owns common capabilities",
-  "custom_shared_body": "Put cross-platform shell, theme, locale switching, API client and shared UI in packages/{{projectName}}-shared.",
-  "custom_local_title": "Web owns product copy",
-  "custom_local_body": "Write Web-only page copy in apps/{{projectName}}-web/messages and compile it with this app's project.inlang.",
-  "flow_title": "Collaboration boundary",
-  "flow_contract": "Contract defines API truth",
-  "flow_service": "Service implements business endpoints",
-  "flow_shared": "Shared provides cross-platform UI/API",
-  "flow_frontend": "Web composes pages and local copy"
+  "page_title": "{name}"
 }
 {{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-web/messages/zh-CN.json.hbs

@@ -2,33 +2,6 @@
 {{#if fullstack.frontends.web}}
 {
   "$schema": "https://inlang.com/schema/inlang-message-format",
-  "page_title": "{name} · Web",
-  "platform_name": "Web",
-  "hero_badge": "Web 工作台",
-  "hero_title": "{name} Web 控制台",
-  "hero_subtitle": "面向浏览器的产品首页，使用本端 messages 管理页面文案，并复用 shared 的 Shell、主题、语言与 API 客户端。",
-  "hero_primary_action": "查看服务状态",
-  "hero_secondary_action": "了解如何自定义",
-  "preview_title": "响应式 Web 体验",
-  "preview_body": "适合官网、控制台与运营后台入口",
-  "preview_metric_shared": "共享组件与 API 客户端",
-  "preview_metric_local": "Web 自有 messages",
-  "preview_metric_theme": "主题可配置",
-  "status_title": "服务联通状态",
-  "status_description": "页面会调用后端服务，确认 contract、service、shared 与 Web 前端已经连通。",
-  "status_online": "{name} 已连接",
-  "status_version": "服务版本",
-  "status_started": "启动时间：{time}",
-  "status_frontends": "服务声明的前端：{list}",
-  "status_frontends_count": "{count} 个前端目标",
-  "custom_shared_title": "共享层放通用能力",
-  "custom_shared_body": "把跨端一致的 Shell、主题、语言切换、API client 与通用组件放在 packages/{{projectName}}-shared。",
-  "custom_local_title": "Web 层放产品文案",
-  "custom_local_body": "Web 独有页面文案写在 apps/{{projectName}}-web/messages，再由本端 project.inlang 编译。",
-  "flow_title": "协同边界",
-  "flow_contract": "Contract 定义接口真相源",
-  "flow_service": "Service 实现业务接口",
-  "flow_shared": "Shared 提供跨端 UI/API 能力",
-  "flow_frontend": "Web 组合页面与本端文案"
+  "page_title": "{name}"
 }
 {{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-web/package.json.hbs

@@ -5,7 +5,7 @@
   "type": "module",
   "version": "0.1.0",
   "private": true,
-  "engines": { "node": ">=22.12.0" },
+  "engines": { "node": "^22.22.2 || ^24.15.0 || >=26.0.0" },
   "scripts": {
     "paraglide:compile": "paraglide-js compile --project ./project.inlang --outdir ./src/lib/paraglide",
     "paraglide:watch": "paraglide-js compile --project ./project.inlang --outdir ./src/lib/paraglide --watch",
@@ -16,7 +16,7 @@
     "preview": "vite preview --host 127.0.0.1 --port {{fullstack.ports.web}} --strictPort",
     "typecheck": "pnpm paraglide:compile && svelte-check --tsconfig ./tsconfig.json",
     "lint": "eslint .",
-    "test": "vitest run",
+    "test": "vitest run --passWithNoTests",
     "test:watch": "vitest",
     "clean": "rimraf dist build .turbo src/lib/paraglide"
   },

package/templates/apps/fullstack/apps/{{projectName}}-web/src/App.svelte.hbs

@@ -1,153 +1,15 @@
 {{! @skipIfEmpty }}
 {{#if fullstack.frontends.web}}
 <script lang="ts">
-  import type { AppInfo } from '{{fullstack.sharedPackageName}}'
-  import * as appM from './lib/paraglide/messages.js'
+  import { AdminWorkspace } from '{{fullstack.sharedPackageName}}'
   import { setLocale } from './lib/paraglide/runtime.js'
-  import { Alert, Button, Card, Skeleton } from '@h-ai/ui'
-  import { onMount } from 'svelte'
-  import { AppShell, fetchAppInfo, messages as sharedM } from '{{fullstack.sharedPackageName}}'
 
-  let info = $state<AppInfo | null>(null)
-  let loading = $state(true)
-  let errorMessage = $state('')
+  const apiOptions = { clientName: '{{projectName}}-web' }
 
   function syncLocale(locale: string) {
-    setLocale(locale as Parameters<typeof setLocale>[0])
+    setLocale(locale as Parameters<typeof setLocale>[0], { reload: false })
   }
-
-  async function refreshStatus() {
-    loading = true
-    errorMessage = ''
-    try {
-      info = await fetchAppInfo({ clientName: '{{projectName}}-web' })
-    }
-    catch {
-      info = null
-      errorMessage = sharedM.home_error()
-    }
-    finally {
-      loading = false
-    }
-  }
-
-  onMount(() => {
-    document.title = appM.page_title({ name: sharedM.app_name() })
-    void refreshStatus()
-  })
 </script>
 
-<AppShell platform="web" onLocaleChange={syncLocale}>
-  <section class="space-y-8">
-    <div class="grid gap-6 lg:grid-cols-[1.2fr_0.8fr]">
-      <section class="relative overflow-hidden rounded-[2rem] border border-base-300/70 bg-gradient-to-br from-primary/15 via-base-100 to-secondary/15 p-6 shadow-2xl shadow-primary/10 lg:p-10">
-        <div class="absolute right-8 top-8 hidden size-28 rounded-full bg-primary/20 blur-3xl sm:block"></div>
-        <div class="relative z-10 max-w-2xl space-y-6">
-          <span class="badge badge-primary badge-lg gap-2">
-            <span class="icon-[tabler--rocket] size-4"></span>
-            {appM.hero_badge()}
-          </span>
-          <div class="space-y-4">
-            <h1 class="text-4xl font-black tracking-tight text-base-content sm:text-5xl">
-              {appM.hero_title({ name: sharedM.app_name() })}
-            </h1>
-            <p class="max-w-xl text-lg leading-8 text-base-content/70">
-              {appM.hero_subtitle()}
-            </p>
-          </div>
-          <div class="flex flex-wrap gap-3">
-            <a class="btn btn-primary shadow-lg shadow-primary/20" href="#status">
-              <span class="icon-[tabler--activity-heartbeat] size-5"></span>
-              {appM.hero_primary_action()}
-            </a>
-            <a class="btn btn-ghost" href="#customize">
-              <span class="icon-[tabler--adjustments] size-5"></span>
-              {appM.hero_secondary_action()}
-            </a>
-          </div>
-        </div>
-      </section>
-
-      <aside class="rounded-[2rem] border border-base-300/70 bg-base-100/80 p-5 shadow-xl backdrop-blur">
-        <div class="mockup-window border border-base-300 bg-base-200/70">
-          <div class="space-y-4 bg-base-100 p-5">
-            <div class="flex items-center justify-between">
-              <div>
-                <p class="text-sm font-semibold">{appM.preview_title()}</p>
-                <p class="text-xs text-base-content/55">{appM.preview_body()}</p>
-              </div>
-              <span class="badge badge-success badge-outline">{appM.platform_name()}</span>
-            </div>
-            <div class="grid gap-3 text-sm">
-              <div class="rounded-2xl bg-primary/10 p-4">
-                <span class="icon-[tabler--components] mb-2 size-6 text-primary"></span>
-                <p class="font-semibold">{appM.preview_metric_shared()}</p>
-              </div>
-              <div class="grid grid-cols-2 gap-3">
-                <div class="rounded-2xl bg-secondary/10 p-4">
-                  <span class="icon-[tabler--language] mb-2 size-6 text-secondary"></span>
-                  <p class="font-semibold">{appM.preview_metric_local()}</p>
-                </div>
-                <div class="rounded-2xl bg-accent/10 p-4">
-                  <span class="icon-[tabler--palette] mb-2 size-6 text-accent"></span>
-                  <p class="font-semibold">{appM.preview_metric_theme()}</p>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </aside>
-    </div>
-
-    <div class="grid gap-6 lg:grid-cols-[0.95fr_1.05fr]">
-      <div id="status">
-        <Card title={appM.status_title()} bordered shadow="md" class="bg-base-100/90 backdrop-blur">
-          <p class="mb-5 text-sm text-base-content/65">{appM.status_description()}</p>
-          {#if loading}
-            <Skeleton variant="title" class="mb-3" />
-            <Skeleton count={3} />
-            <p class="sr-only" data-testid="service-status">{sharedM.home_loading()}</p>
-          {:else if info}
-            <Alert variant="success" title={appM.status_online({ name: info.name })}>
-              <p data-testid="service-status">{info.name}</p>
-            </Alert>
-            <dl class="mt-5 grid gap-3 text-sm sm:grid-cols-2">
-              <div class="rounded-box border border-base-300/70 bg-base-200/60 p-4">
-                <dt class="text-xs text-base-content/55">{appM.status_version()}</dt>
-                <dd class="mt-1 font-semibold">{info.version}</dd>
-              </div>
-              <div class="rounded-box border border-base-300/70 bg-base-200/60 p-4">
-                <dt class="text-xs text-base-content/55">{appM.status_started({ time: info.startedAt })}</dt>
-                <dd class="mt-1 font-semibold">{appM.status_frontends_count({ count: String(info.frontends.length) })}</dd>
-              </div>
-            </dl>
-          {:else}
-            <Alert variant="error" title={sharedM.home_error()}>
-              <p data-testid="service-status">{errorMessage}</p>
-            </Alert>
-          {/if}
-
-          <div class="mt-5">
-            <Button type="button" variant="primary" loading={loading} onclick={refreshStatus}>
-              {sharedM.home_refresh()}
-            </Button>
-          </div>
-        </Card>
-      </div>
-
-      <section id="customize" class="grid gap-4 sm:grid-cols-2">
-        <div class="rounded-[1.5rem] border border-base-300/70 bg-base-100/90 p-5 shadow-md">
-          <span class="icon-[tabler--package] mb-4 size-7 text-primary"></span>
-          <h2 class="text-lg font-bold">{appM.custom_shared_title()}</h2>
-          <p class="mt-2 text-sm leading-6 text-base-content/65">{appM.custom_shared_body()}</p>
-        </div>
-        <div class="rounded-[1.5rem] border border-base-300/70 bg-base-100/90 p-5 shadow-md">
-          <span class="icon-[tabler--message-language] mb-4 size-7 text-secondary"></span>
-          <h2 class="text-lg font-bold">{appM.custom_local_title()}</h2>
-          <p class="mt-2 text-sm leading-6 text-base-content/65">{appM.custom_local_body()}</p>
-        </div>
-      </section>
-    </div>
-  </section>
-</AppShell>
-{{/if}}
+<AdminWorkspace platform="web" {apiOptions} onLocaleChange={syncLocale} />
+{{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-web/src/app.d.ts.hbs

@@ -5,4 +5,4 @@
 import '@h-ai/ui/auto-import'
 
 declare module '*.css'
-{{/if}}
+{{/if}}

package/templates/apps/fullstack/apps/{{projectName}}-web/src/main.ts.hbs

@@ -11,4 +11,4 @@ if (!target)
 const app = mount(App, { target })
 
 export default app
-{{/if}}
+{{/if}}