Browse Source

Fixed home header button + fixed snackbar button not working

Arnaud Vergnet 1 year ago
parent
commit
557dd000ae
3 changed files with 43 additions and 63 deletions
  1. 1
    1
      components/Custom/HeaderButton.js
  2. 13
    21
      components/Lists/WebSectionList.js
  3. 29
    41
      screens/HomeScreen.js

+ 1
- 1
components/Custom/HeaderButton.js View File

@@ -13,7 +13,7 @@ function HeaderButton(props) {
13 13
         <IconButton
14 14
             icon={props.icon}
15 15
             size={26}
16
-            color={colors.text}
16
+            color={props.color !== undefined ? props.color : colors.text}
17 17
             onPress={props.onPress}
18 18
         />
19 19
     );

+ 13
- 21
components/Lists/WebSectionList.js View File

@@ -57,8 +57,6 @@ export default class WebSectionList extends React.PureComponent<Props, State> {
57 57
     onFetchSuccess: Function;
58 58
     onFetchError: Function;
59 59
     getEmptySectionHeader: Function;
60
-    showSnackBar: Function;
61
-    hideSnackBar: Function;
62 60
 
63 61
     constructor() {
64 62
         super();
@@ -67,8 +65,6 @@ export default class WebSectionList extends React.PureComponent<Props, State> {
67 65
         this.onFetchSuccess = this.onFetchSuccess.bind(this);
68 66
         this.onFetchError = this.onFetchError.bind(this);
69 67
         this.getEmptySectionHeader = this.getEmptySectionHeader.bind(this);
70
-        this.showSnackBar = this.showSnackBar.bind(this);
71
-        this.hideSnackBar = this.hideSnackBar.bind(this);
72 68
     }
73 69
 
74 70
     /**
@@ -159,16 +155,12 @@ export default class WebSectionList extends React.PureComponent<Props, State> {
159 155
     /**
160 156
      * Shows the error popup
161 157
      */
162
-    showSnackBar() {
163
-        this.setState({snackbarVisible: true})
164
-    }
158
+    showSnackBar = () => this.setState({snackbarVisible: true});
165 159
 
166 160
     /**
167 161
      * Hides the error popup
168 162
      */
169
-    hideSnackBar() {
170
-        this.setState({snackbarVisible: false})
171
-    }
163
+    hideSnackBar = () => this.setState({snackbarVisible: false});
172 164
 
173 165
     render() {
174 166
         let dataset = [];
@@ -177,17 +169,6 @@ export default class WebSectionList extends React.PureComponent<Props, State> {
177 169
         const shouldRenderHeader = this.props.renderSectionHeader !== null;
178 170
         return (
179 171
             <View>
180
-                <Snackbar
181
-                    visible={this.state.snackbarVisible}
182
-                    onDismiss={this.hideSnackBar}
183
-                    action={{
184
-                        label: 'OK',
185
-                        onPress: this.hideSnackBar,
186
-                    }}
187
-                    duration={4000}
188
-                >
189
-                    {i18n.t("homeScreen.listUpdateFail")}
190
-                </Snackbar>
191 172
                 {/*$FlowFixMe*/}
192 173
                 <SectionList
193 174
                     sections={dataset}
@@ -212,6 +193,17 @@ export default class WebSectionList extends React.PureComponent<Props, State> {
212 193
                             onRefresh={this.onRefresh}/>
213 194
                     }
214 195
                 />
196
+                <Snackbar
197
+                    visible={this.state.snackbarVisible}
198
+                    onDismiss={this.hideSnackBar}
199
+                    action={{
200
+                        label: 'OK',
201
+                        onPress: () => {},
202
+                    }}
203
+                    duration={4000}
204
+                >
205
+                    {i18n.t("homeScreen.listUpdateFail")}
206
+                </Snackbar>
215 207
             </View>
216 208
         );
217 209
     }

+ 29
- 41
screens/HomeScreen.js View File

@@ -32,16 +32,10 @@ type Props = {
32 32
     theme: Object,
33 33
 }
34 34
 
35
-type State = {
36
-    imageModalVisible: boolean,
37
-    imageList: Array<Object>,
38
-    isLoggedIn: boolean,
39
-}
40
-
41 35
 /**
42 36
  * Class defining the app's home screen
43 37
  */
44
-class HomeScreen extends React.Component<Props, State> {
38
+class HomeScreen extends React.Component<Props> {
45 39
 
46 40
     onProxiwashClick: Function;
47 41
     onTutorInsaClick: Function;
@@ -52,15 +46,10 @@ class HomeScreen extends React.Component<Props, State> {
52 46
 
53 47
     colors: Object;
54 48
 
55
-    state = {
56
-        imageModalVisible: false,
57
-        imageList: [],
58
-        isLoggedIn: ConnectionManager.getInstance().isLoggedIn(),
59
-    };
49
+    isLoggedIn: boolean | null;
60 50
 
61 51
     constructor(props) {
62 52
         super(props);
63
-        ConnectionManager.getInstance().addLoginStateListener((value) => this.setState({isLoggedIn: value}));
64 53
         this.onProxiwashClick = this.onProxiwashClick.bind(this);
65 54
         this.onTutorInsaClick = this.onTutorInsaClick.bind(this);
66 55
         this.onMenuClick = this.onMenuClick.bind(this);
@@ -68,6 +57,8 @@ class HomeScreen extends React.Component<Props, State> {
68 57
         this.getRenderItem = this.getRenderItem.bind(this);
69 58
         this.createDataset = this.createDataset.bind(this);
70 59
         this.colors = props.theme.colors;
60
+
61
+        this.isLoggedIn = null;
71 62
     }
72 63
 
73 64
     /**
@@ -82,20 +73,32 @@ class HomeScreen extends React.Component<Props, State> {
82 73
     }
83 74
 
84 75
     componentDidMount() {
85
-        this.props.navigation.setOptions({
86
-            headerRight: this.getHeaderButton,
87
-        });
76
+        this.props.navigation.addListener('focus', this.onScreenFocus);
88 77
     }
89 78
 
79
+    onScreenFocus = () => {
80
+        if (this.isLoggedIn !== ConnectionManager.getInstance().isLoggedIn()) {
81
+            this.isLoggedIn = ConnectionManager.getInstance().isLoggedIn();
82
+            this.props.navigation.setOptions({
83
+                headerRight: this.getHeaderButton,
84
+            });
85
+        }
86
+
87
+    };
88
+
90 89
     getHeaderButton = () => {
91
-        const screen = this.state.isLoggedIn
90
+        const screen = this.isLoggedIn
92 91
             ? "ProfileScreen"
93 92
             : "LoginScreen";
94
-        const icon = this.state.isLoggedIn
93
+        const icon = this.isLoggedIn
95 94
             ? "account"
96 95
             : "login";
97 96
         const onPress = () => this.props.navigation.navigate(screen);
98
-        return <HeaderButton icon={icon} onPress={onPress}/>;
97
+        return <HeaderButton
98
+            icon={icon}
99
+            onPress={onPress}
100
+            color={this.isLoggedIn ? undefined : this.colors.primary}
101
+        />;
99 102
     };
100 103
 
101 104
     onProxiwashClick() {
@@ -448,18 +451,6 @@ class HomeScreen extends React.Component<Props, State> {
448 451
         openBrowser(link, this.colors.primary);
449 452
     }
450 453
 
451
-    showImageModal(imageList) {
452
-        this.setState({
453
-            imageModalVisible: true,
454
-            imageList: imageList,
455
-        });
456
-    };
457
-
458
-    hideImageModal = () => {
459
-        this.setState({imageModalVisible: false});
460
-    };
461
-
462
-
463 454
     /**
464 455
      * Gets a render item for the given feed object
465 456
      *
@@ -494,16 +485,13 @@ class HomeScreen extends React.Component<Props, State> {
494 485
     render() {
495 486
         const nav = this.props.navigation;
496 487
         return (
497
-            <View>
498
-                <WebSectionList
499
-                    createDataset={this.createDataset}
500
-                    navigation={nav}
501
-                    autoRefreshTime={REFRESH_TIME}
502
-                    refreshOnFocus={true}
503
-                    fetchUrl={DATA_URL}
504
-                    renderItem={this.getRenderItem}/>
505
-            </View>
506
-
488
+            <WebSectionList
489
+                createDataset={this.createDataset}
490
+                navigation={nav}
491
+                autoRefreshTime={REFRESH_TIME}
492
+                refreshOnFocus={true}
493
+                fetchUrl={DATA_URL}
494
+                renderItem={this.getRenderItem}/>
507 495
         );
508 496
     }
509 497
 }

Loading…
Cancel
Save