fix: restore console dashboard component visibility

Makefile

@@ -11,6 +11,8 @@ FRONTEND_CRITICAL_VITEST := \
 	src/api/__tests__/admin.features.spec.ts \
 	src/api/admin/__tests__/backup.spec.ts \
 	src/views/admin/__tests__/FeatureRegistryView.spec.ts \
+	src/console/ReactPageHost.spec.ts \
+	src/console/react/DashboardPage.test.ts \
 	src/router/__tests__/progressive-routes.spec.ts \
 	src/components/ui/__tests__/primitives.spec.ts \
 	src/ui-platform/chartTheme.test.ts \

docs/architecture/CODEBASE_INVENTORY.tsv

@@ -20,7 +20,7 @@ DEV_GUIDE.md	documentation	maintained	346	9185	196d76feb4c5898fed983fb13499f1d11
 Dockerfile	tooling	maintained	137	4947	c5350cef4a5cf82c87267986a8a98fa79d9a82a3357b6891763e1cba8799b439
 Dockerfile.goreleaser	other-text	maintained	62	2116	1709c5f34c1268966ecca43f34891acf2d1d653c018ff823fa95971cf1a3522c
 LICENSE	other-text	maintained	165	7651	a5681bf9b05db14d86776930017c647ad9e6e56ff6bbcfdf21e5848288dfaf1b
-Makefile	tooling	maintained	71	2353	4d2c4a15731c2e5f932ecbb6ff93b10e331ba53bdb14292e6aac609539161ce5
+Makefile	tooling	maintained	73	2433	0fea246b53079e07518fe5eace1c0e1d8962c01dddef8fece16ab4d9168bd10b
 README.md	documentation	generated	217	8731	ffa1b4f7414c2610ac8b2d8176be1d896a301aae39eb9bf6647ad770796eb2bd
 README_CN.md	documentation	maintained	210	8248	786cd59b59efb8c6344b61a12caea265015cabc0b18bb6c36880be54b184c342
 REPAIR_REPORT.md	documentation	maintained	53	3303	3dc924e1e4b67a1d0ba90a40a01ba1b6959548fff9729506ce7b1596f79214f8
@@ -34,7 +34,7 @@ backend/cmd/model-sync-smoke/README.md	documentation	maintained	47	1255	94d26b21
 backend/cmd/model-sync-smoke/main.go	backend-go	maintained	195	6131	30a89fd0dc24c2a0ab7f540d1cf26158936612103e15b227fb4ee151fb789252
 backend/cmd/model-sync-smoke/main_test.go	backend-go	maintained	174	6378	75550b4ce06d0a6540df9acb9793929e33076570f90cf5416b92acd180b4fa1a
 backend/cmd/module-migrate/main.go	backend-go	maintained	47	2079	fc048ad91f01d0c288222e5742a9cdef75b305d890ff7d844236eb0a57143ba1
-backend/cmd/server/VERSION	other-text	maintained	1	7	37d78127b770f11b7181f3501bdf30f54ad27fb1a796c313d009fdcfe47d3bec
+backend/cmd/server/VERSION	other-text	maintained	1	6	2e376439ec341f14ae018b8aa4796b9336702e6a59d6c42b91f61d84baac9807
 backend/cmd/server/cleanup.go	backend-go	maintained	258	6840	d3b6826d0a76cab0d573a6a2ae3091e44980c79378fb1865b1dc768187f4f2e5
 backend/cmd/server/cleanup_test.go	backend-go	maintained	47	1359	941fb150cc7fb912493e8f2d8b30d3a56b782379213310c6dd0c11740bce28bd
 backend/cmd/server/main.go	backend-go	maintained	205	5377	ac0796b43393359f52b48e68d20bba5309421ed87e6b8f0eeba133a44013d344
@@ -2612,25 +2612,27 @@ frontend/src/composables/useTableSelection.ts	frontend-script	maintained	105	245
 frontend/src/composables/useUIPlatform.test.ts	frontend-script	maintained	96	3646	4b5a32693c122d2b46864f1b3c30d4aa355b1c10033f6875c5c02a6707285f29
 frontend/src/composables/useUIPlatform.ts	frontend-script	maintained	217	7850	d2712e89fbc8745c01a5ba140d07dffb5f48937d246fc2f7a42b2b1c46e98ebe
 frontend/src/config/customProviderPresets.ts	frontend-script	maintained	490	16421	1632100f6067452643a01147b07cd14f505cb4afc27c53007bd34f005426cd92
-frontend/src/console/ReactPageHost.vue	frontend-vue	maintained	76	2092	e23e8f75e52761bf5846e4f5947939563747ee0b6abefc0f234630f01f85fd4c
+frontend/src/console/ReactPageHost.spec.ts	frontend-script	maintained	61	2387	ad4d2ef4238583e5bc142bb06ed9e3ff0c20f87a480adf5c4bf06a93b166fd71
+frontend/src/console/ReactPageHost.vue	frontend-vue	maintained	88	2286	aaffc188df6d15eab400ced10f94277b962c33ee53e082000a449d07adde5845
 frontend/src/console/react/AppearancePage.ts	frontend-script	maintained	158	7524	e6c300c79b4bb41be1133bbdce93a0a383edc32ea22a70c9fcb7d76506103ebd
 frontend/src/console/react/AuthSettingsPage.ts	frontend-script	maintained	152	8802	9a479aaa64bdb6a42ba9dac96085e98683544c2a4d951d5ba921afce2a5ec64e
 frontend/src/console/react/AvailableChannelsPage.ts	frontend-script	maintained	93	8176	d3fc96abfb5147b51ef7a29150d9f7eecf7b3bff7a69fae6e0b1972193a49c8f
 frontend/src/console/react/ChannelStatusPage.ts	frontend-script	maintained	111	12978	5bb7a4e15e8f8ca3c99ad6a4c172ceaf26d86c99c55767c1448fd1d469165651
 frontend/src/console/react/ConsoleHeader.ts	frontend-script	maintained	377	26885	b3299c481427e408801ca8affc2b065912b0ec3f85888b4f0b52087e1dc27d02
 frontend/src/console/react/ConsoleSidebar.tsx	frontend-script	maintained	362	12939	7a8279b3f01e02e6e307054937feda99d92ccffeba4e14734424482c97cb11c7
-frontend/src/console/react/DashboardPage.tsx	frontend-script	maintained	182	6699	648652560bca7ddea7b5b4ba04c0805479230f751445997f6719034aea591ea5
+frontend/src/console/react/DashboardPage.test.ts	frontend-script	maintained	107	3561	48424d9177be0b997ff85245b161678acb72becbf246736db01193d1b04cb4b6
+frontend/src/console/react/DashboardPage.tsx	frontend-script	maintained	182	6675	1175c99a7d0237a8f358eeaa922027a77ce4fd2380ebd569002215c60df0c7c6
 frontend/src/console/react/DashboardStats.ts	frontend-script	maintained	59	2289	a1f4475f02bd98443f503401d5f03747a1befadeedddf3aadf4cf54ea074658c
 frontend/src/console/react/DistributionPage.ts	frontend-script	maintained	621	27386	8aa71945766d752db2e3fa3b4bbe9ff565d209eb2e01e22fd821b16823c62e07
 frontend/src/console/react/FeatureRegistryPage.ts	frontend-script	maintained	208	11165	26ec8c48062641306a3b65d181309837c6680f44d558c666ba69998902d9170b
 frontend/src/console/react/FeedbackPage.test.ts	frontend-script	maintained	53	1903	41aac4518ea7af992532c60f5f44ec2f6211c339aa553d3d6971dc143b3b9331
 frontend/src/console/react/FeedbackPage.ts	frontend-script	maintained	106	4341	58603be155969b7255f6115d5b95b817d13bace5b3c37e76df3a0d6e8da39a20
 frontend/src/console/react/ModelCatalogPage.ts	frontend-script	maintained	242	15839	bbac3cb62dfec0208bb78cc5278c0c2339b04d2e2dd99ab9d335a584f6245a27
-frontend/src/console/react/ModelDistribution.ts	frontend-script	maintained	350	16533	b02922d24a32b335ed53c6a0f94e6258573a162711b370e8dc253141a70b84ce
+frontend/src/console/react/ModelDistribution.ts	frontend-script	maintained	350	16517	5f5456fd7fb38de8c73022933edab5c1697efd2ecac9d6eb6134bbdcde2b01aa
 frontend/src/console/react/PaymentDashboardPage.ts	frontend-script	maintained	183	10550	2393aaf69442ff7b070d19b9c8a43ee0bd793acaae6ea5fad0ea824f413592ad
 frontend/src/console/react/PaymentOrdersPage.ts	frontend-script	maintained	322	22908	d0690fd76a57aba3dd80da4f2922783eb9000a06908fbfd01edddf43d038cb65
 frontend/src/console/react/PaymentPlansPage.ts	frontend-script	maintained	140	14949	b683e06f5c14e590b9adc9f39b59529a4abb4fdb902af8e5330de0c2f4cff329
-frontend/src/console/react/TokenUsageTrend.tsx	frontend-script	maintained	111	4407	d199be878ebe154288c5eaf735b82b5129fe8965145bd4389e1e58ba062cdcb7
+frontend/src/console/react/TokenUsageTrend.tsx	frontend-script	maintained	112	4436	db5686687ccf783fa46e3e2a2964e6cc1c0d7151b949fd0f562de8767474146e
 frontend/src/console/react/UserDashboardPage.ts	frontend-script	maintained	183	18572	d642c735684744689bb98a5046c827ddae67ecfb76ddd001e3f629a44c6c96e7
 frontend/src/console/react/UserOrdersPage.ts	frontend-script	maintained	121	9568	0379ea41ce195b20b961a924b0372920a90120e4d630458b6bf82b7b8b07b786
 frontend/src/console/react/hooks/use-mobile.tsx	frontend-script	maintained	19	565	ad0936f84f1df79d3697bfbff9c18f8ad58431c1cbaf2359c6a853b0fcc9f28b
@@ -2640,7 +2642,7 @@ frontend/src/console/react/ui/avatar.tsx	frontend-script	maintained	48	1419	4b77
 frontend/src/console/react/ui/badge.tsx	frontend-script	maintained	24	1085	6dcdb8d9c68192fe3411d119923afe4e34ae57e50332bd6a1f4281ba845c9b46
 frontend/src/console/react/ui/breadcrumb.tsx	frontend-script	maintained	122	2603	880ed3253793f0a7779c6b03fd346dc9f9d7ccfe10bb45c509d4103584356cde
 frontend/src/console/react/ui/button.tsx	frontend-script	maintained	58	2711	80c001d59afc7ecc0dff1896299b05d766d05c5dab1dc68b6685a2e6ce9a6771
-frontend/src/console/react/ui/card.tsx	frontend-script	maintained	86	1969	07e46267185647a0344deb18872bae90fea10283edf2d1ab8b9be532dc75b949
+frontend/src/console/react/ui/card.tsx	frontend-script	maintained	86	2044	dd91a29b76c677aeacec132c9740f6481632666d3990f248357e6e9af75a7b82
 frontend/src/console/react/ui/chart.tsx	frontend-script	maintained	236	8883	c633e5fb80d34e7a034fc5ac1e49fa96890607eb8595b03643a745bc84e8c732
 frontend/src/console/react/ui/collapsible.tsx	frontend-script	maintained	9	315	6f5be8ba164c177759bf63cc25ad4d49391f162f6784ba624d72e5d5c0c0dde2
 frontend/src/console/react/ui/createElement.ts	frontend-script	maintained	39	1497	974b6867e3e7993d5740f9f15ccf582acc0da0973584e37a87c95b64f207c111
@@ -2652,8 +2654,8 @@ frontend/src/console/react/ui/label.tsx	frontend-script	maintained	12	447	ee3029
 frontend/src/console/react/ui/select.tsx	frontend-script	maintained	18	808	2d372502cf382e258a66a12b866fec44dc7605c0524b1cc9987b3849ab40dd17
 frontend/src/console/react/ui/separator.tsx	frontend-script	maintained	29	770	0616aa46245c089effe1e6773c6c67fa389f1efb3d102e8e71ff442ad249c3b2
 frontend/src/console/react/ui/sheet.tsx	frontend-script	maintained	140	4295	82240cc43a90ed4f446e8897d37ac319f8f13971e8e3424214f6a706240746e6
-frontend/src/console/react/ui/sidebar.tsx	frontend-script	maintained	772	23749	6d046cea2854ab18050a3a36693f4af718acef69751873209097fd7da929723b
-frontend/src/console/react/ui/skeleton.tsx	frontend-script	maintained	15	275	3b3106940c380677c0173dc213e13b1496361b6d08ed05fee40420c7f013173c
+frontend/src/console/react/ui/sidebar.tsx	frontend-script	maintained	772	23775	7961498b86bf87561b5fc84bc849ccb7e8a0799dd513586e725bc384653dd247
+frontend/src/console/react/ui/skeleton.tsx	frontend-script	maintained	15	289	8715bf0b00fe24fb3401a848a95ab5cebcff5809f914f1a275c222447ff26d39
 frontend/src/console/react/ui/switch.tsx	frontend-script	maintained	32	1269	fe63f12ad1ae351aba0d958234ff8502f69b4b943f18ffe172e1170a8d518a99
 frontend/src/console/react/ui/table.tsx	frontend-script	maintained	19	2190	9eb94a670377eef5d1a4c24132e8b45846df7d69b9daef3f4ef1a15805a2f215
 frontend/src/console/react/ui/textarea.tsx	frontend-script	maintained	18	864	64d675c9cd12cb86e7bd0357b78b3b55b099e65030f636e2ae91002de25a77e6
@@ -2691,7 +2693,8 @@ frontend/src/docs/content/release-0.3.0-preview.md	documentation	maintained	101
 frontend/src/docs/content/release-0.3.4.md	documentation	maintained	42	2463	df60266a985a76ec43d2313713df7c6144d4dc9069208cf03fde18cebd4fe5dd
 frontend/src/docs/content/release-0.3.64.md	documentation	maintained	18	650	a5b296f80cc4752651c6770566eab47a3086d53a1d40b653c9b578ed0d7a2dbd
 frontend/src/docs/content/release-0.3.7.md	documentation	maintained	24	1004	75acda42f7fed2e93430d7d232ec453998353ead8fb4d493babcd70a2264bd9c
-frontend/src/docs/index.ts	frontend-script	maintained	207	7236	c0c4307b7adff00f329f8f41c624e46c6af041c566ee060bb8666be127eeb4fe
+frontend/src/docs/content/release-0.3.8.md	documentation	maintained	11	545	edec885909dd4b8071b0c2cd52cc2730ebe11e546dcebb31fe80574c18b4c310
+frontend/src/docs/index.ts	frontend-script	maintained	215	7483	14c471318de02dc8166ad08800a178b21258dc94f2515a1f230e5402d727b2ea
 frontend/src/i18n/__tests__/riskControlLocales.spec.ts	frontend-script	maintained	24	1276	c5b9ea52f89a2c896982b4d3a414a9d51475b38209ffa842a29dc74804953e57
 frontend/src/i18n/__tests__/usageServiceTierLocales.spec.ts	frontend-script	maintained	20	727	009c53d195a044f6bf7371998265a0152e4668b625d7dc7348471893259c5afb
 frontend/src/i18n/index.ts	frontend-script	maintained	91	2598	5173621347ec40b634a43dd9582e9f11061f2756ed83838265ecfc102dc785b3
@@ -2856,10 +2859,10 @@ frontend/src/stores/subscriptions.ts	frontend-script	maintained	141	3405	efe86cc
 frontend/src/stores/timeRange.ts	frontend-script	maintained	108	2667	ec5719c8a3f89b35aaff6eb8a1c39c8c20e2e5bd118b48ebfdfcd5fea4ec16ec
 frontend/src/style.css	other-text	maintained	1653	43815	5baf2db0834c2b06a95ca671f9a77ed9785e570ff8d09befb815f25038ce3a41
 frontend/src/styles/onboarding.css	other-text	maintained	228	7696	ef82788329aa6647f16140f6246bca817c3964d8ff3fcb83537fce4dfe063e8e
-frontend/src/styles/ui-layout.css	other-text	maintained	36	869	fa54eeaccffc1afe144948dbeeea680d1cff869182d28643369f3831cd598c22
+frontend/src/styles/ui-layout.css	other-text	maintained	50	1232	f4d1f4509763257971fb44bd8004c1b8029eddc28e14d09940349a6767420a34
 frontend/src/styles/ui-modern-compat-parts/part-01.css	other-text	maintained	99	3356	a95d4d05a19dd2618f85238065bf74061c97c19b57b3c3390cc4dd15944b2b71
 frontend/src/styles/ui-modern-compat-parts/part-02.css	other-text	maintained	85	3245	39a490baf156c8b461324cd03854a8204d1e74831a460307ca5e255d6215786a
-frontend/src/styles/ui-modern-compat-parts/part-03.css	other-text	maintained	90	4420	022e8486e7d337e60e9f45ac7c933ad20ea10000406866ae2933ff3431ea8948
+frontend/src/styles/ui-modern-compat-parts/part-03.css	other-text	maintained	102	4834	de1f9f89f53ba5656f16e3d8205c870416f8eda4e1731085a43960d7b520b84d
 frontend/src/styles/ui-modern-compat-parts/part-04.css	other-text	maintained	105	3599	91549805c28ff6867bb03262aefd97c3f783e47c43e2749f8a151ff59a31d952
 frontend/src/styles/ui-modern-compat-parts/part-05.css	other-text	maintained	264	9375	209168c8d465e62c17dab0a41aa9792d729253db3ef5313ae7035b81359e294e
 frontend/src/styles/ui-modern-compat-parts/part-06.css	other-text	maintained	114	4190	13f5128acbbb4b02bbfe8df7badc7b162641a98786e45ec5ec58f8a98f97f6fc
@@ -3102,7 +3105,7 @@ frontend/tailwind.config.js	frontend-script	maintained	181	6206	ae2b3a586dce7517
 frontend/tsconfig.json	configuration	maintained	26	756	f98ff6cf3dda571189c0220ab3a7e52305e393856650785be136edd403217fe6
 frontend/tsconfig.node.json	configuration	maintained	10	213	9e2abb169ea87b7190613a1d4da57ca608463a453bd4231fa3aeee5e308370dd
 frontend/vite.config.ts	frontend-script	maintained	86	2418	7db831b211d28b14142ea3bf0a41c4e93b1b326cefc19ab765a850021af72351
-frontend/vitest.config.ts	frontend-script	maintained	40	938	7fe146c9d88c0b4a24e73f7b583cb1dd3ab94436246337482d18d0c8616db1a2
+frontend/vitest.config.ts	frontend-script	maintained	43	978	26c0856f200174ab4aeb9abef322560aa070a08ed008a302e9b1f9fa9ffde90a
 tools/check_pnpm_audit_exceptions.py	tooling	maintained	247	9027	43878828651706dd6725e5d4717bb0093e83134a8a96c805ff111f9a0282ae83
 tools/ci/check_environment_contract.py	tooling	maintained	165	7221	de6ac4729dfb64d2171357be4605589f20cf520c8d005ab34c782a2b8a119296
 tools/ci/full_stack_smoke.sh	tooling	maintained	202	6947	4e4c7a34cdca4937bc7802e4691eb3cfa359dfb41f47f696f117fa865cee3951

frontend/src/console/ReactPageHost.spec.ts

@@ -0,0 +1,61 @@
+import { readFileSync } from 'node:fs'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+import { act, createElement } from 'react'
+import { flushPromises, mount } from '@vue/test-utils'
+import { describe, expect, it } from 'vitest'
+
+import ReactPageHost from './ReactPageHost.vue'
+
+;(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true
+
+const src = resolve(dirname(fileURLToPath(import.meta.url)))
+const hostSource = readFileSync(resolve(src, 'ReactPageHost.vue'), 'utf8')
+const layoutSource = readFileSync(resolve(src, '../styles/ui-layout.css'), 'utf8')
+const cardSource = readFileSync(resolve(src, 'react/ui/card.tsx'), 'utf8')
+
+function VisibleDashboardStub() {
+  return createElement(
+    'div',
+    { 'data-slot': 'card', className: 'card bg-[hsl(var(--card))] text-[hsl(var(--card-foreground))]' },
+    'API Keys',
+  )
+}
+
+describe('React console host visibility', () => {
+  it('mounts React pages in a real layout box instead of display:contents', () => {
+    expect(hostSource).not.toMatch(/class="contents"/)
+    expect(hostSource).toContain('data-console-runtime="react"')
+    expect(hostSource).toContain('console-runtime-host')
+    expect(hostSource).toContain('flex h-full min-h-0 min-w-0 w-full flex-1 flex-col')
+    expect(layoutSource).toContain("[data-console-runtime='react']")
+    expect(layoutSource).toContain('display: flex;')
+    expect(layoutSource).not.toMatch(/\[data-console-runtime='react'\][^{]*contents/)
+    expect(cardSource).toContain('bg-[hsl(var(--card))]')
+    expect(cardSource).toContain('text-[hsl(var(--card-foreground))]')
+  })
+
+  it('renders dashboard metric cards into the host so they stay in the box tree', async () => {
+    const wrapper = mount(ReactPageHost, {
+      props: {
+        load: async () => ({ default: VisibleDashboardStub }),
+        props: {},
+        errorMessage: 'Failed to load console page',
+      },
+      attachTo: document.body,
+    })
+
+    await act(async () => {
+      await flushPromises()
+    })
+
+    const host = wrapper.get('[data-console-runtime="react"]')
+    expect(host.classes()).toContain('console-runtime-host')
+    expect(host.classes()).not.toContain('contents')
+    expect(wrapper.text()).toContain('API Keys')
+    expect(wrapper.find('[data-slot="card"]').exists()).toBe(true)
+
+    wrapper.unmount()
+  })
+})

frontend/src/console/ReactPageHost.vue

@@ -1,5 +1,9 @@
 <template>
-  <div ref="mountNode" class="contents" data-console-runtime="react"></div>
+  <div
+    ref="mountNode"
+    class="console-runtime-host flex h-full min-h-0 min-w-0 w-full flex-1 flex-col"
+    data-console-runtime="react"
+  ></div>
   <component v-if="error && fallback" :is="fallback" />
   <slot v-else-if="error && $slots.fallback" name="fallback" />
   <div
@@ -14,7 +18,7 @@
 <script setup lang="ts">
 import { createElement, type ComponentType } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
-import { onBeforeUnmount, onMounted, ref, watch, type Component } from 'vue'
+import { nextTick, onBeforeUnmount, onMounted, ref, watch, type Component } from 'vue'
 
 type ReactPageProps = object
 type ReactPageModule = { default?: unknown }
@@ -48,7 +52,11 @@ async function loadPage() {
 
   try {
     const module = await props.load()
-    if (!mounted || currentGeneration !== generation || !mountNode.value) return
+    if (!mounted || currentGeneration !== generation) return
+    if (!mountNode.value) {
+      error.value = props.errorMessage
+      return
+    }
 
     if (typeof module.default !== 'function' && typeof module.default !== 'object') {
       throw new Error('React console page export is invalid')
@@ -64,7 +72,11 @@ async function loadPage() {
 
 watch(() => props.props, render, { deep: true })
 
-onMounted(() => { void loadPage() })
+onMounted(() => {
+  void nextTick().then(() => {
+    void loadPage()
+  })
+})
 
 onBeforeUnmount(() => {
   mounted = false