From 110f5b6c95cd35215d35dac1f6f50b136c113a8c Mon Sep 17 00:00:00 2001
From: Rodri Sanchez <rodri.sanchez1998@gmail.com>
Date: Thu, 9 Mar 2023 18:36:36 -0300
Subject: [PATCH 1/3] Revert "revert "Chore/modernize form components #1372 by
shayc""
This reverts commit 4bff3269a65bda37789dd453044ad999ec211c07.
---
package.json | 4 +-
.../Account/Activate/Activate.container.js | 70 ++--
.../ChangePassword/ChangePassword.actions.js | 5 +-
.../ChangePassword.component.js | 237 +++++++-------
.../Account/ChangePassword/ChangePassword.css | 4 -
.../Account/Login/Login.component.js | 188 +++++------
.../Account/Login/Login.component.test.js | 4 +-
.../ResetPassword/ResetPassword.actions.js | 7 +-
.../ResetPassword/ResetPassword.component.js | 170 +++++-----
.../Account/SignUp/SignUp.component.js | 307 +++++++++---------
.../Account/SignUp/Signup.component.test.js | 3 +-
yarn.lock | 119 ++-----
12 files changed, 526 insertions(+), 592 deletions(-)
diff --git a/package.json b/package.json
index 6d2a0017f..41fca8dda 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,7 @@
"echarts-for-react": "^3.0.2",
"file-saver": "^2.0.5",
"fontsource-roboto": "^4.0.0",
- "formik": "^1.3.2",
+ "formik": "^2.2.9",
"history": "^4.10.1",
"i18n-iso-countries": "4.3.1",
"intl": "^1.2.5",
@@ -85,7 +85,7 @@
"shortid": "^2.2.16",
"source-map-explorer": "^2.5.3",
"swiper": "^6.8.4",
- "yup": "^0.32.11"
+ "yup": "^1.0.0"
},
"devDependencies": {
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.0",
diff --git a/src/components/Account/Activate/Activate.container.js b/src/components/Account/Activate/Activate.container.js
index 601c7bda6..9d335f8a7 100644
--- a/src/components/Account/Activate/Activate.container.js
+++ b/src/components/Account/Activate/Activate.container.js
@@ -1,48 +1,44 @@
-import React, { Fragment, PureComponent } from 'react';
+import React, { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { activate } from './Activate.actions';
import './Activate.css';
-class ActivateContainer extends PureComponent {
- state = {
- isActivating: false,
- activationStatus: {}
- };
-
- componentDidMount() {
- const {
- match: {
- params: { url }
- }
- } = this.props;
+function ActivateContainer({
+ match: {
+ params: { url }
+ }
+}) {
+ const [isActivating, setIsActivating] = useState(false);
+ const [activationStatus, setActivationStatus] = useState({});
- this.setState({ isActivating: true });
+ useEffect(
+ () => {
+ setIsActivating(true);
- activate(url)
- .then(activationStatus => this.setState({ activationStatus }))
- .catch(activationStatus => this.setState({ activationStatus }))
- .finally(() => this.setState({ isActivating: false }));
- }
+ activate(url)
+ .then(response => setActivationStatus(response))
+ .catch(error => setActivationStatus(error))
+ .finally(() => setIsActivating(false));
+ },
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ []
+ );
- render() {
- const { isActivating, activationStatus } = this.state;
+ return (
+ <div className="Activate">
+ {isActivating ? (
+ 'Activating your account...'
+ ) : (
+ <>
+ <div>{activationStatus.message}</div>
- return (
- <div className="Activate">
- {isActivating ? (
- 'Activating your account...'
- ) : (
- <Fragment>
- {activationStatus.message}
- <br />
- <Link to="/" className="Activate_home">
- Home page
- </Link>
- </Fragment>
- )}
- </div>
- );
- }
+ <Link to="/" className="Activate_home">
+ Home page
+ </Link>
+ </>
+ )}
+ </div>
+ );
}
export default ActivateContainer;
diff --git a/src/components/Account/ChangePassword/ChangePassword.actions.js b/src/components/Account/ChangePassword/ChangePassword.actions.js
index 8f8691c02..3809c0808 100644
--- a/src/components/Account/ChangePassword/ChangePassword.actions.js
+++ b/src/components/Account/ChangePassword/ChangePassword.actions.js
@@ -34,12 +34,15 @@ export function storePassword(userid, password, url) {
return Promise.resolve(res);
} catch (err) {
dispatch(storePasswordApiFailure(err.message));
+
if (err.response != null) {
return Promise.reject(err.response.data);
}
- var disonnected = {
+
+ const disonnected = {
message: 'Unable to contact server. Try in a moment'
};
+
return Promise.reject(disonnected);
}
};
diff --git a/src/components/Account/ChangePassword/ChangePassword.component.js b/src/components/Account/ChangePassword/ChangePassword.component.js
index 4954b3011..7014487b6 100644
--- a/src/components/Account/ChangePassword/ChangePassword.component.js
+++ b/src/components/Account/ChangePassword/ChangePassword.component.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { useState } from 'react';
import { connect } from 'react-redux';
import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
import { Formik } from 'formik';
@@ -18,141 +18,136 @@ import { storePassword } from './ChangePassword.actions';
import messages from './ChangePassword.messages';
import './ChangePassword.css';
-export class ChangePassword extends Component {
- static propTypes = {
- intl: intlShape.isRequired
- };
-
- state = {
- isSending: false,
- storePasswordState: {},
- redirectMessage: ''
- };
+export function ChangePassword({
+ intl,
+ history,
+ storePassword,
+ match: {
+ params: { userid, url }
+ }
+}) {
+ const [isSending, setIsSending] = useState(false);
+ const [storePasswordState, setStorePasswordState] = useState({});
+ const [redirectMessage, setRedirectMessage] = useState('');
+ const isButtonDisabled = isSending || !!storePasswordState.success;
- sleep = milliseconds => {
+ function sleep(milliseconds) {
return new Promise(resolve => setTimeout(resolve, milliseconds));
- };
-
- handleSubmit = values => {
- const {
- match: {
- params: { userid, url }
- }
- } = this.props;
-
- const { intl, history, storePassword } = this.props;
+ }
- this.setState({
- isSending: true,
- storePasswordState: {}
- });
+ function handleSubmit(values) {
+ setIsSending(true);
+ setStorePasswordState({});
storePassword(userid, values.password, url)
.then(res => {
- this.setState({
- storePasswordState: res,
- redirectMessage: intl.formatMessage(messages.redirect)
- });
- this.sleep(2000).then(() => {
+ setStorePasswordState(res);
+ setRedirectMessage(intl.formatMessage(messages.redirect));
+
+ sleep(2000).then(() => {
history.replace('/login-signup');
});
})
- .catch(err => this.setState({ storePasswordState: err }))
- .finally(() => this.setState({ isSending: false }));
- };
-
- render() {
- const { isSending, storePasswordState, redirectMessage } = this.state;
- const { intl } = this.props;
-
- const isButtonDisabled = isSending || !!storePasswordState.success;
-
- return (
- <div className="ChangePassword">
- <Dialog open={true} aria-labelledby="changePassword">
- <DialogTitle id="changePassword">
- <FormattedMessage {...messages.changePassword} />
- </DialogTitle>
- <DialogContent>
- {storePasswordState && !storePasswordState.success && (
- <DialogContentText>
- <FormattedMessage {...messages.changePasswordText} />
- </DialogContentText>
+ .catch(err => setStorePasswordState(err))
+ .finally(() => setIsSending(false));
+ }
+
+ return (
+ <div className="ChangePassword">
+ <Dialog open={true} aria-labelledby="changePassword">
+ <DialogTitle id="changePassword">
+ <FormattedMessage {...messages.changePassword} />
+ </DialogTitle>
+
+ <DialogContent>
+ {storePasswordState && !storePasswordState.success && (
+ <DialogContentText>
+ <FormattedMessage {...messages.changePasswordText} />
+ </DialogContentText>
+ )}
+
+ <div
+ className={classNames('ChangePassword__status', {
+ 'ChangePassword__status--error': !storePasswordState.success,
+ 'ChangePassword__status--success': storePasswordState.success
+ })}
+ >
+ {!!storePasswordState.success ? (
+ <Typography color="inherit">
+ {intl.formatMessage(messages.changePasswordSuccess)}
+ </Typography>
+ ) : (
+ <Typography color="inherit">
+ {storePasswordState.message}
+ </Typography>
)}
+ </div>
+
+ {redirectMessage && (
<div
- className={classNames('ChangePassword__status', {
- 'ChangePassword__status--error': !storePasswordState.success,
- 'ChangePassword__status--success': storePasswordState.success
- })}
- >
- {!!storePasswordState.success ? (
- <Typography color="inherit">
- {intl.formatMessage(messages.changePasswordSuccess)}
- </Typography>
- ) : (
- <Typography color="inherit">
- {storePasswordState.message}
- </Typography>
+ className={classNames(
+ 'ChangePassword__status',
+ 'ChangePassword__status--success'
)}
+ >
+ <Typography color="inherit">
+ {intl.formatMessage(messages.redirect)}
+ </Typography>
</div>
- {redirectMessage && (
- <div
- className={classNames(
- 'ChangePassword__status',
- 'ChangePassword__status--success'
- )}
- >
- <Typography color="inherit">
- {intl.formatMessage(messages.redirect)}
- </Typography>
- </div>
- )}
- {storePasswordState && !storePasswordState.success && (
- <Formik
- onSubmit={this.handleSubmit}
- validationSchema={validationSchema}
- >
- {({ errors, handleChange, handleSubmit }) => (
- <form
- className="ChangePassword__form"
- onSubmit={handleSubmit}
- >
- <TextField
- error={errors.password}
- label={intl.formatMessage(messages.password)}
- type="password"
- name="password"
- onChange={handleChange}
- />
- <TextField
- error={errors.passwordRepeat}
- label={intl.formatMessage(messages.passwordRepeat)}
- type="password"
- name="passwordRepeat"
- onChange={handleChange}
- />
- <DialogActions>
- <Button
- type="submit"
- disabled={isButtonDisabled}
- variant="contained"
- color="primary"
- >
- {isSending && <LoadingIcon />}
- <FormattedMessage {...messages.send} />
- </Button>
- </DialogActions>
- </form>
- )}
- </Formik>
- )}
- </DialogContent>
- </Dialog>
- </div>
- );
- }
+ )}
+
+ {storePasswordState && !storePasswordState.success && (
+ <Formik
+ onSubmit={handleSubmit}
+ validationSchema={validationSchema}
+ initialValues={{
+ password: '',
+ passwordRepeat: ''
+ }}
+ >
+ {({ errors, handleChange, handleSubmit }) => (
+ <form className="ChangePassword__form" onSubmit={handleSubmit}>
+ <TextField
+ error={errors.password}
+ label={intl.formatMessage(messages.password)}
+ type="password"
+ name="password"
+ onChange={handleChange}
+ />
+
+ <TextField
+ error={errors.passwordRepeat}
+ label={intl.formatMessage(messages.passwordRepeat)}
+ type="password"
+ name="passwordRepeat"
+ onChange={handleChange}
+ />
+
+ <DialogActions>
+ <Button
+ type="submit"
+ disabled={isButtonDisabled}
+ variant="contained"
+ color="primary"
+ >
+ {isSending && <LoadingIcon />}
+ <FormattedMessage {...messages.send} />
+ </Button>
+ </DialogActions>
+ </form>
+ )}
+ </Formik>
+ )}
+ </DialogContent>
+ </Dialog>
+ </div>
+ );
}
+ChangePassword.propTypes = {
+ intl: intlShape.isRequired
+};
+
const mapDispatchToProps = {
storePassword
};
diff --git a/src/components/Account/ChangePassword/ChangePassword.css b/src/components/Account/ChangePassword/ChangePassword.css
index e22c079e2..b916dc150 100644
--- a/src/components/Account/ChangePassword/ChangePassword.css
+++ b/src/components/Account/ChangePassword/ChangePassword.css
@@ -9,10 +9,6 @@
background: linear-gradient(to right, rgb(121, 22, 254), rgb(172, 47, 138));
}
-.ChangePassword_home {
- margin-top: 1em;
- color: inherit;
-}
.ChangePassword__form > div {
width: 100%;
}
diff --git a/src/components/Account/Login/Login.component.js b/src/components/Account/Login/Login.component.js
index 9ff63b578..a1e31f60f 100644
--- a/src/components/Account/Login/Login.component.js
+++ b/src/components/Account/Login/Login.component.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { useState } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
@@ -17,106 +17,110 @@ import { login } from './Login.actions';
import messages from './Login.messages';
import './Login.css';
-export class Login extends Component {
- static propTypes = {
- intl: intlShape.isRequired,
- isDialogOpen: PropTypes.bool.isRequired,
- onClose: PropTypes.func.isRequired,
- onResetPasswordClick: PropTypes.func.isRequired
- };
+export function Login({
+ intl,
+ isDialogOpen,
+ onClose,
+ onResetPasswordClick,
+ login
+}) {
+ const [isLogin, setIsLogin] = useState(false);
+ const [loginStatus, setLoginStatus] = useState({});
+ const isButtonDisabled = isLogin || !!loginStatus.success;
- state = {
- isLogging: false,
- loginStatus: {}
- };
+ function handleSubmit(values) {
+ setIsLogin(true);
+ setLoginStatus({});
- handleSubmit = values => {
- const { login } = this.props;
+ login(values)
+ .catch(loginStatus => setLoginStatus(loginStatus))
+ .finally(() => setIsLogin(false));
+ }
- this.setState({
- isLogging: true,
- loginStatus: {}
- });
+ return (
+ <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="login">
+ <DialogTitle id="login">
+ <FormattedMessage {...messages.login} />
+ </DialogTitle>
- login(values)
- .catch(loginStatus => this.setState({ loginStatus }))
- .finally(() => this.setState({ isLogging: false }));
- };
+ <DialogContent>
+ <div
+ className={classNames('Login__status', {
+ 'Login__status--error': !loginStatus.success,
+ 'Login__status--success': loginStatus.success
+ })}
+ >
+ <Typography color="inherit">{loginStatus.message}</Typography>
+ </div>
- render() {
- const { isLogging, loginStatus } = this.state;
- const { intl, isDialogOpen, onClose, onResetPasswordClick } = this.props;
+ <Formik
+ onSubmit={handleSubmit}
+ validationSchema={validationSchema}
+ initialValues={{
+ email: '',
+ password: ''
+ }}
+ >
+ {({ errors, handleChange, handleSubmit }) => (
+ <form className="Login__form" onSubmit={handleSubmit}>
+ <TextField
+ error={errors.email}
+ label={intl.formatMessage(messages.email)}
+ name="email"
+ onChange={handleChange}
+ />
- const isButtonDisabled = isLogging || !!loginStatus.success;
+ <TextField
+ error={errors.password}
+ label={intl.formatMessage(messages.password)}
+ type="password"
+ name="password"
+ onChange={handleChange}
+ />
- return (
- <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="login">
- <DialogTitle id="login">
- <FormattedMessage {...messages.login} />
- </DialogTitle>
- <DialogContent>
- <div
- className={classNames('Login__status', {
- 'Login__status--error': !loginStatus.success,
- 'Login__status--success': loginStatus.success
- })}
- >
- <Typography color="inherit">{loginStatus.message}</Typography>
- </div>
- <Formik
- onSubmit={this.handleSubmit}
- validationSchema={validationSchema}
- >
- {({ errors, handleChange, handleSubmit }) => (
- <form className="Login__form" onSubmit={handleSubmit}>
- <TextField
- error={errors.email}
- label={intl.formatMessage(messages.email)}
- name="email"
- onChange={handleChange}
- />
- <TextField
- error={errors.password}
- label={intl.formatMessage(messages.password)}
- type="password"
- name="password"
- onChange={handleChange}
- />
- <DialogActions>
- <Button
- color="primary"
- disabled={isButtonDisabled}
- onClick={onClose}
- >
- <FormattedMessage {...messages.cancel} />
- </Button>
- <Button
- type="submit"
- disabled={isButtonDisabled}
- variant="contained"
- color="primary"
- >
- {isLogging && <LoadingIcon />}
- <FormattedMessage {...messages.login} />
- </Button>
- </DialogActions>
- </form>
- )}
- </Formik>
- <Button
- size="small"
- color="primary"
- disabled={isButtonDisabled}
- onClick={onResetPasswordClick}
- >
- <FormattedMessage {...messages.forgotPassword} />
- </Button>
- </DialogContent>
- </Dialog>
- );
- }
+ <DialogActions>
+ <Button
+ color="primary"
+ disabled={isButtonDisabled}
+ onClick={onClose}
+ >
+ <FormattedMessage {...messages.cancel} />
+ </Button>
+
+ <Button
+ type="submit"
+ disabled={isButtonDisabled}
+ variant="contained"
+ color="primary"
+ >
+ {isLogin && <LoadingIcon />}
+ <FormattedMessage {...messages.login} />
+ </Button>
+ </DialogActions>
+ </form>
+ )}
+ </Formik>
+
+ <Button
+ size="small"
+ color="primary"
+ disabled={isButtonDisabled}
+ onClick={onResetPasswordClick}
+ >
+ <FormattedMessage {...messages.forgotPassword} />
+ </Button>
+ </DialogContent>
+ </Dialog>
+ );
}
+Login.propTypes = {
+ intl: intlShape.isRequired,
+ isDialogOpen: PropTypes.bool.isRequired,
+ onClose: PropTypes.func.isRequired,
+ onResetPasswordClick: PropTypes.func.isRequired
+};
+
const mapDispatchToProps = {
login
};
diff --git a/src/components/Account/Login/Login.component.test.js b/src/components/Account/Login/Login.component.test.js
index 72c4ded3d..9c8155bc9 100644
--- a/src/components/Account/Login/Login.component.test.js
+++ b/src/components/Account/Login/Login.component.test.js
@@ -1,6 +1,5 @@
import React from 'react';
-import { shallow, mount } from 'enzyme';
-import { shallowMatchSnapshot } from '../../../common/test_utils';
+import { shallow } from 'enzyme';
import { Login } from './Login.component';
jest.mock('./Login.messages', () => {
@@ -24,7 +23,6 @@ jest.mock('./Login.messages', () => {
};
});
-const mockLoginfn = jest.fn();
const props = {
isDialogOpen: false,
onClose: jest.fn(),
diff --git a/src/components/Account/ResetPassword/ResetPassword.actions.js b/src/components/Account/ResetPassword/ResetPassword.actions.js
index 9ac5af14c..4756fbce3 100644
--- a/src/components/Account/ResetPassword/ResetPassword.actions.js
+++ b/src/components/Account/ResetPassword/ResetPassword.actions.js
@@ -25,7 +25,7 @@ export function forgotApiSuccess(board) {
};
}
-export function forgot({ email }, type = 'local') {
+export function forgot({ email }) {
return async dispatch => {
try {
dispatch(forgotApiStarted());
@@ -34,12 +34,15 @@ export function forgot({ email }, type = 'local') {
return Promise.resolve(res);
} catch (err) {
dispatch(forgotApiFailure(err.message));
+
if (err.response != null) {
return Promise.reject(err.response.data);
}
- var disonnected = {
+
+ const disonnected = {
message: 'Unable to contact server. Try in a moment'
};
+
return Promise.reject(disonnected);
}
};
diff --git a/src/components/Account/ResetPassword/ResetPassword.component.js b/src/components/Account/ResetPassword/ResetPassword.component.js
index eb216f307..806daedac 100644
--- a/src/components/Account/ResetPassword/ResetPassword.component.js
+++ b/src/components/Account/ResetPassword/ResetPassword.component.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { useState } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
@@ -18,103 +18,99 @@ import { forgot } from './ResetPassword.actions';
import messages from './ResetPassword.messages';
import './ResetPassword.css';
-export class ResetPassword extends Component {
- static propTypes = {
- intl: intlShape.isRequired,
- isDialogOpen: PropTypes.bool.isRequired,
- onClose: PropTypes.func.isRequired
- };
+export function ResetPassword({ intl, isDialogOpen, onClose }) {
+ const [isSending, setIsSending] = useState(false);
+ const [forgotState, setForgotState] = useState({});
+ const isButtonDisabled = isSending || !!forgotState.success;
- state = {
- isSending: false,
- forgotState: {}
- };
-
- handleSubmit = values => {
- const { forgot } = this.props;
-
- this.setState({
- isSending: true,
- forgotState: {}
- });
+ function handleSubmit(values) {
+ setIsSending(true);
+ setForgotState({});
forgot(values)
- .then(res => this.setState({ forgotState: res }))
- .catch(err => this.setState({ forgotState: err }))
- .finally(() => this.setState({ isSending: false }));
- };
+ .then(response => setForgotState(response))
+ .catch(error => setForgotState(error))
+ .finally(() => setIsSending(false));
+ }
- render() {
- const { isSending, forgotState } = this.state;
- const { intl, isDialogOpen, onClose } = this.props;
+ return (
+ <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="forgot">
+ <DialogTitle id="forgot">
+ <FormattedMessage {...messages.resetPassword} />
+ </DialogTitle>
- const isButtonDisabled = isSending || !!forgotState.success;
+ <DialogContent>
+ <DialogContentText>
+ <FormattedMessage {...messages.resetPasswordText} />
+ </DialogContentText>
- return (
- <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="forgot">
- <DialogTitle id="forgot">
- <FormattedMessage {...messages.resetPassword} />
- </DialogTitle>
- <DialogContent>
- <DialogContentText>
- <FormattedMessage {...messages.resetPasswordText} />
- </DialogContentText>
+ <div
+ className={classNames('Forgot__status', {
+ 'Forgot__status--error': !forgotState.success,
+ 'Forgot__status--success': forgotState.success
+ })}
+ >
+ {!!forgotState.success ? (
+ <Typography color="inherit">
+ {intl.formatMessage(messages.resetPasswordSuccess)}
+ </Typography>
+ ) : (
+ <Typography color="inherit">{forgotState.message}</Typography>
+ )}
+ </div>
- <div
- className={classNames('Forgot__status', {
- 'Forgot__status--error': !forgotState.success,
- 'Forgot__status--success': forgotState.success
- })}
+ {forgotState && !forgotState.success && (
+ <Formik
+ onSubmit={handleSubmit}
+ validationSchema={validationSchema}
+ initialValues={{
+ email: ''
+ }}
>
- {!!forgotState.success ? (
- <Typography color="inherit">
- {intl.formatMessage(messages.resetPasswordSuccess)}
- </Typography>
- ) : (
- <Typography color="inherit">{forgotState.message}</Typography>
+ {({ errors, handleChange, handleSubmit }) => (
+ <form className="Forgot__form" onSubmit={handleSubmit}>
+ <TextField
+ error={errors.email}
+ label={intl.formatMessage(messages.email)}
+ name="email"
+ onChange={handleChange}
+ />
+
+ <DialogActions>
+ <Button
+ color="primary"
+ disabled={isButtonDisabled}
+ onClick={onClose}
+ >
+ <FormattedMessage {...messages.cancel} />
+ </Button>
+
+ <Button
+ type="submit"
+ disabled={isButtonDisabled}
+ variant="contained"
+ color="primary"
+ >
+ {isSending && <LoadingIcon />}
+ <FormattedMessage {...messages.send} />
+ </Button>
+ </DialogActions>
+ </form>
)}
- </div>
- {forgotState && !forgotState.success && (
- <Formik
- onSubmit={this.handleSubmit}
- validationSchema={validationSchema}
- >
- {({ errors, handleChange, handleSubmit }) => (
- <form className="Forgot__form" onSubmit={handleSubmit}>
- <TextField
- error={errors.email}
- label={intl.formatMessage(messages.email)}
- name="email"
- onChange={handleChange}
- />
- <DialogActions>
- <Button
- color="primary"
- disabled={isButtonDisabled}
- onClick={onClose}
- >
- <FormattedMessage {...messages.cancel} />
- </Button>
- <Button
- type="submit"
- disabled={isButtonDisabled}
- variant="contained"
- color="primary"
- >
- {isSending && <LoadingIcon />}
- <FormattedMessage {...messages.send} />
- </Button>
- </DialogActions>
- </form>
- )}
- </Formik>
- )}
- </DialogContent>
- </Dialog>
- );
- }
+ </Formik>
+ )}
+ </DialogContent>
+ </Dialog>
+ );
}
+ResetPassword.propTypes = {
+ intl: intlShape.isRequired,
+ forgot: PropTypes.func.isRequired,
+ isDialogOpen: PropTypes.bool.isRequired,
+ onClose: PropTypes.func.isRequired
+};
+
const mapDispatchToProps = {
forgot
};
diff --git a/src/components/Account/SignUp/SignUp.component.js b/src/components/Account/SignUp/SignUp.component.js
index 7484efd10..710638a2f 100644
--- a/src/components/Account/SignUp/SignUp.component.js
+++ b/src/components/Account/SignUp/SignUp.component.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
import { Formik, ErrorMessage } from 'formik';
@@ -18,161 +18,164 @@ import { signUp } from './SignUp.actions';
import messages from './SignUp.messages';
import './SignUp.css';
-export class SignUp extends Component {
- static propTypes = {
- intl: intlShape.isRequired,
- isDialogOpen: PropTypes.bool.isRequired,
- onClose: PropTypes.func.isRequired
- };
-
- state = {
- isSigningUp: false,
- signUpStatus: {}
- };
-
- componentDidUpdate({ isDialogOpen }) {
- if (this.props.isDialogOpen && this.props.isDialogOpen !== isDialogOpen) {
- this.setState({ signUpStatus: {} });
- }
+export function SignUp({ isDialogOpen, onClose, intl }) {
+ const [isSigningUp, setIsSigningUp] = useState(false);
+ const [signUpStatus, setSignUpStatus] = useState({});
+ const isButtonDisabled = isSigningUp || !!signUpStatus.success;
+
+ function handleSubmit() {
+ setIsSigningUp(true);
+ setSignUpStatus({});
+
+ signUp()
+ .then(response => setSignUpStatus(response))
+ .catch(error => setSignUpStatus(error))
+ .finally(() => setIsSigningUp(false));
}
- handleSubmit = values => {
- const { passwordConfirm, ...formValues } = values;
-
- this.setState({
- isSigningUp: true,
- signUpStatus: {}
- });
-
- signUp(formValues)
- .then(signUpStatus => this.setState({ signUpStatus }))
- .catch(signUpStatus => this.setState({ signUpStatus }))
- .finally(() => this.setState({ isSigningUp: false }));
- };
-
- render() {
- const { signUpStatus, isSigningUp } = this.state;
- const { isDialogOpen, onClose, intl } = this.props;
-
- const isButtonDisabled = isSigningUp || !!signUpStatus.success;
-
- return (
- <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="sign-up">
- <DialogTitle id="sign-up">
- <FormattedMessage {...messages.signUp} />
- </DialogTitle>
- <DialogContent>
- <div
- className={classNames('SignUp__status', {
- 'SignUp__status--error': !signUpStatus.success,
- 'SignUp__status--success': signUpStatus.success
- })}
+ useEffect(
+ () => {
+ if (!isDialogOpen) {
+ setSignUpStatus({});
+ }
+ },
+ [isDialogOpen]
+ );
+
+ return (
+ <Dialog open={isDialogOpen} onClose={onClose} aria-labelledby="sign-up">
+ <DialogTitle id="sign-up">
+ <FormattedMessage {...messages.signUp} />
+ </DialogTitle>
+
+ <DialogContent>
+ <div
+ className={classNames('SignUp__status', {
+ 'SignUp__status--error': !signUpStatus.success,
+ 'SignUp__status--success': signUpStatus.success
+ })}
+ >
+ <Typography color="inherit">{signUpStatus.message}</Typography>
+ </div>
+
+ {signUpStatus && !signUpStatus.success && (
+ <Formik
+ onSubmit={handleSubmit}
+ validationSchema={validationSchema}
+ initialValues={{
+ name: '',
+ email: '',
+ password: '',
+ passwordConfirm: '',
+ isTermsAccepted: false
+ }}
>
- <Typography color="inherit">{signUpStatus.message}</Typography>
- </div>
- {signUpStatus && !signUpStatus.success && (
- <Formik
- onSubmit={this.handleSubmit}
- validationSchema={validationSchema}
- initialValues={{
- isTermsAccepted: false
- }}
- >
- {({ errors, handleChange, handleSubmit }) => (
- <form className="SignUp__form" onSubmit={handleSubmit}>
- <TextField
- name="name"
- label={intl.formatMessage(messages.name)}
- error={errors.name}
- onChange={handleChange}
- />
- <TextField
- name="email"
- label={intl.formatMessage(messages.email)}
- error={errors.email}
- onChange={handleChange}
- />
- <TextField
- type="password"
- name="password"
- label={intl.formatMessage(messages.createYourPassword)}
- error={errors.password}
- onChange={handleChange}
- />
- <TextField
- type="password"
- name="passwordConfirm"
- label={intl.formatMessage(messages.confirmYourPassword)}
- error={errors.passwordConfirm}
- onChange={handleChange}
- />
- <FormControlLabel
- control={
- <Checkbox
- type="checkbox"
- name="isTermsAccepted"
- onChange={handleChange}
- color="primary"
- />
- }
- label={
- <FormattedMessage
- {...messages.agreement}
- values={{
- terms: (
- <a
- href="https://www.cboard.io/terms-of-use/"
- target="_blank"
- rel="noopener noreferrer"
- >
- {intl.formatMessage(messages.termsAndConditions)}
- </a>
- ),
- privacy: (
- <a
- href="https://www.cboard.io/privacy/"
- target="_blank"
- rel="noopener noreferrer"
- >
- {intl.formatMessage(messages.privacy)}
- </a>
- )
- }}
- />
- }
- />
- <ErrorMessage
- name="isTermsAccepted"
- component="p"
- className="SignUp__status--error SignUp__termsError"
- />
-
- <DialogActions>
- <Button
- color="primary"
- disabled={isButtonDisabled}
- onClick={onClose}
- >
- <FormattedMessage {...messages.cancel} />
- </Button>
- <Button
- type="submit"
- disabled={isButtonDisabled}
- variant="contained"
+ {({ errors, handleChange, handleSubmit }) => (
+ <form className="SignUp__form" onSubmit={handleSubmit}>
+ <TextField
+ name="name"
+ label={intl.formatMessage(messages.name)}
+ error={errors.name}
+ onChange={handleChange}
+ />
+
+ <TextField
+ name="email"
+ label={intl.formatMessage(messages.email)}
+ error={errors.email}
+ onChange={handleChange}
+ />
+
+ <TextField
+ type="password"
+ name="password"
+ label={intl.formatMessage(messages.createYourPassword)}
+ error={errors.password}
+ onChange={handleChange}
+ />
+
+ <TextField
+ type="password"
+ name="passwordConfirm"
+ label={intl.formatMessage(messages.confirmYourPassword)}
+ error={errors.passwordConfirm}
+ onChange={handleChange}
+ />
+
+ <FormControlLabel
+ control={
+ <Checkbox
+ type="checkbox"
+ name="isTermsAccepted"
+ onChange={handleChange}
color="primary"
- >
- {isSigningUp && <LoadingIcon />}
- <FormattedMessage {...messages.signMeUp} />
- </Button>
- </DialogActions>
- </form>
- )}
- </Formik>
- )}
- </DialogContent>
- </Dialog>
- );
- }
+ />
+ }
+ label={
+ <FormattedMessage
+ {...messages.agreement}
+ values={{
+ terms: (
+ <a
+ href="https://www.cboard.io/terms-of-use/"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ {intl.formatMessage(messages.termsAndConditions)}
+ </a>
+ ),
+ privacy: (
+ <a
+ href="https://www.cboard.io/privacy/"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+ {intl.formatMessage(messages.privacy)}
+ </a>
+ )
+ }}
+ />
+ }
+ />
+
+ <ErrorMessage
+ name="isTermsAccepted"
+ component="p"
+ className="SignUp__status--error SignUp__termsError"
+ />
+
+ <DialogActions>
+ <Button
+ color="primary"
+ disabled={isButtonDisabled}
+ onClick={onClose}
+ >
+ <FormattedMessage {...messages.cancel} />
+ </Button>
+
+ <Button
+ type="submit"
+ disabled={isButtonDisabled}
+ variant="contained"
+ color="primary"
+ >
+ {isSigningUp && <LoadingIcon />}
+ <FormattedMessage {...messages.signMeUp} />
+ </Button>
+ </DialogActions>
+ </form>
+ )}
+ </Formik>
+ )}
+ </DialogContent>
+ </Dialog>
+ );
}
+SignUp.propTypes = {
+ intl: intlShape.isRequired,
+ isDialogOpen: PropTypes.bool.isRequired,
+ onClose: PropTypes.func.isRequired
+};
+
export default injectIntl(SignUp);
diff --git a/src/components/Account/SignUp/Signup.component.test.js b/src/components/Account/SignUp/Signup.component.test.js
index b59e1d862..6b8b90466 100644
--- a/src/components/Account/SignUp/Signup.component.test.js
+++ b/src/components/Account/SignUp/Signup.component.test.js
@@ -1,6 +1,5 @@
import React from 'react';
-import { shallow, mount } from 'enzyme';
-import { shallowMatchSnapshot } from '../../../common/test_utils';
+import { shallow } from 'enzyme';
import { SignUp } from './SignUp.component';
jest.mock('./SignUp.messages', () => {
diff --git a/yarn.lock b/yarn.lock
index 069b7b7de..e8e39e67a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1882,7 +1882,7 @@
dependencies:
regenerator-runtime "^0.13.4"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.12.13", "@babel/runtime@^7.15.4", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.12.13", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
version "7.17.9"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.9.tgz#d19fbf802d01a8cb6cf053a64e472d42c434ba72"
integrity sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==
@@ -2608,11 +2608,6 @@
resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.11.tgz#d421b6c527a3037f7c84433fd2c4229e016863d3"
integrity sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==
-"@types/lodash@^4.14.175":
- version "4.14.182"
- resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.182.tgz#05301a4d5e62963227eaafe0ce04dd77c54ea5c2"
- integrity sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==
-
"@types/mdast@^3.0.0", "@types/mdast@^3.0.3":
version "3.0.10"
resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.10.tgz#4724244a82a4598884cbbe9bcfd73dff927ee8af"
@@ -3273,7 +3268,7 @@ arrify@^1.0.1:
resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=
-asap@~2.0.3, asap@~2.0.6:
+asap@~2.0.6:
version "2.0.6"
resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
@@ -4719,11 +4714,6 @@ core-js-pure@^3.20.2:
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.22.3.tgz#181d1b6321fb29fe99c16a1f28beb840ab84ad36"
integrity sha512-oN88zz7nmKROMy8GOjs+LN+0LedIvbMdnB5XsTlhcOg1WGARt9l0LFg0zohdoFmCsEZ1h2ZbSQ6azj3M+vhzwQ==
-core-js@^1.0.0:
- version "1.2.7"
- resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
- integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
-
core-js@^2.4.0:
version "2.6.12"
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
@@ -4814,14 +4804,6 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
safe-buffer "^5.0.1"
sha.js "^2.4.8"
-create-react-context@^0.2.2:
- version "0.2.3"
- resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.3.tgz#9ec140a6914a22ef04b8b09b7771de89567cb6f3"
- integrity sha512-CQBmD0+QGgTaxDL3OX1IDXYqjkp2It4RIbcb99jS6AEg27Ga+a9G3JtK6SIu0HBwPLZlmwt9F7UwWA4Bn92Rag==
- dependencies:
- fbjs "^0.8.0"
- gud "^1.0.0"
-
cropperjs@^1.5.12:
version "1.5.12"
resolved "https://registry.yarnpkg.com/cropperjs/-/cropperjs-1.5.12.tgz#d9c0db2bfb8c0d769d51739e8f916bbc44e10f50"
@@ -6476,19 +6458,6 @@ fb-watchman@^2.0.0:
dependencies:
bser "2.1.1"
-fbjs@^0.8.0:
- version "0.8.18"
- resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.18.tgz#9835e0addb9aca2eff53295cd79ca1cfc7c9662a"
- integrity sha512-EQaWFK+fEPSoibjNy8IxUtaFOMXcWsY0JaVrQoZR9zC8N2Ygf9iDITPWjUTVIax95b6I742JFLqASHfsag/vKA==
- dependencies:
- core-js "^1.0.0"
- isomorphic-fetch "^2.1.1"
- loose-envify "^1.0.0"
- object-assign "^4.1.0"
- promise "^7.1.1"
- setimmediate "^1.0.5"
- ua-parser-js "^0.7.30"
-
figgy-pudding@^3.5.1:
version "3.5.2"
resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.2.tgz#b4eee8148abb01dcf1d1ac34367d59e12fa61d6e"
@@ -6731,20 +6700,18 @@ form-data@~2.3.2:
combined-stream "^1.0.6"
mime-types "^2.1.12"
-formik@^1.3.2:
- version "1.5.8"
- resolved "https://registry.yarnpkg.com/formik/-/formik-1.5.8.tgz#eee8cd345effe46839bc748c7f920486f12f14b0"
- integrity sha512-fNvPe+ddbh+7xiByT25vuso2p2hseG/Yvuj211fV1DbCjljUEG9OpgRpcb7g7O3kxHX/q31cbZDzMxJXPWSNwA==
+formik@^2.2.9:
+ version "2.2.9"
+ resolved "https://registry.yarnpkg.com/formik/-/formik-2.2.9.tgz#8594ba9c5e2e5cf1f42c5704128e119fc46232d0"
+ integrity sha512-LQLcISMmf1r5at4/gyJigGn0gOwFbeEAlji+N9InZF6LIMXnFNkO42sCI8Jt84YZggpD4cPWObAZaxpEFtSzNA==
dependencies:
- create-react-context "^0.2.2"
deepmerge "^2.1.1"
hoist-non-react-statics "^3.3.0"
- lodash "^4.17.14"
- lodash-es "^4.17.14"
- prop-types "^15.6.1"
+ lodash "^4.17.21"
+ lodash-es "^4.17.21"
react-fast-compare "^2.0.1"
tiny-warning "^1.0.2"
- tslib "^1.9.3"
+ tslib "^1.10.0"
forwarded@0.2.0:
version "0.2.0"
@@ -7064,11 +7031,6 @@ growly@^1.3.0:
resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
integrity sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=
-gud@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/gud/-/gud-1.0.0.tgz#a489581b17e6a70beca9abe3ae57de7a499852c0"
- integrity sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw==
-
gzip-size@5.1.1:
version "5.1.1"
resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-5.1.1.tgz#cb9bee692f87c0612b232840a873904e4c135274"
@@ -8241,14 +8203,6 @@ isobject@^3.0.0, isobject@^3.0.1:
resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=
-isomorphic-fetch@^2.1.1:
- version "2.2.1"
- resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9"
- integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=
- dependencies:
- node-fetch "^1.0.1"
- whatwg-fetch ">=0.10.0"
-
isstream@~0.1.2:
version "0.1.2"
resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
@@ -9249,7 +9203,7 @@ locate-path@^5.0.0:
dependencies:
p-locate "^4.1.0"
-lodash-es@^4.17.14, lodash-es@^4.17.21:
+lodash-es@^4.17.21:
version "4.17.21"
resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
@@ -9921,11 +9875,6 @@ nan@^2.12.1:
resolved "https://registry.yarnpkg.com/nan/-/nan-2.15.0.tgz#3f34a473ff18e15c1b5626b62903b5ad6e665fee"
integrity sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==
-nanoclone@^0.2.1:
- version "0.2.1"
- resolved "https://registry.yarnpkg.com/nanoclone/-/nanoclone-0.2.1.tgz#dd4090f8f1a110d26bb32c49ed2f5b9235209ed4"
- integrity sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA==
-
nanoid@^2.1.0:
version "2.1.11"
resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-2.1.11.tgz#ec24b8a758d591561531b4176a01e3ab4f0f0280"
@@ -9999,14 +9948,6 @@ node-fetch@1.6.3:
encoding "^0.1.11"
is-stream "^1.0.1"
-node-fetch@^1.0.1:
- version "1.7.3"
- resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
- integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==
- dependencies:
- encoding "^0.1.11"
- is-stream "^1.0.1"
-
node-forge@^0.10.0:
version "0.10.0"
resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.10.0.tgz#32dea2afb3e9926f02ee5ce8794902691a676bf3"
@@ -11559,13 +11500,6 @@ promise-inflight@^1.0.1:
resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
-promise@^7.1.1:
- version "7.3.1"
- resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
- integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
- dependencies:
- asap "~2.0.3"
-
promise@^8.0.3:
version "8.1.0"
resolved "https://registry.yarnpkg.com/promise/-/promise-8.1.0.tgz#697c25c3dfe7435dd79fcd58c38a135888eaf05e"
@@ -11590,7 +11524,7 @@ prop-types@15.x, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, pro
object-assign "^4.1.1"
react-is "^16.13.1"
-property-expr@^2.0.4:
+property-expr@^2.0.5:
version "2.0.5"
resolved "https://registry.yarnpkg.com/property-expr/-/property-expr-2.0.5.tgz#278bdb15308ae16af3e3b9640024524f4dc02cb4"
integrity sha512-IJUkICM5dP5znhCckHSv30Q4b5/JA5enCtkRHYaOVOAocnH/1BQEYTC5NMfT3AVl/iXKdr3aqQbQn9DxyWknwA==
@@ -14043,6 +13977,11 @@ timsort@^0.3.0:
resolved "https://registry.yarnpkg.com/timsort/-/timsort-0.3.0.tgz#405411a8e7e6339fe64db9a234de11dc31e02bd4"
integrity sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=
+tiny-case@^1.0.3:
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/tiny-case/-/tiny-case-1.0.3.tgz#d980d66bc72b5d5a9ca86fb7c9ffdb9c898ddd03"
+ integrity sha512-Eet/eeMhkO6TX8mnUteS9zgPbUMQa4I6Kkp5ORiBD5476/m+PIRiumP5tmh5ioJpH7k51Kehawy2UDfsnxxY8Q==
+
tiny-emitter@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.1.0.tgz#1d1a56edfc51c43e863cbb5382a72330e3555423"
@@ -14194,7 +14133,7 @@ tslib@2.3.0:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==
-tslib@^1.11.1, tslib@^1.14.1, tslib@^1.8.1, tslib@^1.9.0, tslib@^1.9.3:
+tslib@^1.10.0, tslib@^1.11.1, tslib@^1.14.1, tslib@^1.8.1, tslib@^1.9.0:
version "1.14.1"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
@@ -14250,6 +14189,11 @@ type-fest@^0.8.1:
resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
+type-fest@^2.19.0:
+ version "2.19.0"
+ resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-2.19.0.tgz#88068015bb33036a598b952e55e9311a60fd3a9b"
+ integrity sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==
+
type-is@~1.6.18:
version "1.6.18"
resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.18.tgz#4e552cd05df09467dcbc4ef739de89f2cf37c131"
@@ -14856,7 +14800,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3, whatwg-encoding@^1.0.5:
dependencies:
iconv-lite "0.4.24"
-whatwg-fetch@>=0.10.0, whatwg-fetch@^3.0.0:
+whatwg-fetch@^3.0.0:
version "3.6.2"
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.6.2.tgz#dced24f37f2624ed0281725d51d0e2e3fe677f8c"
integrity sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA==
@@ -15265,18 +15209,15 @@ yargs@^16.2.0:
y18n "^5.0.5"
yargs-parser "^20.2.2"
-yup@^0.32.11:
- version "0.32.11"
- resolved "https://registry.yarnpkg.com/yup/-/yup-0.32.11.tgz#d67fb83eefa4698607982e63f7ca4c5ed3cf18c5"
- integrity sha512-Z2Fe1bn+eLstG8DRR6FTavGD+MeAwyfmouhHsIUgaADz8jvFKbO/fXc2trJKZg+5EBjh4gGm3iU/t3onKlXHIg==
+yup@^1.0.0:
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/yup/-/yup-1.0.0.tgz#de4e32f9d2e45b1ab428076fc916c84db861b8ce"
+ integrity sha512-bRZIyMkoe212ahGJTE32cr2dLkJw53Va+Uw5mzsBKpcef9zCGQ23k/xtpQUfGwdWPKvCIlR8CzFwchs2rm2XpQ==
dependencies:
- "@babel/runtime" "^7.15.4"
- "@types/lodash" "^4.14.175"
- lodash "^4.17.21"
- lodash-es "^4.17.21"
- nanoclone "^0.2.1"
- property-expr "^2.0.4"
+ property-expr "^2.0.5"
+ tiny-case "^1.0.3"
toposort "^2.0.2"
+ type-fest "^2.19.0"
zrender@5.3.1:
version "5.3.1"
From c2e28747097fb80135e61644208276d6a6fb5d01 Mon Sep 17 00:00:00 2001
From: Rodri Sanchez <rodri.sanchez1998@gmail.com>
Date: Thu, 9 Mar 2023 18:49:04 -0300
Subject: [PATCH 2/3] Add forgot prop to Reset Password component
---
src/components/Account/ResetPassword/ResetPassword.component.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/Account/ResetPassword/ResetPassword.component.js b/src/components/Account/ResetPassword/ResetPassword.component.js
index 806daedac..df349544c 100644
--- a/src/components/Account/ResetPassword/ResetPassword.component.js
+++ b/src/components/Account/ResetPassword/ResetPassword.component.js
@@ -18,7 +18,7 @@ import { forgot } from './ResetPassword.actions';
import messages from './ResetPassword.messages';
import './ResetPassword.css';
-export function ResetPassword({ intl, isDialogOpen, onClose }) {
+export function ResetPassword({ intl, isDialogOpen, onClose, forgot }) {
const [isSending, setIsSending] = useState(false);
const [forgotState, setForgotState] = useState({});
const isButtonDisabled = isSending || !!forgotState.success;
From 35ae83c9f9bb871a8c3ab53fb030782bd54a4222 Mon Sep 17 00:00:00 2001
From: Rodri Sanchez <rodri.sanchez1998@gmail.com>
Date: Thu, 9 Mar 2023 18:50:45 -0300
Subject: [PATCH 3/3] Add parameter to handleSubmit on SignUp
---
src/components/Account/SignUp/SignUp.component.js | 6 ++++--
1 file changed, 4 insertions(+), 2 deletions(-)
diff --git a/src/components/Account/SignUp/SignUp.component.js b/src/components/Account/SignUp/SignUp.component.js
index 710638a2f..af28a9cb2 100644
--- a/src/components/Account/SignUp/SignUp.component.js
+++ b/src/components/Account/SignUp/SignUp.component.js
@@ -23,11 +23,13 @@ export function SignUp({ isDialogOpen, onClose, intl }) {
const [signUpStatus, setSignUpStatus] = useState({});
const isButtonDisabled = isSigningUp || !!signUpStatus.success;
- function handleSubmit() {
+ function handleSubmit(values) {
+ const { passwordConfirm, ...formValues } = values;
+
setIsSigningUp(true);
setSignUpStatus({});
- signUp()
+ signUp(formValues)
.then(response => setSignUpStatus(response))
.catch(error => setSignUpStatus(error))
.finally(() => setIsSigningUp(false));