Fix snackbar color for button

App.tsx

@@ -37,10 +37,10 @@ export const CombinedDarkTheme = {
 }
 
 const App = () => {
-  const isDark = useColorScheme() === 'dark'
+  const phoneTheme = useColorScheme()
   const [initialized, setInitialized] = useState(false)
   const [snackbar, setSnackbar] = useState('')
-  const [theme, setTheme] = useState('system')
+  const [appTheme, setAppTheme] = useState('system')
 
   const [lightColor, setLightColor] = useState<string>(
     CombinedDefaultTheme.colors.primary,
@@ -54,7 +54,7 @@ const App = () => {
     ;(async () => {
       if (!AppDataSource.isInitialized) await AppDataSource.initialize()
       const settings = await settingsRepo.findOne({ where: {} })
-      setTheme(settings.theme)
+      setAppTheme(settings.theme)
       if (settings.lightColor) setLightColor(settings.lightColor)
       if (settings.darkColor) setDarkColor(settings.darkColor)
       setInitialized(true)
@@ -81,20 +81,11 @@ const App = () => {
         colors: { ...CombinedDefaultTheme.colors, primary: lightColor },
       }
       : CombinedDefaultTheme
-    let value = isDark ? darkTheme : lightTheme
+    let value = phoneTheme === 'dark' ? darkTheme : lightTheme
-    if (theme === 'dark') value = darkTheme
+    if (appTheme === 'dark') value = darkTheme
-    else if (theme === 'light') value = lightTheme
+    else if (appTheme === 'light') value = lightTheme
     return value
-  }, [isDark, theme, lightColor, darkColor])
+  }, [phoneTheme, appTheme, lightColor, darkColor])
-
-  const action = useMemo(
-    () => ({
-      label: 'Close',
-      onPress: () => setSnackbar(''),
-      color: paperTheme.colors.background,
-    }),
-    [paperTheme.colors.background],
-  )
 
   return (
     <PaperProvider
@@ -105,8 +96,8 @@ const App = () => {
         {initialized && (
           <ThemeContext.Provider
             value={{
-              theme,
+              theme: appTheme,
-              setTheme,
+              setTheme: setAppTheme,
               lightColor,
               setLightColor,
               darkColor,
@@ -122,7 +113,11 @@ const App = () => {
         duration={3000}
         onDismiss={() => setSnackbar('')}
         visible={!!snackbar}
-        action={action}
+        action={{
+          label: 'Close',
+          onPress: () => setSnackbar(''),
+          textColor: paperTheme.colors.background,
+        }}
       >
         {snackbar}
       </Snackbar>