Added about screen

navigation/DrawerNavigator.js

@@ -17,8 +17,9 @@ import HeaderButton from "../components/Custom/HeaderButton";
 import i18n from "i18n-js";
 import LoginScreen from "../screens/Amicale/LoginScreen";
 import ProfileScreen from "../screens/Amicale/ProfileScreen";
-import ClubListScreen from "../screens/Amicale/ClubListScreen";
-import ClubDisplayScreen from "../screens/Amicale/ClubDisplayScreen";
+import ClubListScreen from "../screens/Amicale/Clubs/ClubListScreen";
+import ClubDisplayScreen from "../screens/Amicale/Clubs/ClubDisplayScreen";
+import ClubAboutScreen from "../screens/Amicale/Clubs/ClubAboutScreen";
 
 const defaultScreenOptions = {
     gestureEnabled: true,
@@ -268,6 +269,16 @@ function ClubStackComponent() {
                     };
                 }}
             />
+            <ClubStack.Screen
+                name="ClubAboutScreen"
+                component={ClubAboutScreen}
+                options={({navigation}) => {
+                    return {
+                        title: "ABOUT",
+                        ...TransitionPresets.ModalSlideFromBottomIOS,
+                    };
+                }}
+            />
         </ClubStack.Navigator>
     );
 }

screens/Amicale/Clubs/ClubAboutScreen.js

@@ -0,0 +1,39 @@
+// @flow
+
+import * as React from 'react';
+import {ScrollView} from 'react-native';
+import {Linking} from "expo";
+import {Text, withTheme} from 'react-native-paper';
+
+type Props = {
+};
+
+type State = {
+};
+
+function openWebLink(event, link) {
+    Linking.openURL(link).catch((err) => console.error('Error opening link', err));
+}
+
+/**
+ * Class defining a planning event information page.
+ */
+class ClubAboutScreen extends React.Component<Props, State> {
+
+    colors: Object;
+
+    constructor(props) {
+        super(props);
+        this.colors = props.theme.colors;
+    }
+
+    render() {
+        return (
+            <ScrollView style={{padding: 5}}>
+                <Text>TEXT</Text>
+            </ScrollView>
+        );
+    }
+}
+
+export default withTheme(ClubAboutScreen);

screens/Amicale/Clubs/ClubListScreen.js

@@ -3,11 +3,12 @@
 import * as React from 'react';
 import {FlatList, Platform} from "react-native";
 import {Chip, Searchbar, withTheme} from 'react-native-paper';
-import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
+import AuthenticatedScreen from "../../../components/Amicale/AuthenticatedScreen";
 import i18n from "i18n-js";
-import ClubListItem from "../../components/Lists/ClubListItem";
-import {isItemInCategoryFilter, stringMatchQuery} from "../../utils/Search";
-import ClubListHeader from "../../components/Lists/ClubListHeader";
+import ClubListItem from "../../../components/Lists/ClubListItem";
+import {isItemInCategoryFilter, stringMatchQuery} from "../../../utils/Search";
+import ClubListHeader from "../../../components/Lists/ClubListHeader";
+import HeaderButton from "../../../components/Custom/HeaderButton";
 
 type Props = {
     navigation: Object,
@@ -40,9 +41,9 @@ class ClubListScreen extends React.Component<Props, State> {
      * Creates the header content
      */
     componentDidMount() {
-        const title = this.getSearchBar.bind(this);
         this.props.navigation.setOptions({
-            headerTitle: title,
+            headerTitle: this.getSearchBar,
+            headerRight: this.getHeaderButtons,
             headerBackTitleVisible: false,
             headerTitleContainerStyle: Platform.OS === 'ios' ?
                 {marginHorizontal: 0, width: '70%'} :
@@ -55,14 +56,23 @@ class ClubListScreen extends React.Component<Props, State> {
      *
      * @return {*}
      */
-    getSearchBar() {
+    getSearchBar = () => {
         return (
             <Searchbar
                 placeholder={i18n.t('proximoScreen.search')}
                 onChangeText={this.onSearchStringChange}
             />
         );
-    }
+    };
+
+    /**
+     * Gets the header button
+     * @return {*}
+     */
+    getHeaderButtons = () => {
+        const onPress = this.props.navigation.navigate.bind(this, "ClubAboutScreen");
+        return <HeaderButton icon={'information'} onPress={onPress}/>;
+    };
 
     /**
      * Callback used when the search changes

translations/en.json

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