/ constants / Colors.ts
Colors.ts
 1  import AsyncStorage from '@react-native-async-storage/async-storage';
 2  
 3  // Define a mutable colors object that can be updated at runtime
 4  let dynamicColors = {
 5    light: {
 6      primary: '#2E8B57',
 7      background: '#F5F5F5',
 8      card: '#FFFFFF',
 9      text: '#333333',
10      border: '#E0E0E0',
11      notification: '#FF6B6B',
12      tint: '#2E8B57',
13      tabIconDefault: '#BDBDBD',
14      tabIconSelected: '#2E8B57',
15      secondaryText: '#757575',
16      error: '#FF6B6B',
17    },
18    dark: {
19      primary: '#8FBC8F',
20      background: '#121212',
21      card: '#121212',
22      text: '#E0E0E0',
23      border: '#333333',
24      notification: '#FF6B6B',
25      tint: '#3d4a3d',
26      tabIconDefault: '#757575',
27      tabIconSelected: '#3d4a3d',
28      secondaryText: '#BDBDBD',
29      error: '#FF6B6B',
30    },
31  };
32  
33  // Export as if it were a constant - all external users see this as a normal constant
34  export const Colors = dynamicColors;
35  
36  export type ColorScheme = keyof typeof Colors;
37  export type ThemeColors = typeof Colors.light & typeof Colors.dark;
38  
39  // Function to update accent color at runtime
40  export function updateAccentColor(
41    accentColor: string | undefined,
42    _colorScheme: ColorScheme = 'light'
43  ): void {
44    if (accentColor) {
45      // Update light theme
46      dynamicColors.light.primary = accentColor;
47      dynamicColors.light.tint = accentColor;
48      dynamicColors.light.tabIconSelected = accentColor;
49  
50      // Update dark theme
51      dynamicColors.dark.primary = accentColor;
52      dynamicColors.dark.tint = accentColor;
53      dynamicColors.dark.tabIconSelected = accentColor;
54    } else {
55      // Reset to default colors
56      dynamicColors.light.primary = '#2E8B57';
57      dynamicColors.light.tint = '#2E8B57';
58      dynamicColors.light.tabIconSelected = '#2E8B57';
59  
60      dynamicColors.dark.primary = '#8FBC8F';
61      dynamicColors.dark.tint = '#3d4a3d';
62      dynamicColors.dark.tabIconSelected = '#3d4a3d';
63    }
64  }
65  
66  // Load accent color from AsyncStorage at app startup
67  export async function initializeAccentColor(): Promise<void> {
68    try {
69      const settingsStr = await AsyncStorage.getItem('app_settings');
70      if (settingsStr) {
71        const settings = JSON.parse(settingsStr);
72        if (settings.accentColor) {
73          updateAccentColor(settings.accentColor);
74        }
75      }
76    } catch (error) {
77      console.error('Error loading accent color:', error);
78    }
79  }
80  
81  // Initialize colors when this module is imported
82  initializeAccentColor().catch((err) =>
83    console.error('Failed to initialize accent color:', err)
84  );