reza connected userFavorite to app

src/components/Drawer.js

@@ -39,7 +39,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
   const [dropdownHeight, setDropdownHeight] = useState(0);
 
   const colorScheme = Appearance.getColorScheme();
-  const [routes, setRoutes] = useState([
+  const routes = [
     {
       name: "صفحه اصلی",
       route: "Home",
@@ -204,7 +204,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
       toast: "",
       message: "",
     },
-  ]);
+  ];
   const [addUserDropdown, setAddUserDropdown] = useState(false);
   const navigation = useNavigation();
   const Route = ({ route }) => {
@@ -250,7 +250,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
   return (
     <View
       style={[
-        tw(`absolute top-0 flex flex-row justify-end `),
+        tw(`absolute top-0 flex flex-row justify-end`),
         {
           left: position,
           width: width,
@@ -268,7 +268,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
           ),
         ]}
       ></Pressable>
-      <View style={[tw("w-4/5 bg-white h-full flex ")]}>
+      <View style={[tw("w-4/5 bg-white h-full flex")]}>
         <View
           style={[
             tw("flex items-end pt-12 px-4"),

src/components/Navbar.js

@@ -1,7 +1,11 @@
 import React, { useCallback } from "react";
-import { StyleSheet, View, Pressable, Text, Appearance, TouchableOpacity } from "react-native";
-import { useNavigation } from "@react-navigation/native";
-import { Ionicons, Entypo } from "@expo/vector-icons";
+import {
+  View,
+  Pressable,
+  Text,
+  Appearance,
+  TouchableOpacity,
+} from "react-native";
 import Svg, {
   G,
   Defs,
@@ -11,14 +15,24 @@ import Svg, {
   Text as Textt,
   TSpan,
 } from "react-native-svg";
+
+import { useNavigation } from "@react-navigation/native";
+import { Ionicons, Entypo } from "@expo/vector-icons";
+
 import { connect } from "react-redux";
+import { userFavorite } from "../redux/actions";
 
 //style
 import Color from "../constants/Colors";
 import tw from "tailwind-rn";
 import fontSize from "../constants/fontSize";
 
-const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
+const Navbar = ({
+  notification,
+  setBoxPosition,
+  headerOptions,
+  addToBookmark,
+}) => {
   const navigation = useNavigation();
   const colorScheme = Appearance.getColorScheme();
   const Button = useCallback(({ icon, route }) => {
@@ -27,7 +41,7 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
         style={[
           tw("rounded-md p-1"),
           {
-            backgroundColor: Color.theme1[colorScheme].greenCF + '05',
+            backgroundColor: Color.theme1[colorScheme].greenCF + "05",
             borderColor: Color.theme1[colorScheme].green79,
             borderWidth: 1,
             marginLeft: route === "AR" ? 10 : 0,
@@ -97,9 +111,7 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
           </Svg>
           {notification && (
             <View
-              style={tw(
-                "h-2.5 w-2.5 absolute -left-1 -top-1 rounded-full"
-              )}
+              style={tw("h-2.5 w-2.5 absolute -left-1 -top-1 rounded-full")}
             ></View>
           )}
         </Pressable>
@@ -236,7 +248,15 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
             style={tw("mr-2")}
             size={24}
             color={"#52796F"}
-            onPress={() => navigation.goBack()}
+            onPress={() =>
+              headerOptions?.bookmarkItem?.contentId
+                ? addToBookmark({
+                    contentId: headerOptions?.bookmarkItem?.contentId,
+                  })
+                : addToBookmark({
+                    productId: headerOptions?.bookmarkItem?.productId,
+                  })
+            }
           />
         )}
         {headerOptions?.menu && (
@@ -249,6 +269,8 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
 
 const mapStateToProps = (state) => ({});
 
-export default connect(mapStateToProps)(Navbar);
+const mapDispatchToProps = {
+  addToBookmark: userFavorite.add,
+};
 
-const styles = StyleSheet.create({});
+export default connect(mapStateToProps, mapDispatchToProps)(Navbar);

src/redux/actions/index.js

@@ -11,6 +11,7 @@ export { default as faq } from "./faq";
 export { default as file } from "./file";
 export { default as qr } from "./qr";
 export {default as userAddress} from "./userAddress";
+export {default as userFavorite} from "./userFavorite";
 export { default as transport } from "./transport";
 export { default as activation } from "./activation";
 export { default as form } from "./form";

src/redux/actions/userFavorite.js

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

src/redux/reducers/book.js

@@ -1,3 +1,5 @@
+import {asyncAwesomeAlert} from '../../utils/AsyncWrappers';
+
 const initialState = {
   loading: false,
   error: null,
@@ -83,7 +85,9 @@ export default function book(state = initialState, action) {
     case "book/loading":
       return { ...state, loading: true };
     case "book/error":
-      // toast.error(data.message);
+      asyncAwesomeAlert("خطا", data.message, {
+        showCancelButton: false,
+      });
       return { ...state, loading: false, error: data.message };
     default:
       return state;

src/redux/reducers/index.js

@@ -10,6 +10,7 @@ export { default as userFactor } from "./userFactor";
 export { default as userProduct } from "./userProduct";
 import { default as qr } from "./qr";
 export { default as userAddress } from "./userAddress";
+export { default as userFavorite } from "./userFavorite";
 export { default as transport } from "./transport";
 export { default as activation } from "./activation";
 export { default as form } from "./form";

src/redux/reducers/product.js

@@ -1,3 +1,5 @@
+import {asyncAwesomeAlert} from '../../utils/AsyncWrappers';
+
 const initialState = {
   loading: false,
   error: null,
@@ -18,7 +20,9 @@ export default function product(state = initialState, action) {
     case "product/loading":
       return { ...state, loading: true };
     case "product/error":
-      // toast.error(data.message);
+      asyncAwesomeAlert("خطا", data.message, {
+        showCancelButton: false,
+      });
       return { ...state, loading: false, error: data.message };
     default:
       return state;

src/redux/reducers/userAddress.js

@@ -19,7 +19,7 @@ export default function userAddress(state = initialState, action) {
     case "userAddress/update":
       return { ...state, loading: false, error: null };
     case "userAddress/add":
-      return { ...state, loading: false, error: null, sum: data.payPrice };
+      return { ...state, loading: false, error: null};
     case "userAddress/delete":
       return { ...state, loading: false, error: null };
     case "userAddress/loading":

src/redux/reducers/userFactor.js

@@ -1,4 +1,3 @@
-import {useNavigation} from '@react-navigation/native';
 import {asyncAwesomeAlert} from '../../utils/AsyncWrappers';
 
 const initialState = {

src/redux/reducers/userFavorite.js

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

src/redux/store.js

@@ -18,6 +18,7 @@ import userAddress from "./reducers/userAddress";
 import transport from "./reducers/transport"
 import comment from './reducers/comment';
 import form from "./reducers/form";
+import userFavorite from "./reducers/userFavorite";
 
 const persistConfig = {
   key: "root",
@@ -52,7 +53,8 @@ const store = createStore(
       userAddress,
       transport,
       comment,
-      form
+      form,
+      userFavorite
     })
   ),
   initialState,

src/screens/Blog/index.js

@@ -55,6 +55,7 @@ export const Blog = ({ getInfo, blog, getList, blogs, route }) => {
           bookmark: true,
           qr: false,
           back: true,
+          bookmarkItem: { contentId: blog?.id },
         }}
       />
       <ScrollView

src/screens/Product/components/Book.js

@@ -67,22 +67,25 @@ function Book({
   )[0];
 
   return (
-    <ScrollView style={[tw("flex  flex-1 relative")]}>
+    <ScrollView
+      style={[tw("flex  flex-1 relative")]}
+      
+    >
       {!mobile && <View style={tw("mt-5")}></View>}
-      {pageLoading && (
-        <Pressable
+      {!book && (
+        <View
           style={[
             tw("absolute left-0 top-0 rounded-md overflow-hidden"),
             {
               width: Dimensions.get("window").width,
-              height: height - 150,
+              height: height - 200,
               zIndex: 1,
               backgroundColor: Colors.theme1[colorScheme].white + "60",
             },
           ]}
         >
           <Blur />
-        </Pressable>
+        </View>
       )}
       {imageSlider && <ImageSlider />}
       <View style={[tw("flex flex-row-reverse")]}>

src/screens/Product/index.js

@@ -14,7 +14,7 @@ import Navbar from "../../components/Navbar";
 
 function Product({ route, book, getBook, grades }) {
   useEffect(() => {
-    getBook({ id: route.params.id, vod : true });
+    getBook({ id: route.params.id, vod: true });
   }, []);
 
   return (
@@ -28,17 +28,19 @@ function Product({ route, book, getBook, grades }) {
         // setBoxPosition={setBoxPosition}
         headerOptions={{
           logo: false,
-          menu: true,
+          menu: false,
           hamburgerMenu: false,
           title: "",
           bookmark: true,
           qr: false,
           back: true,
+          bookmarkItem: { productId: book?.id },
         }}
       />
       <ScrollView
         contentContainerStyle={styles.contentContainerStyle}
         style={styles.container}
+        scrollEnabled={book ? true : false}
       >
         <Book book={book} grades={grades} />
       </ScrollView>

src/screens/Profile/components/ProfileBookmark/index.js

@@ -16,6 +16,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { useNavigation } from "@react-navigation/native";
 import Svg, { Path } from "react-native-svg";
+import {userFavorite} from '../../../../redux/actions';
 
 //components
 import Navbar from "../../../../components/Navbar";
@@ -31,76 +32,11 @@ import bookImage from "../../..//OrdersFollowUp/assets/b1.png";
 const { height, width } = Dimensions.get("window");
 const ios = Platform.OS === "ios";
 
-const ProfileBookmark = ({ bookmarkList }) => {
-  const colorScheme = Appearance.getColorScheme();
-  const navigation = useNavigation();
+const ProfileBookmark = ({ bookmarkList, getList }) => {
 
-  const Bookmark = ({ bookmark }) => {
-    return (
-      <Pressable
-        style={[
-          tw("flex flex-row-reverse rounded-md justify-between px-3.5 py-2"),
-          {
-            borderWidth: 1.5,
-            borderColor: Colors.theme1[colorScheme].greenCF,
-          },
-        ]}
-      >
-        <View style={tw("flex flex-row-reverse items-end")}>
-          <Image
-            source={bookmark.image}
-            style={{
-              width: mobile ? width / 5 : width / 7,
-              minWidth: 80,
-              height: ((mobile ? width / 5 : width / 7) * 4) / 2.7,
-              minHeight: (80 * 4) / 2.7,
-            }}
-          />
-          <View style={tw(`flex  mr-2 ${ios ? "items-end" : ""}`)}>
-            <Text
-              style={{
-                fontFamily: "bold",
-                fontSize: fontSize.lg,
-                color: Colors.theme1[colorScheme].gray20,
-              }}
-            >
-              {bookmark.name}
-            </Text>
-            <Text
-              style={{
-                marginTop: 5,
-                fontFamily: "regular",
-                fontSize: fontSize.base,
-                color: Colors.theme1[colorScheme].gray20,
-              }}
-            >
-              {bookmark.grade}
-            </Text>
-          </View>
-        </View>
-        <Svg
-          data-name="vuesax/linear/archive-add"
-          xmlns="http://www.w3.org/2000/svg"
-          width={29.778}
-          height={29.778}
-        >
-          <Path
-            d="M20.869 2.482H8.908a4.8 4.8 0 0 0-4.789 4.789v17.483c0 2.233 1.6 3.176 3.561 2.1l6.055-3.362a2.628 2.628 0 0 1 2.32 0l6.055 3.362c1.96 1.092 3.561.149 3.561-2.1V7.271a4.819 4.819 0 0 0-4.802-4.789Z"
-            fill="#37a865"
-          />
-          <Path
-            data-name="Vector"
-            d="M17.987 13.214h-6.2"
-            fill="none"
-            stroke="#fff"
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            strokeWidth={1.5}
-          />
-        </Svg>
-      </Pressable>
-    );
-  };
+  React.useEffect(() => {
+    getList();
+  },[]);
 
   return (
     <SafeAreaView
@@ -137,12 +73,83 @@ const ProfileBookmark = ({ bookmarkList }) => {
   );
 };
 
+const Bookmark = ({ bookmark }) => {
+  const colorScheme = Appearance.getColorScheme();
+  return (
+    <Pressable
+      style={[
+        tw("flex flex-row-reverse rounded-md justify-between px-3.5 py-2"),
+        {
+          borderWidth: 1.5,
+          borderColor: Colors.theme1[colorScheme].greenCF,
+        },
+      ]}
+    >
+      <View style={tw("flex flex-row-reverse items-end")}>
+        <Image
+          source={bookmark.image}
+          style={{
+            width: mobile ? width / 5 : width / 7,
+            minWidth: 80,
+            height: ((mobile ? width / 5 : width / 7) * 4) / 2.7,
+            minHeight: (80 * 4) / 2.7,
+          }}
+        />
+        <View style={tw(`flex  mr-2 ${ios ? "items-end" : ""}`)}>
+          <Text
+            style={{
+              fontFamily: "bold",
+              fontSize: fontSize.lg,
+              color: Colors.theme1[colorScheme].gray20,
+            }}
+          >
+            {bookmark.name}
+          </Text>
+          <Text
+            style={{
+              marginTop: 5,
+              fontFamily: "regular",
+              fontSize: fontSize.base,
+              color: Colors.theme1[colorScheme].gray20,
+            }}
+          >
+            {bookmark.grade}
+          </Text>
+        </View>
+      </View>
+      <Svg
+        data-name="vuesax/linear/archive-add"
+        xmlns="http://www.w3.org/2000/svg"
+        width={29.778}
+        height={29.778}
+      >
+        <Path
+          d="M20.869 2.482H8.908a4.8 4.8 0 0 0-4.789 4.789v17.483c0 2.233 1.6 3.176 3.561 2.1l6.055-3.362a2.628 2.628 0 0 1 2.32 0l6.055 3.362c1.96 1.092 3.561.149 3.561-2.1V7.271a4.819 4.819 0 0 0-4.802-4.789Z"
+          fill="#37a865"
+        />
+        <Path
+          data-name="Vector"
+          d="M17.987 13.214h-6.2"
+          fill="none"
+          stroke="#fff"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={1.5}
+        />
+      </Svg>
+    </Pressable>
+  );
+};
+
 const mapStateToProps = (state) => ({
   loading: state.userFactor.loading,
   mobile: state.publicApi.mobile,
+  bookmarkList : state.userFavorite.list
 });
 
-const mapDispatchToProps = {};
+const mapDispatchToProps = {
+  getList : userFavorite.list,
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProfileBookmark);
 

src/screens/VideoDisplay/index.js

@@ -66,7 +66,7 @@ function VideoDisplay({ route, mobile }) {
           menu: true,
           hamburgerMenu: false,
           title: "",
-          bookmark: true,
+          bookmark: false,
           qr: false,
           back: true,
         }}