import React, { useState } from "react"; import { connect } from "react-redux"; import { blog, book, user, userProduct, publicApi } from "../../redux/actions"; import AsyncStorage from "@react-native-async-storage/async-storage"; import { useNavigation } from "@react-navigation/native"; import { copilot, walkthroughable, CopilotStep } from "react-native-copilot"; 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, bottomNavigation, setFirstLogin, firstLogin, ...props }) => { const navigation = useNavigation(); const [position, setPosition] = useState("100%"); const setBoxPosition = () => { LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); setPosition(position === "100%" ? "0%" : "100%"); }; const getFirstLogin = React.useCallback(async () => { const firstLoginFlag = await AsyncStorage.getItem("firstLogin"); if (!firstLoginFlag) { AsyncStorage.setItem('firstLogin', JSON.stringify(true)); setTimeout(() => { props.start(); }, 800); } }, [firstLogin]); React.useEffect(() => { if (!blogs) { getBlogs(); } if (!books) { getBooks({ vod: true }); } if (!userProducts) { getUserProducts(); } getFirstLogin(); }, []); return ( {!mobile ? : null} {books?.length ? (
) : null} {bottomNavigation.vod.isActive ? : null} ); }; // 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, bottomNavigation: state.config.bottomNavigation, firstLogin: state.publicApi.firstLogin, }); const mapDispatchToProps = { getBlogs: blog.list, getBooks: book.list, getUserProducts: userProduct.list, setFirstLogin: publicApi.setFirstLogin, }; const component = copilot({ labels: { previous: "قبلی", next: "بعدی", skip: "رد کردن", finish: "پایان", }, })(Home); export default connect(mapStateToProps, mapDispatchToProps)(component);