reza fixed error before 18

navigation/index.js

@@ -352,6 +352,7 @@ const HomeStackScreen = () => {
       <HomeStack.Screen name="Home" component={Home} />
       <HomeStack.Screen name="VOD" component={Videos} />
       <HomeStack.Screen name="Video" component={Video} unmountOnExit={true} />
+      <HomeStack.Screen name="ShoppingCart" component={ShoppingCart} />
       <HomeStack.Screen name="VideoDisplay" component={VideoDisplay} />
       <HomeStack.Screen name="Products" component={Products} />
       <HomeStack.Screen name="Product" component={Product} />
@@ -375,6 +376,7 @@ const ProductsStackScreen = () => {
     >
       <ProductsStack.Screen name="Products" component={Products} />
       <ProductsStack.Screen name="Product" component={Product} />
+      <ProductsStack.Screen name="ShoppingCart" component={ShoppingCart} />
       <ProductsStack.Screen name="Sample" component={Sample} />
       <ProductsStack.Screen name="Info" component={Info} />
     </ProductsStack.Navigator>
@@ -392,6 +394,7 @@ const VODStackScreen = () => {
     >
       <VODStack.Screen name="VOD" component={Videos} />
       <VODStack.Screen name="Video" component={Video} unmountOnExit={true} />
+      <VODStack.Screen name="ShoppingCart" component={ShoppingCart} />
       <VODStack.Screen name="VideoDisplay" component={VideoDisplay} />
     </VODStack.Navigator>
   );

src/components/AlertModal.js

@@ -91,18 +91,31 @@ const AlertModal = props => {
       confirmButtonColor={alert.confirmButtonColor}
       onCancelPressed={onCancelPressed}
       onConfirmPressed={(onConfirmPressed)}
+      cancelButtonTextStyle={{
+        color : '#777',
+        fontFamily : 'regular',
+      }}
+      confirmButtonTextStyle={{
+        fontFamily : 'regular',
+
+      }}
       contentStyle={{
         width: ReactNative.Dimensions.get('window').width / 1.5,
       }}
       cancelButtonStyle={{
         fontFamily : 'regular',
+        borderColor : "#777",
+        borderWidth : 1,
+        backgroundColor : 'white',
       }}
       confirmButtonStyle={
         {
           width: ReactNative.Dimensions.get('window').width / 4,
           alignItems: 'center',
           justifyContent: 'center',
-          fontFamily : 'regular'
+          fontFamily : 'regular',
+          borderColor : "#2980b9",
+          borderWidth : 1,
         }
       }
       useNativeDriver={true}

src/components/Drawer.js

@@ -9,7 +9,6 @@ import {
   TouchableOpacity,
   Image,
   LayoutAnimation,
-  StatusBar,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import { asyncAwesomeAlert } from "../utils/AsyncWrappers";

src/components/Navbar.js

@@ -5,6 +5,7 @@ import {
   Text,
   Appearance,
   TouchableOpacity,
+  ActivityIndicator,
 } from "react-native";
 
 import Svg, {
@@ -36,6 +37,7 @@ const Navbar = ({
   deleteBookmark,
   userFavoriteList,
   theme,
+  bookmarkLoading,
 }) => {
   const navigation = useNavigation();
 
@@ -391,7 +393,9 @@ const Navbar = ({
           </>
         )}
         {headerOptions?.bookmark &&
-          (isActiveBookmark ? (
+          (bookmarkLoading ? (
+            <ActivityIndicator size={20} color={Color.theme1[theme].green79} />
+          ) : isActiveBookmark ? (
             <Ionicons
               name="bookmark"
               style={tw("mr-2")}
@@ -443,6 +447,7 @@ const Navbar = ({
 const mapStateToProps = (state) => ({
   userFavoriteList: state.userFavorite.list,
   theme: state.publicApi.theme,
+  bookmarkLoading: state.userFavorite.loading,
 });
 
 const mapDispatchToProps = {

src/redux/actions/userProduct.js

@@ -19,7 +19,6 @@ const userProduct = {
     (data = {}, data2 = {}, data3 = {}) =>
     async (dispatch) => {
       await proxy.post("userProduct/add", data, { dispatch });
-      await proxy.get("userProduct/list", data2, { dispatch });
       await proxy.get("userFactor/info", data3, { dispatch });
     },
   del:

src/redux/reducers/userFactor.js

@@ -58,6 +58,7 @@ export default function userFactor(state = initialState, action) {
     case "userFactor/error":
       asyncAwesomeAlert("خطا", data.message, {
         showCancelButton: false,
+        confirmText: "باشه"
       });
       return { ...state, loading: false, error: data.message };
     default:

src/redux/reducers/userProduct.js

@@ -23,6 +23,7 @@ export default function userFactor(state = initialState, action) {
         data.filter((item) => item.product.productType === 2).length > 0
           ? true
           : false;
+      console.log('list fetched!');
       return {
         ...state,
         loading: false,

src/screens/Home/components/Blogs.js

@@ -29,7 +29,7 @@ const ios = Platform.OS === "ios";
 
 function Blogs({ blogs, mobile, theme }) {
   return (
-    <View style={[tw("flex mb-5")]}>
+    <View style={[tw("flex")]}>
       <View style={tw("w-full px-4")}>
         <Header title={"خواندنی‌ها"} route={"Blogs"} />
       </View>
@@ -37,8 +37,8 @@ function Blogs({ blogs, mobile, theme }) {
         showsHorizontalScrollIndicator={false}
         horizontal={true}
         inverted={true}
-        style={[tw("flex flex-row mt-3 pb-7")]}
+        style={[tw("flex flex-row mt-3")]}
-        data={blogs.slice(0,7)}
+        data={blogs.slice(0, 7)}
         renderItem={({ item }) => (
           <Blog blog={item} mobile={mobile} theme={theme} />
         )}
@@ -51,11 +51,10 @@ function Blogs({ blogs, mobile, theme }) {
 
 const Blog = ({ blog, mobile, theme }) => {
   const navigation = useNavigation();
-
   return (
     <Pressable
       style={[
-        tw("rounded-md mr-4 rounded-md relative"),
+        tw("mr-4 relative"),
         { width: mobile ? 250 : width / 2.2 },
       ]}
       onPress={() => navigation.push("Blog", { id: blog?.id })}
@@ -64,7 +63,6 @@ const Blog = ({ blog, mobile, theme }) => {
         source={{ uri: `https://dnvn.ir/api/v1/file/${blog.fileIds}` }}
         resizeMode="contain"
         style={[
-          tw("rounded-md"),
           {
             flex: 1,
             height: mobile ? 180 : ((width / 2.2) * 9) / 16,

src/screens/Home/index.js

@@ -78,7 +78,7 @@ const Home = ({
 // Later on in your styles..
 const styles = StyleSheet.create({
   contentContainerStyle: {
-    paddingBottom: 40,
+    // paddingBottom: 40,
     // flex : 1,
     // alignItems: "",
   },

src/screens/Otp/index.js

@@ -118,7 +118,7 @@ function Otp(props) {
       let timeout = setTimeout(() => {
         clearInterval(interval);
         setTimeEnd(true);
-      }, 10000);
+      }, 120000);
       return () => {
         clearInterval(interval);
         clearTimeout(timeout);
@@ -132,10 +132,14 @@ function Otp(props) {
       const hour = Math.floor(value / 60);
       return (
         (hour > 0
-          ? (hour.toString().length === 1 ? "0" + hour.toString() : hour) + ""
+          ? (minute.toString().length === 1
+              ? "0" + minute.toString()
+              : minute) + ""
           : "") +
+        " " +
         ":" +
-        (minute.toString().length === 1 ? "0" + minute.toString() : minute)
+        " " +
+        (hour.toString().length === 1 ? "0" + hour.toString() : hour)
       );
     },
     [props.route]
@@ -345,7 +349,7 @@ function Otp(props) {
                 },
               ]}
             >
-              {"زمان باقی مانده تا ارسال مجدد: " + duration(time)}
+              {"زمان باقی مانده تا ارسال مجدد:" + " " + duration(time) + " "}
             </Text>
           ) : (
             <View style={tw("flex")}>

src/screens/Product/components/Book.js

@@ -44,6 +44,7 @@ function Book({
 }) {
   const navigation = useNavigation();
   const [type, setType] = useState(1);
+  const [whichTypeAdded, setWhichTypeAdded] = React.useState(null);
   const [pageLoading, setPageLoading] = useState(false);
   const [imageSlider, setImageSlider] = useState(false);
 
@@ -66,10 +67,54 @@ function Book({
     )[0];
   }, [userProducts, book]);
 
+  const videoAvailabileInCart = React.useMemo(() => {
+    return userProducts?.filter(
+      (product) => product?.productId === book?.product[2]?.id
+    )[0];
+  }, [userProducts, book]);
+
+  const addToCart = React.useCallback(
+    async (action, type) => {
+      setWhichTypeAdded(type);
+      await action();
+    },
+    [book, userId]
+  );
+
+  React.useEffect(() => {
+    if (userProducts.length && whichTypeAdded) {
+      setTimeout(() => {
+        if (whichTypeAdded === "video" && videoAvailabileInCart) {
+          asyncAwesomeAlert("", "به سبد خرید اضافه شد", {
+            showCancelButton: true,
+            onConfirm: () => navigation.push("ShoppingCart"),
+            confirmText: "مشاهده سبد خرید",
+            cancelText: "باشه",
+          });
+        } else if (whichTypeAdded === "physical" && physicalAvailabileInCart) {
+          asyncAwesomeAlert("", "به سبد خرید اضافه شد", {
+            showCancelButton: true,
+            onConfirm: () => navigation.push("ShoppingCart"),
+            confirmText: "مشاهده سبد خرید",
+            cancelText: "باشه",
+          });
+        } else if (whichTypeAdded === "digital" && digitalAvailabileInCart) {
+          asyncAwesomeAlert("", "به سبد خرید اضافه شد", {
+            showCancelButton: true,
+            onConfirm: () => navigation.push("ShoppingCart"),
+            confirmText: "مشاهده سبد خرید",
+            cancelText: "باشه",
+          });
+        }
+        setWhichTypeAdded(null);
+      }, 500);
+    }
+  }, [userProducts]);
+
   return (
     <ScrollView style={[tw("flex  flex-1 relative")]}>
       {!mobile && <View style={tw("mt-5")}></View>}
-      {(!book || userFavoriteLoading) && (
+      {(!book) && (
         <View
           style={[
             tw("absolute left-0 top-0 rounded-md overflow-hidden"),
@@ -221,17 +266,23 @@ function Book({
           onPress={() =>
             physicalAvailabileInCart
               ? asyncAwesomeAlert(
-                  "نتیجه",
+                  "",
-                  "این محصول قبلا به سبد خرید اضافه شده است.",
+                  "این محصول قبلا به سبد خرید شما اضافه شده است.",
                   {
-                    showCancelButton: false,
+                    showCancelButton: true,
+                    onConfirm: () => navigation.push("ShoppingCart"),
+                    confirmText: "مشاهده سبد خرید",
+                    cancelText: "باشه",
                   }
                 )
-              : pushToCart({
+              : addToCart(
-                  productId: book?.product[1]?.id,
+                  pushToCart({
-                  userId: userId,
+                    productId: book?.product[1]?.id,
-                  count: 1,
+                    userId: userId,
-                })
+                    count: 1,
+                  }),
+                  "physical"
+                )
           }
         >
           <>
@@ -278,17 +329,23 @@ function Book({
           onPress={() =>
             digitalAvailabileInCart
               ? asyncAwesomeAlert(
-                  "خطا",
+                  "",
-                  "این محصول قبلا به سبد خرید اضافه شده است.",
+                  "این محصول قبلا به سبد خرید شما اضافه شده است.",
                   {
-                    showCancelButton: false,
+                    showCancelButton: true,
+                    onConfirm: () => navigation.push("ShoppingCart"),
+                    confirmText: "مشاهده سبد خرید",
+                    cancelText: "باشه",
                   }
                 )
-              : pushToCart({
+              : addToCart(
-                  productId: book?.product[0]?.id,
+                  pushToCart({
-                  userId: userId,
+                    productId: book?.product[0]?.id,
-                  count: 1,
+                    userId: userId,
-                })
+                    count: 1,
+                  }),
+                  "digital"
+                )
           }
         >
           <>
@@ -356,11 +413,25 @@ function Book({
             },
           ]}
           onPress={() =>
-            pushToCart({
+            videoAvailabileInCart
-              productId: book?.product[2]?.id,
+              ? asyncAwesomeAlert(
-              userId: userId,
+                  "",
-              count: 1,
+                  "این محصول قبلا به سبد خرید شما اضافه شده است.",
-            })
+                  {
+                    showCancelButton: true,
+                    onConfirm: () => navigation.push("ShoppingCart"),
+                    confirmText: "مشاهده سبد خرید",
+                    cancelText: "باشه",
+                  }
+                )
+              : addToCart(
+                  pushToCart({
+                    productId: book?.product[2]?.id,
+                    userId: userId,
+                    count: 1,
+                  }),
+                  "video"
+                )
           }
         >
           <>

src/screens/Profile/components/User.js

@@ -133,7 +133,7 @@ const User = ({ user, mobile, theme, logout }) => {
             style={tw(`flex  w-full ${mobile ? "mt-0" : "mt-4"}`)}
             onPress={() =>
               asyncAwesomeAlert(
-                "نتیجه",
+                "",
                 "آیا قصد خروج از حساب کاربری فعلی رو داری؟",
                 {
                   showCancelButton: true,

src/screens/ShoppingCart/components/Code.js

@@ -5,6 +5,7 @@ import {
   Pressable,
   TextInput,
   KeyboardAvoidingView,
+  ActivityIndicator,
 } from "react-native";
 import { connect } from "react-redux";
 import { userFactor } from "../../../redux/actions";
@@ -14,13 +15,21 @@ import fontSize from "../../../constants/fontSize";
 import Colors from "../../../constants/Colors";
 import tw from "tailwind-rn";
 
-function Code({ codeId, setCodeId, userId, factorId, theme }) {
+function Code({ codeId, setCodeId, theme, loading }) {
   const [value, setValue] = React.useState(codeId || "");
+  const [requestFlag, setRequestFlag] = React.useState(false);
 
   const setOff = () => {
-    setCodeId({ offCodeValue: value, userId: userId, id: factorId });
+    setRequestFlag(true);
+    setCodeId({ offCodeValue: value });
   };
 
+  React.useEffect(() => {
+    if (!loading) {
+      setRequestFlag(false);
+    }
+  }, [loading]);
+
   return (
     <KeyboardAvoidingView
       enabled
@@ -33,13 +42,13 @@ function Code({ codeId, setCodeId, userId, factorId, theme }) {
         ]}
       >
         <TextInput
-          onChaneText={(text) => setValue(text)}
+          onChangeText={(text) => setValue(text)}
           style={[
             tw("border-0 flex-1 text-right pr-3"),
             { fontSize: fontSize.tiny, fontFamily: "regular" },
           ]}
           placeholder={"کد تخفیف دارید ؟"}
-          placeholderTextColor={Colors.theme1[theme].gray20 + 'aa'}
+          placeholderTextColor={Colors.theme1[theme].gray20 + "aa"}
         />
         <Pressable
           onPress={() => setOff()}
@@ -52,14 +61,22 @@ function Code({ codeId, setCodeId, userId, factorId, theme }) {
             },
           ]}
         >
-          <Text
+          {loading && requestFlag ? (
-            style={[
+            <ActivityIndicator
-              tw("text-white"),
+              size={fontSize.tiny}
-              { fontSize: fontSize.tiny, fontFamily: "bold" },
+              color={Colors.theme1[theme].white}
-            ]}
+              style={tw('px-2')}
-          >
+            />
-            ثبت کد
+          ) : (
-          </Text>
+            <Text
+              style={[
+                tw("text-white"),
+                { fontSize: fontSize.tiny, fontFamily: "bold" },
+              ]}
+            >
+              ثبت کد
+            </Text>
+          )}
         </Pressable>
       </View>
     </KeyboardAvoidingView>
@@ -68,9 +85,8 @@ function Code({ codeId, setCodeId, userId, factorId, theme }) {
 
 const mapStateToProps = (state) => ({
   codeId: state.userFactor.info?.codeId,
-  userId: state.user.status?.id,
+  loading: state.userFactor.loading,
-  factorId: state.userFactor.info?.id,
+  theme: state.publicApi.theme,
-  theme: state.publicApi.theme
 });
 
 const mapDispatchToProps = {

src/screens/ShoppingCart/components/Product.js

@@ -21,7 +21,7 @@ import tw from "tailwind-rn";
 const width = Dimensions.get("window").width;
 const ios = Platform.OS === "ios";
 
-function Product({ product, grades, pushToCart, loading, mobile, theme }) {
+function Product({ product, grades, pushToCart, loading, mobile, theme, addActionFlag, getList }) {
   const [selectedProduct, setSelectedProduct] = React.useState(null);
 
   const submit = async (action) => {
@@ -30,234 +30,241 @@ function Product({ product, grades, pushToCart, loading, mobile, theme }) {
   };
 
   React.useEffect(() => {
-    if(!loading){
+    if (!loading) {
       setSelectedProduct(null);
     }
-  },[loading]);
+  }, [loading]);
 
   return (
-    <View
+    product && (
-      style={[
+      <View
-        tw(
+        style={[
-          `flex justify-between py-2 ${ios ? "flex-row" : "flex-row-reverse"}`
+          tw(
-        ),
+            `flex justify-between py-2 ${ios ? "flex-row" : "flex-row-reverse"}`
-        {
+          ),
-          borderBottomWidth: 1,
+          {
-          borderColor: Colors.theme1[theme].grayE3,
+            borderBottomWidth: 1,
-          direction: "rtl",
+            borderColor: Colors.theme1[theme].grayE3,
-        },
+            direction: "rtl",
-      ]}
+          },
-    >
+        ]}
-      <View style={tw(`flex ${ios ? "flex-row" : "flex-row-reverse"}`)}>
+      >
-        <Image
+        <View style={tw(`flex ${ios ? "flex-row" : "flex-row-reverse"}`)}>
-          source={{
+          <Image
-            uri: "https://dnvn.ir/api/v1/file/" + product.product.book.fileIds,
+            source={{
-          }}
+              uri:
-          style={[
+                "https://dnvn.ir/api/v1/file/" + product.product.book.fileIds,
-            tw(""),
-            {
-              width: mobile ? width / 5 : width / 7,
-              height: ((mobile ? width / 5 : width / 7) * 4) / 2.8,
-            },
-          ]}
-        />
-        <View
-          style={tw(`flex   ${ios ? "items-start pl-3" : "items-end pr-2"}`)}
-        >
-          <Text
-            style={{
-              fontSize: mobile ? fontSize.lg : fontSize.xl4,
-              color: Colors.theme1[theme].green79,
-              marginBottom: 5,
-              fontFamily: "bold",
-            }}
-          >
-            {product?.product?.book?.name || " "}
-          </Text>
-          <Text
-            style={{
-              fontSize: mobile ? fontSize.sm : fontSize.lg,
-              color: Colors.theme1[theme].gray2077,
-              marginBottom: 3,
-              fontFamily: "regular",
-            }}
-          >
-            {"پایه" + " " + grades[product?.product?.book?.gradeId] || " "}
-          </Text>
-          <Text
-            style={{
-              fontSize: mobile ? fontSize.sm : fontSize.lg,
-              color: Colors.theme1[theme].gray2077,
-              fontFamily: "regular",
             }}
-          >
+            style={[
-            {product?.productType || 1 === 2 ? "نسخه فیزیکی" : "نسخه دیجیتال"}
+              tw(""),
-          </Text>
+              {
+                width: mobile ? width / 5 : width / 7,
+                height: ((mobile ? width / 5 : width / 7) * 4) / 2.8,
+              },
+            ]}
+          />
           <View
-            style={tw(
+            style={tw(`flex   ${ios ? "items-start pl-3" : "items-end pr-2"}`)}
-              `flex items-center justify-center mt-4 ${
-                ios ? "flex-row-reverse" : "flex-row"
-              }`
-            )}
           >
             <Text
-              style={[
+              style={{
-                {
+                fontSize: mobile ? fontSize.lg : fontSize.xl4,
-                  fontSize: mobile ? fontSize.xs : fontSize.tiny,
+                color: Colors.theme1[theme].green79,
-                  fontFamily: "regular",
+                marginBottom: 5,
-                },
+                fontFamily: "bold",
-              ]}
+              }}
             >
-              {" " + "تومان"}
+              {product.product.book.name || " "}
             </Text>
             <Text
-              style={[
+              style={{
-                {
+                fontSize: mobile ? fontSize.sm : fontSize.lg,
-                  fontSize: mobile ? fontSize.lg : fontSize.xl,
+                color: Colors.theme1[theme].gray2077,
-                  fontFamily: "regular",
+                marginBottom: 3,
-                },
+                fontFamily: "regular",
-              ]}
+              }}
             >
-              {separate(product?.product?.price) || " "}
+              {"پایه" + " " + grades[product.product.book.gradeId] || " "}
             </Text>
-          </View>
+            <Text
-        </View>
+              style={{
-      </View>
+                fontSize: mobile ? fontSize.sm : fontSize.lg,
-      <View
+                color: Colors.theme1[theme].gray2077,
-        style={tw(`flex  justify-between ${ios ? "items-end" : "items-start"}`)}
+                fontFamily: "regular",
-      >
+              }}
-        <AntDesign
+            >
-          name="close"
+              {product.productType || 1 === 2 ? "نسخه فیزیکی" : "نسخه دیجیتال"}
-          size={mobile ? 20 : 30}
+            </Text>
-          color={Colors.theme1[theme].redFF1}
+            <View
-          onPress={() =>
+              style={tw(
-            submit(
+                `flex items-center justify-center mt-4 ${
-              pushToCart(
+                  ios ? "flex-row-reverse" : "flex-row"
-                {
+                }`
-                  productId: product?.productId,
+              )}
-                  userId: product?.userId,
-                  count: product?.productType === 1 ? -1 : -product?.count,
-                },
-                {},
-                { id: product?.factorId }
-              )
-            )
-          }
-        />
-        <View style={tw("flex  items-center mt-2")}>
-          <View
-            style={tw(
-              `flex items-center mb-3 ${ios ? "flex-row" : "flex-row-reverse"}`
-            )}
-          >
-            <Pressable
-              onPress={() =>
-                submit(
-                  pushToCart({
-                    productId: product?.productId,
-                    userId: product?.userId,
-                    count: 1,
-                  })
-                )
-              }
-              style={[
-                tw(
-                  `rounded-md py-0 flex flex-row justify-center items-center border ${
-                    mobile ? "px-2" : "px-3"
-                  }`
-                ),
-                {
-                  borderColor: Colors.theme1[theme].greenCF,
-                },
-              ]}
             >
               <Text
-                style={{
+                style={[
-                  fontSize: mobile ? fontSize.xl : fontSize.xl4,
+                  {
-                  color: Colors.theme1[theme].greenCF,
+                    fontSize: mobile ? fontSize.xs : fontSize.tiny,
-                  fontFamily: "light",
+                    fontFamily: "regular",
-                }}
+                  },
+                ]}
               >
-                +
+                {" " + "تومان"}
               </Text>
-            </Pressable>
-            {loading && selectedProduct === product?.productId ? (
-              <ActivityIndicator
-                style={tw("mx-2")}
-                size="small"
-                color={Colors.theme1[theme].greenBA}
-              />
-            ) : (
               <Text
                 style={[
-                  tw("mx-2.5"),
                   {
-                    fontSize: fontSize.xl6,
+                    fontSize: mobile ? fontSize.lg : fontSize.xl,
-                    color: Colors.theme1[theme].greenBA,
+                    fontFamily: "regular",
-                    fontFamily: "bold",
                   },
                 ]}
               >
-                {product?.count}
+                {separate(product.product.price) || " "}
               </Text>
-            )}
+            </View>
-
+          </View>
-            <Pressable
+        </View>
-              onPress={() =>
+        <View
-                submit(
+          style={tw(
-                  pushToCart({
+            `flex  justify-between ${ios ? "items-end" : "items-start"}`
-                    productId: product?.productId,
+          )}
-                    userId: product?.userId,
+        >
-                    count: -1,
+          <AntDesign
-                  })
+            name="close"
+            size={mobile ? 20 : 30}
+            color={Colors.theme1[theme].redFF1}
+            onPress={() =>
+              submit(
+                pushToCart(
+                  {
+                    productId: product.productId,
+                    userId: product.userId,
+                    count: product.productType === 1 ? -1 : -product?.count,
+                  },
+                  {},
+                  { id: product.factorId }
                 )
-              }
+              )
-              style={[
+            }
-                tw(
+          />
-                  `rounded-md py-0  flex flex-row justify-center items-center border ${
+          <View style={tw("flex  items-center mt-2")}>
-                    mobile ? "px-2.5" : "px-3.5"
+            <View
-                  }`
+              style={tw(
-                ),
+                `flex items-center mb-3 ${
-                {
+                  ios ? "flex-row" : "flex-row-reverse"
-                  borderColor: Colors.theme1[theme].greenCF,
+                }`
-                },
+              )}
-              ]}
             >
+              <Pressable
+                onPress={() =>
+                  submit(
+                    pushToCart({
+                      productId: product.productId,
+                      userId: product.userId,
+                      count: 1,
+                    })
+                  )
+                }
+                style={[
+                  tw(
+                    `rounded-md py-0 flex flex-row justify-center items-center border ${
+                      mobile ? "px-2" : "px-3"
+                    }`
+                  ),
+                  {
+                    borderColor: Colors.theme1[theme].greenCF,
+                  },
+                ]}
+              >
+                <Text
+                  style={{
+                    fontSize: mobile ? fontSize.xl : fontSize.xl4,
+                    color: Colors.theme1[theme].greenCF,
+                    fontFamily: "light",
+                  }}
+                >
+                  +
+                </Text>
+              </Pressable>
+              {(loading && selectedProduct === product.productId) ? (
+                <ActivityIndicator
+                  style={tw("mx-2")}
+                  size="small"
+                  color={Colors.theme1[theme].greenBA}
+                />
+              ) : (
+                <Text
+                  style={[
+                    tw("mx-2.5"),
+                    {
+                      fontSize: fontSize.xl6,
+                      color: Colors.theme1[theme].greenBA,
+                      fontFamily: "bold",
+                    },
+                  ]}
+                >
+                  {product.count}
+                </Text>
+              )}
+
+              <Pressable
+                onPress={() =>
+                  submit(
+                    pushToCart({
+                      productId: product.productId,
+                      userId: product.userId,
+                      count: -1,
+                    })
+                  )
+                }
+                style={[
+                  tw(
+                    `rounded-md py-0  flex flex-row justify-center items-center border ${
+                      mobile ? "px-2.5" : "px-3.5"
+                    }`
+                  ),
+                  {
+                    borderColor: Colors.theme1[theme].greenCF,
+                  },
+                ]}
+              >
+                <Text
+                  style={{
+                    fontSize: mobile ? fontSize.xl : fontSize.xl4,
+                    color: Colors.theme1[theme].greenCF,
+                    fontFamily: "bold",
+                  }}
+                >
+                  -
+                </Text>
+              </Pressable>
+            </View>
+            <View
+              style={tw(
+                `flex items-center justify-center ${
+                  ios ? "flex-row-reverse" : "flex-row"
+                }`
+              )}
+            >
+              <Text style={[{ fontSize: fontSize.sm, fontFamily: "regular" }]}>
+                {" " + "تومان"}
+              </Text>
               <Text
-                style={{
+                style={[
-                  fontSize: mobile ? fontSize.xl : fontSize.xl4,
+                  {
-                  color: Colors.theme1[theme].greenCF,
+                    fontSize: mobile ? fontSize.xl : fontSize.xl4,
-                  fontFamily: "bold",
+                    fontFamily: "regular",
-                }}
+                  },
+                ]}
               >
-                -
+                {separate(product.product.price * product.count) || " "}
               </Text>
-            </Pressable>
+            </View>
-          </View>
-          <View
-            style={tw(
-              `flex items-center justify-center ${
-                ios ? "flex-row-reverse" : "flex-row"
-              }`
-            )}
-          >
-            <Text style={[{ fontSize: fontSize.sm, fontFamily: "regular" }]}>
-              {" " + "تومان"}
-            </Text>
-            <Text
-              style={[
-                {
-                  fontSize: mobile ? fontSize.xl : fontSize.xl4,
-                  fontFamily: "regular",
-                },
-              ]}
-            >
-              {separate(product?.product?.price * product?.count) || " "}
-            </Text>
           </View>
         </View>
       </View>
-    </View>
+    )
   );
 }
 
@@ -265,10 +272,12 @@ const mapStateToProps = (state) => ({
   grades: state.publicApi.grades,
   mobile: state.publicApi.mobile,
   theme: state.publicApi.theme,
+  addActionFlag: state.userProduct.addActionFlag,
 });
 
 const mapDispatchToProps = {
   pushToCart: userProduct.add,
+  getList: userProduct.list
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(Product);

src/screens/ShoppingCart/index.js

@@ -91,7 +91,7 @@ function ShoppingCart({
   getFactorInfo,
   loading,
   payFactor,
-  theme
+  theme,
 }) {
   const navigation = useNavigation();
   const [position, setPosition] = useState("100%");
@@ -109,9 +109,7 @@ function ShoppingCart({
   }, [list]);
 
   useEffect(() => {
-    if (list.length === 0) {
+    getList();
-      getList();
-    }
     getFactorInfo({ userId });
   }, []);
 
@@ -293,7 +291,7 @@ const mapStateToProps = (state) => ({
   userId: state.user.status?.id,
   hasPhysical: state.userProduct.hasPhysical,
   loading: state.userProduct.loading,
-  theme: state.publicApi.theme
+  theme: state.publicApi.theme,
 });
 
 const mapDispatchToProps = {

src/screens/Video/index.js

@@ -11,9 +11,11 @@ import {
   Text,
   Appearance,
 } from "react-native";
+import { useNavigation } from "@react-navigation/native";
 import { connect } from "react-redux";
 import { publicApi, userProduct } from "../../redux/actions";
 import separate from "../../utils/separate";
+import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
 
 //components
 import Navbar from "../../components/Navbar";
@@ -40,10 +42,12 @@ function Product({
   pushToCart,
   loading,
   mobile,
-  theme
+  theme,
+  userProducts,
 }) {
   const [position, setPosition] = useState("100%");
-
+  const navigation = useNavigation();
+  const [addedFlag, setAddedFlag] = React.useState(false);
   useEffect(() => {
     getBook({ bookId: route.params.id }, { id: route.params.id, vod: true });
   }, []);
@@ -52,6 +56,32 @@ function Product({
     LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
     setPosition(position === "100%" ? "0%" : "100%");
   };
+
+  const videoAvailabileInCart = React.useMemo(() => {
+    return userProducts?.filter(
+      (product) => product?.productId === book?.product[2]?.id
+    )[0];
+  }, [userProducts, book]);
+
+  const addToCart = React.useCallback(
+    async (action) => {
+      setAddedFlag(true);
+      await action();
+    },
+    [book, userId]
+  );
+
+  React.useEffect(() => {
+    if (videoAvailabileInCart && addedFlag) {
+      setAddedFlag(false);
+      asyncAwesomeAlert("", "به سبد خرید اضافه شد", {
+        showCancelButton: false,
+        onConfirm: () => navigation.push("ShoppingCart"),
+        confirmText: "مشاهده سبد خرید",
+      });
+    }
+  }, [userProducts]);
+
   return (
     <SafeAreaView
       style={{
@@ -90,7 +120,10 @@ function Product({
               resizeMode="contain"
               style={[
                 tw("rounded-sm ml-2"),
-                { height: mobile ? width / 3 * 4 / 2.6 : 300, width: mobile ? width / 3 : 210 },
+                {
+                  height: mobile ? ((width / 3) * 4) / 2.6 : 300,
+                  width: mobile ? width / 3 : 210,
+                },
               ]}
             />
             <View style={tw("flex  items-end flex-1")}>
@@ -135,11 +168,24 @@ function Product({
             width={"100%"}
             loading={loading}
             onPress={() =>
-              pushToCart({
+              videoAvailabileInCart
-                productId: book?.product[2]?.id,
+                ? asyncAwesomeAlert(
-                userId: userId,
+                    "",
-                count: 1,
+                    "این محصول قبلا به سبد خرید شما اضافه شده است.",
-              })
+                    {
+                      showCancelButton: true,
+                      onConfirm: () => navigation.push("ShoppingCart"),
+                      confirmText: "مشاهده سبد خرید",
+                      cancelText: "باشه",
+                    }
+                  )
+                : addToCart(
+                    pushToCart({
+                      productId: book?.product[2]?.id,
+                      userId: userId,
+                      count: 1,
+                    })
+                  )
             }
           />
         </View>
@@ -170,13 +216,14 @@ const styles = StyleSheet.create({
 
 const mapStateToProps = (state) => ({
   book: state.book.info,
+  userProducts: state.userProduct.list,
   seasons: state.publicApi.categories,
   grades: state.publicApi.grades,
   isLogin: state.user.status,
   userId: state.user.status?.id,
   loading: state.userProduct.loading,
   mobile: state.publicApi.mobile,
-  theme: state.publicApi.theme
+  theme: state.publicApi.theme,
 });
 
 const mapDispatchToProps = {

src/screens/VideoDisplay/index.js

@@ -31,7 +31,6 @@ const ios = Platform.OS === "ios";
 function VideoDisplay({ route, mobile, theme }) {
   const video = React.useRef(null);
   const [width, setWidth] = useState(Dimensions.get("window").width);
-  const [status, setStatus] = React.useState({});
   const [position, setPosition] = useState("100%");
 
   const setBoxPosition = () => {
@@ -39,15 +38,7 @@ function VideoDisplay({ route, mobile, theme }) {
     setPosition(position === "100%" ? "0%" : "100%");
   };
 
-  const setOrientation = () => {
+  console.log(video);
-    if (Dimensions.get("window").height > Dimensions.get("window").width) {
-      //Device is in portrait mode, rotate to landscape mode.
-      ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE);
-    } else {
-      //Device is in landscape mode, rotate to portrait mode.
-      ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.PORTRAIT);
-    }
-  }
 
   return (
     <SafeAreaView
@@ -79,15 +70,13 @@ function VideoDisplay({ route, mobile, theme }) {
         <View style={tw("flex ")}>
           <Video
             ref={video}
-            style={{ width: "100%", height: (width * 9) / 16 - 16 }}
+            style={{ width: "100%", height: (width * 9) / 16 - 16}}
             source={{
               uri: `https://dnvn.ir/api/v1/file/${route.params.unit?.fileIds}`,
             }}
             useNativeControls
             resizeMode="cover"
-            onFullscreenUpdate={setOrientation}
+            
-            isLooping
-            onPlaybackStatusUpdate={(status) => setStatus(() => status)}
           />
           <Text
             style={{