Allow clicking on a club in profile screen to show its information

src/navigation/DrawerNavigator.js

@@ -236,6 +236,16 @@ function ProfileStackComponent() {
                     };
                 }}
             />
+            <ClubStack.Screen
+                name="club-information"
+                component={ClubDisplayScreen}
+                options={({navigation}) => {
+                    return {
+                        title: i18n.t('screens.clubDisplayScreen'),
+                        ...TransitionPresets.ModalSlideFromBottomIOS,
+                    };
+                }}
+            />
         </ProfileStack.Navigator>
     );
 }
@@ -290,7 +300,7 @@ function ClubStackComponent() {
                 component={ClubDisplayScreen}
                 options={({navigation}) => {
                     return {
-                        title: "",
+                        title: i18n.t('screens.clubDisplayScreen'),
                         ...TransitionPresets.ModalSlideFromBottomIOS,
                     };
                 }}
@@ -300,7 +310,7 @@ function ClubStackComponent() {
                 component={ClubAboutScreen}
                 options={({navigation}) => {
                     return {
-                        title: "ABOUT",
+                        title: i18n.t('screens.about'),
                         ...TransitionPresets.ModalSlideFromBottomIOS,
                     };
                 }}

src/screens/Amicale/Clubs/ClubDisplayScreen.js

@@ -135,6 +135,7 @@ class ClubDisplayScreen extends React.Component<Props, State> {
     getScreen = (data: Object) => {
         console.log('fetchedData passed to screen:');
         console.log(data);
+        console.log("Using fake data");
         data = FakeClub;
         this.updateHeaderTitle(data);
 

src/screens/Amicale/ProfileScreen.js

@@ -79,7 +79,7 @@ class ProfileScreen extends React.Component<Props, State> {
                 return this.getPersonalCard();
             case '1':
                 return this.getClubCard();
-            case '2':
+            default:
                 return this.getMembershipCar();
         }
     };
@@ -164,20 +164,39 @@ class ProfileScreen extends React.Component<Props, State> {
         );
     }
 
+    openClubDetailsScreen(id: number) {
+        this.props.navigation.navigate("club-information", {clubId: id});
+    }
+
+    clubListItem = ({item}: Object) => {
+        const onPress = () => this.openClubDetailsScreen(0); // TODO get club id
+        const isManager = false; // TODO detect if manager
+        let description = i18n.t("profileScreen.isMember");
+        let icon = (props) => <List.Icon {...props} icon="chevron-right"/>;
+        if (isManager) {
+            description = i18n.t("profileScreen.isManager");
+            icon = (props) => <List.Icon {...props} icon="star" color={this.colors.primary}/>;
+        }
+        return <List.Item
+            title={item.name}
+            description={description}
+            left={icon}
+            onPress={onPress}
+        />;
+    };
+
+    clubKeyExtractor = (item: Object) => item.name;
+
     getClubList(list: Array<string>) {
         let dataset = [];
         for (let i = 0; i < list.length; i++) {
             dataset.push({name: list[i]});
         }
         return (
+            //$FlowFixMe
             <FlatList
-                renderItem={({item}) =>
+                renderItem={this.clubListItem}
-                    <List.Item
+                keyExtractor={this.clubKeyExtractor}
-                        title={item.name}
-                        left={props => <List.Icon {...props} icon="chevron-right"/>}
-                    />
-                }
-                keyExtractor={item => item.name}
                 data={dataset}
             />
         );

translations/en.json

@@ -220,8 +220,10 @@
     "personalInformation": "Personal information",
     "noData": "No data",
     "editInformation": "Edit Information",
-    "clubs": "Clubs",
+    "clubs": "Your clubs",
-    "clubsSubtitle": "Clubs you are part of",
+    "clubsSubtitle": "Click on a club to show its information",
+    "isMember": "Member",
+    "isManager": "Manager",
     "membership": "Membership Fee",
     "membershipSubtitle": "Allows you to take part in various activities",
     "membershipPayed": "Payed",

translations/fr.json

@@ -220,8 +220,10 @@
     "personalInformation": "Informations Personnelles",
     "noData": "Pas de données",
     "editInformation": "Modifier les informations",
-    "clubs": "Clubs",
+    "clubs": "Vos clubs",
-    "clubsSubtitle": "Liste de vos clubs",
+    "clubsSubtitle": "Cliquez sur un club pour afficher ses informations",
+    "isMember": "Membre",
+    "isManager": "Responsable",
     "membership": "Cotisation",
     "membershipSubtitle": "Permet de participer à diverses activités",
     "membershipPayed": "Payée",