fix: make Guanghu home and themes visible
This commit is contained in:
parent
edf46c6733
commit
9fc5e88574
@ -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)
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ type HoloLakeHomeProps = {
|
||||
|
||||
const modules = [
|
||||
['知识湖', '把代码仓库、文档与路径转译成可阅读、可追溯的知识页面。', '进入知识库'],
|
||||
['页面组件', '提示块、批注、关系卡、路径包、折叠块与高亮代码已接入笔记编辑器。', '在笔记中输入 /'],
|
||||
['协作空间', '人类与人格体在同一上下文中对话、确认、留存回执。', '筹备中'],
|
||||
['授权中心', '任何真实操作先形成可读计划,再由人类一次确认。', '筹备中'],
|
||||
]
|
||||
|
||||
30
src/hooks/useGuanghuTheme.test.ts
Normal file
30
src/hooks/useGuanghuTheme.test.ts
Normal file
@ -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')
|
||||
})
|
||||
})
|
||||
@ -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])
|
||||
|
||||
|
||||
@ -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 {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user