Improve error handling

This commit is contained in:
Paulo Gustavo Veiga 2021-02-03 17:53:37 -08:00
parent eeceb9734a
commit b10360fe6f
5 changed files with 42 additions and 21 deletions

View File

@ -42,23 +42,24 @@ export const parseResponseOnError = (response: any): ErrorInfo => {
switch (status) { switch (status) {
case 401: case 401:
// this.authFailed(); // this.authFailed();
break; break;
default: default:
if (data) { if (data) {
result = {};
// Set global errors ... // Set global errors ...
if (data.globalErrors) { result = {};
let msg:string; let globalErrors = data.globalErrors;
let errors = data.globalErrors; if (globalErrors && globalErrors.length > 0) {
if (errors.length > 0) { result.msg = globalErrors[0];
result.msg = errors[0];
}
} }
// Set field errors ... // Set field errors ...
if (data.fieldErrors) { if (data.fieldErrors && Object.keys(data.fieldErrors).length > 0) {
result.fields = new Map<string, string>(); result.fields = data.fieldErrors;
if (!result.msg) {
const key = Object.keys(data.fieldErrors)[0];
result.msg = data.fieldErrors[key];
}
} }
} else { } else {
@ -76,7 +77,7 @@ export const parseResponseOnError = (response: any): ErrorInfo => {
} }
interface Client { interface Client {
createMap(rest: { name: string; description?: string | undefined }) createMap(rest: { name: string; description?: string | undefined })
deleteLabel(label: string): Promise<unknown>; deleteLabel(label: string): Promise<unknown>;
registerNewUser(user: NewUser): Promise<void>; registerNewUser(user: NewUser): Promise<void>;
resetPassword(email: string): Promise<void>; resetPassword(email: string): Promise<void>;
@ -87,7 +88,7 @@ interface Client {
duplicateMap(id: number, basicInfo: BasicMapInfo): Promise<void>; duplicateMap(id: number, basicInfo: BasicMapInfo): Promise<void>;
loadMapInfo(id: number): Promise<BasicMapInfo>; loadMapInfo(id: number): Promise<BasicMapInfo>;
changeStarred(id: number): Promise<void>; changeStarred(id: number): Promise<void>;
} }

View File

@ -13,13 +13,32 @@ export default class RestClient extends MockClient {
} }
fetchAllMaps(): Promise<MapInfo[]> { fetchAllMaps(): Promise<MapInfo[]> {
console.log("Fetching maps from server") // https://app.wisemapping.com/c/restful/maps/
// 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 = parseResponseOnError(response);
// reject(errorInfo);
// });
// }
// return new Promise(handler);
// https://app.wisemapping.com/c/restful/maps/
// console.log("Fetching maps from server")
return Promise.resolve([]); return Promise.resolve([]);
} }
registerNewUser(user: NewUser): Promise<void> { registerNewUser(user: NewUser): Promise<void> {
const handler = (success: () => void, reject: (error: ErrorInfo) => void) => { const handler = (success: () => void, reject: (error: ErrorInfo) => void) => {
axios.post(this.baseUrl + '/service/users', axios.post(this.baseUrl + '/service/users/',
JSON.stringify(user), JSON.stringify(user),
{ headers: { 'Content-Type': 'application/json' } } { headers: { 'Content-Type': 'application/json' } }
).then(response => { ).then(response => {
@ -33,6 +52,7 @@ export default class RestClient extends MockClient {
} }
return new Promise(handler); return new Promise(handler);
} }
resetPassword(email: string): Promise<void> { resetPassword(email: string): Promise<void> {
const handler = (success: () => void, reject: (error: ErrorInfo) => void) => { const handler = (success: () => void, reject: (error: ErrorInfo) => void) => {

View File

@ -50,7 +50,7 @@ const ForgotPassword = () => {
<form onSubmit={handleOnSubmit}> <form onSubmit={handleOnSubmit}>
<Input type="email" name="email" label={{ id: "forgot.email", defaultMessage: "Email" }} <Input type="email" name="email" label={{ id: "forgot.email", defaultMessage: "Email" }}
autoComplete="email" onChange={e => setEmail(e.target.value)} /> autoComplete="email" onChange={e => setEmail(e.target.value)} error={error}/>
<SubmitButton value={intl.formatMessage({ id: "forgot.register", defaultMessage: "Send recovery link" })} /> <SubmitButton value={intl.formatMessage({ id: "forgot.register", defaultMessage: "Send recovery link" })} />
</form> </form>

View File

@ -22,14 +22,14 @@ const Input = (props: InputProps) => {
const name = props.name; const name = props.name;
const value = props.value; const value = props.value;
const onChange = props.onChange ? props.onChange : () => { }; const onChange = props.onChange ? props.onChange : () => { };
const fieldError = Boolean(error?.fields?.get(name)); const fieldError = error?.fields?.[name];
const required = props.required != undefined ? props.required : true; const required = props.required != undefined ? props.required : true;
const fullWidth = props.fullWidth != undefined ? props.required : true; const fullWidth = props.fullWidth != undefined ? props.required : true;
return ( return (
<TextField name={name} type={props.type} label={intl.formatMessage(props.label)} <TextField name={name} type={props.type} label={intl.formatMessage(props.label)}
value={value} onChange={onChange} value={value} onChange={onChange}
error={fieldError} helperText={fieldError} error={Boolean(fieldError)} helperText={fieldError}
variant="outlined" required={required} fullWidth={fullWidth} margin="dense"/> variant="outlined" required={required} fullWidth={fullWidth} margin="dense"/>
); );

View File

@ -72,16 +72,16 @@ const RegistrationForm = () => {
<GlobalError error={error} /> <GlobalError error={error} />
<Input name="email" type="email" onChange={handleOnChange} label={{ id: "registration.email", defaultMessage: "Email" }} <Input name="email" type="email" onChange={handleOnChange} label={{ id: "registration.email", defaultMessage: "Email" }}
autoComplete="email" /> autoComplete="email" error={error}/>
<Input name="firstname" type="text" onChange={handleOnChange} label={{ id: "registration.firstname", defaultMessage: "First Name" }} <Input name="firstname" type="text" onChange={handleOnChange} label={{ id: "registration.firstname", defaultMessage: "First Name" }}
autoComplete="given-name" /> autoComplete="given-name" error={error}/>
<Input name="lastname" type="text" onChange={handleOnChange} label={{ id: "registration.lastname", defaultMessage: "Last Name" }} <Input name="lastname" type="text" onChange={handleOnChange} label={{ id: "registration.lastname", defaultMessage: "Last Name" }}
autoComplete="family-name" /> autoComplete="family-name" error={error}/>
<Input name="password" type="password" onChange={handleOnChange} label={{ id: "registration.password", defaultMessage: "Password" }} <Input name="password" type="password" onChange={handleOnChange} label={{ id: "registration.password", defaultMessage: "Password" }}
autoComplete="new-password" /> autoComplete="new-password" error={error}/>
<div style={{ width: '330px', padding: '5px 0px 5px 20px' }}> <div style={{ width: '330px', padding: '5px 0px 5px 20px' }}>
<ReCAPTCHA <ReCAPTCHA