From 1e71f981f611c161719885b56177d8e177bf6c39 Mon Sep 17 00:00:00 2001
From: Louison PARANT <Louison.PARANT@etu.uca.fr>
Date: Mon, 20 Nov 2023 11:13:01 +0100
Subject: [PATCH] Bug Fix (Separator ProfileElement)

---
 LeftOvers/App.tsx                       |  4 ++--
 LeftOvers/components/ProfileElement.tsx | 11 +++++++++--
 LeftOvers/components/ValidateButton.tsx |  1 +
 LeftOvers/screens/HomePage.tsx          |  9 ++++-----
 LeftOvers/screens/ModifyProfile.tsx     |  2 +-
 5 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/LeftOvers/App.tsx b/LeftOvers/App.tsx
index 150d43d..8eea4ad 100644
--- a/LeftOvers/App.tsx
+++ b/LeftOvers/App.tsx
@@ -9,11 +9,11 @@ import FiltersSelection from './screens/FiltersSelection';
 
 export default function App(props) {
   return(
-    <HomePage/>
+    //<HomePage/>
     //<ModifyProfile/>
     //<Profiles/>
     //<RecipeSuggestion/>
     //<CreateProfile/>
-    //<FiltersSelection/>
+    <FiltersSelection/>
   );
 }
\ No newline at end of file
diff --git a/LeftOvers/components/ProfileElement.tsx b/LeftOvers/components/ProfileElement.tsx
index 614caa5..658820e 100644
--- a/LeftOvers/components/ProfileElement.tsx
+++ b/LeftOvers/components/ProfileElement.tsx
@@ -10,6 +10,7 @@ type Profile = {
 
 export default function ProfileElement(props : Profile) {
   const [waiting, setWaiting] = useState("none")
+  const [separator, setSeparator] = useState("none")
   const changeStatus = () => {
       if (props.disableSelection){
           setWaiting("none")
@@ -20,7 +21,13 @@ export default function ProfileElement(props : Profile) {
       else{
           setWaiting("flex")
       }
-      console.log(waiting, props.name)
+      if (props.isActive == "flex" && waiting == "none"){
+          setSeparator("flex")
+      }
+      else{
+          setSeparator("none")
+      }
+      console.log(waiting, separator, props.name)
   };
   return (
       <Pressable onPress={changeStatus} style={styles.button}>
@@ -33,7 +40,7 @@ export default function ProfileElement(props : Profile) {
                   <View style={[styles.active, {display: props.isActive}]}>
                       <Text style={styles.textActive}>Activated</Text>
                   </View>
-                  <View style={{flex: 0.3, display: waiting}}/>
+                  <View style={{flex: 0.3, display: separator}}/>
                   <View style={[styles.waiting, {display: waiting}]}>
                       <Text style={styles.textWaiting}>Waiting...</Text>
                   </View>
diff --git a/LeftOvers/components/ValidateButton.tsx b/LeftOvers/components/ValidateButton.tsx
index de00a10..1ad4d82 100644
--- a/LeftOvers/components/ValidateButton.tsx
+++ b/LeftOvers/components/ValidateButton.tsx
@@ -21,6 +21,7 @@ export default function ValidateButton(props: ValidateButtonProps) {
             borderColor: props.colour,
             backgroundColor: props.backColour,
             alignItems: 'center',
+            justifyContent: "center",
             flexDirection: "row",
             padding: 5,
             paddingRight: 10,}}>
diff --git a/LeftOvers/screens/HomePage.tsx b/LeftOvers/screens/HomePage.tsx
index 549988e..dcf7ce7 100644
--- a/LeftOvers/screens/HomePage.tsx
+++ b/LeftOvers/screens/HomePage.tsx
@@ -87,7 +87,7 @@ export default function HomePage(props) {
                      <View style={{marginTop: 10}}/>
                      <View style={styles.ingredientSelection}>
                          <Text style={{fontSize: 15, color: "#3F3C42"}}>Selected Ingredient</Text>
-                         <View style={{flexDirection: "row", padding: 10}}>
+                         <View style={{flexDirection: "row", padding: 10, justifyContent: "center", alignItems: "center"}}>
                              <Pressable onPress={decreaseCounter}>
                                  <Image source={bracketLeft} style={{ width: 40, height: 40 }} />
                              </Pressable>
@@ -97,9 +97,9 @@ export default function HomePage(props) {
                              </Pressable>
                          </View>
                      </View>
-                     <View style={{marginTop: 20}}/>
+                     <View style={{marginTop: 15}}/>
                      <ValidateButton title="Change Selected Ingredients" image="cook.png" colour="#59BDCD" backColour="#E3DEC9"/>
-                     <View style={{marginTop: 5}}/>
+                     <View style={{marginTop: 10}}/>
                      <ValidateButton title="Search Recipes" image="search.png" colour="#59BDCD" backColour="#E3DEC9"/>
                 </View>
             </LinearGradient>
@@ -145,18 +145,17 @@ const styles = StyleSheet.create({
   },
   nbSelected: {
         fontSize: 11,
-        //flex: 0.2,
         color: "#3F3C42",
         textAlign: "right",
   },
 
   profilesSelection: {
-        //maxWidth: 370,
         flexDirection: 'column',
         alignItems: 'center',
         justifyContent: 'center',
         borderRadius: 20,
         backgroundColor: '#F2F0E4',
+        paddingTop: 5,
         marginHorizontal: 10,
   },
   welcome: {
diff --git a/LeftOvers/screens/ModifyProfile.tsx b/LeftOvers/screens/ModifyProfile.tsx
index 212fc03..1a8b096 100644
--- a/LeftOvers/screens/ModifyProfile.tsx
+++ b/LeftOvers/screens/ModifyProfile.tsx
@@ -14,7 +14,7 @@ export default function ModifyProfile(props) {
         <TopBar title="Modify Profile" isVisible="true"/>
         <View style={styles.container}>
             <LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
-                <View style={{marginTop: 10}}/>
+                <View style={{marginTop: 20}}/>
                 <ProfileModification name="Johnny Silverhand" avatar="plus_small.png" diets={die} allergies={all}></ProfileModification>
                 <View style={{marginTop: 10}}/>
                 <ValidateButton title="Update Profile" image="update.png" colour="#ACA279" backColour="#F2F0E4"></ValidateButton>