From 96ed75ac728e9342f8a757c27e33dc882564e954 Mon Sep 17 00:00:00 2001
From: Arnaud Vergnet <vergnet@etud.insa-toulouse.fr>
Date: Tue, 21 Apr 2020 20:02:17 +0200
Subject: [PATCH] Added collapsible header to profile

---
 src/navigation/MainTabNavigator.js   |  8 +-------
 src/screens/Amicale/ProfileScreen.js | 22 +++++++++++++++++-----
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/navigation/MainTabNavigator.js b/src/navigation/MainTabNavigator.js
index c211ea0..ae966c8 100644
--- a/src/navigation/MainTabNavigator.js
+++ b/src/navigation/MainTabNavigator.js
@@ -246,13 +246,7 @@ function HomeStackComponent(initialRoute: string | null, defaultData: { [key: st
                     title: i18n.t('screens.login'),
                 }}
             />
-            <HomeStack.Screen
-                name="profile"
-                component={ProfileScreen}
-                options={{
-                    title: i18n.t('screens.profile'),
-                }}
-            />
+            {createScreenCollapsibleStack("profile", HomeStack, ProfileScreen, i18n.t('screens.profile'))}
             {createScreenCollapsibleStack("club-list", HomeStack, ClubListScreen, i18n.t('clubs.clubList'))}
             <HomeStack.Screen
                 name="club-about"
diff --git a/src/screens/Amicale/ProfileScreen.js b/src/screens/Amicale/ProfileScreen.js
index 960583e..d0dd71b 100644
--- a/src/screens/Amicale/ProfileScreen.js
+++ b/src/screens/Amicale/ProfileScreen.js
@@ -1,16 +1,20 @@
 // @flow
 
 import * as React from 'react';
-import {FlatList, StyleSheet, View} from "react-native";
+import {Animated, FlatList, StyleSheet, View} from "react-native";
 import {Avatar, Button, Card, Divider, List, withTheme} from 'react-native-paper';
 import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
 import i18n from 'i18n-js';
 import LogoutDialog from "../../components/Amicale/LogoutDialog";
 import MaterialHeaderButtons, {Item} from "../../components/Overrides/CustomHeaderButton";
+import CustomTabBar from "../../components/Tabbar/CustomTabBar";
+import {Collapsible} from "react-navigation-collapsible";
+import {withCollapsible} from "../../utils/withCollapsible";
 
 type Props = {
     navigation: Object,
     theme: Object,
+    collapsibleStack: Collapsible,
 }
 
 type State = {
@@ -52,12 +56,20 @@ class ProfileScreen extends React.Component<Props, State> {
 
     getScreen = (data: Object) => {
         this.data = data[0];
+        const {containerPaddingTop, scrollIndicatorInsetTop, onScroll} = this.props.collapsibleStack;
         return (
-            <View>
-                {/*$FlowFixMe*/}
-                <FlatList
+            <View style={{flex: 1}}>
+                <Animated.FlatList
                     renderItem={this.getRenderItem}
                     data={this.flatListData}
+                    // Animations
+                    onScroll={onScroll}
+                    contentContainerStyle={{
+                        paddingTop: containerPaddingTop,
+                        paddingBottom: CustomTabBar.TAB_BAR_HEIGHT,
+                        minHeight: '100%'
+                    }}
+                    scrollIndicatorInsets={{top: scrollIndicatorInsetTop}}
                 />
                 <LogoutDialog
                     {...this.props}
@@ -323,4 +335,4 @@ const styles = StyleSheet.create({
 
 });
 
-export default withTheme(ProfileScreen);
+export default withCollapsible(withTheme(ProfileScreen));