diff --git a/navigation/index.js b/navigation/index.js index c3d012a..99c29d8 100644 --- a/navigation/index.js +++ b/navigation/index.js @@ -20,6 +20,7 @@ import Profile from "../src/screens/Profile"; import Videos from "../src/screens/Videos"; import Exams from "../src/screens/Exams"; import ShoppingCart from "../src/screens/ShoppingCart"; +import Video from "../src/screens/Video"; const width = Dimensions.get("window").width; @@ -140,6 +141,7 @@ const VODStackScreen = () => { screenOptions={{ headerShown: false }} > + diff --git a/src/redux/proxy.js b/src/redux/proxy.js index 962faee..2c79aa9 100644 --- a/src/redux/proxy.js +++ b/src/redux/proxy.js @@ -150,10 +150,10 @@ class Proxy { console.log("proxy logout error : ", error); } }; - status = () => { + status = async () => { try { - let refresh = AsyncStorage.getItem("refresh"); - let userData = AsyncStorage.getItem("userData"); + let refresh = await AsyncStorage.getItem("refresh"); + let userData = await AsyncStorage.getItem("userData"); if (!refresh) return false; if (refresh == "undefined") { const keys = ["refresh", "access", "userData"]; diff --git a/src/redux/reducers/user.js b/src/redux/reducers/user.js index a0b8d2c..65e57fd 100644 --- a/src/redux/reducers/user.js +++ b/src/redux/reducers/user.js @@ -1,8 +1,13 @@ import proxy from "../proxy"; import AsyncStorage from "@react-native-async-storage/async-storage"; +const checkStatus = async () => { + let status = await proxy.status(); + return status; +} + let initialState = { - status: proxy.status(), + status: checkStatus(), loading: false, error: null, list: null, diff --git a/src/screens/Home/index.js b/src/screens/Home/index.js index 4a40873..37fe67c 100644 --- a/src/screens/Home/index.js +++ b/src/screens/Home/index.js @@ -1,5 +1,5 @@ -import React, { useState } from "react"; -import { useTranslation } from "react-i18next"; +import React, { useState, useEffect } from "react"; +import { connect } from "react-redux"; import { View, StyleSheet, @@ -21,7 +21,7 @@ import Drawer from "../../components/Drawer"; // import { SafeAreaView } from 'react-native-safe-area-context'; // Within your render function -function Home(props) { +const Home = ({ isLogin }) => { const [position, setPosition] = useState("100%"); const setBoxPosition = () => { @@ -49,7 +49,7 @@ function Home(props) { ); -} +}; // Later on in your styles.. const styles = StyleSheet.create({ @@ -65,4 +65,10 @@ const styles = StyleSheet.create({ }, }); -export default Home; +const mapStateToProps = (state) => ({ + isLogin: state.user.status, +}); + +const mapDispatchToProps = {}; + +export default connect(mapStateToProps, mapDispatchToProps)(Home); diff --git a/src/screens/Splash/index.js b/src/screens/Splash/index.js index cefa2de..3330f7b 100644 --- a/src/screens/Splash/index.js +++ b/src/screens/Splash/index.js @@ -5,8 +5,7 @@ import Logo from "../../assets/images/logo.png"; const { width, height } = Dimensions.get("window"); -function Splash({ navigation, isLogin, loading}) { - +function Splash({ navigation, isLogin}) { useEffect(() => { setTimeout(() => { !isLogin @@ -33,7 +32,6 @@ function Splash({ navigation, isLogin, loading}) { const mapStateToProps = (state) => ({ isLogin: state.user.status, - loading : state.userProduct.loading, }); const mapDispatchToProps = {}; diff --git a/src/screens/Video/assets/arrowMore.png b/src/screens/Video/assets/arrowMore.png new file mode 100644 index 0000000..a9c0cf6 Binary files /dev/null and b/src/screens/Video/assets/arrowMore.png differ diff --git a/src/screens/Video/assets/poster.png b/src/screens/Video/assets/poster.png new file mode 100644 index 0000000..b5b5588 Binary files /dev/null and b/src/screens/Video/assets/poster.png differ diff --git a/src/screens/Video/assets/user.png b/src/screens/Video/assets/user.png new file mode 100644 index 0000000..ccf1e39 Binary files /dev/null and b/src/screens/Video/assets/user.png differ diff --git a/src/screens/Video/components/Season.js b/src/screens/Video/components/Season.js new file mode 100644 index 0000000..b8593ba --- /dev/null +++ b/src/screens/Video/components/Season.js @@ -0,0 +1,148 @@ +import React, { useState } from "react"; +import { + View, + Text, + Dimensions, + Pressable, + TouchableOpacity, +} from "react-native"; +import tw from "tailwind-rn"; +import Colors from "../../../constants/Colors"; +const { width, height } = Dimensions.get("window"); + +const Season = ({ season }) => { + const [activeSeason, setActiveSeason] = useState(null); + const Unit = ({ unit }) => { + return ( + + + + {unit.name} + + + {unit.duration} + + + + {unit.play && ( + + + نمایش + + + )} + {unit.download && ( + + + دانلود + + + )} + + + ); + }; + return ( + + + setActiveSeason(season.name === activeSeason ? null : season.name) + } + > + + {season.name} + + + {season.duration} + + + + {season.name === activeSeason && + season.units.map((unit, index) => )} + + ); +}; + +export default Season; diff --git a/src/screens/Video/index.js b/src/screens/Video/index.js new file mode 100644 index 0000000..95539cf --- /dev/null +++ b/src/screens/Video/index.js @@ -0,0 +1,157 @@ +import React, { useState } from "react"; +import { + View, + StyleSheet, + Dimensions, + ScrollView, + SafeAreaView, + StatusBar, + LayoutAnimation, + Image, + Text, +} from "react-native"; +import { connect } from "react-redux"; +import userImage from "./assets/user.png"; +import poster from "./assets/poster.png"; +import Navbar from "../../components/Navbar"; +import Drawer from "../../components/Drawer"; +import Divider from "../../components/Divider"; +import Season from "./components/Season"; +import tw from "tailwind-rn"; + +const { height, width } = Dimensions.get("window"); + +function Product({ + product = { + type: "کتاب ها", + name: "ریاضی", + price: "145.000 تومان", + imageUrl: "https://dnvn.ir/api/v1/file/2105", + poster: poster, + grade: "پایه هفتم ابتدایی", + seasons: [ + { + name: "فصل اول: مباحث جوشش مواد مذاب در مرکز زمین", + duration: "2:30:13", + units: [ + { + name: "مقدمه جالب توجه نویسنده کتاب برای شما", + duration: "14:30", + download: true, + play: true, + }, + { + name: "چگونگی ساخت نیروگاه‌های برقی ", + duration: "14:30", + download: false, + play: true, + }, + { + name: "آیا گوگل از ما دزدی می‌کند ؟", + duration: "14:30", + download: true, + play: true, + }, + ], + }, + ], + }, +}) { + const [position, setPosition] = useState("100%"); + + const setBoxPosition = () => { + LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); + setPosition(position === "100%" ? "0%" : "100%"); + }; + return ( + + + + + + + + + + + + + + {product.name} + + + {product.grade} + + + + + + + { + product.seasons.map((season, index) => ) + } + + + + ); +} + +const styles = StyleSheet.create({ + contentContainerStyle: { + paddingBottom: 100, + }, + container: { + width: Dimensions.get("window").width, + backgroundColor: "white", + flexDirection: "column", + paddingVertical: 5, + paddingHorizontal: 16, + }, +}); +export default Product; diff --git a/src/screens/Videos/components/MostViewedVideo.js b/src/screens/Videos/components/MostViewedVideo.js index 31d922c..09dc32a 100644 --- a/src/screens/Videos/components/MostViewedVideo.js +++ b/src/screens/Videos/components/MostViewedVideo.js @@ -19,7 +19,7 @@ function MostViewedVideo({}) { }, tw("flex flex-col items-end rounded-md ml-4"), ]} - onPress={() => navigation.navigate("Product")} + onPress={() => navigation.navigate("Video")} > { }, tw("flex flex-col items-end mb-4"), ]} - onPress={() => navigation.navigate("Product")} + onPress={() => navigation.navigate("Video")} >