simplify logic
parent
a88ac217c2
commit
9a86f0dae4
|
@ -93,37 +93,32 @@ export const ThemeContext = createContext<Theme>(defaultTheme)
|
||||||
|
|
||||||
export const useTheme = () => useContext(ThemeContext)
|
export const useTheme = () => useContext(ThemeContext)
|
||||||
|
|
||||||
|
const getTheme = (theme: ColorSchemeName) =>
|
||||||
|
theme === 'dark' ? darkTheme : defaultTheme
|
||||||
|
|
||||||
export const ThemeProvider: React.FC<ThemeProviderProps> = ({
|
export const ThemeProvider: React.FC<ThemeProviderProps> = ({
|
||||||
theme,
|
theme,
|
||||||
children,
|
children,
|
||||||
}) => {
|
}) => {
|
||||||
const colorSchemeFromRN = useColorScheme()
|
const colorSchemeFromRN = useColorScheme()
|
||||||
const [nativeColorScheme, setNativeColorScheme] =
|
const [statefulColorScheme, setStatefulColorScheme] =
|
||||||
React.useState<ColorSchemeName>(colorSchemeFromRN)
|
React.useState<ColorSchemeName>(colorSchemeFromRN)
|
||||||
|
const colorScheme = isWeb ? colorSchemeFromRN : statefulColorScheme
|
||||||
|
const themeValue = getTheme(theme === 'system' ? colorScheme : theme)
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (isWeb) {
|
if (!isWeb) return
|
||||||
setNativeColorScheme(colorSchemeFromRN)
|
|
||||||
}
|
|
||||||
|
|
||||||
const subscription = AppState.addEventListener('change', state => {
|
const subscription = AppState.addEventListener('change', state => {
|
||||||
const isActive = state === 'active'
|
const isActive = state === 'active'
|
||||||
|
|
||||||
if (!isActive) return
|
if (!isActive) return
|
||||||
|
|
||||||
setNativeColorScheme(colorSchemeFromRN)
|
setStatefulColorScheme(colorSchemeFromRN)
|
||||||
})
|
})
|
||||||
return () => subscription.remove()
|
return () => subscription.remove()
|
||||||
}, [colorSchemeFromRN])
|
}, [colorSchemeFromRN])
|
||||||
|
|
||||||
const value =
|
return (
|
||||||
theme === 'system'
|
<ThemeContext.Provider value={themeValue}>{children}</ThemeContext.Provider>
|
||||||
? nativeColorScheme === 'dark'
|
)
|
||||||
? darkTheme
|
|
||||||
: defaultTheme
|
|
||||||
: theme === 'dark'
|
|
||||||
? darkTheme
|
|
||||||
: defaultTheme
|
|
||||||
|
|
||||||
return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue