From 9fc5e885742a48c2794a4b4fcd8ddae66501aa28 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=86=B0=E6=9C=94?= <565183519@qq.com>
Date: Fri, 17 Jul 2026 10:30:04 +0800
Subject: [PATCH] fix: make Guanghu home and themes visible

---
 src/App.tsx                       |  4 ++--
 src/components/HoloLakeHome.tsx   |  1 +
 src/hooks/useGuanghuTheme.test.ts | 30 ++++++++++++++++++++++++++++++
 src/hooks/useGuanghuTheme.ts      | 12 +++++++++++-
 src/lib/guanghuTheme.ts           |  6 +++---
 5 files changed, 47 insertions(+), 6 deletions(-)
 create mode 100644 src/hooks/useGuanghuTheme.test.ts

diff --git a/src/App.tsx b/src/App.tsx
index 2b4ef17..66c879d 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -170,8 +170,7 @@ function App() {
 
 function MainApp({ noteWindowParams }: { noteWindowParams: NoteWindowParams | null }) {
   const aiWorkspaceWindow = false
-  const [showHoloLakeHome, setShowHoloLakeHome] = useState(false)
-  const { theme: guanghuTheme, cycleTheme } = useGuanghuTheme()
+  const [showHoloLakeHome, setShowHoloLakeHome] = useState(true)
   const { dragRegionRef } = useDragRegion<HTMLElement>()
   const [selection, setSelection] = useState<SidebarSelection>(DEFAULT_SELECTION)
   const [noteListFilter, setNoteListFilter] = useState<NoteListFilter>('open')
@@ -426,6 +425,7 @@ function MainApp({ noteWindowParams }: { noteWindowParams: NoteWindowParams | nu
     settings,
     settingsLoaded,
   })
+  const { theme: guanghuTheme, cycleTheme } = useGuanghuTheme()
   const quickPromptTarget = lastAiWorkspaceTarget ?? aiAgentPreferences.defaultAiTarget
   const quickPromptTargetReady = aiTargetReady(quickPromptTarget, aiAgentsStatus)
 
diff --git a/src/components/HoloLakeHome.tsx b/src/components/HoloLakeHome.tsx
index 86b2891..49127ca 100644
--- a/src/components/HoloLakeHome.tsx
+++ b/src/components/HoloLakeHome.tsx
@@ -4,6 +4,7 @@ type HoloLakeHomeProps = {
 
 const modules = [
   ['知识湖', '把代码仓库、文档与路径转译成可阅读、可追溯的知识页面。', '进入知识库'],
+  ['页面组件', '提示块、批注、关系卡、路径包、折叠块与高亮代码已接入笔记编辑器。', '在笔记中输入 /'],
   ['协作空间', '人类与人格体在同一上下文中对话、确认、留存回执。', '筹备中'],
   ['授权中心', '任何真实操作先形成可读计划，再由人类一次确认。', '筹备中'],
 ]
diff --git a/src/hooks/useGuanghuTheme.test.ts b/src/hooks/useGuanghuTheme.test.ts
new file mode 100644
index 0000000..8fa948a
--- /dev/null
+++ b/src/hooks/useGuanghuTheme.test.ts
@@ -0,0 +1,30 @@
+import { act, renderHook } from '@testing-library/react'
+import { beforeEach, describe, expect, it } from 'vitest'
+import { GUANGHU_THEME_STORAGE_KEY } from '../lib/guanghuTheme'
+import { THEME_MODE_STORAGE_KEY } from '../lib/themeMode'
+import { useGuanghuTheme } from './useGuanghuTheme'
+
+describe('useGuanghuTheme', () => {
+  beforeEach(() => {
+    window.localStorage.clear()
+    document.documentElement.removeAttribute('data-guanghu-theme')
+    document.documentElement.removeAttribute('data-theme')
+    document.documentElement.classList.remove('dark')
+  })
+
+  it('makes the lake presets visibly switch the document between light and dark', () => {
+    window.localStorage.setItem(GUANGHU_THEME_STORAGE_KEY, 'lake-light')
+    const { result } = renderHook(() => useGuanghuTheme())
+
+    expect(document.documentElement).toHaveAttribute('data-guanghu-theme', 'lake-light')
+    expect(document.documentElement).toHaveAttribute('data-theme', 'light')
+    expect(window.localStorage.getItem(THEME_MODE_STORAGE_KEY)).toBe('light')
+
+    act(() => result.current.cycleTheme())
+
+    expect(document.documentElement).toHaveAttribute('data-guanghu-theme', 'lake-dark')
+    expect(document.documentElement).toHaveAttribute('data-theme', 'dark')
+    expect(document.documentElement).toHaveClass('dark')
+    expect(window.localStorage.getItem(THEME_MODE_STORAGE_KEY)).toBe('dark')
+  })
+})
diff --git a/src/hooks/useGuanghuTheme.ts b/src/hooks/useGuanghuTheme.ts
index 2c42f2d..ec175ce 100644
--- a/src/hooks/useGuanghuTheme.ts
+++ b/src/hooks/useGuanghuTheme.ts
@@ -6,6 +6,16 @@ import {
   writeGuanghuTheme,
   type GuanghuTheme,
 } from '../lib/guanghuTheme'
+import { applyThemeModeToDocument, writeStoredThemeMode } from '../lib/themeMode'
+
+function applyGuanghuTheme(theme: GuanghuTheme): void {
+  document.documentElement.setAttribute('data-guanghu-theme', theme)
+  if (theme === 'native') return
+
+  const mode = theme === 'lake-light' ? 'light' : 'dark'
+  applyThemeModeToDocument(document, mode)
+  writeStoredThemeMode(window.localStorage, mode)
+}
 
 export function useGuanghuTheme(): { theme: GuanghuTheme; cycleTheme: () => void } {
   const [theme, setTheme] = useState<GuanghuTheme>(() => (
@@ -13,7 +23,7 @@ export function useGuanghuTheme(): { theme: GuanghuTheme; cycleTheme: () => void
   ))
 
   useEffect(() => {
-    document.documentElement.setAttribute('data-guanghu-theme', theme)
+    applyGuanghuTheme(theme)
     writeGuanghuTheme(window.localStorage, theme)
   }, [theme])
 
diff --git a/src/lib/guanghuTheme.ts b/src/lib/guanghuTheme.ts
index 711a589..7ed2806 100644
--- a/src/lib/guanghuTheme.ts
+++ b/src/lib/guanghuTheme.ts
@@ -4,9 +4,9 @@ export const GUANGHU_THEMES = ['native', 'lake-light', 'lake-dark'] as const
 export type GuanghuTheme = typeof GUANGHU_THEMES[number]
 
 export const GUANGHU_THEME_LABELS: Record<GuanghuTheme, string> = {
-  native: '原生',
-  'lake-light': '湖光浅色',
-  'lake-dark': '湖心深色',
+  native: '跟随原生',
+  'lake-light': '湖光浅色（亮）',
+  'lake-dark': '湖心深色（暗）',
 }
 
 export function normalizeGuanghuTheme(value: unknown): GuanghuTheme {