You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

125 lines
3.0 KiB

import React, { useState } from "react";
import { connect } from "react-redux";
import { blog, book, userProduct } from "../../redux/actions";
import {useNavigation} from "@react-navigation/native";
import {
View,
StyleSheet,
ScrollView,
SafeAreaView,
Platform,
StatusBar,
LayoutAnimation,
Dimensions,
} from "react-native";
//components
import Navbar from "../../components/Navbar";
import Scroll from "./components/Scroll";
import MyBooks from "./components/MyBooks";
import Videos from "./components/Videos";
import Blogs from "./components/Blogs";
import Drawer from "../../components/Drawer";
import Header from "./components/Header";
//style
import tw from "tailwind-rn";
const { width, height } = Dimensions.get("window");
const Home = ({
route,
blogs,
books,
userProducts,
mobile,
getBlogs,
getBooks,
getUserProducts,
}) => {
const navigation = useNavigation();
const [position, setPosition] = useState("100%");
const setBoxPosition = () => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
setPosition(position === "100%" ? "0%" : "100%");
};
React.useEffect(() => {
if (blogs.length === 0) {
getBlogs();
} else if (books.length === 0) {
getBooks({ vod: true });
} else if (userProducts.length === 0) {
getUserProducts();
}
}, [books, userProducts, blogs]);
return (
<SafeAreaView style={styles.safeStyle}>
<Navbar
setBoxPosition={setBoxPosition}
headerOptions={{
logo: true,
menu: false,
hamburgerMenu: true,
title: "",
bookmark: false,
qr: true,
back: false,
}}
/>
<Drawer setBoxPosition={setBoxPosition} position={position} />
<ScrollView
contentContainerStyle={styles.contentContainerStyle}
style={[styles.container]}
>
{!mobile ? <View style={tw("mt-5")}></View> : null}
<MyBooks books={userProducts} />
{books.length ? (
<View style={tw("px-4 w-full")}>
<Header title={"فروشگاه"} route={"Products"} />
</View>
) : null}
<Scroll books={books} />
{/* <Videos videos={books} /> */}
<Blogs blogs={blogs} />
</ScrollView>
</SafeAreaView>
);
};
// Later on in your styles..
const styles = StyleSheet.create({
safeStyle: {
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
flex: 1,
},
contentContainerStyle: {
paddingBottom: height / 10,
// flex : 1,
// alignItems: "",
},
container: {
flexDirection: "column",
paddingVertical: 0,
paddingHorizontal: 0,
},
});
const mapStateToProps = (state) => ({
blogs: state.blog.list,
books: state.book.list,
userProducts: state.userProduct.list,
mobile: state.publicApi.isMobile,
});
const mapDispatchToProps = {
getBlogs: blog.list,
getBooks: book.list,
getUserProducts: userProduct.list,
};
export default connect(mapStateToProps, mapDispatchToProps)(Home);