diff --git a/LeftOvers/components/CustomButton.tsx b/LeftOvers/components/CustomButton.tsx
index db7ddd2..60528ad 100644
--- a/LeftOvers/components/CustomButton.tsx
+++ b/LeftOvers/components/CustomButton.tsx
@@ -3,11 +3,10 @@ import {StyleSheet, Pressable, Text, View} from 'react-native';
interface CustomButtonProps {
- source : string
title : string
}
-export default function CustomButton(props) {
+export default function CustomButton(props: CustomButtonProps) {
return (
diff --git a/LeftOvers/components/RecipeElement.tsx b/LeftOvers/components/RecipeElement.tsx
index 57b5588..efd854c 100644
--- a/LeftOvers/components/RecipeElement.tsx
+++ b/LeftOvers/components/RecipeElement.tsx
@@ -4,8 +4,6 @@ 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 {
number : number
diff --git a/LeftOvers/components/RecipeElementReduce.tsx b/LeftOvers/components/RecipeElementReduce.tsx
index 88f8a59..e61a9bc 100644
--- a/LeftOvers/components/RecipeElementReduce.tsx
+++ b/LeftOvers/components/RecipeElementReduce.tsx
@@ -2,7 +2,6 @@ import React from 'react';
import {StyleSheet,Pressable, Text, View, Image} from 'react-native';
import brochette from '../assets/images/brochette.png';
import background from '../assets/images/Background.png';
-import normalize from './Normalize';
interface recipeElementReduceProps {
diff --git a/LeftOvers/components/SelectedIngredient.tsx b/LeftOvers/components/SelectedIngredient.tsx
index a6c3ffd..26e690c 100644
--- a/LeftOvers/components/SelectedIngredient.tsx
+++ b/LeftOvers/components/SelectedIngredient.tsx
@@ -31,6 +31,7 @@ export default function SelectedIngredient(props: SelectedIngredientProps) {
};
const handlePress = () => {
+ // Supposons que vous voulez envoyer la valeur 'Hello' au parent
props.onEvent('Hello');
};
diff --git a/LeftOvers/components/TopBar.tsx b/LeftOvers/components/TopBar.tsx
index 639422d..fda32e4 100644
--- a/LeftOvers/components/TopBar.tsx
+++ b/LeftOvers/components/TopBar.tsx
@@ -2,13 +2,12 @@ import React from 'react';
import { Appbar } from 'react-native-paper';
interface TopBarProps{
- source : string
- firstImage : string
- lastImage : string
+ title : string
+ isVisible : boolean
}
- export default function TopBar(props : any) {
+ export default function TopBar(props) {
const _goBack = () => console.log('Went back');
@@ -18,9 +17,15 @@ interface TopBarProps{
return (
-
-
-
+
+
+ {props.isVisible &&(
+ <>
+
+
+ )}
+
+
);
}
\ No newline at end of file
diff --git a/LeftOvers/screens/IngredientSelection.tsx b/LeftOvers/screens/IngredientSelection.tsx
new file mode 100644
index 0000000..39e61f9
--- /dev/null
+++ b/LeftOvers/screens/IngredientSelection.tsx
@@ -0,0 +1,150 @@
+import React from 'react';
+import { View, StyleSheet, Text, Image, Pressable,ScrollView} from 'react-native';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import TopBar from '../components/TopBar';
+import { Searchbar } from 'react-native-paper';
+import brochette from '../assets/images/brochette.png';
+import FoodElementText from '../components/FoodElementText';
+import CustomButton from '../components/CustomButton';
+
+
+export default function IngredientSelection() {
+
+ const [searchQuery, setSearchQuery] = React.useState('');
+
+ const onChangeSearch = query => setSearchQuery(query);
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Available
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+const styles = StyleSheet.create({
+ page: {
+ flex: 1,
+ backgroundColor: '#59BDCD',
+ alignItems: 'center',
+ display: 'flex',
+ flexWrap: 'wrap',
+ padding: 20,
+ },
+ element: {
+ backgroundColor:'#F2F0E4',
+ borderRadius: 30,
+ },
+ horizontalAlignement: {
+ display: 'flex',
+ height: 30,
+ width: 350,
+ flexDirection: 'row',
+ justifyContent: 'space-around',
+ alignItems: 'center',
+ marginTop: 15,
+ }
+});
diff --git a/LeftOvers/screens/RecipeDetails.tsx b/LeftOvers/screens/RecipeDetails.tsx
new file mode 100644
index 0000000..2b51f33
--- /dev/null
+++ b/LeftOvers/screens/RecipeDetails.tsx
@@ -0,0 +1,44 @@
+import React from 'react';
+import { View, StyleSheet} from 'react-native';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import TopBar from '../components/TopBar';
+import RecipeElementReduce from '../components/RecipeElementReduce';
+
+
+export default function RecipeDetails(props) {
+ return (
+
+
+
+
+
+
+ );
+ }
+
+ const styles = StyleSheet.create({
+ page: {
+ flex: 1,
+ backgroundColor: '#59BDCD',
+ alignItems: 'center',
+ display: 'flex',
+ flexWrap: 'wrap',
+ padding: 20,
+ },
+ element: {
+ marginTop: 20,
+ },
+ horizontalAlignement: {
+ display: 'flex',
+ height: 30,
+ width: 350,
+ flexDirection: 'row',
+ justifyContent: 'space-around',
+ alignItems: 'center',
+ marginTop: 10,
+ }
+ });
+
\ No newline at end of file
diff --git a/LeftOvers/screens/RecipeSuggestion.tsx b/LeftOvers/screens/RecipeSuggestion.tsx
index 738fe00..25c9d82 100644
--- a/LeftOvers/screens/RecipeSuggestion.tsx
+++ b/LeftOvers/screens/RecipeSuggestion.tsx
@@ -10,6 +10,7 @@ import brochette from '../assets/images/brochette.png';
import ParameterTopBar from '../components/ParameterTopBar';
import bracketLeft from '../assets/images/angle_bracket_left.png';
import bracketRight from '../assets/images/angle_bracket_right.png';
+import CustomButton from '../components/CustomButton';
export default function RecipeSuggestion(props) {
@@ -26,7 +27,7 @@ export default function RecipeSuggestion(props) {
const hideModal = () => setVisible(false);
const containerStyle = {
backgroundColor: 'white',
- height: 400,
+ height: 450,
width: 380,
};
@@ -69,7 +70,7 @@ export default function RecipeSuggestion(props) {
return (
-
+
+
+
+
+
)}
{visibleFilters &&(
HEHEHEHEHEHEHE
+
+
+
+
+
)}
@@ -142,7 +152,7 @@ const styles = StyleSheet.create({
position: 'absolute',
top: '50%', // Centre verticalement
left: '50%', // Centre horizontalement
- transform: [{ translateX: -185 }, { translateY: -120 }], // Ajustez en fonction de la moitié de la hauteur et de la largeur
+ transform: [{ translateX: -185 }, { translateY: -90 }], // Ajustez en fonction de la moitié de la hauteur et de la largeur
},
horizontalAlignement: {
display: 'flex',