update 10 files

App.js

@@ -11,7 +11,7 @@ import { PersistGate } from "redux-persist/integration/react";
 import { copilot } from "react-native-copilot";
 
 
-const App = () => {
+const App = (props) => {
   const [appIsReady, setAppIsReady] = React.useState(false);
   let [fontsLoaded] = useFonts({
     light: require("./assets/fonts/Farsi/Light.ttf"),
@@ -20,23 +20,18 @@ const App = () => {
     demi: require("./assets/fonts/Farsi/DemiBold.ttf"),
   });
 
+
   React.useEffect(() => {
     async function prepare() {
       try {
-        // Keep the splash screen visible while we fetch resources
         await SplashScreen.preventAutoHideAsync();
-        // Pre-load fonts, make any API calls you need to do here
-        // Artificially delay for two seconds to simulate a slow loading
-        // experience. Please remove this if you copy and paste the code!
         await new Promise((resolve) => setTimeout(resolve, 2000));
       } catch (e) {
         console.warn(e);
       } finally {
-        // Tell the application to render
         setAppIsReady(true);
       }
     }
-
     prepare();
   }, []);
 
@@ -54,7 +49,7 @@ const App = () => {
     <View style={{ flex: 1 }} onLayout={onLayoutRootView}>
       <Provider store={store}>
         <PersistGate loading={null} persistor={persistor}>
-          <Navigation />
+          <Navigation startUserGuide={() => props.start()} />
           <AlertModal />
         </PersistGate>
       </Provider>

navigation/index.js

@@ -52,7 +52,12 @@ import Colors from "../src/constants/Colors";
 import fontSize from "../src/constants/fontSize";
 
 const Tab = createBottomTabNavigator();
-const BottomTabNavigator = ({ theme, userProducts, bottomNavigation }) => {
+const BottomTabNavigator = ({
+  theme,
+  userProducts,
+  bottomNavigation,
+  startUserGuide,
+}) => {
   const insets = useSafeAreaInsets();
   const [headerShown, setHeaderShown] = React.useState(true);
   React.useEffect(() => {
@@ -97,7 +102,9 @@ const BottomTabNavigator = ({ theme, userProducts, bottomNavigation }) => {
       {bottomNavigation.home.isActive ? (
         <Tab.Screen
           name="HomeTab"
-          children={() => <HomeStackScreen theme={theme} />}
+          children={() => (
+            <HomeStackScreen startUserGuide={startUserGuide} theme={theme} />
+          )}
           options={{
             title: bottomNavigation.home.label,
             tabBarIcon: ({ focused, color }) =>
@@ -320,9 +327,11 @@ const BottomTabNavigator = ({ theme, userProducts, bottomNavigation }) => {
           name="ShoppingCartTab"
           children={() => <CARTStackScreen theme={theme} />}
           options={{
-            tabBarBadge: userProducts?.filter((product) => product?.condition < 2)
+            tabBarBadge: userProducts?.filter(
-              .length
+              (product) => product?.condition < 2
-              ? userProducts?.filter((product) => product?.condition < 2)?.length
+            ).length
+              ? userProducts?.filter((product) => product?.condition < 2)
+                  ?.length
               : null,
             tabBarBadgeStyle: {
               color: "white",
@@ -466,7 +475,7 @@ const BottomTabNavigator = ({ theme, userProducts, bottomNavigation }) => {
 };
 
 const HomeStack = createNativeStackNavigator();
-const HomeStackScreen = ({ theme }) => {
+const HomeStackScreen = ({ theme, startUserGuide }) => {
   return (
     <HomeStack.Navigator
       screenOptions={{
@@ -475,11 +484,14 @@ const HomeStackScreen = ({ theme }) => {
           backgroundColor:
             theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
         },
-        unmountOnBlur: true
+        unmountOnBlur: true,
       }}
       initialRouteName="Home"
     >
-      <HomeStack.Screen name="Home" component={Home} />
+      <HomeStack.Screen
+        name="Home"
+        children={() => <Home startUserGuide={startUserGuide} />}
+      />
       <HomeStack.Screen name="VOD" component={Videos} />
       <HomeStack.Screen name="Video" component={Video} unmountOnExit={true} />
       <HomeStack.Screen name="VideoDisplay" component={VideoDisplay} />
@@ -504,7 +516,7 @@ const ProductsStackScreen = ({ theme }) => {
           backgroundColor:
             theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
         },
-        unmountOnBlur: true
+        unmountOnBlur: true,
       }}
       initialRouteName="Products"
     >
@@ -526,7 +538,7 @@ const VODStackScreen = ({ theme }) => {
           backgroundColor:
             theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
         },
-        unmountOnBlur: true
+        unmountOnBlur: true,
       }}
       initialRouteName="VOD"
     >
@@ -547,7 +559,7 @@ const CARTStackScreen = ({ theme }) => {
           backgroundColor:
             theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
         },
-        unmountOnBlur: true
+        unmountOnBlur: true,
       }}
       initialRouteName="ShoppingCart"
     >
@@ -568,7 +580,7 @@ const PROFILEStackScreen = ({ theme }) => {
           backgroundColor:
             theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
         },
-        unmountOnBlur: true
+        unmountOnBlur: true,
       }}
     >
       <PROFILEStack.Screen name="Profile" component={Profile} />
@@ -594,6 +606,7 @@ const Navigation = ({
   theme,
   setOrientation,
   bottomNavigation,
+  startUserGuide,
 }) => {
   const linking = {
     prefixes: [prefix],
@@ -631,7 +644,7 @@ const Navigation = ({
             backgroundColor:
               theme === "light" ? Colors.theme1.white : Colors.theme1.dark,
           },
-          unmountOnBlur: true
+          unmountOnBlur: true,
         }}
       >
         <Stack.Screen name="Splash" component={Splash} />
@@ -645,6 +658,7 @@ const Navigation = ({
               theme={theme}
               userProducts={userProducts}
               bottomNavigation={bottomNavigation}
+              startUserGuide={startUserGuide}
             />
           )}
         />

src/components/Navbar.js

@@ -53,11 +53,11 @@ const Navbar = ({
   React.useEffect(() => {}, []);
 
   const isActiveBookmark = React.useMemo(() => {
-    return userFavoriteList.filter((object) =>
+    return userFavoriteList?.filter((object) =>
-      headerOptions.bookmarkItem?.productId
+      headerOptions?.bookmarkItem?.productId
-        ? object.productId === headerOptions.bookmarkItem?.productId
+        ? object?.productId === headerOptions?.bookmarkItem?.productId
-        : object.contentId === headerOptions.bookmarkItem?.contentId
+        : object?.contentId === headerOptions?.bookmarkItem?.contentId
-    ).length;
+    )?.length;
   }, [headerOptions, userFavoriteList]);
 
   const Button = useCallback(

src/screens/AR/components/Book.js

@@ -29,7 +29,7 @@ const Book = ({ book, mobile, theme }) => {
         style={[
           tw("rounded-sm w-full"),
           {
-            height : width / 4.2 * 4 / 3,
+            height : mobile ? width / 2.2 * 4 / 3 : width / 4.2 * 4 / 3,
             flex: 1,
           },
         ]}
@@ -39,7 +39,7 @@ const Book = ({ book, mobile, theme }) => {
           {
             fontFamily: "bold",
             fontSize: mobile ?  fontSize.lg : fontSize.tiny,
-            marginTop: 10,
+            marginTop: 5,
             color:
               theme === "light" ? Colors.theme1.green79 : Colors.theme1.white,
             textAlign: "right",

src/screens/AR/index.js

@@ -75,7 +75,7 @@ function AR({ getUserProducts, userProducts, mobile, theme }) {
           }}
           contentContainerStyle={{ paddingBottom: 100 }}
         >
-          <View style={tw(`flex flex-wrap flex-row-reverse`)}>
+          <View style={tw(`flex flex-wrap flex-row-reverse justify-between`)}>
             {userProducts
               ?.filter(
                 (product) =>

src/screens/Home/index.js

@@ -1,8 +1,8 @@
 import React, { useState } from "react";
 import { connect } from "react-redux";
 import { blog, book, userProduct, publicApi } from "../../redux/actions";
-import AsyncStorage from "@react-native-async-storage/async-storage";
 import { useNavigation } from "@react-navigation/native";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 
 import {
   View,
@@ -23,7 +23,6 @@ import Videos from "./components/Videos";
 import Blogs from "./components/Blogs";
 import Drawer from "../../components/Drawer";
 import Header from "./components/Header";
-import MapSelector from "../../components/MapSelector";
 
 //style
 import tw from "tailwind-rn";
@@ -40,8 +39,7 @@ const Home = ({
   getBooks,
   getUserProducts,
   bottomNavigation,
-  setFirstLogin,
+  startUserGuide,
-  firstLogin,
   ...props
 }) => {
   const navigation = useNavigation();
@@ -55,12 +53,12 @@ const Home = ({
   const getFirstLogin = React.useCallback(async () => {
     const firstLoginFlag = await AsyncStorage.getItem("firstLogin");
     if (!firstLoginFlag) {
-      AsyncStorage.setItem("firstLogin", JSON.stringify(true));
       setTimeout(() => {
-        props.start();
+        startUserGuide();
+        AsyncStorage.setItem("firstLogin", JSON.stringify(true));
       }, 800);
     }
-  }, [firstLogin]);
+  }, []);
 
   React.useEffect(() => {
     if (!blogs) {
@@ -72,7 +70,6 @@ const Home = ({
     if (!userProducts) {
       getUserProducts();
     }
-
     getFirstLogin();
   }, []);
 
@@ -135,14 +132,12 @@ const mapStateToProps = (state) => ({
   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,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(Home);

src/screens/Otp/index.js

@@ -9,7 +9,7 @@ import {
   KeyboardAvoidingView,
   ScrollView,
   Platform,
-  StatusBar
+  StatusBar,
 } from "react-native";
 import tw from "tailwind-rn";
 import { connect } from "react-redux";

src/screens/Profile/index.js

@@ -72,10 +72,13 @@ function Profile({ mobile, theme, logout, loading }) {
           onPress={() =>
             asyncAwesomeAlert("", "آیا قصد خروج از حساب کاربری فعلی رو داری؟", {
               showCancelButton: true,
-              confirmText : 'آره',
+              confirmText: "آره",
               cancelText: "خیر",
               onConfirm: () => {
-                navigation.navigate("HomeTab", { screen: "Home" });
+                navigation.reset({
+                  index: 0,
+                  routes: [{ name: "Login" }],
+                });
                 logout();
               },
             })