|
@@ -22,10 +22,31 @@ const algorithmMap: Record<string, MappingAlgorithm> = {
|
|
|
compact: theme.compactAlgorithm
|
|
|
}
|
|
|
|
|
|
+// Get theme from localStorage or use default
|
|
|
+const getStoredTheme = () => {
|
|
|
+ const storedTheme = localStorage.getItem('theme_mode')
|
|
|
+ return storedTheme && ['default', 'dark', 'compact'].includes(storedTheme)
|
|
|
+ ? storedTheme
|
|
|
+ : 'default'
|
|
|
+}
|
|
|
+
|
|
|
+// Initialize HTML class based on theme
|
|
|
+const initThemeClass = (themeName: string) => {
|
|
|
+ if (themeName === 'dark') {
|
|
|
+ document.documentElement.classList.add('dark')
|
|
|
+ } else {
|
|
|
+ document.documentElement.classList.remove('dark')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// Initialize theme from localStorage
|
|
|
+const initialTheme = getStoredTheme()
|
|
|
+initThemeClass(initialTheme)
|
|
|
+
|
|
|
const useConfigStore = create<ConfigState & Actions>()((set) => ({
|
|
|
themeConfig: {
|
|
|
- _algorithm: ['default'],
|
|
|
- algorithm: [theme.defaultAlgorithm],
|
|
|
+ _algorithm: initialTheme === 'default' ? ['default'] : [initialTheme],
|
|
|
+ algorithm: initialTheme === 'default' ? [theme.defaultAlgorithm] : [algorithmMap[initialTheme]],
|
|
|
primaryColor: '#1890ff'
|
|
|
},
|
|
|
themeOptions: [
|
|
@@ -34,6 +55,16 @@ const useConfigStore = create<ConfigState & Actions>()((set) => ({
|
|
|
{ label: 'Compact', value: 'compact' },
|
|
|
],
|
|
|
setAlgorithm: (v: string) => {
|
|
|
+ // Store theme in localStorage
|
|
|
+ localStorage.setItem('theme_mode', v)
|
|
|
+
|
|
|
+ // Update HTML class for dark mode
|
|
|
+ if (v === 'dark') {
|
|
|
+ document.documentElement.classList.add('dark')
|
|
|
+ } else {
|
|
|
+ document.documentElement.classList.remove('dark')
|
|
|
+ }
|
|
|
+
|
|
|
set((state) => {
|
|
|
const includesCompact = state.themeConfig._algorithm.includes('compact')
|
|
|
const _algorithm = includesCompact ? [v, 'compact'] : [v]
|