enh
This commit is contained in:
parent
72475f7f71
commit
bbf5d1657b
2 changed files with 22 additions and 34 deletions
|
|
@ -70,24 +70,6 @@ export default function SearchResults() {
|
||||||
// Search is now automatic via debounce, but keep this for manual submit
|
// Search is now automatic via debounce, but keep this for manual submit
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
if (isLoading) {
|
|
||||||
return (
|
|
||||||
<View style={tw`flex-1 justify-center items-center bg-gray-50`}>
|
|
||||||
<MyText style={tw`text-gray-500 font-medium`}>Loading products...</MyText>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
return (
|
|
||||||
<View style={tw`flex-1 justify-center items-center bg-gray-50`}>
|
|
||||||
<MaterialIcons name="error-outline" size={48} color="#EF4444" />
|
|
||||||
<MyText style={tw`text-gray-900 text-lg font-bold mt-4`}>Oops!</MyText>
|
|
||||||
<MyText style={tw`text-gray-500 mt-2`}>Failed to load products</MyText>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={tw`flex-1 bg-gray-50`}>
|
<View style={tw`flex-1 bg-gray-50`}>
|
||||||
<MyFlatList
|
<MyFlatList
|
||||||
|
|
@ -108,17 +90,23 @@ export default function SearchResults() {
|
||||||
columnWrapperStyle={{ gap: 16, justifyContent: "center" }}
|
columnWrapperStyle={{ gap: 16, justifyContent: "center" }}
|
||||||
contentContainerStyle={[tw`pb-24`, { gap: 16 }]}
|
contentContainerStyle={[tw`pb-24`, { gap: 16 }]}
|
||||||
ListEmptyComponent={
|
ListEmptyComponent={
|
||||||
<View style={tw`flex-1 justify-center items-center py-12 px-4`}>
|
isLoading ? (
|
||||||
<MaterialIcons name="search-off" size={64} color="#e5e7eb" />
|
<View style={tw`flex-1 justify-center items-center py-12 px-4`}>
|
||||||
<MyText style={tw`text-gray-500 mt-4 text-center text-lg font-medium`}>
|
<MyText style={tw`text-gray-500 font-medium`}>Loading products...</MyText>
|
||||||
No products found
|
</View>
|
||||||
</MyText>
|
) : (
|
||||||
{debouncedQuery && (
|
<View style={tw`flex-1 justify-center items-center py-12 px-4`}>
|
||||||
<MyText style={tw`text-gray-400 mt-2 text-center`}>
|
<MaterialIcons name="search-off" size={64} color="#e5e7eb" />
|
||||||
Try adjusting your search for "{debouncedQuery}"
|
<MyText style={tw`text-gray-500 mt-4 text-center text-lg font-medium`}>
|
||||||
|
No products found
|
||||||
</MyText>
|
</MyText>
|
||||||
)}
|
{debouncedQuery && (
|
||||||
</View>
|
<MyText style={tw`text-gray-400 mt-2 text-center`}>
|
||||||
|
Try adjusting your search for "{debouncedQuery}"
|
||||||
|
</MyText>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
ListHeaderComponent={
|
ListHeaderComponent={
|
||||||
<View style={tw`pt-4 pb-2 px-4`}>
|
<View style={tw`pt-4 pb-2 px-4`}>
|
||||||
|
|
|
||||||
|
|
@ -330,26 +330,26 @@ const ProductDetail: React.FC<ProductDetailProps> = ({ productId, isFlashDeliver
|
||||||
{isFlashDelivery ? (
|
{isFlashDelivery ? (
|
||||||
<MyTouchableOpacity
|
<MyTouchableOpacity
|
||||||
style={[tw`flex-1 py-3.5 rounded-xl items-center shadow-md`, {
|
style={[tw`flex-1 py-3.5 rounded-xl items-center shadow-md`, {
|
||||||
backgroundColor: (productDetail.isOutOfStock || !productDetail.isFlashAvailable) ? '#9ca3af' : theme.colors.brand500
|
backgroundColor: (productDetail.isOutOfStock || !productDetail.isFlashAvailable) ? '#9ca3af' : '#FDF2F8'
|
||||||
}]}
|
}]}
|
||||||
onPress={() => !(productDetail.isOutOfStock || !productDetail.isFlashAvailable) && handleBuyNow(productDetail.id)}
|
onPress={() => !(productDetail.isOutOfStock || !productDetail.isFlashAvailable) && handleBuyNow(productDetail.id)}
|
||||||
disabled={productDetail.isOutOfStock || !productDetail.isFlashAvailable}
|
disabled={productDetail.isOutOfStock || !productDetail.isFlashAvailable}
|
||||||
>
|
>
|
||||||
<MyText style={tw`text-white text-base font-bold`}>
|
<MyText style={tw`text-base font-bold ${productDetail.isOutOfStock || !productDetail.isFlashAvailable ? 'text-gray-400' : 'text-pink-600'}`}>
|
||||||
{productDetail.isOutOfStock ? 'Out of Stock' :
|
{productDetail.isOutOfStock ? 'Out of Stock' :
|
||||||
(!productDetail.isFlashAvailable ? 'Not Flash Eligible' : 'Buy Now')}
|
(!productDetail.isFlashAvailable ? 'Not Flash Eligible' : 'Get in 1 Hour')}
|
||||||
</MyText>
|
</MyText>
|
||||||
</MyTouchableOpacity>
|
</MyTouchableOpacity>
|
||||||
) : productDetail.isFlashAvailable ? (
|
) : productDetail.isFlashAvailable ? (
|
||||||
<MyTouchableOpacity
|
<MyTouchableOpacity
|
||||||
style={[tw`flex-1 py-3.5 rounded-xl items-center shadow-md`, {
|
style={[tw`flex-1 py-3.5 rounded-xl items-center shadow-md`, {
|
||||||
backgroundColor: productDetail.deliverySlots.length === 0 ? '#9ca3af' : theme.colors.brand500
|
backgroundColor: productDetail.deliverySlots.length === 0 ? '#9ca3af' : '#FDF2F8'
|
||||||
}]}
|
}]}
|
||||||
onPress={() => productDetail.deliverySlots.length > 0 && handleBuyNow(productDetail.id)}
|
onPress={() => productDetail.deliverySlots.length > 0 && handleBuyNow(productDetail.id)}
|
||||||
disabled={productDetail.deliverySlots.length === 0}
|
disabled={productDetail.deliverySlots.length === 0}
|
||||||
>
|
>
|
||||||
<MyText style={tw`text-white text-base font-bold`}>
|
<MyText style={tw`text-base font-bold ${productDetail.deliverySlots.length === 0 ? 'text-gray-400' : 'text-pink-600'}`}>
|
||||||
{productDetail.deliverySlots.length === 0 ? 'No Slots' : 'Buy Now'}
|
{productDetail.deliverySlots.length === 0 ? 'No Slots' : 'Get in 1 Hour'}
|
||||||
</MyText>
|
</MyText>
|
||||||
</MyTouchableOpacity>
|
</MyTouchableOpacity>
|
||||||
) : (
|
) : (
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue