[web] Add callback adding members to thread in `AddMembersModal`
ClosedPublic
Actions

Authored by • jacek on Apr 15 2022, 4:42 AM.

Details

Reviewers

tomek
atul
• benschac

Commits

rCOMM5261b164eb1e: [web] Add callback adding members to thread in `AddMembersModal`

Summary

Introduce callback for dispatching server action in AddMembersModal. It is executed after selecting all users to add and pressing "Add selected members" button.

Test Plan

After pressing the button, all selected users should be added to the thread

Diff Detail

Repository

rCOMM Comm

Lint

No Lint Coverage

Unit

No Test Coverage

Event Timeline

• jacek created this revision.Apr 15 2022, 4:42 AM

Herald added subscribers: • abosh, • benschac, • karol and 4 others. · View Herald TranscriptApr 15 2022, 4:42 AM

• jacek added a parent revision: D3743: [web] Introduce searching users in `AddMembersModal`.Apr 15 2022, 4:56 AM

• jacek added reviewers: tomek, atul, • benschac.

Harbormaster completed remote builds in B8230: Diff 11514.Apr 15 2022, 8:27 AM

• jacek requested review of this revision.Apr 15 2022, 8:27 AM

tomek accepted this revision.Apr 15 2022, 9:38 AM

This revision is now accepted and ready to land.Apr 15 2022, 9:38 AM

rebase, convert set to array

Harbormaster completed remote builds in B8443: Diff 11782.Apr 22 2022, 3:57 AM

rebase

Harbormaster completed remote builds in B8591: Diff 11975.Apr 27 2022, 2:51 AM

rebase

Harbormaster completed remote builds in B8692: Diff 12103.Apr 29 2022, 3:34 AM

Closed by commit rCOMM5261b164eb1e: [web] Add callback adding members to thread in `AddMembersModal` (authored by • jacek). · Explain WhyApr 29 2022, 3:44 AM

This revision was automatically updated to reflect the committed changes.

• jacek added a commit: rCOMM5261b164eb1e: [web] Add callback adding members to thread in `AddMembersModal`.

Revision Contents
Changeset List

Path

Size

web/

modals/

threads/

members/

add-members-modal.react.js

30 lines

Diff 12103

View Options

web/modals/threads/members/add-members-modal.react.js

	// @flow			// @flow

	import { HeaderBackButton as BaseHeaderBackButton } from '@react-navigation/elements';			import { HeaderBackButton as BaseHeaderBackButton } from '@react-navigation/elements';
				import invariant from 'invariant';
	import * as React from 'react';			import * as React from 'react';
	import { Text } from 'react-native';			import { Alert, Text } from 'react-native';
	import { TouchableOpacity } from 'react-native-gesture-handler';			import { TouchableOpacity } from 'react-native-gesture-handler';

				import type { NavigationRoute } from '../navigation/route-names';
	import { useColors } from '../themes/colors.js';			import { useColors } from '../themes/colors.js';

	type Props = React.ElementConfig<typeof BaseHeaderBackButton>;			type ChangeRolesHeaderLeftButtonProps = {
	function ChangeRolesHeaderLeftButton(props: Props): React.Node {			+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(
				'Unsaved Changes',
				'You have unsaved changes, are you sure you want to cancel? You will lose all your progress',
				[
				{ text: 'Cancel', onPress },
				{ text: 'Stay', style: 'cancel' },
				],
				{ cancelable: true },
				);
				}, [memberRole, props, selectedRole]);
				rohanAuthorUnsubmitted Done Inline Actions I think the wording here may be a bit confusing. In my experience, 'cancel' typically means close the alert, and there's another option like 'confirm' or something that will mean you're ok with discarding changes. Here it seems like 'cancel' means we're ok with discarding changes. Not sure if it's just me though (cc @ted) rohan: I think the wording here may be a bit confusing. In my experience, 'cancel' typically means…
				ashoatUnsubmitted Not Done Inline Actions What do we do in the current edit-message workflow? Heads-up I generally handle copy, not @ted ashoat: What do we do in the current edit-message workflow? Heads-up I generally handle copy, not @ted
				rohanAuthorUnsubmitted Done Inline Actions Ah my bad. It looks like in message editing: `Continue editing` closes the alert and continues editing while `Discard edit` closes the alert and exits editing rohan: Ah my bad. It looks like in message editing: `Continue editing` closes the alert and continues…
				ashoatUnsubmitted Not Done Inline Actions I agree we shouldn't use the term `Cancel` here... how about `Leave`? I don't think we need `{ cancelable: true }`... we can just default to `Stay` if the user dismisses the `Alert` Can we try to match copy for title / description with the edit-message workflow? ashoat: 1. I agree we shouldn't use the term `Cancel` here... how about `Leave`? 2. I don't think we…
				rohanAuthorUnsubmitted Done Inline Actions Yeah that makes sense, I'll update the diff rohan: Yeah that makes sense, I'll update the diff

	const { panelForegroundSecondaryLabel } = useColors();			const { panelForegroundSecondaryLabel } = useColors();
	const labelStyle = React.useMemo(			const labelStyle = React.useMemo(
	() => ({			() => ({
	color: panelForegroundSecondaryLabel,			color: panelForegroundSecondaryLabel,
	marginLeft: 10,			marginLeft: 10,
	}),			}),
	[panelForegroundSecondaryLabel],			[panelForegroundSecondaryLabel],
	);			);

	return (			return (
	<TouchableOpacity onPress={props.onPress}>			<TouchableOpacity onPress={onCancel}>
	<Text style={labelStyle}>Cancel</Text>			<Text style={labelStyle}>Cancel</Text>
	</TouchableOpacity>			</TouchableOpacity>
	);			);
	}			}

	export default ChangeRolesHeaderLeftButton;			export default ChangeRolesHeaderLeftButton;

[web] Add callback adding members to thread in `AddMembersModal`ClosedPublicActions