From 81c8f99256e7f7f71927b981f7e8a36318cf36a2 Mon Sep 17 00:00:00 2001
From: Rayhan Hassou <Rayhan.HASSOU@etu.uca.fr>
Date: Thu, 9 Nov 2023 16:12:10 +0100
Subject: [PATCH 1/2] add a new component, a reduce version of the
 recipeElement

---
 LeftOvers/App.js                              | 11 ++-
 ...cipeElementImage.tsx => RecipeElement.tsx} | 15 ++--
 LeftOvers/components/RecipeElementReduce.tsx  | 83 +++++++++++++++++++
 3 files changed, 102 insertions(+), 7 deletions(-)
 rename LeftOvers/components/{RecipeElementImage.tsx => RecipeElement.tsx} (86%)
 create mode 100644 LeftOvers/components/RecipeElementReduce.tsx

diff --git a/LeftOvers/App.js b/LeftOvers/App.js
index 030483c..7c5d287 100644
--- a/LeftOvers/App.js
+++ b/LeftOvers/App.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
-import RecipeElementImage from './components/RecipeElementImage';
+import RecipeElement from './components/RecipeElement';
+import RecipeElementReduce from './components/RecipeElementReduce';
 
 const generateImageList = () => {
   const imageList = [];
@@ -16,7 +17,13 @@ export default function App() {
 
   return (
     <View style={styles.container}>
-      <RecipeElementImage title="Rice whith curry chicken" number="7" description="A delicious rice with a sweet chicken with curry sauce. Perfect recipes for winter, delicious and healthy"  imageList={imageList}></RecipeElementImage>
+      <RecipeElement title="Rice whith curry chicken" number="7" description="A delicious rice with a sweet chicken with curry sauce.  je teste des trucs en vrai
+      en sah on fait des test parceque parfois la vie est dur faut etre solide
+      hahahaha je comprends pas comment c'est possible 
+      Perfect recipes for winter, delicious and healthy"  imageList={imageList}></RecipeElement>
+      <View style={{width: 50, height: 50}}></View>
+      <RecipeElementReduce title="Chocolate cake" number="12" duree="4h30"></RecipeElementReduce>
+
     </View>
   );
 }
diff --git a/LeftOvers/components/RecipeElementImage.tsx b/LeftOvers/components/RecipeElement.tsx
similarity index 86%
rename from LeftOvers/components/RecipeElementImage.tsx
rename to LeftOvers/components/RecipeElement.tsx
index f869d72..5b0ff0e 100644
--- a/LeftOvers/components/RecipeElementImage.tsx
+++ b/LeftOvers/components/RecipeElement.tsx
@@ -1,19 +1,20 @@
 import React from 'react';
-import {StyleSheet,Pressable, Text, View, Image} from 'react-native';
+import {StyleSheet,Pressable, Text, View, Image, SafeAreaView, ScrollView} from 'react-native';
 import brochette from '../assets/images/brochette.png'; 
 import Union_left from '../assets/images/Union_left.png';
 import Union_right from '../assets/images/Union_right.png';
 import background from '../assets/images/Background.png'; 
 
 
-interface recipeElementImageProps {
+interface recipeElementProps {
   number : number
   title  : string
   description : string
   imageList : string[]
+  image : string
 }
 
-export default function RecipeElementImage(props : any) {
+export default function RecipeElement(props : any) {
   return (
     <Pressable style={styles.button}>
       <View style={styles.view}>
@@ -35,8 +36,12 @@ export default function RecipeElementImage(props : any) {
         </View>
 
         <View style={{alignItems: 'center', justifyContent: 'center'}}>
-        <Text style={styles.smallText}>{props.description}</Text>
-        </View>
+          <SafeAreaView>
+            <ScrollView>
+                  <Text style={styles.smallText}>{props.description}</Text>
+            </ScrollView>
+          </SafeAreaView>
+          </View>
         <Image source={background} style={{width: 210, height: 20, marginTop: 300, position: 'absolute'}}></Image>
       </View>
     </Pressable>
diff --git a/LeftOvers/components/RecipeElementReduce.tsx b/LeftOvers/components/RecipeElementReduce.tsx
new file mode 100644
index 0000000..a673433
--- /dev/null
+++ b/LeftOvers/components/RecipeElementReduce.tsx
@@ -0,0 +1,83 @@
+import React from 'react';
+import {StyleSheet,Pressable, Text, View, Image} from 'react-native';
+import brochette from '../assets/images/brochette.png'; 
+import Union_left from '../assets/images/Union_left.png';
+import Union_right from '../assets/images/Union_right.png';
+import background from '../assets/images/Background.png'; 
+
+
+interface recipeElementReduceProps {
+  number : number
+  title  : string
+  image : string
+  duree : string
+}
+
+export default function RecipeElementReduce(props : any) {
+  return (
+    <Pressable style={styles.button}>
+      <View style={styles.view}>
+        <Text style={styles.text}>{props.number}</Text>
+        <Text style={styles.title}>{props.title}</Text>
+        <Image source={props.image ? props.image : brochette} style={{ width: 100, height: 100 }}/>
+        <View style={{marginTop: 200, position: 'absolute'}}>
+            <Image source={background} style={{width: 210, height: 20}}></Image>
+            <Text style={styles.smallText}>{props.duree}</Text>
+        </View>
+      </View>
+    </Pressable>
+  ); 
+}
+
+const styles = StyleSheet.create({
+  button: {
+    alignItems: 'center',
+    justifyContent: 'center',
+    width : 250,
+    height: 250,
+    borderRadius: 40,
+    elevation: 3,
+    backgroundColor: '#E3DEC9',
+  },
+  text: {
+    fontSize: 14,
+    lineHeight: 21,
+    fontWeight: 'bold',
+    letterSpacing: 0.25,
+    color: '#756C28',
+    marginTop: 10,
+  },
+  smallText: {
+    position: 'absolute', 
+    textAlign: 'center', 
+    left: 0, 
+    right: 0, 
+    marginHorizontal: 'auto', 
+    color: '#E3DEC9',
+    
+  },
+  title:{
+    fontSize: 18,
+    lineHeight: 21,
+    fontWeight: 'bold',
+    letterSpacing: 0.25,
+    color: '#524B1A',
+  },
+  view: {
+    width : 240,
+    height: 240,
+    borderRadius: 40,
+    elevation: 3,
+    borderWidth: 2,
+    borderColor: 'grey',
+    alignItems: 'center', // Centre le contenu verticalement
+    display: "flex",
+    flexWrap: "wrap",
+  },
+  horizontalAlignement: {
+    display: "flex",
+    flexDirection : 'row',
+    alignItems: 'center', 
+    marginTop: 10,
+  }
+});
\ No newline at end of file

From 087d9cd7f91d6a2fe75c07360494a3cb5992a76f Mon Sep 17 00:00:00 2001
From: Rayhan Hassou <Rayhan.HASSOU@etu.uca.fr>
Date: Fri, 10 Nov 2023 10:44:31 +0100
Subject: [PATCH 2/2] add a new component

---
 LeftOvers/components/Normalize.tsx           | 17 +++++++++++++++++
 LeftOvers/components/RecipeElement.tsx       |  2 ++
 LeftOvers/components/RecipeElementReduce.tsx |  4 +++-
 LeftOvers/screens/RecipeSuggestion.tsx       |  0
 4 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 LeftOvers/components/Normalize.tsx
 create mode 100644 LeftOvers/screens/RecipeSuggestion.tsx

diff --git a/LeftOvers/components/Normalize.tsx b/LeftOvers/components/Normalize.tsx
new file mode 100644
index 0000000..b328a11
--- /dev/null
+++ b/LeftOvers/components/Normalize.tsx
@@ -0,0 +1,17 @@
+import { Dimensions, Platform, PixelRatio } from 'react-native';
+
+const {
+  width: SCREEN_WIDTH,
+} = Dimensions.get('window');
+
+const scale = SCREEN_WIDTH / 480;
+
+// @ts-ignore
+export default function normalize(size) {
+  const newSize = size * scale
+  if (Platform.OS === 'ios') {
+    return Math.round(PixelRatio.roundToNearestPixel(newSize))
+  } else {
+    return Math.round(PixelRatio.roundToNearestPixel(newSize)) - 3
+  }
+}
\ No newline at end of file
diff --git a/LeftOvers/components/RecipeElement.tsx b/LeftOvers/components/RecipeElement.tsx
index 5b0ff0e..b7925e9 100644
--- a/LeftOvers/components/RecipeElement.tsx
+++ b/LeftOvers/components/RecipeElement.tsx
@@ -4,6 +4,7 @@ import brochette from '../assets/images/brochette.png';
 import Union_left from '../assets/images/Union_left.png';
 import Union_right from '../assets/images/Union_right.png';
 import background from '../assets/images/Background.png'; 
+import normalize from './Normalize';
 
 
 interface recipeElementProps {
@@ -48,6 +49,7 @@ export default function RecipeElement(props : any) {
   ); 
 }
 
+
 const styles = StyleSheet.create({
   button: {
     alignItems: 'center',
diff --git a/LeftOvers/components/RecipeElementReduce.tsx b/LeftOvers/components/RecipeElementReduce.tsx
index a673433..b4d7920 100644
--- a/LeftOvers/components/RecipeElementReduce.tsx
+++ b/LeftOvers/components/RecipeElementReduce.tsx
@@ -4,6 +4,7 @@ import brochette from '../assets/images/brochette.png';
 import Union_left from '../assets/images/Union_left.png';
 import Union_right from '../assets/images/Union_right.png';
 import background from '../assets/images/Background.png'; 
+import normalize from './Normalize';
 
 
 interface recipeElementReduceProps {
@@ -29,6 +30,7 @@ export default function RecipeElementReduce(props : any) {
   ); 
 }
 
+
 const styles = StyleSheet.create({
   button: {
     alignItems: 'center',
@@ -54,7 +56,7 @@ const styles = StyleSheet.create({
     right: 0, 
     marginHorizontal: 'auto', 
     color: '#E3DEC9',
-    
+
   },
   title:{
     fontSize: 18,
diff --git a/LeftOvers/screens/RecipeSuggestion.tsx b/LeftOvers/screens/RecipeSuggestion.tsx
new file mode 100644
index 0000000..e69de29