reza added some feature

navigation/index.js

@@ -18,6 +18,7 @@ import Login from "../src/screens/Login";
 import Otp from "../src/screens/Otp";
 import Product from "../src/screens/Product";
 import QR from "../src/screens/QR";
+import QRContent from "../src/screens/QRContent";
 import Faq from "../src/screens/Faq";
 import Activation from "../src/screens/Activation";
 import { connect } from "react-redux";
@@ -112,6 +113,9 @@ const HomeStackScreen = () => {
       initialRouteName="Home"
     >
       <HomeStack.Screen name="Home" component={Home} />
+      <VODStack.Screen name="VOD" component={Videos} />
+      <ProductsStack.Screen name="Products" component={Products} />
+      <VODStack.Screen name="Video" component={Video} />
       <HomeStack.Screen name="Product" component={Product} />
     </HomeStack.Navigator>
   );
@@ -173,6 +177,7 @@ const Navigation = ({ getStatus, isLogin }) => {
         <Stack.Screen name="Order" component={OrderDetails} />
         <Stack.Screen name="Faq" component={Faq} />
         <Stack.Screen name="Activation" component={Activation} />
+        <Stack.Screen name="QRContent" component={QRContent} />
       </Stack.Navigator>
     </NavigationContainer>
   );

src/components/Drawer.js

@@ -9,7 +9,7 @@ import {
   TouchableOpacity,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
-import { Entypo, FontAwesome, Ionicons, AntDesign } from "@expo/vector-icons";
+import { Ionicons, AntDesign } from "@expo/vector-icons";
 import tw from "tailwind-rn";
 
 const width = Dimensions.get("window").width;
@@ -100,7 +100,7 @@ const Drawer = ({ position, setBoxPosition }) => {
     >
       <Pressable
         onPress={() => setBoxPosition()}
-        style={[tw(`w-1/5 h-full ${position === "0%" ? "" : ""}`)]}
+        style={[tw(`w-1/5 h-full ${position === "0%" ? "bg-black bg-opacity-40" : ""}`)]}
       ></Pressable>
       <View style={[tw("w-4/5 bg-white h-full flex flex-col px-4 pt-10")]}>
         {routes.map((route, index) => (

src/redux/actions/index.js

@@ -9,8 +9,4 @@ export { default as userProduct } from "./userProduct";
 export { default as content } from "./content";
 export { default as faq } from "./faq";
 export { default as file } from "./file";
-
+export { default as qr } from "./qr";
-
-
-
-

src/redux/actions/qr.js

@@ -0,0 +1,33 @@
+import proxy from "../proxy";
+
+const qr = {
+  list:
+    (data = {}) =>
+    async (dispatch) =>
+      await proxy.get("qr/list", data, { dispatch }),
+  info:
+    (data = {}) =>
+    async (dispatch) => {
+      await proxy.get("qr/info", data, { dispatch });
+    },
+  add:
+    (data = {}, data2 = {}) =>
+    async (dispatch) => {
+      await proxy.post("qr/add", data);
+      await proxy.get("qr/list", data2, { dispatch });
+    },
+  del:
+    (data = {}, data2 = {}) =>
+    async (dispatch) => {
+      await proxy.delete("ar/delete", data);
+      await proxy.get("ar/list", data2, { dispatch });
+    },
+  update:
+    (data = {}, data2 = {}) =>
+    async (dispatch) => {
+      await proxy.put("ar/update", data);
+      await proxy.get("ar/list", data2, { dispatch });
+    },
+};
+
+export default qr;

src/redux/reducers/index.js

@@ -8,3 +8,4 @@ export { default as faq } from "./faq";
 export { default as file } from "./file";
 export { default as userFactor } from "./userFactor";
 export { default as userProduct } from "./userProduct";
+import { default as qr } from "./qr";

src/redux/reducers/qr.js

@@ -0,0 +1,33 @@
+const initialState = {
+  loading: false,
+  error: null,
+  list: null,
+};
+
+export default function qr(state = initialState, action) {
+  let { type, data } = action;
+  switch (type) {
+    case "qr/list":
+      return { ...state, loading: false, error: null };
+    case "qr/update":
+      return { ...state, loading: false, error: null };
+    case "qr/add":
+      return { ...state, loading: false, error: null };
+    case "qr/delete":
+      return { ...state, loading: false, error: null };
+    case "qr/info":
+      return {
+        ...state,
+        loading: false,
+        list: data,
+        error: null,
+      };
+    /////////////
+    case "loading":
+      return { ...state, loading: true };
+    case "error":
+      return { ...state, loading: false, error: data.message };
+    default:
+      return state;
+  }
+}

src/redux/store.js

@@ -13,6 +13,7 @@ import faq from "./reducers/faq";
 import file from "./reducers/file";
 import userFactor from "./reducers/userFactor";
 import userProduct from "./reducers/userProduct";
+import qr from './reducers/qr';
 
 const persistConfig = {
   key: "root",
@@ -43,6 +44,7 @@ const store = createStore(
       file,
       userFactor,
       userProduct,
+      qr
     })
   ),
   initialState,

src/screens/Activation/index.js

@@ -53,6 +53,7 @@ function Activation({}) {
         position: "relative",
       }}
     >
+      <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={-142}>
         <Navbar
           setBoxPosition={setBoxPosition}
           headerOptions={{
@@ -78,7 +79,7 @@ function Activation({}) {
           <View
             style={[
               tw("flex flex-col justify-between items-center"),
-            { height: height - 140 },
+              { height: height - StatusBar.currentHeight - 70 },
             ]}
           >
             <View style={tw("flex flex-col w-full")}>
@@ -92,7 +93,7 @@ function Activation({}) {
                 <Image source={bookIcon} style={[{ width: 90, height: 90 }]} />
               </View>
             </View>
-          <KeyboardAvoidingView style={tw("w-full flex flex-col px-4")} enabled>
+            <View style={tw("w-full flex flex-col px-4")}>
               <TextInput
                 placeholder="کد فعال‌سازی"
                 placeholderTextColor="#70707070"
@@ -122,9 +123,10 @@ function Activation({}) {
                 border={{ color: "#196EC0", width: 0 }}
                 width={"100%"}
               />
-          </KeyboardAvoidingView>
+            </View>
           </View>
         </ScrollView>
+      </KeyboardAvoidingView>
     </SafeAreaView>
   );
 }

src/screens/Faq/components/Instance.js

@@ -1,59 +1,55 @@
-import React, {useState} from 'react';
+import { View, Text, Dimensions, TouchableOpacity } from "react-native";
-import {View, Text, Dimensions, Image, Pressable} from 'react-native';
+import { Entypo } from "@expo/vector-icons";
-import tw from 'tailwind-react-native-classnames';
+import tw from "tailwind-rn";
-import minusIcon from '../assets/-.png';
-import plusIcon from '../assets/+.png';
 
-const width = Dimensions.get('window').width;
+const { width } = Dimensions.get("window");
 
-function Instance(props) {
+function Instance({ question, selectFaq }) {
-  const [active, setActive] = useState(false);
   return (
-    <Pressable
+    <TouchableOpacity
-      onPress={() => setActive(!active)}
+      onPress={() => selectFaq(question.id)}
       style={[
-        tw.style('w-full flex flex-col my-1.5 rounded-md px-4 py-2'),
+        tw("w-full flex flex-col my-1.5 rounded-md px-4 py-2"),
         {
-          backgroundColor: !active ? '#F9F9F9' : '#F6F9FD',
+          backgroundColor: !question.active ? "#F9F9F9" : "#F6F9FD",
-          borderColor: !active ? '#DBDBDB' : '#196EC0',
+          borderColor: !question.active ? "#DBDBDB" : "#196EC0",
           borderWidth: 1,
         },
-      ]}>
+      ]}
-      <View
+    >
-        style={tw.style('flex flex-row-reverse justify-between items-center')}>
+      <View style={tw("flex flex-row-reverse justify-between items-center")}>
         <Text
           style={[
             {
-              width: '90%',
+              width: "90%",
-              textAlign: 'right',
+              textAlign: "right",
-              color: '#196EC0',
+              color: "#196EC0",
               fontSize: width / 34,
-              fontFamily: 'bold'
+              fontFamily: "bold",
             },
-          ]}>
+          ]}
-          نحوه خرید از سایت چگونه است ؟
+        >
+          {question.title}
         </Text>
-        <Image
+        {question.active ? (
-          source={!active ? plusIcon : minusIcon}
+          <Entypo name="minus" size={20} color="#196EC0" />
-          style={{width: 10, height: 20}}
+        ) : (
-        />
+          <Entypo name="plus" size={20} color="#196EC0" />
+        )}
       </View>
-      {active && (
+      {question.active && (
-        <View style={tw.style('w-full flex flex-row-reverse pt-2')}>
+        <View style={tw("w-full flex flex-row-reverse pt-2")}>
           <Text
             style={[
-              {color: '#196EC0', fontSize: width / 36, fontFamily: 'light'},
+              { color: "#196EC0", fontSize: width / 36, fontFamily: "light" },
-              tw.style('inline text-right flex-1'),
+              tw("text-right flex-1"),
-            ]}>
+            ]}
-            هر نفسی که فرو می‌ بریم، مرگی را که مدام به ما دستاندازی می‌کند پس
+          >
-            می‌زند... در نهایت این مرگ است که باید پیروز شود، زیرا از هنگام تولد
+            {question.description}
-            بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش، با آن
-            بازی می کند. با این همه، ما تا آنجا که ممکن است، با علاقه فراوان و
-            دلواپسی
           </Text>
         </View>
       )}
-    </Pressable>
+    </TouchableOpacity>
   );
 }
 

src/screens/Faq/index.js

@@ -1,16 +1,17 @@
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import {
   View,
   StyleSheet,
   Dimensions,
   ScrollView,
-  Text,
   SafeAreaView,
   Platform,
   StatusBar,
   LayoutAnimation,
 } from "react-native";
-import tw from "tailwind-react-native-classnames";
+import { connect } from "react-redux";
+import { faq } from "../../redux/actions";
+import tw from "tailwind-rn";
 import Header from "../../components/Header";
 import Navbar from "../../components/Navbar";
 import Drawer from "../../components/Drawer";
@@ -20,10 +21,13 @@ import bgFaq from "./assets/bgFaq.png";
 
 const width = Dimensions.get("window").width;
 
-function Faq(props) {
+function Faq({ list, getFaq, searchResult, search, selectFaq, searchFaq }) {
-  const [search, setSearch] = useState("");
   const [position, setPosition] = useState("100%");
 
+  useEffect(() => {
+    getFaq();
+  }, []);
+
   const setBoxPosition = () => {
     LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
     setPosition(position === "100%" ? "0%" : "100%");
@@ -36,6 +40,7 @@ function Faq(props) {
       style={{
         paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
         position: "relative",
+        backgroundColor: "white",
       }}
     >
       <Navbar
@@ -43,54 +48,55 @@ function Faq(props) {
         headerOptions={{
           logo: true,
           menu: false,
-          hamburgerMenu: true,
+          hamburgerMenu: false,
           title: "",
           bookmark: false,
           qr: true,
-          back: false,
+          back: true,
           backgroundColor: "#E9F0F7",
         }}
       />
       <Drawer setBoxPosition={setBoxPosition} position={position} />
-      <ScrollView
-        contentContainerStyle={styles.contentContainerStyle}
-        style={[tw.style("bg-white flex flex-col"), { width: width }]}
-      >
       <Header
         background={bgFaq}
         title={"پرسش‌های متداول"}
         description={"تیم پشتیبانی ما اینجاست تا شما رو کمک کنه"}
         // icon={}
       />
-        <View style={styles.container}>
+      <View style={tw("px-4 mb-4")}>
         <Search
           value={search}
-            onChange={setSearch}
+          onChange={searchFaq}
           placeholder={"بخشی از پرسش خود را اینجا بنویسید"}
         />
-          <View style={tw.style("mt-2 w-full")}></View>
-          {[0, 1, 2, 3, 4].map((item, index) => (
-            <Instance key={index} />
-          ))}
       </View>
+      <ScrollView
+        style={[tw("bg-white flex flex-col pb-20 px-4 mb-4"), { width: width }]}
+      >
+        {!search
+          ? list.length > 0 &&
+            list.map((item, index) => (
+              <Instance key={index} question={item} selectFaq={selectFaq} />
+            ))
+          : list.length > 0 &&
+            searchResult.map((item, index) => (
+              <Instance key={index} question={item} selectFaq={selectFaq} />
+            ))}
       </ScrollView>
     </SafeAreaView>
   );
 }
 
-// Later on in your styles..
+const mapStateToProps = (state) => ({
-const styles = StyleSheet.create({
+  list: state.faq.list,
-  contentContainerStyle: {
+  searchResult: state.faq.searchResult,
-    paddingBottom: 100,
+  search: state.faq.search,
-    alignItems: "flex-end",
-  },
-  container: {
-    width: Dimensions.get("window").width,
-    backgroundColor: "white",
-    flexDirection: "column",
-    paddingVertical: 0,
-    paddingHorizontal: 16,
-  },
 });
 
-export default Faq;
+const mapDispatchToProps = {
+  getFaq: faq.list,
+  selectFaq: faq.selectFaq,
+  searchFaq: faq.searchFaq,
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Faq);

src/screens/Home/components/MyBooks.js

@@ -1,4 +1,3 @@
-import React, { useState, useEffect } from "react";
 import {
   View,
   Text,

src/screens/Home/components/Scroll.js

@@ -55,7 +55,7 @@ const Product = ({ book, position }) => {
           height: position === 0 ? 245 : 118,
         },
       ]}
-      onPress={() => navigation.navigate('Product')}
+      onPress={() => navigation.navigate("Product", { id : book.id, type : 'book'})}
     >
       <Image
         source={{ uri: `https://dnvn.ir/api/v1/file/${book.fileIds}` }}

src/screens/Home/components/Videos.js

@@ -1,10 +1,5 @@
-import {
+import { View, Text, Image, TouchableOpacity, FlatList } from "react-native";
-  View,
+import { useNavigation } from "@react-navigation/native";
-  Text,
-  Image,
-  TouchableOpacity,
-  FlatList,
-} from "react-native";
 import tw from "tailwind-rn";
 import fontSize from "../../../constants/fontSize";
 import { connect } from "react-redux";
@@ -22,14 +17,14 @@ function Videos({ videos, grades }) {
           tw("w-full flex flex-col rounded-md pt-2 px-2  overflow-hidden"),
         ]}
       >
-        <Header title="دوره‌های ویدئویی شما" route={"Videos"} />
+        <Header title="دوره‌های ویدئویی شما" route={"VOD"} />
         <FlatList
           showsHorizontalScrollIndicator={false}
           style={[tw("py-3")]}
           horizontal={true}
           inverted={true}
           data={videos}
-          renderItem={({item}) => <Video video={item} grades={grades} />}
+          renderItem={({ item }) => <Video video={item} grades={grades} />}
           keyExtractor={(item) => item.id}
         />
       </View>
@@ -38,10 +33,14 @@ function Videos({ videos, grades }) {
 }
 
 const Video = ({ video, grades }) => {
+  const navigation = useNavigation();
   return (
-    <TouchableOpacity style={tw("flex flex-col ml-3")}>
+    <TouchableOpacity
+      style={tw("flex flex-col ml-3")}
+      onPress={() => navigation.navigate("Video", { id: video.id })}
+    >
       <Image
-        source={{uri : `https://dnvn.ir/api/v1/file/${video.fileIds}`}}
+        source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
         style={[
           tw("rounded-md"),
           {
@@ -71,14 +70,16 @@ const Video = ({ video, grades }) => {
             fontSize: fontSize.xs,
           },
         ]}
-      >{grades[video.gradeId]}</Text>
+      >
+        {grades[video.gradeId]}
+      </Text>
       <Progress percent={60} alignItems={"items-end"} />
     </TouchableOpacity>
   );
 };
 
 const mapStateToProps = (state) => ({
-  grades : state.publicApi.grades
+  grades: state.publicApi.grades,
 });
 
 export default connect(mapStateToProps, {})(Videos);

src/screens/Login/index.js

@@ -8,7 +8,6 @@ import {
   ActivityIndicator,
   Dimensions,
   TouchableHighlight,
-  KeyboardAvoidingView
 } from "react-native";
 import Logo from "./assets/logo.png";
 import CustomTextInput from "../../components/CustomTextInput";
@@ -17,7 +16,7 @@ import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
 import tw from "tailwind-rn";
 import {user} from '../../redux/actions';
 
-const { width, height } = Dimensions.get("window");
+const { width } = Dimensions.get("window");
 
 function Login(props) {
   const [phone, setPhone] = useState("");

src/screens/OrderDetails/components/Book.js

@@ -4,7 +4,6 @@ import tw from 'tailwind-react-native-classnames';
 import _ from 'lodash';
 
 const width = Dimensions.get('window').width;
-const height = Dimensions.get('window').height;
 
 export default function Book({book}) {
   return (

src/screens/OrdersFollowUp/components/Order.js

@@ -5,7 +5,6 @@ import {
   Dimensions,
   StyleSheet,
   Image,
-  Pressable,
   TouchableOpacity
 } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
@@ -15,7 +14,6 @@ import { AntDesign } from '@expo/vector-icons';
 import _ from 'lodash';
 
 const width = Dimensions.get('window').width;
-const height = Dimensions.get('window').height;
 
 const colors = {
   1: '#FFF700',
@@ -93,25 +91,7 @@ function Order({order}) {
                       ]}
                     />
                   ))}
-            {order.items.length >= 2 && (
+            
-              <View
-                style={[
-                  tw.style(
-                    'flex flex-row-reverse items-center justify-center relative rounded-md overflow-hidden',
-                  ),
-                  {
-                    width: 60,
-                    height: 90,
-                    backgroundColor: '#EBEBEB',
-                  },
-                ]}>
-                {/* <Image
-                  source={order.items[2]}
-                  style={[tw.style('absolute left-0 top-0 h-full w-full z-10')]}
-                /> */}
-                <AntDesign name="pluscircleo" size={24} color="gray" />
-              </View>
-            )}
           </View>
           <View style={[tw.style('')]}>
             <Text

src/screens/OrdersFollowUp/index.js

@@ -1,7 +1,5 @@
 import React, { useState } from "react";
 import {
-  View,
-  Text,
   Dimensions,
   StyleSheet,
   ScrollView,
@@ -13,10 +11,7 @@ import {
 import Order from "./components/Order";
 import Navbar from "../../components/Navbar";
 import Drawer from "../../components/Drawer";
-import { connect } from "react-redux";
 import b1Image from "./assets/b1.png";
-import b2Image from "./assets/b2.png";
-import b3Image from "./assets/b3.png";
 
 const width = Dimensions.get("window").width;
 
@@ -81,7 +76,7 @@ OrdersFollowUp.defaultProps = {
       number: "535353523653",
       receiveCode: "300031",
       status: 2,
-      items: [b1Image, b2Image, b3Image, b3Image],
+      items: [b1Image, b1Image, b1Image, b1Image],
       date: "1400/1/12",
       cost: "1.240.000",
     },
@@ -89,7 +84,7 @@ OrdersFollowUp.defaultProps = {
       number: "535353523653",
       receiveCode: "300031",
       status: 3,
-      items: [b1Image, b2Image, b3Image],
+      items: [b1Image, b1Image, b1Image],
       date: "1400/1/12",
       cost: "1.240.000",
     },
@@ -97,7 +92,7 @@ OrdersFollowUp.defaultProps = {
       number: "535353523653",
       receiveCode: "300031",
       status: 4,
-      items: [b1Image, b2Image, b3Image],
+      items: [b1Image, b1Image, b1Image],
       date: "1400/1/12",
       cost: "1.240.000",
     },

src/screens/Product/components/Book.js

@@ -3,7 +3,6 @@ import {
   View,
   Text,
   Image,
-  Dimensions,
   ScrollView,
   Pressable,
 } from "react-native";
@@ -18,9 +17,6 @@ import fontSize from "../../../constants/fontSize";
 import { product, userProduct } from "../../../redux/actions";
 import { connect } from "react-redux";
 
-const width = Dimensions.get("window").width;
-const height = Dimensions.get("window").height;
-
 function Book({ book, grades, pushToCart, userId }) {
   const [type, setType] = useState(1);
   return (

src/screens/Product/index.js

@@ -12,8 +12,6 @@ import Book from "./components/Book";
 import Video from "./components/Video";
 import { connect } from "react-redux";
 import {book} from "../../redux/actions";
-import userImage from "./assets/user.png";
-import poster from "./assets/poster.png";
 import Navbar from "../../components/Navbar";
 import Drawer from "../../components/Drawer";
 

src/screens/Products/components/Book.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { View, Image, Text, Dimensions, Pressable } from "react-native";
+import { Image, Text, Dimensions, Pressable } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import tw from "tailwind-react-native-classnames";
 import fontSize from '../../../constants/fontSize';

src/screens/Products/index.js

@@ -11,9 +11,8 @@ import {
 } from "react-native";
 import { connect } from "react-redux";
 import { book } from "../../redux/actions";
-import tw from "tailwind-react-native-classnames";
+import tw from "tailwind-rn";
 import Book from "./components/Book";
-import Video from "./components/Video";
 import Search from "../../components/Search";
 import Select from "../../components/Select";
 import Drawer from "../../components/Drawer";
@@ -25,7 +24,6 @@ function Products({ grades, productTypes, books }) {
   const [search, setSearch] = useState("");
 
   useEffect(() => {}, []);
-
   const setBoxPosition = () => {
     LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
     setPosition(position === "100%" ? "0%" : "100%");
@@ -39,10 +37,7 @@ function Products({ grades, productTypes, books }) {
       }}
     >
       <Drawer setBoxPosition={setBoxPosition} position={position} />
-      <ScrollView
+      <View style={tw("flex flex-col px-4 h-28 bg-white")}>
-        contentContainerStyle={styles.contentContainerStyle}
-        style={styles.container}
-      >
         <Search
           value={search}
           onChange={setSearch}
@@ -50,8 +45,7 @@ function Products({ grades, productTypes, books }) {
         />
         <View
           style={[
-            tw.style("flex flex-1 flex-row justify-between items-center"),
+            tw("flex flex-1 flex-row justify-between items-center my-2"),
-            { marginTop: 10, width: "100%" },
           ]}
         >
           <Select
@@ -69,9 +63,11 @@ function Products({ grades, productTypes, books }) {
             width={"48%"}
           />
         </View>
+      </View>
+      <ScrollView>
         <View
-          style={tw.style(
+          style={tw(
-            "flex flex-1 w-full py-5 flex-row flex-wrap justify-between bg-white"
+            "flex w-full px-4 flex-row flex-wrap justify-between bg-white"
           )}
         >
           {productType === "کتاب فیزیکی" &&
@@ -88,19 +84,6 @@ function Products({ grades, productTypes, books }) {
   );
 }
 
-const styles = StyleSheet.create({
-  contentContainerStyle: {
-    paddingBottom: 50,
-  },
-  container: {
-    width: Dimensions.get("window").width,
-    backgroundColor: "white",
-    flexDirection: "column",
-    paddingVertical: 0,
-    paddingHorizontal: 10,
-  },
-});
-
 const mapStateToProps = (state) => ({
   grades: state.publicApi.grades,
   books: state.book.list,

src/screens/QR/Scan/index.js

@@ -2,10 +2,10 @@ import React, { useState, useEffect } from "react";
 import {
   View,
   Text,
-  Image,
   TouchableOpacity,
   Dimensions,
   ImageBackground,
+  StatusBar
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import tw from "tailwind-rn";
@@ -31,7 +31,7 @@ export default function Scan({}) {
 
   const handleBarCodeScanned = ({ type, data }) => {
     setScanned(true);
-    alert(`Bar code with type ${type} and data ${data} has been scanned!`);
+    navigation.navigate("QRContent", {data});
   };
 
   if (hasPermission === null) {
@@ -45,26 +45,20 @@ export default function Scan({}) {
     <ImageBackground
       source={laptopImage}
       resizeMode="cover"
-      style={[tw("w-full"), { height: height }]}
+      style={[tw("w-full"), { height: height - StatusBar.currentHeight }]}
     >
       <View
         style={tw(
           "flex-1 flex flex-col justify-evenly items-center  bg-gray-800 bg-opacity-80"
         )}
       >
-        {/* <View style={{width : '100%', height : 300}}>
+        <View style={{ width: height / 2.5, height: height / 2.5 }}>
           <BarCodeScanner
             onBarCodeScanned={scanned ? undefined : handleBarCodeScanned}
-          style={{ width: "100%", height: '100%' }}
+            style={{ width: "100%", height: "100%" }}
           />
-      </View> */}
+        </View>
 
-        <View
-          style={[
-            { width: height / 2.5, height: height / 2.5 },
-            tw("bg-white rounded-2xl"),
-          ]}
-        ></View>
         {/* {scanned && ( */}
         <TouchableOpacity
           onPress={() => navigation.goBack()}

src/screens/QR/index.js

@@ -6,39 +6,21 @@ import {
   Dimensions,
   StatusBar,
 } from "react-native";
-import Content from "./Content";
 import Scan from "./Scan";
-import Navbar from "../../components/Navbar";
 
 const width = Dimensions.get("window").width;
-function QR({ page }) {
+function QR({  }) {
-  const [currentPage, setCurrentPage] = useState(page);
   return (
     <SafeAreaView
       style={{
         paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
       }}
     >
-      {currentPage === "content" && (
-        <Navbar
-          headerOptions={{
-            logo: false,
-            menu: true,
-            hamburgerMenu: false,
-            title: "",
-            bookmark: true,
-            qr: false,
-            back: true,
-          }}
-        />
-      )}
-
       <ScrollView
         contentContainerStyle={styles.contentContainerStyle}
         style={styles.container}
       >
-        {currentPage === "scan" && <Scan />}
+        <Scan />
-        {currentPage === "content" && <Content />}
       </ScrollView>
     </SafeAreaView>
   );
@@ -54,11 +36,7 @@ const styles = StyleSheet.create({
     width: Dimensions.get("window").width,
     backgroundColor: "white",
     flexDirection: "column",
-    paddingVertical: 5,
+    paddingVertical: 0,
     paddingHorizontal: 0,
   },
 });
-
-QR.defaultProps = {
-  page: "content",
-};

src/screens/QRContent/Content/PDF.js

@@ -1,6 +1,7 @@
 import React from "react";
 import { View, Text, Image, Dimensions } from "react-native";
 import tw from "tailwind-rn";
+
 import pdfIcon from "../../../assets/icons/pdf.png";
 
 const {width} = Dimensions.get("window");

src/screens/QRContent/Content/index.js

@@ -3,7 +3,8 @@ import { View, Text, Image, Dimensions } from "react-native";
 import tw from "tailwind-rn";
 import Tab from "../Tab";
 import Colors from "../../../constants/Colors";
-const { width, height } = Dimensions.get("window");
+
+const { width} = Dimensions.get("window");
 
 export default function Content({ data }) {
   return (

src/screens/QRContent/Tab/index.js

@@ -8,7 +8,7 @@ import PPT from "../Content/PPT";
 import PDF from "../Content/PDF";
 import Links from "../Content/Links";
 
-const { width, height } = Dimensions.get("window");
+const { width} = Dimensions.get("window");
 
 //assets
 

src/screens/QRContent/index.js

@@ -0,0 +1,70 @@
+import React, { useState,useEffect } from "react";
+import {
+  StyleSheet,
+  ScrollView,
+  SafeAreaView,
+  Dimensions,
+  StatusBar,
+} from "react-native";
+import { connect } from "react-redux";
+import {qr} from '../../redux/actions'
+import Content from "./Content";
+import Navbar from "../../components/Navbar";
+
+function QRContent({ route, getQrData, data  }) {
+  useEffect(() => {
+    getQrData({tail : 'zist10_14'});
+  },[]);
+
+  useEffect(() => {
+    console.log(data);
+  },[data]);
+  return (
+    <SafeAreaView
+      style={{
+        paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
+      }}
+    >
+      <Navbar
+        headerOptions={{
+          logo: false,
+          menu: true,
+          hamburgerMenu: false,
+          title: "",
+          bookmark: true,
+          qr: false,
+          back: true,
+        }}
+      />
+      <ScrollView
+        contentContainerStyle={styles.contentContainerStyle}
+        style={styles.container}
+      >
+        <Content />
+      </ScrollView>
+    </SafeAreaView>
+  );
+}
+
+const mapStateToProps = (state) => ({
+  data : state.qr.list
+});
+
+const mapDispatchToProps = {
+  getQrData : qr.info
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(QRContent);
+
+const styles = StyleSheet.create({
+  contentContainerStyle: {
+    paddingBottom: 0,
+  },
+  container: {
+    width: Dimensions.get("window").width,
+    backgroundColor: "white",
+    flexDirection: "column",
+    paddingVertical: 5,
+    paddingHorizontal: 0,
+  },
+});

src/screens/ShoppingCart/components/Code.js

@@ -10,6 +10,7 @@ import {
 import { connect } from "react-redux";
 import { userFactor } from "../../../redux/actions";
 import tw from "tailwind-react-native-classnames";
+
 const width = Dimensions.get("window").width;
 
 function Code({ codeId, setCodeId, userId, factorId }) {

src/screens/ShoppingCart/components/Product.js

@@ -4,11 +4,8 @@ import { connect } from "react-redux";
 import { userProduct } from "../../../redux/actions";
 import { AntDesign } from "@expo/vector-icons";
 import tw from "tailwind-react-native-classnames";
-import bookImage from "../assets/book.png";
-import deleteIcon from "../assets/delete.png";
 
 const width = Dimensions.get("window").width;
-const height = Dimensions.get("window").height;
 
 function Product({ product, grades, pushToCart }) {
   return (

src/screens/ShoppingCart/index.js

@@ -6,13 +6,12 @@ import {
   Dimensions,
   StyleSheet,
   Pressable,
-  Image,
   SafeAreaView,
   StatusBar,
   LayoutAnimation,
 } from "react-native";
 import { connect } from "react-redux";
-import { userProduct, userFactor, publicApi } from "../../redux/actions";
+import { userProduct, userFactor} from "../../redux/actions";
 import { Ionicons } from "@expo/vector-icons";
 import Product from "./components/Product";
 import Code from "./components/Code";

src/screens/Splash/index.js

@@ -1,9 +1,10 @@
 import React, { useEffect } from "react";
-import { View, Text, Image, ActivityIndicator, Dimensions } from "react-native";
+import { View, Image, ActivityIndicator, Dimensions } from "react-native";
 import { connect } from "react-redux";
+
 import Logo from "../../assets/images/logo.png";
 
-const { width, height } = Dimensions.get("window");
+const { width } = Dimensions.get("window");
 
 function Splash({ navigation, isLogin }) {
   useEffect(() => {

src/screens/Video/components/Season.js

@@ -1,8 +1,7 @@
-import React, { useState } from "react";
+import React from "react";
 import {
   View,
   Text,
-  Dimensions,
   Pressable,
   TouchableOpacity,
 } from "react-native";

src/screens/Video/index.js

@@ -19,7 +19,7 @@ import Season from "./components/Season";
 import tw from "tailwind-rn";
 import fontSize from '../../constants/fontSize';
 
-const { height, width } = Dimensions.get("window");
+const { height } = Dimensions.get("window");
 
 function Product({
   route,

src/screens/VideoDisplay/components/Season/index.js

@@ -1,11 +1,12 @@
-import React, { useState } from "react";
+import React from "react";
 import { View, Text, Dimensions, Pressable } from "react-native";
 import { connect } from "react-redux";
 import { publicApi } from "../../../../redux/actions";
 import tw from "tailwind-rn";
 import Colors from "../../../../constants/Colors";
 import { useNavigation } from "@react-navigation/native";
-const { width, height } = Dimensions.get("window");
+
+const { width} = Dimensions.get("window");
 
 const Season = ({ season, activeUnit, name }) => {
   const navigation = useNavigation();

src/screens/VideoDisplay/index.js

@@ -9,10 +9,9 @@ import {
   LayoutAnimation,
 } from "react-native";
 import { connect } from "react-redux";
-import { book, publicApi } from "../../redux/actions";
 import Navbar from "../../components/Navbar";
 import Drawer from "../../components/Drawer";
-import { Video, AVPlaybackStatus } from "expo-av";
+import { Video } from "expo-av";
 import tw from 'tailwind-rn';
 import * as ScreenOrientation from 'expo-screen-orientation';
 import Season from "./components/Season";

src/screens/Videos/components/NewestVideo.js

@@ -4,10 +4,9 @@ import { useNavigation } from "@react-navigation/native";
 import tw from "tailwind-rn";
 import fontSize from "../../../constants/fontSize";
 
-const { width, height } = Dimensions.get("window");
+const { width } = Dimensions.get("window");
 
 import Header from "../../Home/components/Header";
-import posterImage from "../../Products/assets/poster.png";
 
 const NewestVideo = ({ videos, grades }) => {
   const navigation = useNavigation();

src/screens/Videos/components/VerticalGradeFilter.js

@@ -1,6 +1,5 @@
 import React from "react";
 import { View, Text, FlatList, TouchableOpacity } from "react-native";
-import { connect } from "react-redux";
 import tw from "tailwind-rn";
 import fontSize from '../../../constants/fontSize';