ysimard
/
application-amicale
forked from vergnet/application-amicale
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Moved about screen in sidemenu, fixed warnings

keplyx 4 years ago
parent
d654a5d7a8
commit
e72196812e
6 changed files with 155 additions and 115 deletions
Split View Show Diff Stats
  1. 10
    5
      components/Sidebar.js
  2. 16
    18
      screens/About/AboutDependenciesScreen.js
  3. 122
    74
      screens/About/AboutScreen.js
  4. 1
    14
      screens/SettingsScreen.js
  5. 3
    2
      translations/en.json
  6. 3
    2
      translations/fr.json

+ 10
- 5
components/Sidebar.js View File 

@@ -66,15 +66,15 @@ export default class SideBar extends React.Component<Props, State> {
66 66 
                 icon: "school",
67 67 
             },
68 68 
             {
69 
-                name: "Mails BlueMind",
70 
-                route: "BlueMindScreen",
71 
-                icon: "email",
72 
-            },
73 
-            {
74 69 
                 name: i18n.t('sidenav.divider2'),
75 70 
                 route: "Divider2"
76 71 
             },
77 72 
             {
73 
+                name: i18n.t('screens.bluemind'),
74 
+                route: "BlueMindScreen",
75 
+                icon: "email",
76 
+            },
77 
+            {
78 78 
                 name: i18n.t('screens.availableRooms'),
79 79 
                 route: "AvailableRoomScreen",
80 80 
                 icon: "calendar-check",
 
@@ -93,6 +93,11 @@ export default class SideBar extends React.Component<Props, State> {
93 93 
                 route: "SettingsScreen",
94 94 
                 icon: "settings",
95 95 
             },
96 
+            {
97 
+                name: i18n.t('screens.about'),
98 
+                route: "AboutScreen",
99 
+                icon: "information",
100 
+            },
96 101 
         ];
97 102 
     }
98 103

+ 16
- 18
screens/About/AboutDependenciesScreen.js View File 

@@ -31,24 +31,22 @@ export default class AboutDependenciesScreen extends React.Component<Props> {
31 31 
         return (
32 32 
             <Container>
33 33 
                 <CustomHeader hasBackButton={true} navigation={nav} title={i18n.t('aboutScreen.libs')}/>
34 
-                <Content>
35 
-                    <FlatList
36 
-                        data={data}
37 
-                        keyExtractor={(item) => item.name}
38 
-                        style={{minHeight: 300, width: '100%'}}
39 
-                        renderItem={({item}) =>
40 
-                            <ListItem>
41 
-                                <Body>
42 
-                                    <Text>
43 
-                                        {item.name}
44 
-                                    </Text>
45 
-                                    <Text note>
46 
-                                        {item.version.replace('^', '')}
47 
-                                    </Text>
48 
-                                </Body>
49 
-                            </ListItem>}
50 
-                    />
51 
-                </Content>
34 
+                <FlatList
35 
+                    data={data}
36 
+                    keyExtractor={(item) => item.name}
37 
+                    style={{minHeight: 300, width: '100%'}}
38 
+                    renderItem={({item}) =>
39 
+                        <ListItem>
40 
+                            <Body>
41 
+                                <Text>
42 
+                                    {item.name}
43 
+                                </Text>
44 
+                                <Text note>
45 
+                                    {item.version.replace('^', '')}
46 
+                                </Text>
47 
+                            </Body>
48 
+                        </ListItem>}
49 
+                />
52 50 
             </Container>
53 51 
         );
54 52 
     }

+ 122
- 74
screens/About/AboutScreen.js View File 

@@ -185,6 +185,107 @@ export default class AboutScreen extends React.Component<Props, State> {
185 185 
         },
186 186 
     ];
187 187
188 
+    dataOrder: Array<Object> = [
189 
+        {
190 
+            id: 'app',
191 
+        },
192 
+        {
193 
+            id: 'team',
194 
+        },
195 
+        {
196 
+            id: 'techno',
197 
+        },
198 
+    ];
199 
+
200 
+    getAppCard() {
201 
+        return (
202 
+            <Card>
203 
+                <CardItem>
204 
+                    <Left>
205 
+                        <Thumbnail square source={require('../../assets/icon.png')}/>
206 
+                        <Body>
207 
+                            <H1>{appJson.expo.name}</H1>
208 
+                            <Text note>
209 
+                                v.{appJson.expo.version}
210 
+                            </Text>
211 
+                        </Body>
212 
+                    </Left>
213 
+                </CardItem>
214 
+                <FlatList
215 
+                    data={this.appData}
216 
+                    extraData={this.state}
217 
+                    keyExtractor={(item) => item.icon}
218 
+                    listKey={(item) => "app"}
219 
+                    renderItem={({item}) =>
220 
+                        this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
221 
+                    }
222 
+                />
223 
+            </Card>
224 
+        );
225 
+    }
226 
+
227 
+    getTeamCard() {
228 
+        return (
229 
+            <Card>
230 
+                <CardItem>
231 
+                    <Left>
232 
+                        <CustomMaterialIcon
233 
+                            icon={'account-multiple'}
234 
+                            fontSize={40}
235 
+                            width={40}
236 
+                            color={ThemeManager.getCurrentThemeVariables().brandPrimary}/>
237 
+                        <Body>
238 
+                            <H1>{i18n.t('aboutScreen.team')}</H1>
239 
+                        </Body>
240 
+                    </Left>
241 
+                </CardItem>
242 
+                <CardItem header>
243 
+                    <Text>{i18n.t('aboutScreen.author')}</Text>
244 
+                </CardItem>
245 
+                <FlatList
246 
+                    data={this.authorData}
247 
+                    extraData={this.state}
248 
+                    keyExtractor={(item) => item.icon}
249 
+                    listKey={(item) => "team1"}
250 
+                    renderItem={({item}) =>
251 
+                        this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
252 
+                    }
253 
+                />
254 
+                <CardItem header>
255 
+                    <Text>{i18n.t('aboutScreen.additionalDev')}</Text>
256 
+                </CardItem>
257 
+                <FlatList
258 
+                    data={this.additionalDevData}
259 
+                    extraData={this.state}
260 
+                    keyExtractor={(item) => item.icon}
261 
+                    listKey={(item) => "team2"}
262 
+                    renderItem={({item}) =>
263 
+                        this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
264 
+                    }
265 
+                />
266 
+            </Card>
267 
+        );
268 
+    }
269 
+
270 
+    getTechnoCard() {
271 
+        return (
272 
+            <Card>
273 
+                <CardItem header>
274 
+                    <Text>{i18n.t('aboutScreen.technologies')}</Text>
275 
+                </CardItem>
276 
+                <FlatList
277 
+                    data={this.technoData}
278 
+                    extraData={this.state}
279 
+                    keyExtractor={(item) => item.icon}
280 
+                    listKey={(item) => "techno"}
281 
+                    renderItem={({item}) =>
282 
+                        this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
283 
+                    }
284 
+                />
285 
+            </Card>
286 
+        );
287 
+    }
288 
+
188 289 
     /**
189 290 
      * Get a clickable card item to be rendered inside a card.
190 291 
      *
 
@@ -284,86 +385,33 @@ export default class AboutScreen extends React.Component<Props, State> {
284 385 
         }
285 386 
     }
286 387
388 
+    getMainCard(item: Object) {
389 
+        switch (item.id) {
390 
+            case 'app':
391 
+                return this.getAppCard();
392 
+            case 'team':
393 
+                return this.getTeamCard();
394 
+            case 'techno':
395 
+                return this.getTechnoCard();
396 
+        }
397 
+        return <View/>;
398 
+    }
399 
+
287 400 
     render() {
288 401 
         const nav = this.props.navigation;
289 402 
         return (
290 403 
             <Container>
291 404 
                 {this.getBugReportModal()}
292 405 
                 <CustomHeader navigation={nav} title={i18n.t('screens.about')} hasBackButton={true}/>
293 
-                <Content padder>
294 
-                    <Card>
295 
-                        <CardItem>
296 
-                            <Left>
297 
-                                <Thumbnail square source={require('../../assets/icon.png')}/>
298 
-                                <Body>
299 
-                                    <H1>{appJson.expo.name}</H1>
300 
-                                    <Text note>
301 
-                                        v.{appJson.expo.version}
302 
-                                    </Text>
303 
-                                </Body>
304 
-                            </Left>
305 
-                        </CardItem>
306 
-                        <FlatList
307 
-                            data={this.appData}
308 
-                            extraData={this.state}
309 
-                            keyExtractor={(item) => item.icon}
310 
-                            renderItem={({item}) =>
311 
-                                this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
312 
-                            }
313 
-                        />
314 
-                    </Card>
315 
-
316 
-                    <Card>
317 
-                        <CardItem>
318 
-                            <Left>
319 
-                                <CustomMaterialIcon
320 
-                                    icon={'account-multiple'}
321 
-                                    fontSize={40}
322 
-                                    width={40}
323 
-                                    color={ThemeManager.getCurrentThemeVariables().brandPrimary}/>
324 
-                                <Body>
325 
-                                    <H1>{i18n.t('aboutScreen.team')}</H1>
326 
-                                </Body>
327 
-                            </Left>
328 
-                        </CardItem>
329 
-                        <CardItem header>
330 
-                            <Text>{i18n.t('aboutScreen.author')}</Text>
331 
-                        </CardItem>
332 
-                        <FlatList
333 
-                            data={this.authorData}
334 
-                            extraData={this.state}
335 
-                            keyExtractor={(item) => item.icon}
336 
-                            renderItem={({item}) =>
337 
-                                this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
338 
-                            }
339 
-                        />
340 
-                        <CardItem header>
341 
-                            <Text>{i18n.t('aboutScreen.additionalDev')}</Text>
342 
-                        </CardItem>
343 
-                        <FlatList
344 
-                            data={this.additionalDevData}
345 
-                            extraData={this.state}
346 
-                            keyExtractor={(item) => item.icon}
347 
-                            renderItem={({item}) =>
348 
-                                this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
349 
-                            }
350 
-                        />
351 
-                    </Card>
352 
-
353 
-                    <Card>
354 
-                        <CardItem header>
355 
-                            <Text>{i18n.t('aboutScreen.technologies')}</Text>
356 
-                        </CardItem>
357 
-                        <FlatList
358 
-                            data={this.technoData}
359 
-                            extraData={this.state}
360 
-                            keyExtractor={(item) => item.icon}
361 
-                            renderItem={({item}) =>
362 
-                                this.getCardItem(item.onPressCallback, item.icon, item.text, item.showChevron, item.showOnlyDebug)
363 
-                            }
364 
-                        />
365 
-                    </Card>
366 
-                </Content>
406 
+                <FlatList
407 
+                    style={{padding: 5}}
408 
+                    data={this.dataOrder}
409 
+                    extraData={this.state}
410 
+                    keyExtractor={(item) => item.id}
411 
+                    renderItem={({item}) =>
412 
+                        this.getMainCard(item)
413 
+                    }
414 
+                />
367 415 
             </Container>
368 416 
         );
369 417 
     }

+ 1
- 14
screens/SettingsScreen.js View File 

@@ -212,24 +212,11 @@ export default class SettingsScreen extends React.Component<Props, State> {
212 212 
         );
213 213 
     }
214 214
215 
-    getRightButton() {
216 
-        return (
217 
-            <Touchable
218 
-                style={{padding: 6}}
219 
-                onPress={() => this.props.navigation.navigate('AboutScreen')}>
220 
-                <CustomMaterialIcon
221 
-                    color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
222 
-                    icon="information"/>
223 
-            </Touchable>
224 
-        );
225 
-    }
226 
-
227 215 
     render() {
228 216 
         const nav = this.props.navigation;
229 217 
         return (
230 218 
             <Container>
231 
-                <CustomHeader navigation={nav} title={i18n.t('screens.settings')} hasBackButton={true}
232 
-                              rightButton={this.getRightButton()}/>
219 
+                <CustomHeader navigation={nav} title={i18n.t('screens.settings')} hasBackButton={true}/>
233 220 
                 <Content padder>
234 221 
                     <Card>
235 222 
                         <CardItem header>

+ 3
- 2
translations/en.json View File 

@@ -7,12 +7,13 @@
7 7 
     "menuSelf": "RU Menu",
8 8 
     "settings": "Settings",
9 9 
     "availableRooms": "Available rooms",
10 
+    "bluemind": "INSA Mails",
10 11 
     "about": "About",
11 12 
     "debug": "Debug"
12 13 
   },
13 14 
   "sidenav": {
14 
-    "divider1": "Nice websites",
15 
-    "divider2": "Useful services",
15 
+    "divider1": "Useful websites",
16 
+    "divider2": "Services",
16 17 
     "divider3": "Personalisation"
17 18 
   },
18 19 
   "intro": {

+ 3
- 2
translations/fr.json View File 

@@ -7,12 +7,13 @@
7 7 
     "menuSelf": "Menu du RU",
8 8 
     "settings": "Paramètres",
9 9 
     "availableRooms": "Salles dispo",
10 
+    "bluemind": "Mails INSA",
10 11 
     "about": "À Propos",
11 12 
     "debug": "Debug"
12 13 
   },
13 14 
   "sidenav": {
14 
-    "divider1": "Sites bien",
15 
-    "divider2": "Services utiles",
15 
+    "divider1": "Sites utiles",
16 
+    "divider2": "Services",
16 17 
     "divider3": "Personnalisation"
17 18 
   },
18 19 
   "intro": {

Write Preview
Loading…
Cancel
Save