Browse Source

Created error dialog component for error handling

Arnaud Vergnet 4 years ago
parent
commit
ed2bf89d2f

+ 1
- 1
src/components/Amicale/LogoutDialog.js View File

@@ -2,7 +2,7 @@
2 2
 
3 3
 import * as React from 'react';
4 4
 import i18n from 'i18n-js';
5
-import LoadingConfirmDialog from "../Custom/LoadingConfirmDialog";
5
+import LoadingConfirmDialog from "../Dialog/LoadingConfirmDialog";
6 6
 import ConnectionManager from "../../managers/ConnectionManager";
7 7
 
8 8
 type Props = {

src/components/Custom/AlertDialog.js → src/components/Dialog/AlertDialog.js View File

@@ -1,8 +1,7 @@
1 1
 import * as React from 'react';
2
-import {Button, Dialog, Paragraph, Portal, withTheme} from 'react-native-paper';
2
+import {Button, Dialog, Paragraph, Portal} from 'react-native-paper';
3 3
 
4 4
 type Props = {
5
-    navigation: Object,
6 5
     visible: boolean,
7 6
     onDismiss: Function,
8 7
     title: string,
@@ -11,10 +10,6 @@ type Props = {
11 10
 
12 11
 class AlertDialog extends React.PureComponent<Props> {
13 12
 
14
-    constructor(props) {
15
-        super(props);
16
-    }
17
-
18 13
     render() {
19 14
         return (
20 15
             <Portal>
@@ -34,4 +29,4 @@ class AlertDialog extends React.PureComponent<Props> {
34 29
     }
35 30
 }
36 31
 
37
-export default withTheme(AlertDialog);
32
+export default AlertDialog;

+ 46
- 0
src/components/Dialog/ErrorDialog.js View File

@@ -0,0 +1,46 @@
1
+import * as React from 'react';
2
+import i18n from "i18n-js";
3
+import {ERROR_TYPE} from "../../managers/ConnectionManager";
4
+import AlertDialog from "./AlertDialog";
5
+
6
+type Props = {
7
+    visible: boolean,
8
+    onDismiss: Function,
9
+    errorCode: number,
10
+}
11
+
12
+class ErrorDialog extends React.PureComponent<Props> {
13
+
14
+    title: string;
15
+    message: string;
16
+
17
+    generateMessage() {
18
+        this.title = i18n.t("loginScreen.errors.title");
19
+        switch (this.props.errorCode) {
20
+            case ERROR_TYPE.BAD_CREDENTIALS:
21
+                this.message = i18n.t("loginScreen.errors.credentials");
22
+                break;
23
+            case ERROR_TYPE.NO_CONSENT:
24
+                this.message = i18n.t("loginScreen.errors.consent");
25
+                break;
26
+            case ERROR_TYPE.CONNECTION_ERROR:
27
+                this.message = i18n.t("loginScreen.errors.connection");
28
+                break;
29
+            case ERROR_TYPE.SERVER_ERROR:
30
+                this.message = "SERVER ERROR"; // TODO translate
31
+                break;
32
+            default:
33
+                this.message = i18n.t("loginScreen.errors.unknown");
34
+                break;
35
+        }
36
+    }
37
+
38
+    render() {
39
+        this.generateMessage();
40
+        return (
41
+            <AlertDialog {...this.props} title={this.title} message={this.message}/>
42
+        );
43
+    }
44
+}
45
+
46
+export default ErrorDialog;

src/components/Custom/LoadingConfirmDialog.js → src/components/Dialog/LoadingConfirmDialog.js View File


+ 10
- 40
src/screens/Amicale/LoginScreen.js View File

@@ -3,10 +3,10 @@
3 3
 import * as React from 'react';
4 4
 import {Keyboard, KeyboardAvoidingView, ScrollView, StyleSheet, TouchableWithoutFeedback, View} from "react-native";
5 5
 import {Avatar, Button, Card, HelperText, Paragraph, TextInput, withTheme} from 'react-native-paper';
6
-import ConnectionManager, {ERROR_TYPE} from "../../managers/ConnectionManager";
6
+import ConnectionManager from "../../managers/ConnectionManager";
7 7
 import {openBrowser} from "../../utils/WebBrowser";
8 8
 import i18n from 'i18n-js';
9
-import AlertDialog from "../../components/Custom/AlertDialog";
9
+import ErrorDialog from "../../components/Dialog/ErrorDialog";
10 10
 
11 11
 type Props = {
12 12
     navigation: Object,
@@ -19,8 +19,7 @@ type State = {
19 19
     isPasswordValidated: boolean,
20 20
     loading: boolean,
21 21
     dialogVisible: boolean,
22
-    dialogTitle: string,
23
-    dialogMessage: string,
22
+    dialogError: number,
24 23
 }
25 24
 
26 25
 const ICON_AMICALE = require('../../../assets/amicale.png');
@@ -38,8 +37,7 @@ class LoginScreen extends React.Component<Props, State> {
38 37
         isPasswordValidated: false,
39 38
         loading: false,
40 39
         dialogVisible: false,
41
-        dialogTitle: '',
42
-        dialogMessage: '',
40
+        dialogError: 0,
43 41
     };
44 42
 
45 43
     colors: Object;
@@ -66,11 +64,10 @@ class LoginScreen extends React.Component<Props, State> {
66 64
         this.colors = props.theme.colors;
67 65
     }
68 66
 
69
-    showErrorDialog = (title: string, message: string) =>
67
+    showErrorDialog = (error: number) =>
70 68
         this.setState({
71
-            dialogTitle: title,
72
-            dialogMessage: message,
73
-            dialogVisible: true
69
+            dialogVisible: true,
70
+            dialogError: error,
74 71
         });
75 72
 
76 73
     hideErrorDialog = () => this.setState({dialogVisible: false});
@@ -132,9 +129,7 @@ class LoginScreen extends React.Component<Props, State> {
132 129
                 .then((data) => {
133 130
                     this.handleSuccess();
134 131
                 })
135
-                .catch((error) => {
136
-                    this.handleErrors(error);
137
-                })
132
+                .catch(this.showErrorDialog)
138 133
                 .finally(() => {
139 134
                     this.setState({loading: false});
140 135
                 });
@@ -145,29 +140,6 @@ class LoginScreen extends React.Component<Props, State> {
145 140
         this.props.navigation.navigate('ProfileScreen');
146 141
     }
147 142
 
148
-    handleErrors(error: number) {
149
-        const title = i18n.t("loginScreen.errors.title");
150
-        let message;
151
-        switch (error) {
152
-            case ERROR_TYPE.BAD_CREDENTIALS:
153
-                message = i18n.t("loginScreen.errors.credentials");
154
-                break;
155
-            case ERROR_TYPE.NO_CONSENT:
156
-                message = i18n.t("loginScreen.errors.consent");
157
-                break;
158
-            case ERROR_TYPE.CONNECTION_ERROR:
159
-                message = i18n.t("loginScreen.errors.connection");
160
-                break;
161
-            case ERROR_TYPE.SERVER_ERROR:
162
-                message = "SERVER ERROR"; // TODO translate
163
-                break;
164
-            default:
165
-                message = i18n.t("loginScreen.errors.unknown");
166
-                break;
167
-        }
168
-        this.showErrorDialog(title, message);
169
-    }
170
-
171 143
     getFormInput() {
172 144
         return (
173 145
             <View>
@@ -297,12 +269,10 @@ class LoginScreen extends React.Component<Props, State> {
297 269
                             {this.getSecondaryCard()}
298 270
                         </View>
299 271
                     </TouchableWithoutFeedback>
300
-                    <AlertDialog
301
-                        {...this.props}
272
+                    <ErrorDialog
302 273
                         visible={this.state.dialogVisible}
303
-                        title={this.state.dialogTitle}
304
-                        message={this.state.dialogMessage}
305 274
                         onDismiss={this.hideErrorDialog}
275
+                        errorCode={this.state.dialogError}
306 276
                     />
307 277
                 </ScrollView>
308 278
             </KeyboardAvoidingView>

+ 1
- 1
src/screens/Amicale/VoteScreen.js View File

@@ -16,7 +16,7 @@ import {
16 16
 } from 'react-native-paper';
17 17
 import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
18 18
 import {getTimeOnlyString, stringToDate} from "../../utils/Planning";
19
-import LoadingConfirmDialog from "../../components/Custom/LoadingConfirmDialog";
19
+import LoadingConfirmDialog from "../../components/Dialog/LoadingConfirmDialog";
20 20
 import ConnectionManager from "../../managers/ConnectionManager";
21 21
 
22 22
 const ICON_AMICALE = require('../../../assets/amicale.png');

Loading…
Cancel
Save