feat: 首页更新

hooks/useTheme.ts

@@ -1,49 +1,50 @@
 /**
  * 主题 Hooks
- * 
+ *
  * 提供统一的主题访问接口
  */
 
 import { useMemo } from 'react';
 import { useColorScheme as useSystemColorScheme } from 'react-native';
 import { useTheme as useThemeStore } from '@/stores';
-import Colors from '@/constants/Colors';
+import { Colors } from '@/theme';
+import { ThemeEnum } from '@/constants/theme';
 
 /**
- * 获取当前颜色方案（light | dark）
- * 
+ * 获取当前颜色方案（light | dark | orange）
+ *
  * 从 settingsStore 读取用户设置的主题
- * 支持 'light' | 'dark' | 'auto' 三种模式
+ * 支持 'light' | 'dark' | 'orange' | 'auto' 四种模式
  */
-export function useColorScheme(): 'light' | 'dark' {
+export function useColorScheme(): ThemeEnum {
   const userTheme = useThemeStore();
   const systemTheme = useSystemColorScheme();
 
   // 如果用户选择了 'auto'，则使用系统主题
   if (userTheme === 'auto') {
-    return systemTheme === 'dark' ? 'dark' : 'light';
+    return systemTheme === 'dark' ? ThemeEnum.DARK : ThemeEnum.LIGHT;
   }
 
   // 否则使用用户选择的主题
-  return userTheme;
+  return userTheme as ThemeEnum;
 }
 
 /**
  * 获取主题颜色
- * 
- * @param props - 可选的自定义颜色 { light?: string; dark?: string }
+ *
+ * @param props - 可选的自定义颜色 { light?: string; dark?: string; orange?: string }
  * @param colorName - Colors 中定义的颜色名称
  * @returns 当前主题对应的颜色值
- * 
+ *
  * @example
  * ```tsx
  * const textColor = useThemeColor({}, 'text');
- * const customColor = useThemeColor({ light: '#000', dark: '#fff' }, 'text');
+ * const customColor = useThemeColor({ light: '#000', dark: '#fff', orange: '#f90' }, 'text');
  * ```
  */
 export function useThemeColor(
-  props: { light?: string; dark?: string },
-  colorName: keyof typeof Colors.light & keyof typeof Colors.dark
+  props: { light?: string; dark?: string; orange?: string },
+  colorName: keyof typeof Colors.light & keyof typeof Colors.dark & keyof typeof Colors.orange
 ): string {
   const theme = useColorScheme();
   const colorFromProps = props[theme];
@@ -57,9 +58,9 @@ export function useThemeColor(
 
 /**
  * 获取完整的主题颜色对象
- * 
+ *
  * @returns 当前主题的所有颜色配置
- * 
+ *
  * @example
  * ```tsx
  * const colors = useThemeColors();
@@ -70,7 +71,7 @@ export function useThemeColor(
  */
 export function useThemeColors() {
   const theme = useColorScheme();
-  
+
   return useMemo(() => {
     return Colors[theme];
   }, [theme]);
@@ -78,23 +79,24 @@ export function useThemeColors() {
 
 /**
  * 获取主题相关的所有信息
- * 
+ *
  * @returns 主题信息对象
- * 
+ *
  * @example
  * ```tsx
- * const { theme, colors, isDark } = useThemeInfo();
+ * const { theme, colors, isDark, isLight, isOrange } = useThemeInfo();
  * ```
  */
 export function useThemeInfo() {
   const theme = useColorScheme();
   const colors = useThemeColors();
-  
+
   return useMemo(() => ({
     theme,
     colors,
-    isDark: theme === 'dark',
-    isLight: theme === 'light',
+    isDark: theme === ThemeEnum.DARK,
+    isLight: theme === ThemeEnum.LIGHT,
+    isOrange: theme === ThemeEnum.ORANGE,
   }), [theme, colors]);
 }