Base dark theme implementation

hooks/useTheme.ts

@@ -0,0 +1,57 @@
+import { selectTheme } from "@/redux/user/user.selectors";
+import { darkTheme, lightTheme } from "@/util/theme";
+import { useColorScheme } from "react-native";
+import { useSelector } from "react-redux";
+
+type ThemePreference = "light" | "dark" | "system";
+
+/**
+ * Custom hook that returns the appropriate theme based on user preference
+ * 
+ * This hook automatically selects the correct theme (light or dark) based on:
+ * - User's explicit preference (light/dark)  
+ * - System appearance when "system" is selected
+ * - Defaults to system theme if no preference is set
+ * 
+ * @returns The theme object compatible with React Native Paper
+ * 
+ * @example
+ * ```typescript
+ * import { useTheme } from "@/hooks/useTheme";
+ * 
+ * const MyComponent = () => {
+ *   const theme = useTheme();
+ *   
+ *   return (
+ *     <View style={{ backgroundColor: theme.colors.background }}>
+ *       <Text style={{ color: theme.colors.onBackground }}>
+ *         Themed content
+ *       </Text>
+ *     </View>
+ *   );
+ * };
+ * ```
+ */
+export const useTheme = () => {
+  const userThemePreference: ThemePreference = useSelector(selectTheme);
+  const systemColorScheme = useColorScheme();
+
+  // Determine which theme to use based on user preference
+  let selectedTheme;
+  
+  switch (userThemePreference) {
+    case "light":
+      selectedTheme = lightTheme;
+      break;
+    case "dark":
+      selectedTheme = darkTheme;
+      break;
+    case "system":
+    default:
+      // Use system preference when user selects "system" or as fallback
+      selectedTheme = systemColorScheme === "dark" ? darkTheme : lightTheme;
+      break;
+  }
+
+  return selectedTheme;
+};