Fix Android action sheet color mode

src/components/Timeline/Shared/Actions.tsx

@@ -2,6 +2,7 @@ import Icon from '@components/Icon'
 import { displayMessage } from '@components/Message'
 import CustomText from '@components/Text'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { useNavigation } from '@react-navigation/native'
 import { StackNavigationProp } from '@react-navigation/stack'
 import { RootStackParamList } from '@utils/navigation/navigators'
@@ -99,7 +100,8 @@ const TimelineActions: React.FC = () => {
             t('shared.actions.reblogged.options.unlisted'),
             t('common:buttons.cancel')
           ],
-          cancelButtonIndex: 2
+          cancelButtonIndex: 2,
+          ...androidActionSheetStyles(colors)
         },
         (selectedIndex: number) => {
           switch (selectedIndex) {

src/helpers/androidActionSheetStyles.ts

@@ -0,0 +1,5 @@
+export const androidActionSheetStyles = (colors: any) => ({
+  containerStyle: { backgroundColor: colors.backgroundDefault },
+  textStyle: { color: colors.primaryDefault },
+  titleTextStyle: { color: colors.secondary }
+})

src/screens/Compose/Root/Actions.tsx

@@ -2,6 +2,7 @@ import { emojis } from '@components/Emojis'
 import EmojisContext from '@components/Emojis/helpers/EmojisContext'
 import Icon from '@components/Icon'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { getInstanceConfigurationStatusMaxAttachments } from '@utils/slices/instancesSlice'
 import layoutAnimation from '@utils/styles/layoutAnimation'
 import { useTheme } from '@utils/styles/ThemeManager'
@@ -16,7 +17,7 @@ const ComposeActions: React.FC = () => {
   const { showActionSheetWithOptions } = useActionSheet()
   const { composeState, composeDispatch } = useContext(ComposeContext)
   const { t } = useTranslation('screenCompose')
-  const { colors, mode } = useTheme()
+  const { colors } = useTheme()
   const instanceConfigurationStatusMaxAttachments = useSelector(
     getInstanceConfigurationStatusMaxAttachments,
     () => true
@@ -89,7 +90,7 @@ const ComposeActions: React.FC = () => {
             t('common:buttons.cancel')
           ],
           cancelButtonIndex: 4,
-          userInterfaceStyle: mode
+          ...androidActionSheetStyles(colors)
         },
         buttonIndex => {
           switch (buttonIndex) {

src/screens/Compose/Root/Footer/Poll.tsx

@@ -3,6 +3,7 @@ import Icon from '@components/Icon'
 import { MenuRow } from '@components/Menu'
 import CustomText from '@components/Text'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { getInstanceConfigurationPoll } from '@utils/slices/instancesSlice'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
@@ -23,13 +24,9 @@ const ComposePoll: React.FC = () => {
   const { t } = useTranslation('screenCompose')
   const { colors, mode } = useTheme()
 
-  const instanceConfigurationPoll = useSelector(
+  const instanceConfigurationPoll = useSelector(getInstanceConfigurationPoll, () => true)
-    getInstanceConfigurationPoll,
-    () => true
-  )
   const MAX_OPTIONS = instanceConfigurationPoll.max_options
-  const MAX_CHARS_PER_OPTION =
+  const MAX_CHARS_PER_OPTION = instanceConfigurationPoll.max_characters_per_option
-    instanceConfigurationPoll.max_characters_per_option
   const MIN_EXPIRATION = instanceConfigurationPoll.min_expiration
   const MAX_EXPIRATION = instanceConfigurationPoll.max_expiration
 
@@ -127,10 +124,9 @@ const ComposePoll: React.FC = () => {
                 )
               }
             : {
-                accessibilityHint: t(
+                accessibilityHint: t('content.root.footer.poll.quantity.reduce.accessibilityHint', {
-                  'content.root.footer.poll.quantity.reduce.accessibilityHint',
+                  amount: total
-                  { amount: total }
+                })
-                )
               })}
           onPress={() => {
             total > 2 &&
@@ -179,9 +175,7 @@ const ComposePoll: React.FC = () => {
           disabled={!(total < MAX_OPTIONS)}
         />
       </View>
-      <View
+      <View style={{ paddingHorizontal: StyleConstants.Spacing.Global.PagePadding }}>
-        style={{ paddingHorizontal: StyleConstants.Spacing.Global.PagePadding }}
-      >
         <MenuRow
           title={t('content.root.footer.poll.multiple.heading')}
           content={
@@ -198,7 +192,7 @@ const ComposePoll: React.FC = () => {
                   t('common:buttons.cancel')
                 ],
                 cancelButtonIndex: 2,
-                userInterfaceStyle: mode
+                ...androidActionSheetStyles(colors)
               },
               index => {
                 if (index && index < 2) {
@@ -226,19 +220,16 @@ const ComposePoll: React.FC = () => {
               '604800'
             ].filter(
               expiration =>
-                parseInt(expiration) >= MIN_EXPIRATION &&
+                parseInt(expiration) >= MIN_EXPIRATION && parseInt(expiration) <= MAX_EXPIRATION
-                parseInt(expiration) <= MAX_EXPIRATION
             )
             showActionSheetWithOptions(
               {
                 options: [
-                  ...expirations.map(e =>
+                  ...expirations.map(e => t(`content.root.footer.poll.expiration.options.${e}`)),
-                    t(`content.root.footer.poll.expiration.options.${e}`)
-                  ),
                   t('common:buttons.cancel')
                 ],
                 cancelButtonIndex: expirations.length,
-                userInterfaceStyle: mode
+                ...androidActionSheetStyles(colors)
               },
               index => {
                 if (index !== undefined && index < expirations.length) {

src/screens/ImagesViewer.tsx

@@ -1,6 +1,7 @@
 import GracefullyImage from '@components/GracefullyImage'
 import { HeaderCenter, HeaderLeft, HeaderRight } from '@components/Header'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { RootStackScreenProps } from '@utils/navigation/navigators'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { useCallback, useState } from 'react'
@@ -39,7 +40,7 @@ const ScreenImagesViewer = ({
 
   const insets = useSafeAreaInsets()
 
-  const { mode } = useTheme()
+  const { mode, colors } = useTheme()
   const { t } = useTranslation('screenImageViewer')
 
   const initialIndex = imageUrls.findIndex(image => image.id === id)
@@ -55,7 +56,7 @@ const ScreenImagesViewer = ({
           t('common:buttons.cancel')
         ],
         cancelButtonIndex: 2,
-        userInterfaceStyle: mode
+        ...androidActionSheetStyles(colors)
       },
       async buttonIndex => {
         switch (buttonIndex) {
@@ -181,7 +182,7 @@ const ScreenImagesViewer = ({
                 t('common:buttons.cancel')
               ],
               cancelButtonIndex: 2,
-              userInterfaceStyle: mode
+              ...androidActionSheetStyles(colors)
             },
             async buttonIndex => {
               switch (buttonIndex) {

src/screens/Tabs/Me/Profile/Root.tsx

@@ -1,5 +1,6 @@
 import { MenuContainer, MenuRow } from '@components/Menu'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { useAppDispatch } from '@root/store'
 import { TabMeProfileStackScreenProps } from '@utils/navigation/navigators'
 import { useProfileMutation, useProfileQuery } from '@utils/queryHooks/profile'
@@ -16,7 +17,7 @@ const TabMeProfileRoot: React.FC<
     messageRef: RefObject<FlashMessage>
   }
 > = ({ messageRef, navigation }) => {
-  const { mode } = useTheme()
+  const { colors } = useTheme()
   const { t } = useTranslation('screenTabs')
 
   const { showActionSheetWithOptions } = useActionSheet()
@@ -93,7 +94,7 @@ const TabMeProfileRoot: React.FC<
                   t('common:buttons.cancel')
                 ],
                 cancelButtonIndex: 3,
-                userInterfaceStyle: mode
+                ...androidActionSheetStyles(colors)
               },
               async buttonIndex => {
                 switch (buttonIndex) {

src/screens/Tabs/Me/Settings/App.tsx

@@ -1,6 +1,7 @@
 import haptics from '@components/haptics'
 import { MenuContainer, MenuRow } from '@components/Menu'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { useNavigation } from '@react-navigation/native'
 import { LOCALES } from '@root/i18n/locales'
 import { useAppDispatch } from '@root/store'
@@ -15,6 +16,7 @@ import {
   getSettingsStaticEmoji,
   changeStaticEmoji
 } from '@utils/slices/settingsSlice'
+import { useTheme } from '@utils/styles/ThemeManager'
 import * as Localization from 'expo-localization'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
@@ -26,6 +28,7 @@ const SettingsApp: React.FC = () => {
   const navigation = useNavigation<any>()
   const dispatch = useAppDispatch()
   const { showActionSheetWithOptions } = useActionSheet()
+  const { colors } = useTheme()
   const { t, i18n } = useTranslation('screenTabs')
 
   const settingsFontsize = useSelector(getSettingsFontsize)
@@ -71,7 +74,8 @@ const SettingsApp: React.FC = () => {
                 t('me.settings.theme.options.dark'),
                 t('common:buttons.cancel')
               ],
-              cancelButtonIndex: 3
+              cancelButtonIndex: 3,
+              ...androidActionSheetStyles(colors)
             },
             buttonIndex => {
               switch (buttonIndex) {
@@ -105,7 +109,8 @@ const SettingsApp: React.FC = () => {
                 t('me.settings.darkTheme.options.darker'),
                 t('common:buttons.cancel')
               ],
-              cancelButtonIndex: 2
+              cancelButtonIndex: 2,
+              ...androidActionSheetStyles(colors)
             },
             buttonIndex => {
               switch (buttonIndex) {
@@ -135,7 +140,8 @@ const SettingsApp: React.FC = () => {
                 t('me.settings.browser.options.external'),
                 t('common:buttons.cancel')
               ],
-              cancelButtonIndex: 2
+              cancelButtonIndex: 2,
+              ...androidActionSheetStyles(colors)
             },
             buttonIndex => {
               switch (buttonIndex) {

src/screens/Tabs/Me/Settings/Dev.tsx

@@ -3,6 +3,7 @@ import { MenuContainer, MenuRow } from '@components/Menu'
 import { displayMessage } from '@components/Message'
 import CustomText from '@components/Text'
 import { useActionSheet } from '@expo/react-native-action-sheet'
+import { androidActionSheetStyles } from '@helpers/androidActionSheetStyles'
 import { persistor } from '@root/store'
 import { getInstanceActive, getInstances } from '@utils/slices/instancesSlice'
 import { StyleConstants } from '@utils/styles/constants'
@@ -13,7 +14,7 @@ import { DevSettings } from 'react-native'
 import { useSelector } from 'react-redux'
 
 const SettingsDev: React.FC = () => {
-  const { colors, mode } = useTheme()
+  const { colors } = useTheme()
   const { showActionSheetWithOptions } = useActionSheet()
   const instanceActive = useSelector(getInstanceActive)
   const instances = useSelector(getInstances, () => true)
@@ -58,7 +59,7 @@ const SettingsDev: React.FC = () => {
                 })
                 .concat(['Cancel']),
               cancelButtonIndex: instances.length,
-              userInterfaceStyle: mode
+              ...androidActionSheetStyles(colors)
             },
             () => {}
           )