Browse Source

Added about screen

Arnaud Vergnet 1 year ago
parent
commit
20336c699e

+ 13
- 2
navigation/DrawerNavigator.js View File

@@ -17,8 +17,9 @@ import HeaderButton from "../components/Custom/HeaderButton";
17 17
 import i18n from "i18n-js";
18 18
 import LoginScreen from "../screens/Amicale/LoginScreen";
19 19
 import ProfileScreen from "../screens/Amicale/ProfileScreen";
20
-import ClubListScreen from "../screens/Amicale/ClubListScreen";
21
-import ClubDisplayScreen from "../screens/Amicale/ClubDisplayScreen";
20
+import ClubListScreen from "../screens/Amicale/Clubs/ClubListScreen";
21
+import ClubDisplayScreen from "../screens/Amicale/Clubs/ClubDisplayScreen";
22
+import ClubAboutScreen from "../screens/Amicale/Clubs/ClubAboutScreen";
22 23
 
23 24
 const defaultScreenOptions = {
24 25
     gestureEnabled: true,
@@ -268,6 +269,16 @@ function ClubStackComponent() {
268 269
                     };
269 270
                 }}
270 271
             />
272
+            <ClubStack.Screen
273
+                name="ClubAboutScreen"
274
+                component={ClubAboutScreen}
275
+                options={({navigation}) => {
276
+                    return {
277
+                        title: "ABOUT",
278
+                        ...TransitionPresets.ModalSlideFromBottomIOS,
279
+                    };
280
+                }}
281
+            />
271 282
         </ClubStack.Navigator>
272 283
     );
273 284
 }

+ 39
- 0
screens/Amicale/Clubs/ClubAboutScreen.js View File

@@ -0,0 +1,39 @@
1
+// @flow
2
+
3
+import * as React from 'react';
4
+import {ScrollView} from 'react-native';
5
+import {Linking} from "expo";
6
+import {Text, withTheme} from 'react-native-paper';
7
+
8
+type Props = {
9
+};
10
+
11
+type State = {
12
+};
13
+
14
+function openWebLink(event, link) {
15
+    Linking.openURL(link).catch((err) => console.error('Error opening link', err));
16
+}
17
+
18
+/**
19
+ * Class defining a planning event information page.
20
+ */
21
+class ClubAboutScreen extends React.Component<Props, State> {
22
+
23
+    colors: Object;
24
+
25
+    constructor(props) {
26
+        super(props);
27
+        this.colors = props.theme.colors;
28
+    }
29
+
30
+    render() {
31
+        return (
32
+            <ScrollView style={{padding: 5}}>
33
+                <Text>TEXT</Text>
34
+            </ScrollView>
35
+        );
36
+    }
37
+}
38
+
39
+export default withTheme(ClubAboutScreen);

screens/Amicale/ClubDisplayScreen.js → screens/Amicale/Clubs/ClubDisplayScreen.js View File


screens/Amicale/ClubListScreen.js → screens/Amicale/Clubs/ClubListScreen.js View File

@@ -3,11 +3,12 @@
3 3
 import * as React from 'react';
4 4
 import {FlatList, Platform} from "react-native";
5 5
 import {Chip, Searchbar, withTheme} from 'react-native-paper';
6
-import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
6
+import AuthenticatedScreen from "../../../components/Amicale/AuthenticatedScreen";
7 7
 import i18n from "i18n-js";
8
-import ClubListItem from "../../components/Lists/ClubListItem";
9
-import {isItemInCategoryFilter, stringMatchQuery} from "../../utils/Search";
10
-import ClubListHeader from "../../components/Lists/ClubListHeader";
8
+import ClubListItem from "../../../components/Lists/ClubListItem";
9
+import {isItemInCategoryFilter, stringMatchQuery} from "../../../utils/Search";
10
+import ClubListHeader from "../../../components/Lists/ClubListHeader";
11
+import HeaderButton from "../../../components/Custom/HeaderButton";
11 12
 
12 13
 type Props = {
13 14
     navigation: Object,
@@ -40,9 +41,9 @@ class ClubListScreen extends React.Component<Props, State> {
40 41
      * Creates the header content
41 42
      */
42 43
     componentDidMount() {
43
-        const title = this.getSearchBar.bind(this);
44 44
         this.props.navigation.setOptions({
45
-            headerTitle: title,
45
+            headerTitle: this.getSearchBar,
46
+            headerRight: this.getHeaderButtons,
46 47
             headerBackTitleVisible: false,
47 48
             headerTitleContainerStyle: Platform.OS === 'ios' ?
48 49
                 {marginHorizontal: 0, width: '70%'} :
@@ -55,14 +56,23 @@ class ClubListScreen extends React.Component<Props, State> {
55 56
      *
56 57
      * @return {*}
57 58
      */
58
-    getSearchBar() {
59
+    getSearchBar = () => {
59 60
         return (
60 61
             <Searchbar
61 62
                 placeholder={i18n.t('proximoScreen.search')}
62 63
                 onChangeText={this.onSearchStringChange}
63 64
             />
64 65
         );
65
-    }
66
+    };
67
+
68
+    /**
69
+     * Gets the header button
70
+     * @return {*}
71
+     */
72
+    getHeaderButtons = () => {
73
+        const onPress = this.props.navigation.navigate.bind(this, "ClubAboutScreen");
74
+        return <HeaderButton icon={'information'} onPress={onPress}/>;
75
+    };
66 76
 
67 77
     /**
68 78
      * Callback used when the search changes

+ 1
- 1
translations/en.json View File

@@ -248,7 +248,7 @@
248 248
     "managersSubtitle": "These people make the club live",
249 249
     "managersUnavailable": "This club has no one :(",
250 250
     "categories": "Categories",
251
-    "categoriesFilterMessage": "Click on a categories to filter the list"
251
+    "categoriesFilterMessage": "Click on a category to filter the list"
252 252
   },
253 253
   "dialog": {
254 254
     "ok": "OK",

Loading…
Cancel
Save