diff --git a/native/chat/settings/delete-thread.react.js b/native/chat/settings/delete-thread.react.js --- a/native/chat/settings/delete-thread.react.js +++ b/native/chat/settings/delete-thread.react.js @@ -6,7 +6,6 @@ Text, View, TextInput as BaseTextInput, - Alert, ActivityIndicator, } from 'react-native'; import { ScrollView } from 'react-native-gesture-handler'; @@ -16,9 +15,16 @@ deleteThread, } from 'lib/actions/thread-actions.js'; import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js'; -import { threadInfoSelector } from 'lib/selectors/thread-selectors.js'; -import { identifyInvalidatedThreads } from 'lib/shared/thread-utils.js'; +import { + threadInfoSelector, + containedThreadInfos, +} from 'lib/selectors/thread-selectors.js'; +import { + identifyInvalidatedThreads, + communityOrThreadNoun, +} from 'lib/shared/thread-utils.js'; import type { LoadingStatus } from 'lib/types/loading-types.js'; +import { threadTypeIsCommunityRoot } from 'lib/types/thread-types-enum.js'; import type { ThreadInfo, ResolvedThreadInfo, @@ -41,6 +47,7 @@ import { useSelector } from '../../redux/redux-utils.js'; import { type Colors, useColors, useStyles } from '../../themes/colors.js'; import type { GlobalTheme } from '../../types/themes.js'; +import Alert from '../../utils/alert.js'; import type { ChatNavigationProp } from '../chat.react.js'; export type DeleteThreadParams = { @@ -55,6 +62,7 @@ ...BaseProps, // Redux state +threadInfo: ResolvedThreadInfo, + +shouldUseDeleteConfirmationAlert: boolean, +loadingStatus: LoadingStatus, +activeTheme: ?GlobalTheme, +colors: Colors, @@ -124,13 +132,37 @@ this.passwordInput.focus(); }; - submitDeletion = () => { + dispatchDeleteThreadAction = () => { this.props.dispatchActionPromise( deleteThreadActionTypes, this.deleteThread(), ); }; + getThreadsToDeleteText() { + return `${ + threadTypeIsCommunityRoot(this.props.threadInfo.type) + ? 'Subchannels and threads' + : 'Threads' + } within this ${communityOrThreadNoun(this.props.threadInfo)}`; + } + + submitDeletion = () => { + if (!this.props.shouldUseDeleteConfirmationAlert) { + this.dispatchDeleteThreadAction(); + return; + } + Alert.alert( + 'Warning', + `${this.getThreadsToDeleteText()} will also be permanently deleted.`, + [ + { text: 'Cancel', style: 'cancel' }, + { text: 'Continue', onPress: this.dispatchDeleteThreadAction }, + ], + { cancelable: false }, + ); + }; + async deleteThread() { const { threadInfo, navDispatch } = this.props; navDispatch({ @@ -230,6 +262,9 @@ const reduxThreadInfo = useSelector( state => threadInfoSelector(state)[threadID], ); + const reduxContainedThreadInfos = useSelector( + state => containedThreadInfos(state)[threadID], + ); const { setParams } = props.navigation; React.useEffect(() => { @@ -253,10 +288,14 @@ invariant(navContext, 'NavContext should be set in DeleteThread'); const navDispatch = navContext.dispatch; + const shouldUseDeleteConfirmationAlert = + reduxContainedThreadInfos && reduxContainedThreadInfos.length > 0; + return (