From ed2bf89d2f570d24172d2e5b4842ad787f871199 Mon Sep 17 00:00:00 2001 From: Arnaud Vergnet Date: Tue, 7 Apr 2020 00:52:17 +0200 Subject: [PATCH] Created error dialog component for error handling --- src/components/Amicale/LogoutDialog.js | 2 +- .../{Custom => Dialog}/AlertDialog.js | 9 +--- src/components/Dialog/ErrorDialog.js | 46 +++++++++++++++++ .../LoadingConfirmDialog.js | 0 src/screens/Amicale/LoginScreen.js | 50 ++++--------------- src/screens/Amicale/VoteScreen.js | 2 +- 6 files changed, 60 insertions(+), 49 deletions(-) rename src/components/{Custom => Dialog}/AlertDialog.js (80%) create mode 100644 src/components/Dialog/ErrorDialog.js rename src/components/{Custom => Dialog}/LoadingConfirmDialog.js (100%) diff --git a/src/components/Amicale/LogoutDialog.js b/src/components/Amicale/LogoutDialog.js index 5c6de91..297ec90 100644 --- a/src/components/Amicale/LogoutDialog.js +++ b/src/components/Amicale/LogoutDialog.js @@ -2,7 +2,7 @@ import * as React from 'react'; import i18n from 'i18n-js'; -import LoadingConfirmDialog from "../Custom/LoadingConfirmDialog"; +import LoadingConfirmDialog from "../Dialog/LoadingConfirmDialog"; import ConnectionManager from "../../managers/ConnectionManager"; type Props = { diff --git a/src/components/Custom/AlertDialog.js b/src/components/Dialog/AlertDialog.js similarity index 80% rename from src/components/Custom/AlertDialog.js rename to src/components/Dialog/AlertDialog.js index 32633b0..05516d7 100644 --- a/src/components/Custom/AlertDialog.js +++ b/src/components/Dialog/AlertDialog.js @@ -1,8 +1,7 @@ import * as React from 'react'; -import {Button, Dialog, Paragraph, Portal, withTheme} from 'react-native-paper'; +import {Button, Dialog, Paragraph, Portal} from 'react-native-paper'; type Props = { - navigation: Object, visible: boolean, onDismiss: Function, title: string, @@ -11,10 +10,6 @@ type Props = { class AlertDialog extends React.PureComponent { - constructor(props) { - super(props); - } - render() { return ( @@ -34,4 +29,4 @@ class AlertDialog extends React.PureComponent { } } -export default withTheme(AlertDialog); +export default AlertDialog; diff --git a/src/components/Dialog/ErrorDialog.js b/src/components/Dialog/ErrorDialog.js new file mode 100644 index 0000000..6f10ba8 --- /dev/null +++ b/src/components/Dialog/ErrorDialog.js @@ -0,0 +1,46 @@ +import * as React from 'react'; +import i18n from "i18n-js"; +import {ERROR_TYPE} from "../../managers/ConnectionManager"; +import AlertDialog from "./AlertDialog"; + +type Props = { + visible: boolean, + onDismiss: Function, + errorCode: number, +} + +class ErrorDialog extends React.PureComponent { + + title: string; + message: string; + + generateMessage() { + this.title = i18n.t("loginScreen.errors.title"); + switch (this.props.errorCode) { + case ERROR_TYPE.BAD_CREDENTIALS: + this.message = i18n.t("loginScreen.errors.credentials"); + break; + case ERROR_TYPE.NO_CONSENT: + this.message = i18n.t("loginScreen.errors.consent"); + break; + case ERROR_TYPE.CONNECTION_ERROR: + this.message = i18n.t("loginScreen.errors.connection"); + break; + case ERROR_TYPE.SERVER_ERROR: + this.message = "SERVER ERROR"; // TODO translate + break; + default: + this.message = i18n.t("loginScreen.errors.unknown"); + break; + } + } + + render() { + this.generateMessage(); + return ( + + ); + } +} + +export default ErrorDialog; diff --git a/src/components/Custom/LoadingConfirmDialog.js b/src/components/Dialog/LoadingConfirmDialog.js similarity index 100% rename from src/components/Custom/LoadingConfirmDialog.js rename to src/components/Dialog/LoadingConfirmDialog.js diff --git a/src/screens/Amicale/LoginScreen.js b/src/screens/Amicale/LoginScreen.js index 2866683..7b717a9 100644 --- a/src/screens/Amicale/LoginScreen.js +++ b/src/screens/Amicale/LoginScreen.js @@ -3,10 +3,10 @@ import * as React from 'react'; import {Keyboard, KeyboardAvoidingView, ScrollView, StyleSheet, TouchableWithoutFeedback, View} from "react-native"; import {Avatar, Button, Card, HelperText, Paragraph, TextInput, withTheme} from 'react-native-paper'; -import ConnectionManager, {ERROR_TYPE} from "../../managers/ConnectionManager"; +import ConnectionManager from "../../managers/ConnectionManager"; import {openBrowser} from "../../utils/WebBrowser"; import i18n from 'i18n-js'; -import AlertDialog from "../../components/Custom/AlertDialog"; +import ErrorDialog from "../../components/Dialog/ErrorDialog"; type Props = { navigation: Object, @@ -19,8 +19,7 @@ type State = { isPasswordValidated: boolean, loading: boolean, dialogVisible: boolean, - dialogTitle: string, - dialogMessage: string, + dialogError: number, } const ICON_AMICALE = require('../../../assets/amicale.png'); @@ -38,8 +37,7 @@ class LoginScreen extends React.Component { isPasswordValidated: false, loading: false, dialogVisible: false, - dialogTitle: '', - dialogMessage: '', + dialogError: 0, }; colors: Object; @@ -66,11 +64,10 @@ class LoginScreen extends React.Component { this.colors = props.theme.colors; } - showErrorDialog = (title: string, message: string) => + showErrorDialog = (error: number) => this.setState({ - dialogTitle: title, - dialogMessage: message, - dialogVisible: true + dialogVisible: true, + dialogError: error, }); hideErrorDialog = () => this.setState({dialogVisible: false}); @@ -132,9 +129,7 @@ class LoginScreen extends React.Component { .then((data) => { this.handleSuccess(); }) - .catch((error) => { - this.handleErrors(error); - }) + .catch(this.showErrorDialog) .finally(() => { this.setState({loading: false}); }); @@ -145,29 +140,6 @@ class LoginScreen extends React.Component { this.props.navigation.navigate('ProfileScreen'); } - handleErrors(error: number) { - const title = i18n.t("loginScreen.errors.title"); - let message; - switch (error) { - case ERROR_TYPE.BAD_CREDENTIALS: - message = i18n.t("loginScreen.errors.credentials"); - break; - case ERROR_TYPE.NO_CONSENT: - message = i18n.t("loginScreen.errors.consent"); - break; - case ERROR_TYPE.CONNECTION_ERROR: - message = i18n.t("loginScreen.errors.connection"); - break; - case ERROR_TYPE.SERVER_ERROR: - message = "SERVER ERROR"; // TODO translate - break; - default: - message = i18n.t("loginScreen.errors.unknown"); - break; - } - this.showErrorDialog(title, message); - } - getFormInput() { return ( @@ -297,12 +269,10 @@ class LoginScreen extends React.Component { {this.getSecondaryCard()} - diff --git a/src/screens/Amicale/VoteScreen.js b/src/screens/Amicale/VoteScreen.js index 8282303..1be102c 100644 --- a/src/screens/Amicale/VoteScreen.js +++ b/src/screens/Amicale/VoteScreen.js @@ -16,7 +16,7 @@ import { } from 'react-native-paper'; import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen"; import {getTimeOnlyString, stringToDate} from "../../utils/Planning"; -import LoadingConfirmDialog from "../../components/Custom/LoadingConfirmDialog"; +import LoadingConfirmDialog from "../../components/Dialog/LoadingConfirmDialog"; import ConnectionManager from "../../managers/ConnectionManager"; const ICON_AMICALE = require('../../../assets/amicale.png');