diff --git a/packages/webapp/src/components/forgot-password-page/index.tsx b/packages/webapp/src/components/forgot-password-page/index.tsx index e6dd8ad9..2b6c7fee 100644 --- a/packages/webapp/src/components/forgot-password-page/index.tsx +++ b/packages/webapp/src/components/forgot-password-page/index.tsx @@ -1,15 +1,12 @@ import React, { useState, useEffect } from 'react' import { FormattedMessage, useIntl } from 'react-intl' import { useHistory } from "react-router-dom" -import { Service } from '../../services/Service' - -import { PageContent } from '../../theme/global-style'; - +import { Service, ErrorInfo } from '../../services/Service' import Header from '../header' import Footer from '../footer' +import { PageContent } from '../../theme/global-style' import FormErrorDialog from '../form-error-dialog' - import SubmitButton from '../submit-button' type ForgotPasswordProps = { @@ -19,25 +16,36 @@ type ForgotPasswordProps = { const ForgotPassword = (props: ServiceProps) => { const [email, setEmail] = useState(''); const [errorMsg, setErrorMsg] = useState(''); +<<<<<<< HEAD +======= +>>>>>>> 9a3a179 (Initial version of maps list. WIP) const [disableButton, setDisableButton] = useState(false); const history = useHistory(); const intl = useIntl(); - const handleSubmit = async (event: React.FormEvent) => { + const handleOnSubmit = (event: React.FormEvent) => { event.preventDefault(); setDisableButton(true); // Call Service ... +<<<<<<< HEAD props.service.resetPassword( email, () => history.push("/c/forgot-password-success"), (errorInfo) => { setErrorMsg(errorInfo.msg ? errorInfo.msg : ''); +======= + const service = props.service; + service.resetPassword(email) + .then(() => { + history.push("/c/forgot-password-success"); + }).catch((error: ErrorInfo) => { + setErrorMsg(error.msg ? error.msg : ''); +>>>>>>> 9a3a179 (Initial version of maps list. WIP) setDisableButton(false); - } - ); + }); } return ( @@ -45,7 +53,7 @@ const ForgotPassword = (props: ServiceProps) => {

-
handleSubmit(e)}> + setEmail(e.target.value)} placeholder={intl.formatMessage({ id: "forgot.email", defaultMessage: "Email" })} required={true} autoComplete="email" /> diff --git a/packages/webapp/src/components/registration-page/index.tsx b/packages/webapp/src/components/registration-page/index.tsx index 31b4adbf..df01de98 100644 --- a/packages/webapp/src/components/registration-page/index.tsx +++ b/packages/webapp/src/components/registration-page/index.tsx @@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react' import { FormattedMessage, useIntl } from 'react-intl' import ReCAPTCHA from 'react-google-recaptcha' import { useHistory } from "react-router-dom" -import { Service, NewUser } from '../../services/Service' +import { Service, NewUser, ErrorInfo } from '../../services/Service' import FormErrorDialog from '../form-error-dialog' import Header from '../header' @@ -18,14 +18,15 @@ const RegistrationForm = (props: ServiceProps) => { const [firstname, setFirstname] = useState(''); const [password, setPassword] = useState(''); const [recaptchaToken, setRecaptchaToken] = useState(''); - const [errorMsg, setErrorMsg] = useState(); + const [errorMsg, setErrorMsg] = useState(); const [disableButton, setDisableButton] = useState(false); const history = useHistory(); const intl = useIntl(); - const handleSubmit = async (event: React.FormEvent) => { + + const handleOnSubmit = (event: React.FormEvent): void => { event.preventDefault(); setDisableButton(true); @@ -39,22 +40,25 @@ const RegistrationForm = (props: ServiceProps) => { }; // Call Service ... - props.service.registerNewUser( - user, - () => history.push("/c/registration-success"), - (errorInfo) => { - const errorMsg = errorInfo.msg ? errorInfo.msg : ''; - setErrorMsg(errorMsg); setDisableButton(false); - } - ); + const service = props.service; + service.registerNewUser(user) + .then(() => { + history.push("/c/registration-success") + }).catch((error: ErrorInfo) => { + const errorMsg = error.msg ? error.msg : undefined; + setErrorMsg(errorMsg); + setDisableButton(false); + }); } + + return (

- handleSubmit(e)}> + setEmail(e.target.value)} placeholder={intl.formatMessage({ id: "registration.email", defaultMessage: "Email" })} required={true} autoComplete="email" /> setFirstname(e.target.value)} placeholder={intl.formatMessage({ id: "registration.firstname", defaultMessage: "First Name" })} required={true} autoComplete="given-name" /> setLastname(e.target.value)} placeholder={intl.formatMessage({ id: "registration.lastname", defaultMessage: "Last Name" })} required={true} autoComplete="family-name" /> diff --git a/packages/webapp/src/services/Service.ts b/packages/webapp/src/services/Service.ts index 70ee73ab..f0d9432d 100644 --- a/packages/webapp/src/services/Service.ts +++ b/packages/webapp/src/services/Service.ts @@ -33,8 +33,8 @@ export type ErrorInfo = { } interface Service { - registerNewUser(user: NewUser, onSuccess: () => void, onError: (errorInfo: ErrorInfo) => void):void; - resetPassword(email: string, onSuccess: () => void, onError: (errorInfo: ErrorInfo) => void): void; + registerNewUser(user: NewUser): Promise; + resetPassword(email: string): Promise; fetchAllMaps(): Promise; deleteMap(id: number): Promise; @@ -62,19 +62,21 @@ class RestService implements Service { return Promise.resolve(); } - async registerNewUser(user: NewUser, onSuccess: () => void, onError: (errorInfo: ErrorInfo) => void) { - - await axios.post(this.baseUrl + '/service/users', - JSON.stringify(user), - { headers: { 'Content-Type': 'application/json' } } - ).then(response => { - // All was ok, let's sent to success page ... - onSuccess(); - }).catch(error => { - const response = error.response; - const errorMsg = this.parseResponseOnError(response); - onError(errorMsg); - }); + registerNewUser(user: NewUser): Promise { + const handler = (success: () => void, reject: (error: ErrorInfo) => void) => { + axios.post(this.baseUrl + '/service/users', + JSON.stringify(user), + { headers: { 'Content-Type': 'application/json' } } + ).then(response => { + // All was ok, let's sent to success page ...; + success(); + }).catch(error => { + const response = error.response; + const errorInfo = this.parseResponseOnError(response); + reject(errorInfo); + }); + } + return new Promise(handler); } async fetchAllMaps(): Promise { @@ -99,18 +101,23 @@ class RestService implements Service { return Promise.resolve(maps); } - async resetPassword(email: string, onSuccess: () => void, onError: (errorInfo: ErrorInfo) => void) { - await axios.put(this.baseUrl + '/service/users/resetPassword?email=' + email, - null, - { headers: { 'Content-Type': 'application/json' } } - ).then(response => { - // All was ok, let's sent to success page ... - onSuccess(); - }).catch(error => { - const response = error.response; - const errorInfo: ErrorInfo = this.parseResponseOnError(response); - onError(errorInfo); - }); + resetPassword(email: string): Promise { + + const handler = (success: () => void, reject: (error: ErrorInfo) => void) => { + axios.post(this.baseUrl + '/service/users/resetPassword?email=' + email, + null, + { headers: { 'Content-Type': 'application/json' } } + ).then(response => { + // All was ok, let's sent to success page ...; + success(); + }).catch(error => { + const response = error.response; + const errorInfo = this.parseResponseOnError(response); + reject(errorInfo); + }); + } + return new Promise(handler); + } private parseResponseOnError = (response: any): ErrorInfo => {