fix(profile): show correct error messages

Signed-off-by: Erik Michelson <github@erik.michelson.eu>
This commit is contained in:
Erik Michelson 2023-03-29 21:40:17 +02:00
parent 15374acb93
commit 5e1e773859
3 changed files with 21 additions and 19 deletions

View file

@ -7,8 +7,8 @@
export class ApiError extends Error {
constructor(
public readonly statusCode: number,
public readonly backendErrorName: string | undefined,
public readonly backendErrorMessage: string | undefined
public readonly backendErrorName?: string,
public readonly backendErrorMessage?: string
) {
super()
}

View file

@ -13,35 +13,38 @@ export class ErrorToI18nKeyMapper {
constructor(private apiError: Error, private i18nNamespace?: string) {}
public withHttpCode(code: number, i18nKey: string): this {
public withHttpCode(code: number, i18nKey: string, treatAsAbsoluteKey?: boolean): this {
if (this.foundI18nKey === undefined && this.apiError instanceof ApiError && this.apiError.statusCode === code) {
this.foundI18nKey = i18nKey
this.foundI18nKey = treatAsAbsoluteKey ? i18nKey : `${this.i18nNamespace ?? ''}.${i18nKey}`
}
return this
}
public withBackendErrorName(errorName: string, i18nKey: string): this {
public withBackendErrorName(errorName: string, i18nKey: string, treatAsAbsoluteKey?: boolean): this {
if (
this.foundI18nKey === undefined &&
this.apiError instanceof ApiError &&
this.apiError.backendErrorName === errorName
) {
this.foundI18nKey = i18nKey
this.foundI18nKey = treatAsAbsoluteKey ? i18nKey : `${this.i18nNamespace ?? ''}.${i18nKey}`
}
return this
}
public withErrorMessage(message: string, i18nKey: string): this {
public withErrorMessage(message: string, i18nKey: string, treatAsAbsoluteKey?: boolean): this {
if (this.foundI18nKey === undefined && this.apiError.message === message) {
this.foundI18nKey = i18nKey
this.foundI18nKey = treatAsAbsoluteKey ? i18nKey : `${this.i18nNamespace ?? ''}.${i18nKey}`
}
return this
}
public orFallbackI18nKey<T extends string | undefined = string>(fallback: T): string | T {
if (!this.foundI18nKey) {
return fallback
public orFallbackI18nKey<T extends string | undefined = string>(
fallback: T,
treatAsAbsoluteKey?: boolean
): string | T {
if (this.foundI18nKey) {
return this.foundI18nKey
}
return this.i18nNamespace ? `${this.i18nNamespace}.${this.foundI18nKey}` : this.foundI18nKey
return !treatAsAbsoluteKey && fallback ? `${this.i18nNamespace ?? ''}.${fallback}` : fallback
}
}

View file

@ -36,11 +36,11 @@ export const ProfileChangePassword: React.FC = () => {
return true
} catch (error) {
const foundI18nKey = new ErrorToI18nKeyMapper(error as Error, 'login.auth.error')
.withHttpCode(401, 'invalidCredentials')
.withHttpCode(401, 'usernamePassword')
.withBackendErrorName('FeatureDisabledError', 'loginDisabled')
.withBackendErrorName('PasswordTooWeakError', 'passwordTooWeak')
.withBackendErrorName('PasswordTooWeakError', 'login.register.error.passwordTooWeak', true)
.orFallbackI18nKey('other')
return Promise.reject(foundI18nKey)
return Promise.reject(new Error(foundI18nKey))
} finally {
if (formRef.current) {
formRef.current.reset()
@ -79,14 +79,13 @@ export const ProfileChangePassword: React.FC = () => {
<CurrentPasswordField onChange={onChangeOldPassword} value={oldPassword} />
<NewPasswordField onChange={onChangeNewPassword} value={newPassword} />
<PasswordAgainField password={newPassword} onChange={onChangeNewPasswordAgain} value={newPasswordAgain} />
<Alert className='small' show={!!error && !loading} variant={'danger'}>
<Alert className='small my-3' show={!!error && !loading} variant={'danger'}>
<Trans i18nKey={error?.message} />
</Alert>
<Alert className='small' show={changeSucceeded && !loading} variant={'success'}>
<Alert className='small my-3' show={!error && !loading && Boolean(changeSucceeded)} variant={'success'}>
<Trans i18nKey={'profile.changePassword.successText'} />
</Alert>
<Button type='submit' variant='primary' disabled={!ready}>
<Button type='submit' variant='primary' disabled={!ready} className={'mt-3'}>
<Trans i18nKey='common.save' />
</Button>
</Form>