Webatrice: Registration toasts (#4566)

* wip

* Registration Success Toast

* remove debugging code

* remove unused field

* Show toast on successful password reset

* Toast on account activation success

* lint and PR feedback

* Rework interface names to avoid collision

* Move CssBaseline to sibling of ToastProvider

Co-authored-by: Brent Clark <brent@backboneiq.com>
This commit is contained in:
Brent Clark 2022-02-15 19:40:30 -06:00 committed by GitHub
parent 88b861d632
commit 4c04b4ef5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 164 additions and 13 deletions

View file

@ -1,6 +1,4 @@
// eslint-disable-next-line
import React, { Component, useState } from 'react';
import { connect } from 'react-redux';
import { useState } from 'react';
import { Form, Field } from 'react-final-form';
import { OnChange } from 'react-final-form-listeners';
import setFieldTouched from 'final-form-set-field-touched'
@ -11,9 +9,9 @@ import Typography from '@material-ui/core/Typography';
import { CountryDropdown, InputField, KnownHosts } from 'components';
import { useReduxEffect } from 'hooks';
import { ServerTypes } from 'store';
import { FormKey } from 'types';
import './RegisterForm.css';
import { useToast } from 'components/Toast';
const RegisterForm = ({ onSubmit }: RegisterFormProps) => {
const [emailRequired, setEmailRequired] = useState(false);
@ -21,6 +19,7 @@ const RegisterForm = ({ onSubmit }: RegisterFormProps) => {
const [emailError, setEmailError] = useState(null);
const [passwordError, setPasswordError] = useState(null);
const [userNameError, setUserNameError] = useState(null);
const { openToast } = useToast({ key: 'registration-success', children: 'Registration Successful!' })
const onHostChange = (host) => setEmailRequired(false);
const onEmailChange = () => emailError && setEmailError(null);
@ -35,6 +34,10 @@ const RegisterForm = ({ onSubmit }: RegisterFormProps) => {
setError(error);
}, ServerTypes.REGISTRATION_FAILED);
useReduxEffect(() => {
openToast()
}, ServerTypes.REGISTRATION_SUCCES);
useReduxEffect(({ error }) => {
setEmailError(error);
}, ServerTypes.REGISTRATION_EMAIL_ERROR);