SendEmailConfirmationView.tsx 2.79 KB
Newer Older
1
2
import React, { useEffect, useState } from 'react';
import { StackNavigationProp } from '@react-navigation/stack';
3
import { RouteProp } from '@react-navigation/core';
4

5
import { OutsideParamList } from '../stacks/types';
6
7
8
9
10
11
12
13
14
15
16
import TextInput from '../containers/TextInput';
import Button from '../containers/Button';
import { showErrorAlert } from '../utils/info';
import isValidEmail from '../utils/isValidEmail';
import I18n from '../i18n';
import RocketChat from '../lib/rocketchat';
import { useTheme } from '../theme';
import FormContainer, { FormContainerInner } from '../containers/FormContainer';
import log, { events, logEvent } from '../utils/log';
import sharedStyles from './Styles';

17
18
19
interface ISendEmailConfirmationViewProps {
	navigation: StackNavigationProp<OutsideParamList, 'SendEmailConfirmationView'>;
	route: RouteProp<OutsideParamList, 'SendEmailConfirmationView'>;
20
21
}

22
const SendEmailConfirmationView = ({ navigation, route }: ISendEmailConfirmationViewProps): JSX.Element => {
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
	const [email, setEmail] = useState('');
	const [invalidEmail, setInvalidEmail] = useState(true);
	const [isFetching, setIsFetching] = useState(false);

	const { theme } = useTheme();

	const validate = (val: string) => {
		const isInvalidEmail = !isValidEmail(val);
		setEmail(val);
		setInvalidEmail(isInvalidEmail);
	};

	const resendConfirmationEmail = async () => {
		logEvent(events.SEC_SEND_EMAIL_CONFIRMATION);
		if (invalidEmail || !email) {
			return;
		}
		try {
			setIsFetching(true);
			const result = await RocketChat.sendConfirmationEmail(email);
			if (result.success) {
				navigation.pop();
				showErrorAlert(I18n.t('Verify_email_desc'));
			}
		} catch (e: any) {
			log(e);
			const msg = e?.data?.error || I18n.t('There_was_an_error_while_action', { action: I18n.t('sending_email_confirmation') });
			showErrorAlert(msg, I18n.t('Alert'));
		}
		setIsFetching(false);
	};

	useEffect(() => {
		navigation.setOptions({
			title: 'Rocket.Chat'
		});
		if (route.params?.user) {
			validate(route.params.user);
		}
	}, []);

	return (
		<FormContainer theme={theme} testID='send-email-confirmation-view'>
			<FormContainerInner>
				<TextInput
					autoFocus
					placeholder={I18n.t('Email')}
					keyboardType='email-address'
					returnKeyType='send'
					onChangeText={(email: string) => validate(email)}
					onSubmitEditing={resendConfirmationEmail}
					testID='send-email-confirmation-view-email'
					containerStyle={sharedStyles.inputLastChild}
					theme={theme}
					value={email}
				/>
				<Button
					title={I18n.t('Send_email_confirmation')}
					type='primary'
					onPress={resendConfirmationEmail}
					testID='send-email-confirmation-view-submit'
					loading={isFetching}
					disabled={invalidEmail}
					theme={theme}
				/>
			</FormContainerInner>
		</FormContainer>
	);
};
export default SendEmailConfirmationView;