reza fixed drawer left side color

src/components/Avatar.js

@@ -0,0 +1,54 @@
+import React from "react";
+import { Image, View } from "react-native";
+import Svg, { G, Path } from "react-native-svg";
+
+//style
+import tw from "tailwind-rn";
+
+function Avatar({ source, size }) {
+  return (
+    <View
+      style={[
+        tw(
+          "bg-gray-100 rounded-full overflow-hidden flex justify-center items-center"
+        ),
+        {
+          minWidth: size,
+          minHeight: size,
+        },
+      ]}
+    >
+      {source ? (
+        <Image
+          source={{ uri: `https:dnvn.ir/api/v1/file/${source}` }}
+          style={{ minWidth: "100%", minHeight: "100%" }}
+          resizeMode="contain"
+        />
+      ) : (
+        <Svg
+          data-name="vuesax/bold/frame"
+          xmlns="http://www.w3.org/2000/svg"
+          width={36.975}
+          height={36.975}
+        >
+          <G fill="none">
+            <Path d="M18.488 3.081a7.311 7.311 0 0 0-.185 14.621 1.243 1.243 0 0 1 .339 0h.108a7.313 7.313 0 0 0-.262-14.621Z" />
+            <Path
+              d="M18.488 5.081a5.324 5.324 0 0 0-5.318 5.318c0 1.395.528 2.705 1.486 3.689.94.965 2.215 1.535 3.6 1.61.165-.011.328-.01.484.002a5.31 5.31 0 0 0 5.066-5.304 5.324 5.324 0 0 0-5.318-5.315m0-2a7.325 7.325 0 0 1 7.318 7.318 7.3 7.3 0 0 1-7.056 7.303h-.108a1.243 1.243 0 0 0-.339 0c-4.036-.14-7.133-3.344-7.133-7.303a7.325 7.325 0 0 1 7.318-7.318Z"
+              fill="#818181"
+            />
+            <G data-name="Vector">
+              <Path d="M26.314 21.8a15.3 15.3 0 0 0-15.637 0 6.081 6.081 0 0 0-3.035 4.976 6.03 6.03 0 0 0 3.02 4.945 14.234 14.234 0 0 0 7.826 2.172 14.234 14.234 0 0 0 7.826-2.172 6.078 6.078 0 0 0 3.02-4.976 6.066 6.066 0 0 0-3.02-4.945Z" />
+              <Path
+                d="M18.507 21.651c-2.528 0-4.977.661-6.721 1.814-1.383.926-2.144 2.102-2.144 3.311 0 1.201.756 2.366 2.129 3.282l.006.003c1.734 1.165 4.18 1.833 6.711 1.833 2.53 0 4.977-.668 6.708-1.83 1.762-1.189 2.136-2.455 2.138-3.31-.01-.862-.388-2.129-2.129-3.29-1.729-1.152-4.17-1.813-6.698-1.813m0-2c2.831 0 5.658.716 7.807 2.15 1.942 1.293 3.005 3.05 3.02 4.945 0 1.91-1.078 3.666-3.02 4.976-4.313 2.896-11.339 2.896-15.652 0-1.942-1.294-3.02-3.05-3.02-4.946 0-1.895 1.078-3.666 3.035-4.976 2.165-1.433 5-2.149 7.83-2.149Z"
+                fill="#818181"
+              />
+            </G>
+          </G>
+        </Svg>
+      )}
+    </View>
+  );
+}
+
+export default Avatar;

src/components/Drawer.js

@@ -9,6 +9,7 @@ import {
   TouchableOpacity,
   Image,
   LayoutAnimation,
+  Animated,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import { asyncAwesomeAlert } from "../utils/AsyncWrappers";
@@ -17,11 +18,15 @@ import { user } from "../redux/actions";
 import Svg, { Path, G } from "react-native-svg";
 import { AntDesign } from "@expo/vector-icons";
 
+//components
+import Avatar from "../components/Avatar";
+
 //style
 import tw from "tailwind-rn";
 import fontSize from "../constants/fontSize";
 import Colors from "../constants/Colors";
 
+//variables
 const ios = Platform.OS === "ios";
 
 if (
@@ -34,6 +39,7 @@ if (
 const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
   const [height, setHeight] = useState(Dimensions.get("window").height);
   const [width, setWidth] = useState(Dimensions.get("window").width);
+  const fadeAnim = React.useRef(new Animated.Value(0)).current; // Initial value for opacity: 0
   const [dropdown, setDropdown] = useState(false);
   const [dropdownHeight, setDropdownHeight] = useState(0);
   const navigation = useNavigation();
@@ -246,6 +252,23 @@ const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
     [mobile, position]
   );
 
+  React.useEffect(() => {
+    if (position === "0%") {
+      setTimeout(() => {
+        Animated.timing(fadeAnim, {
+          toValue: 0.5,
+          duration: 300,
+        }).start();
+      }, 300);
+    }
+    if (position === "100%") {
+      Animated.timing(fadeAnim, {
+        toValue: 0,
+        duration: 10,
+      }).start();
+    }
+  }, [position]);
+
   const onLayout = React.useCallback(() => {
     setHeight(Dimensions.get("window").height);
     setWidth(Dimensions.get("window").width);
@@ -269,15 +292,15 @@ const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
         },
       ]}
       onLayout={() => onLayout()}
+    >
+      <Animated.View
+        style={[tw("w-1/5 h-full bg-black"), { opacity: fadeAnim }]}
       >
         <Pressable
+          style={tw("flex-1")}
           onPress={() => setBoxPosition()}
-        style={[
-          tw(
-            `w-1/5 h-full ${position === "0%" ? "bg-black bg-opacity-40" : ""}`
-          ),
-        ]}
         ></Pressable>
+      </Animated.View>
       <View style={[tw("w-4/5 bg-white h-full flex")]}>
         <View
           style={[
@@ -286,26 +309,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
           ]}
         >
           <View style={tw("flex flex-row-reverse w-full justify-between")}>
-            {user?.picFileIds ? (
+            <Avatar souce={user.picFileIds} size={width / 6} />
-              <Image
-                source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileIds }}
-                style={[
-                  tw("rounded-full"),
-                  { width: mobile ? 60 : 100, height: mobile ? 60 : 100 },
-                ]}
-              />
-            ) : (
-              <View
-                style={[
-                  tw("rounded-full bg-gray-200"),
-                  {
-                    width: mobile ? 60 : 100,
-                    height: mobile ? 60 : 100,
-                    zIndex: 1,
-                  },
-                ]}
-              ></View>
-            )}
             <AntDesign
               name="close"
               size={mobile ? 20 : 30}
@@ -336,7 +340,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
                   color: "white",
                   fontFamily: "bold",
                   marginTop: 5,
-                  textAlign: ios ? "right" : "auto",
+                  textAlign: "right",
                 }}
               >
                 {user?.cellphone}

src/components/Empty.js

@@ -8,7 +8,6 @@ import tw from "tailwind-rn";
 import fontSize from "../constants/fontSize";
 
 const Empty = ({ text, buttonText, buttonAction, theme }) => {
-  console.log('first');
   return (
     <View style={tw("flex-1 flex justify-center items-center")}>
       <Text

src/components/Navbar.js

@@ -141,7 +141,7 @@ const Navbar = ({
             xmlnsXlink="http://www.w3.org/1999/xlink"
             width={19.644}
             height={30.908}
-            style={{ transform: [{ translateY: -15.454 }] }}
+            style={{ transform: [{ translateY: -15.454 }, {scale: 1.3}] }}
           >
             <Defs>
               <Pattern

src/redux/proxy.js

@@ -2,6 +2,7 @@ import { ApiConfig } from "../constants/defaultValues";
 import axios from "axios";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import { useNavigation } from "@react-navigation/native";
+import { asyncAwesomeAlert } from "../utils/AsyncWrappers";
 
 let { baseUrl } = ApiConfig;
 let access;
@@ -68,6 +69,10 @@ class Proxy {
             return response.data.data;
           }
           return;
+        case 403:
+          asyncAwesomeAlert("", 'خطای ورود اطلاعات', {
+            showCancelButton: false,
+          });
         default:
           dispatch({
             type: url.split("/")[0] + "/" + "error",

src/redux/reducers/user.js

@@ -62,6 +62,9 @@ const user = (state = initialState, action) => {
     case "user/loading":
       return { ...state, loading: true };
     case "user/error":
+      asyncAwesomeAlert("خطا", data.message, {
+        showCancelButton: false,
+      });
       return { ...state, error : true };
     default:
       return state;

src/screens/Product/components/Book.js

@@ -527,7 +527,7 @@ function Book({
             <Text
               style={[
                 {
-                  fontSize: fontSize.sm,
+                  fontSize: fontSize.tiny,
                   color: "#275077",
                   fontFamily: "regular",
                 },
@@ -536,7 +536,6 @@ function Book({
             >
               امتیازات و نظرات
             </Text>
-            <Entypo name="chevron-small-left" size={20} color="#196EC0" />
           </View>
           <Rates rate={book?.rate || 4} productId={book?.product[1]?.id} />
           <Comments

src/screens/Product/components/Comments.js

@@ -15,13 +15,14 @@ import { asyncAwesomeAlert } from "../../../utils/AsyncWrappers";
 
 //components
 import Pressable from "../../../components/Pressable";
+import Avatar from "../../../components/Avatar";
 
 //assets
 import tw from "tailwind-rn";
 import fontSize from "../../../constants/fontSize";
 import Colors from "../../../constants/Colors";
 
-const width = Dimensions.get("window").width;
+const {width} = Dimensions.get("window");
 const ios = Platform.OS === "ios";
 
 function Commnets({
@@ -142,16 +143,7 @@ const AddComment = ({ addComment, productId, ...props }) => {
       behavior={ios ? "padding" : "height"}
       style={[tw("flex items-end")]}
     >
-      <View
+      <Avatar source={null} size={width / 5.5} />
-        style={[
-          tw("rounded-full"),
-          {
-            width: 70,
-            height: 70,
-            backgroundColor: Colors.theme1[colorScheme].grayE3,
-          },
-        ]}
-      ></View>
       <TextInput
         style={[
           tw("w-full mt-4 px-2 rounded-md"),

src/screens/Profile/components/User.js

@@ -1,27 +1,33 @@
-import { View, Text, Image, Platform, Pressable, BackHandler } from "react-native";
+import { View, Text, Platform, Pressable, Dimensions } from "react-native";
 import React from "react";
 import { connect } from "react-redux";
-import {user} from "../../../redux/actions";
+import { user } from "../../../redux/actions";
 import Svg, { Path } from "react-native-svg";
 import { asyncAwesomeAlert } from "../../../utils/AsyncWrappers";
 import { useNavigation } from "@react-navigation/native";
 
+//components
+import Avatar from "../../../components/Avatar";
+
 //style
 import tw from "tailwind-rn";
 import fontSize from "../../../constants/fontSize";
 import Colors from "../../../constants/Colors";
 
+//variables
 const ios = Platform.OS === "ios";
+const {width} = Dimensions.get("window");
+
 
-const User = ({ user, mobile, theme, logout }) => {
+const User = ({ user, mobile, theme }) => {
   const [dropdown, setDropdown] = React.useState(true);
   const navigation = useNavigation();
 
   React.useEffect(() => {
-    if(!user){
+    if (!user) {
-      navigation.navigate('Login');
+      navigation.navigate("Login");
     }
-  },[user]);
+  }, [user]);
 
   return (
     <View style={tw(`w-full  ${ios ? "items-end" : ""}`)}>
@@ -32,28 +38,8 @@ const User = ({ user, mobile, theme, logout }) => {
         onPress={() => setDropdown(!dropdown)}
       >
         <View style={tw(`flex items-center flex-row-reverse`)}>
-          {user?.picFileIds ? (
+          <Avatar source={user.picFileIds} size={width / 5.5} />
-            <Image
+          <View style={tw(`flex mr-2 ${ios ? "items-end" : ""}`)}>
-              source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileIds }}
-              style={[
-                tw("rounded-full"),
-                { width: mobile ? 70 : 140, height: mobile ? 70 : 140 },
-              ]}
-            />
-          ) : (
-            <View
-              style={[
-                tw("rounded-full"),
-                {
-                  width: mobile ? 70 : 140,
-                  height: mobile ? 70 : 140,
-                  zIndex: 1,
-                  backgroundColor: "#ddd",
-                },
-              ]}
-            ></View>
-          )}
-          <View style={tw(`flex  mr-1 ${ios ? "items-end" : ""}`)}>
             <Text
               style={{
                 fontSize: mobile ? fontSize.lg : fontSize.xl5,
@@ -69,6 +55,7 @@ const User = ({ user, mobile, theme, logout }) => {
                 color: Colors.theme1[theme].gray20,
                 fontFamily: "light",
                 marginTop: mobile ? 3 : 6,
+                textAlign: "right",
               }}
             >
               {user?.cellphone}
@@ -141,5 +128,4 @@ const mapStateToProps = (state) => ({
   theme: state.publicApi.theme,
 });
 
-
 export default connect(mapStateToProps)(User);

src/screens/Profile/index.js

@@ -9,6 +9,7 @@ import {
   SafeAreaView,
   StatusBar,
   LayoutAnimation,
+  ActivityIndicator,
 } from "react-native";
 import { connect } from "react-redux";
 import { useNavigation } from "@react-navigation/native";
@@ -28,7 +29,7 @@ import fontSize from "../../constants/fontSize";
 import Colors from "../../constants/Colors";
 import tw from "tailwind-rn";
 
-function Profile({ mobile, theme, logout }) {
+function Profile({ mobile, theme, logout, loading }) {
   const navigation = useNavigation();
   const [position, setPosition] = useState("100%");
 
@@ -78,12 +79,18 @@ function Profile({ mobile, theme, logout }) {
           <View
             style={[tw(`flex items-center w-full pb-3 mb-3 flex-row-reverse`)]}
           >
+            {loading ? (
+              <ActivityIndicator
+                color={Colors.theme1[theme].redC0}
+                size={fontSize.xl}
+              />
+            ) : (
               <Svg
                 data-name="vuesax/linear/logout"
                 xmlns="http://www.w3.org/2000/svg"
                 width={34.034}
                 height={34.034}
-              style={{ transform : [{scale : 0.8}] }}
+                style={{ transform: [{ scale: 0.8 }] }}
               >
                 <G
                   fill="none"
@@ -99,12 +106,14 @@ function Profile({ mobile, theme, logout }) {
                   />
                 </G>
               </Svg>
+            )}
+
             <Text
               style={{
                 fontSize: mobile ? fontSize.base : fontSize.xl,
                 fontFamily: "bold",
                 color: Colors.theme1[theme].redFF1,
-                marginRight : 4
+                marginRight: 4,
               }}
             >
               خروج از حساب کاربری
@@ -119,6 +128,7 @@ function Profile({ mobile, theme, logout }) {
 const mapStateToProps = (state) => ({
   mobile: state.publicApi.mobile,
   theme: state.publicApi.theme,
+  loading: state.user.loading,
 });
 
 const mapDispatchToProps = {

src/screens/Splash/index.js

@@ -45,9 +45,6 @@ function Splash({
     BackHandler.exitApp();
   }
 
-  // if(isFocused){
-  //   console.log('bi rabt');
-  // }
 
   if(isFocused && !out){
     if (isLogin !== null) {

src/screens/Video/index.js

@@ -161,7 +161,7 @@ function Product({
             <Divider type={"vertical"} />
           </View>
           <CustomPressable
-            title={`خرید با قیمت ${separate(book?.product[2]?.price)} تومان`}
+            title={`خرید با قیمت ${separate(book?.product[2]?.price || ' ')} تومان`}
             backgroundColor={Colors.theme1[theme].greenCF}
             color={"white"}
             border={{ color: "#196EC0", width: 0 }}

src/screens/VideoDisplay/index.js

@@ -38,8 +38,6 @@ function VideoDisplay({ route, mobile, theme }) {
     setPosition(position === "100%" ? "0%" : "100%");
   };
 
-  console.log(video);
-
   return (
     <SafeAreaView
       style={{