Skip to content

Commit 1ce2bdc

Browse files
committed
2 parents 1f2355d + 560b304 commit 1ce2bdc

File tree

2 files changed

+60
-62
lines changed

2 files changed

+60
-62
lines changed

frontend/app/(menuItem)/[id].tsx

Lines changed: 53 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@ export default function Route() {
3333
navigation.setOptions({ headerShown: false });
3434
getMenuItemById(id).then((data) => {
3535
setMenuItem(data);
36-
setLoading(false);
3736
});
37+
new Promise((resolve) => setTimeout(resolve, 1500)).then(() => setLoading(false));
3838
}, [navigation]);
3939

4040
return (
@@ -47,67 +47,62 @@ export default function Route() {
4747
</Skeleton>
4848
<ThemedView style={styles.container}>
4949
<Skeleton show={loading} colorMode={"light"}>
50-
<ThemedView style={styles.headerContainer}>
51-
<View style={styles.titleRow}>
52-
<ThemedText style={styles.titleText} numberOfLines={1}>
53-
{menuItem?.name}
54-
</ThemedText>
55-
</View>
56-
<View style={styles.restaurantContainer}>
57-
<RestaurantIcon color={"#666"} width={20} height={20} />
58-
<TouchableOpacity
59-
onPress={() => {
60-
router.push(`/(restaurant)/${menuItem?.restaurantID}`);
61-
}}>
62-
<ThemedText style={styles.restaurantText}>
63-
{menuItem?.restaurantName || "Restaurant Name"}
50+
<ThemedView>
51+
<ThemedView style={styles.headerContainer}>
52+
<View style={styles.titleRow}>
53+
<ThemedText style={styles.titleText} numberOfLines={1}>
54+
{menuItem?.name}
6455
</ThemedText>
65-
</TouchableOpacity>
66-
</View>
67-
</ThemedView>
68-
</Skeleton>
69-
70-
<Skeleton show={loading} colorMode={"light"}>
71-
<ThemedView style={styles.tagsContainer}>
72-
<View style={styles.tagRow}>
73-
{menuItem?.tags.map((tag, index) => (
74-
<ThemedTag
75-
key={index}
76-
title={tag}
77-
backgroundColor={"#E8F5E9"}
78-
textColor={"#2E7D32"}
79-
/>
80-
))}
81-
</View>
82-
</ThemedView>
83-
</Skeleton>
56+
</View>
57+
<View style={styles.restaurantContainer}>
58+
<RestaurantIcon color={"#666"} width={20} height={20} />
59+
<TouchableOpacity
60+
onPress={() => {
61+
router.push(`/(restaurant)/${menuItem?.restaurantID}`);
62+
}}>
63+
<ThemedText style={styles.restaurantText}>
64+
{menuItem?.restaurantName || "Restaurant Name"}
65+
</ThemedText>
66+
</TouchableOpacity>
67+
</View>
68+
</ThemedView>
69+
<ThemedView style={styles.tagsContainer}>
70+
<View style={styles.tagRow}>
71+
{menuItem?.tags.map((tag, index) => (
72+
<ThemedTag
73+
key={index}
74+
title={tag}
75+
backgroundColor={"#E8F5E9"}
76+
textColor={"#2E7D32"}
77+
/>
78+
))}
79+
</View>
80+
</ThemedView>
8481

85-
<Skeleton show={loading} colorMode={"light"}>
86-
<ThemedView style={styles.descriptionContainer}>
87-
<ThemedText style={styles.descriptionText}>{menuItem?.description}</ThemedText>
88-
<View style={styles.allergyRow}>
89-
<View style={styles.allergyItemsContainer}>
90-
<ThemedText style={styles.allergyText} numberOfLines={1}>
91-
{menuItem?.dietaryRestrictions.join(", ") || "No known allergens."}
92-
</ThemedText>
82+
<ThemedView style={styles.descriptionContainer}>
83+
<ThemedText style={styles.descriptionText}>{menuItem?.description}</ThemedText>
84+
<View style={styles.allergyRow}>
85+
<View style={styles.allergyItemsContainer}>
86+
<ThemedText style={styles.allergyText} numberOfLines={1}>
87+
{menuItem?.dietaryRestrictions.join(", ") || "No known allergens."}
88+
</ThemedText>
89+
</View>
90+
<Pressable style={styles.allergyButton}>
91+
<ThemedText style={styles.viewAllText}>see allergens</ThemedText>
92+
</Pressable>
9393
</View>
94-
<Pressable style={styles.allergyButton}>
95-
<ThemedText style={styles.viewAllText}>see allergens</ThemedText>
96-
</Pressable>
97-
</View>
98-
</ThemedView>
99-
</Skeleton>
94+
</ThemedView>
10095

101-
<Skeleton show={loading} colorMode={"light"}>
102-
<ThemedView style={styles.sectionHeader}>
103-
<AddReviewButton onPress={() => setIsReviewModalVisible(true)} />
104-
<ReviewFlow
105-
isVisible={isReviewModalVisible}
106-
onClose={() => setIsReviewModalVisible(false)}
107-
restaurantId={menuItem?.restaurantID || ""}
108-
menuItemName={menuItem?.name || ""}
109-
dishImageUrl={menuItem?.picture || ""}
110-
/>
96+
<ThemedView style={styles.sectionHeader}>
97+
<AddReviewButton onPress={() => setIsReviewModalVisible(true)} />
98+
<ReviewFlow
99+
isVisible={isReviewModalVisible}
100+
onClose={() => setIsReviewModalVisible(false)}
101+
restaurantId={menuItem?.restaurantID || ""}
102+
menuItemName={menuItem?.name || ""}
103+
dishImageUrl={menuItem?.picture || ""}
104+
/>
105+
</ThemedView>
111106
</ThemedView>
112107
</Skeleton>
113108

frontend/app/(restaurant)/[id].tsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,14 @@ export default function Route() {
3030
}>();
3131

3232
const [restaurant, setRestaurant] = React.useState<TRestaurant | null>(null);
33+
const [loading, setLoading] = React.useState(true);
3334
const navigation = useNavigation();
3435

3536
useEffect(() => {
36-
getRestaurant(id).then((res) => {
37+
getRestaurant(id).then(async (res) => {
3738
setRestaurant(res);
3839
});
40+
new Promise((resolve) => setTimeout(resolve, 1500)).then(() => setLoading(false));
3941
navigation.setOptions({ headerShown: false });
4042
}, [navigation]);
4143

@@ -50,13 +52,13 @@ export default function Route() {
5052

5153
return (
5254
<ScrollView showsVerticalScrollIndicator={false}>
53-
<Skeleton show={restaurant == null} colorMode={"light"}>
55+
<Skeleton show={loading} colorMode={"light"}>
5456
<BannerAndAvatar
5557
bannerURL={"https://shorturl.at/zZdqT"}
56-
avatarURL={restaurant?.picture || "https://placehold.co/600x400/png?text=P"}
58+
avatarURL={"https://placehold.co/600x400/png?text=P"}
5759
/>
5860
</Skeleton>
59-
<Skeleton.Group show={restaurant == null}>
61+
<Skeleton.Group show={loading}>
6062
<ThemedView style={styles.container}>
6163
<Skeleton colorMode={"light"}>
6264
<ThemedView style={styles.headerContainer}>
@@ -179,6 +181,7 @@ const styles = StyleSheet.create({
179181
flexDirection: "row",
180182
justifyContent: "space-between",
181183
alignItems: "center",
184+
paddingTop: 4,
182185
},
183186
detailsContainer: {
184187
paddingVertical: 4,

0 commit comments

Comments
 (0)