WORK-RHA #12

Merged
rayhan.hassou merged 2 commits from WORK-RHA into master 1 year ago

@ -5,6 +5,7 @@ import ValidateButton from './components/ValidateButton';
import { LinearGradient } from 'expo-linear-gradient';
import RecipeSuggestion from './screens/RecipeSuggestion';
import RecipeDetails from './screens/RecipeDetails';
import IngredientSelection from './screens/IngredientSelection';
export default function App() {
const all = [{value: "Mussels"}, {value: "Skimmed Milk"}, {value: "Nuts"}]
@ -36,14 +37,15 @@ export default function App() {
const ingredients = generateList();
return (
<IngredientSelection listIngredient={ingredients}></IngredientSelection>
/*<RecipeSuggestion list={ingredients} diets={die} allergy={all}></RecipeSuggestion>*/
<RecipeDetails ingredient={ingredient}
/*<RecipeDetails ingredient={ingredient}
ustensils={ustensils}
steps={steps}
title="Chocolat Cake"
number="63"
duree="30 minutes"
></RecipeDetails>
></RecipeDetails>*/
);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 941 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 939 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 410 B

@ -6,14 +6,39 @@ import { Searchbar } from 'react-native-paper';
import brochette from '../assets/images/brochette.png';
import FoodElementText from '../components/FoodElementText';
import CustomButton from '../components/CustomButton';
import plus from '../assets/images/plus.png';
import moins from '../assets/images/minus.png';
import meat from '../assets/images/meat_icon.png';
import vegetable from '../assets/images/vegetable_icon.png';
import fruit from '../assets/images/fruit_icon.png';
export default function IngredientSelection() {
export default function IngredientSelection(props) {
const [searchQuery, setSearchQuery] = React.useState('');
const onChangeSearch = query => setSearchQuery(query);
type ItemProps = {value: string}
const AvailaibleItem = ({value}: ItemProps) => (
<><View style={styles.horizontalAlignement}>
<FoodElementText title={value} />
<Pressable>
<Image source={plus} style={{ width: 20, height: 20 }} />
</Pressable>
</View><View style={{ height: 30 }}></View></>
)
const ChooseItem = ({value}: ItemProps) => (
<><View style={styles.horizontalAlignement}>
<FoodElementText title={value} />
<Pressable>
<Image source={moins} style={{ width: 20, height: 20 }} />
</Pressable>
</View><View style={{ height: 30 }}></View></>
)
return (
<SafeAreaProvider>
<TopBar title="Ingredient selection" />
@ -22,16 +47,13 @@ export default function IngredientSelection() {
<View style={styles.element}>
<View style={[styles.horizontalAlignement, {justifyContent: 'center'}]}>
<Pressable>
<Image source={brochette} style={{ width: 40, height: 40 }} />
<Image source={meat} style={{ width: 30, height: 30 }} />
</Pressable>
<Pressable>
<Image source={brochette} style={{ width: 40, height: 40 }} />
<Image source={vegetable} style={{ width: 30, height: 30 }} />
</Pressable>
<Pressable>
<Image source={brochette} style={{ width: 40, height: 40 }} />
</Pressable>
<Pressable>
<Image source={brochette} style={{ width: 40, height: 40 }} />
<Image source={fruit} style={{ width: 30, height: 30 }} />
</Pressable>
</View>
<View>
@ -49,45 +71,15 @@ export default function IngredientSelection() {
</View>
<View style={{ flex: 1}} >
<ScrollView contentContainerStyle={{ alignItems: 'center', height: 300}}>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
{props.listIngredient.map((source, index) => (
<AvailaibleItem key={index} value={source}></AvailaibleItem>
))}
</ScrollView>
</View>
<View style={{ height: 20 }}></View>
</View>
<View style={[styles.element, {marginTop: 40}]}>
<View style={[styles.horizontalAlignement, {justifyContent: "flex-start", marginLeft: 10}]}>
<Text style={{fontSize: 20, color: '#ACA279'}}>Available</Text>
</View>
@ -96,23 +88,9 @@ export default function IngredientSelection() {
<View style={{ flex: 1}} >
<ScrollView contentContainerStyle={{ alignItems: 'center', height: 150}}>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
<View style={styles.horizontalAlignement}>
<FoodElementText title="test" />
<Image source={brochette} style={{ width: 20, height: 20 }} />
</View>
<View style={{ height: 30 }}></View>
{props.listIngredient.map((source, index) => (
<ChooseItem key={index} value={source}></ChooseItem>
))}
</ScrollView>
</View>
<View style={{ height: 20 }}></View>

Loading…
Cancel
Save