119 lines
3.8 KiB
JavaScript
119 lines
3.8 KiB
JavaScript
import React from "react";
|
|
import {
|
|
FlatList,
|
|
Image,
|
|
ScrollView,
|
|
StyleSheet,
|
|
Text,
|
|
TouchableOpacity,
|
|
View,
|
|
} from "react-native";
|
|
import MasonryList from "@react-native-seoul/masonry-list";
|
|
import { useNavigation } from "@react-navigation/native";
|
|
|
|
const TopShops = ({ vendors }) => {
|
|
const navigation = useNavigation();
|
|
|
|
const cat = [
|
|
"https://i.pinimg.com/564x/ca/8c/34/ca8c34e10eb890c49c3b6887064be2d8.jpg",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-00-222-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-03-056-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-01-689-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-02-255-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-06-540-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-05-217-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-08-59-121-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/04/Ship-building-Logistics-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/04/Aggregates-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/03/viber_image_2022-03-30_15-09-01-102-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/04/Travel-Tours-150x150.png",
|
|
"https://obanana.com/wp-content/uploads/2022/08/health-vector-150x150.png",
|
|
];
|
|
return (
|
|
<View style={styles.container}>
|
|
<Text style={styles.header}> TOP SHOPS</Text>
|
|
<View style={{ flexDirection: "row", marginTop: 15 }}>
|
|
<MasonryList
|
|
horizontal
|
|
data={vendors ? vendors.slice(-9, -1) : []}
|
|
showsHorizontalScrollIndicator={false}
|
|
renderItem={({ item, i }) => {
|
|
return (
|
|
<TouchableOpacity
|
|
key={i}
|
|
onPress={() => navigation.navigate("Shop", { product: item })}
|
|
>
|
|
<View style={styles.addUser}>
|
|
<Image
|
|
style={styles.img}
|
|
source={{
|
|
uri: item.vendor_image
|
|
? item.vendor_image
|
|
: "https://wkdonlinedogtraining.com/wp-content/themes/wkd-wp/build/images/bg-no-img-big.jpg",
|
|
}}
|
|
/>
|
|
<Text
|
|
style={{
|
|
color: "#000",
|
|
fontSize: 13,
|
|
fontWeight: "600",
|
|
textTransform: "uppercase",
|
|
textAlign: "center",
|
|
// flexWrap: "wrap",
|
|
}}
|
|
numberOfLines={2}
|
|
>
|
|
{item.user_login}
|
|
</Text>
|
|
</View>
|
|
</TouchableOpacity>
|
|
);
|
|
}}
|
|
/>
|
|
</View>
|
|
</View>
|
|
);
|
|
};
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
// flex: 1,
|
|
backgroundColor: "#fff",
|
|
// alignItems: "center",
|
|
// justifyContent: "center",
|
|
width: "100%",
|
|
// marginHorizontal: 10,
|
|
padding: 10,
|
|
// marginTop:25
|
|
// height: "87%",
|
|
},
|
|
addUser: {
|
|
height: 150,
|
|
width: 150,
|
|
// justifyContent: "center",
|
|
alignItems: "center",
|
|
borderWidth: 1,
|
|
borderColor: "#eee",
|
|
margin: 5,
|
|
padding: 5,
|
|
},
|
|
wrapper: {
|
|
width: "100%",
|
|
height: 250,
|
|
// backgroundColor: "#ffaa00",
|
|
},
|
|
header: {
|
|
fontSize: 14,
|
|
fontWeight: "700",
|
|
textTransform: "uppercase",
|
|
},
|
|
img: {
|
|
width: 80,
|
|
height: 80,
|
|
resizeMode: "cover",
|
|
borderRadius: 10,
|
|
marginVertical: 10,
|
|
// backgroundColor: "#ffaa00",
|
|
},
|
|
});
|
|
export default TopShops;
|