/**
 * Theme context + provider
 * Switches palette based on system color scheme
 */

import { createContext, useContext, useMemo } from 'react'
import { useColorScheme } from 'react-native'
import { darkColors } from './colors.dark'
import { lightColors } from './colors.light'
import type { ThemeColors } from './types'

const ThemeContext = createContext<ThemeColors>(darkColors)

export function ThemeProvider({ children }: { children: React.ReactNode }) {
  const scheme = useColorScheme()
  const colors = useMemo(
    () => (scheme === 'light' ? lightColors : darkColors),
    [scheme],
  )
  return (
    <ThemeContext.Provider value={colors}>{children}</ThemeContext.Provider>
  )
}

export function useThemeColors(): ThemeColors {
  return useContext(ThemeContext)
}
