Page MenuHomePhabricator
Files F3369036

D8159.id27949.diff
No OneTemporary
Actions

D8159.id27949.diff
View Options

diff --git a/native/chat/chat.react.js b/native/chat/chat.react.js
--- a/native/chat/chat.react.js
+++ b/native/chat/chat.react.js
@@ -296,14 +296,14 @@
headerTitle: 'Pinned Messages',
headerBackTitleVisible: false,
};
-const changeRolesScreenOptions = {
+const changeRolesScreenOptions = ({ route }) => ({
// eslint-disable-next-line react/display-name
headerLeft: headerLeftProps => (
- <ChangeRolesHeaderLeftButton {...headerLeftProps} />
+ <ChangeRolesHeaderLeftButton {...headerLeftProps} route={route} />
),
headerTitle: 'Change Role',
presentation: 'modal',
-};
+});
export type ChatNavigationProp<
RouteName: $Keys<ChatParamList> = $Keys<ChatParamList>,
diff --git a/native/roles/change-roles-header-left-button.react.js b/native/roles/change-roles-header-left-button.react.js
--- a/native/roles/change-roles-header-left-button.react.js
+++ b/native/roles/change-roles-header-left-button.react.js
@@ -1,14 +1,44 @@
// @flow
import { HeaderBackButton as BaseHeaderBackButton } from '@react-navigation/elements';
+import invariant from 'invariant';
import * as React from 'react';
-import { Text } from 'react-native';
+import { Alert, Text } from 'react-native';
import { TouchableOpacity } from 'react-native-gesture-handler';
+import type { NavigationRoute } from '../navigation/route-names';
import { useColors } from '../themes/colors.js';
-type Props = React.ElementConfig<typeof BaseHeaderBackButton>;
-function ChangeRolesHeaderLeftButton(props: Props): React.Node {
+type ChangeRolesHeaderLeftButtonProps = {
+ +route: NavigationRoute<'ChangeRolesScreen'>,
+ ...React.ElementConfig<typeof BaseHeaderBackButton>,
+};
+
+function ChangeRolesHeaderLeftButton(
+ props: ChangeRolesHeaderLeftButtonProps,
+): React.Node {
+ const { memberInfo, role: selectedRole } = props.route.params;
+ const { role: memberRole } = memberInfo;
+
+ const onCancel = React.useCallback(() => {
+ const { onPress } = props;
+ invariant(onPress, 'onPress must be defined');
+
+ if (selectedRole === memberRole) {
+ onPress();
+ return;
+ }
+
+ Alert.alert(
+ 'Discard changes?',
+ 'You have unsaved changes which will be discarded if you navigate away',
+ [
+ { text: 'Leave', onPress },
+ { text: 'Stay', style: 'cancel' },
+ ],
+ );
+ }, [memberRole, props, selectedRole]);
+
const { panelForegroundSecondaryLabel } = useColors();
const labelStyle = React.useMemo(
() => ({
@@ -19,7 +49,7 @@
);
return (
- <TouchableOpacity onPress={props.onPress}>
+ <TouchableOpacity onPress={onCancel}>
<Text style={labelStyle}>Cancel</Text>
</TouchableOpacity>
);

File Metadata

Mime Type
text/plain
Expires
Tue, Nov 26, 9:28 PM (22 h, 58 s)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2586389
Default Alt Text
D8159.id27949.diff (2 KB)

Event Timeline