Align discard confirmation

src/screens/Compose/EditAttachment.tsx

@@ -55,7 +55,8 @@ const ComposeEditAttachment: React.FC<
           accessibilityLabel={t(
             'screenCompose:content.editAttachment.header.right.accessibilityLabel'
           )}
-          content='save'
+          type='text'
+          content={t('common:buttons.apply')}
           loading={isSubmitting}
           onPress={() => {
             if (composeState.type === 'edit') {

src/screens/Tabs/Me/List/Edit.tsx

@@ -1,25 +1,23 @@
+import { discardConfirmation } from '@components/discardConfirmation'
 import { EmojisState } from '@components/Emojis/Context'
 import haptics from '@components/haptics'
 import { HeaderLeft, HeaderRight } from '@components/Header'
 import ComponentInput from '@components/Input'
 import { displayMessage, Message } from '@components/Message'
 import Selections from '@components/Selections'
-import CustomText from '@components/Text'
 import { CommonActions } from '@react-navigation/native'
 import { useQueryClient } from '@tanstack/react-query'
 import { TabMeStackScreenProps } from '@utils/navigation/navigators'
 import { QueryKeyLists, useListsMutation } from '@utils/queryHooks/lists'
 import { StyleConstants } from '@utils/styles/constants'
-import { useTheme } from '@utils/styles/ThemeManager'
 import React, { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Alert, ScrollView, TextInput } from 'react-native'
+import { ScrollView, TextInput } from 'react-native'
 
 const TabMeListEdit: React.FC<TabMeStackScreenProps<'Tab-Me-List-Edit'>> = ({
   navigation,
   route: { params }
 }) => {
-  const { colors } = useTheme()
   const { t } = useTranslation(['common', 'screenTabs'])
 
   const messageRef = useRef(null)
@@ -92,21 +90,10 @@ const TabMeListEdit: React.FC<TabMeStackScreenProps<'Tab-Me-List-Edit'>> = ({
         <HeaderLeft
           content='x'
           onPress={() => {
-            if (params.type === 'edit' ? params.payload.title !== title : title.length) {
+            discardConfirmation({
-              Alert.alert(t('common:discard.title'), t('common:discard.message'), [
+              condition: params.type === 'edit' ? params.payload.title !== title : !!title.length,
-                {
+              action: () => navigation.pop(1)
-                  text: t('common:buttons.discard'),
+            })
-                  style: 'destructive',
-                  onPress: () => navigation.pop(1)
-                },
-                {
-                  text: t('common:buttons.cancel'),
-                  style: 'default'
-                }
-              ])
-            } else {
-              navigation.pop(1)
-            }
           }}
         />
       ),

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

@@ -1,3 +1,4 @@
+import { discardConfirmation } from '@components/discardConfirmation'
 import { ComponentEmojis } from '@components/Emojis'
 import { EmojisState } from '@components/Emojis/Context'
 import { HeaderLeft, HeaderRight } from '@components/Header'
@@ -9,7 +10,7 @@ import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { Dispatch, RefObject, SetStateAction, useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Alert, ScrollView, TextInput } from 'react-native'
+import { ScrollView, TextInput } from 'react-native'
 import FlashMessage from 'react-native-flash-message'
 
 const Field: React.FC<{
@@ -92,21 +93,10 @@ const TabMeProfileFields: React.FC<
         <HeaderLeft
           content='chevron-left'
           onPress={() => {
-            if (dirty) {
+            discardConfirmation({
-              Alert.alert(t('common:discard.title'), t('common:discard.message'), [
+              condition: dirty,
-                {
+              action: () => navigation.navigate('Tab-Me-Profile-Root')
-                  text: t('common:buttons.discard'),
+            })
-                  style: 'destructive',
-                  onPress: () => navigation.navigate('Tab-Me-Profile-Root')
-                },
-                {
-                  text: t('common:buttons.cancel'),
-                  style: 'default'
-                }
-              ])
-            } else {
-              navigation.navigate('Tab-Me-Profile-Root')
-            }
           }}
         />
       ),

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

@@ -1,3 +1,4 @@
+import { discardConfirmation } from '@components/discardConfirmation'
 import { ComponentEmojis } from '@components/Emojis'
 import { EmojisState } from '@components/Emojis/Context'
 import { HeaderLeft, HeaderRight } from '@components/Header'
@@ -7,8 +8,7 @@ import { useProfileMutation } from '@utils/queryHooks/profile'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { RefObject, useEffect, useRef, useState } from 'react'
-import { useTranslation } from 'react-i18next'
+import { ScrollView, TextInput } from 'react-native'
-import { Alert, ScrollView, TextInput } from 'react-native'
 import FlashMessage from 'react-native-flash-message'
 
 const TabMeProfileName: React.FC<
@@ -23,7 +23,6 @@ const TabMeProfileName: React.FC<
   navigation
 }) => {
   const { theme } = useTheme()
-  const { t } = useTranslation(['common'])
   const { mutateAsync, status } = useProfileMutation()
 
   const [value, setValue] = useState(display_name)
@@ -46,21 +45,10 @@ const TabMeProfileName: React.FC<
         <HeaderLeft
           content='chevron-left'
           onPress={() => {
-            if (dirty) {
+            discardConfirmation({
-              Alert.alert(t('common:discard.title'), t('common:discard.message'), [
+              condition: dirty,
-                {
+              action: () => navigation.navigate('Tab-Me-Profile-Root')
-                  text: t('common:buttons.discard'),
+            })
-                  style: 'destructive',
-                  onPress: () => navigation.navigate('Tab-Me-Profile-Root')
-                },
-                {
-                  text: t('common:buttons.cancel'),
-                  style: 'default'
-                }
-              ])
-            } else {
-              navigation.navigate('Tab-Me-Profile-Root')
-            }
           }}
         />
       ),

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

@@ -1,3 +1,4 @@
+import { discardConfirmation } from '@components/discardConfirmation'
 import { ComponentEmojis } from '@components/Emojis'
 import { EmojisState } from '@components/Emojis/Context'
 import { HeaderLeft, HeaderRight } from '@components/Header'
@@ -7,8 +8,7 @@ import { useProfileMutation } from '@utils/queryHooks/profile'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { RefObject, useEffect, useRef, useState } from 'react'
-import { useTranslation } from 'react-i18next'
+import { ScrollView, TextInput } from 'react-native'
-import { Alert, ScrollView, TextInput } from 'react-native'
 import FlashMessage from 'react-native-flash-message'
 
 const TabMeProfileNote: React.FC<
@@ -23,7 +23,6 @@ const TabMeProfileNote: React.FC<
   navigation
 }) => {
   const { theme } = useTheme()
-  const { t } = useTranslation(['common'])
   const { mutateAsync, status } = useProfileMutation()
 
   const [notes, setNotes] = useState(note)
@@ -46,21 +45,10 @@ const TabMeProfileNote: React.FC<
         <HeaderLeft
           content='chevron-left'
           onPress={() => {
-            if (dirty) {
+            discardConfirmation({
-              Alert.alert(t('common:discard.title'), t('common:discard.message'), [
+              condition: dirty,
-                {
+              action: () => navigation.navigate('Tab-Me-Profile-Root')
-                  text: t('common:buttons.discard'),
+            })
-                  style: 'destructive',
-                  onPress: () => navigation.navigate('Tab-Me-Profile-Root')
-                },
-                {
-                  text: t('common:buttons.cancel'),
-                  style: 'default'
-                }
-              ])
-            } else {
-              navigation.navigate('Tab-Me-Profile-Root')
-            }
           }}
         />
       ),

src/screens/Tabs/Notifications/Filters.tsx

@@ -1,3 +1,4 @@
+import { discardConfirmation } from '@components/discardConfirmation'
 import { HeaderLeft, HeaderRight } from '@components/Header'
 import { MenuContainer, MenuRow } from '@components/Menu'
 import { useQueryClient } from '@tanstack/react-query'
@@ -8,7 +9,6 @@ import { setAccountStorage, useAccountStorage } from '@utils/storage/actions'
 import { isEqual } from 'lodash'
 import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Alert } from 'react-native'
 import { ScrollView } from 'react-native-gesture-handler'
 
 const TabNotificationsFilters: React.FC<
@@ -28,21 +28,7 @@ const TabNotificationsFilters: React.FC<
         <HeaderLeft
           content='chevron-down'
           onPress={() => {
-            if (changed) {
+            discardConfirmation({ condition: changed, action: () => navigation.goBack() })
-              Alert.alert(t('common:discard.title'), t('common:discard.message'), [
-                {
-                  text: t('common:buttons.discard'),
-                  style: 'destructive',
-                  onPress: () => navigation.goBack()
-                },
-                {
-                  text: t('common:buttons.cancel'),
-                  style: 'default'
-                }
-              ])
-            } else {
-              navigation.goBack()
-            }
           }}
         />
       ),