reza added profile bookmark

src/screens/Profile/components/ProfileAddress/dots.svg

@@ -1,10 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-  <g id="vuesax_linear_more" data-name="vuesax/linear/more" transform="translate(0 24) rotate(-90)">
-    <g id="more">
-      <path id="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(3 10)" fill="#07612c"/>
-      <path id="Vector-2" data-name="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(17 10)" fill="#07612c"/>
-      <path id="Vector-3" data-name="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(10 10)" fill="#07612c"/>
-      <path id="Vector-4" data-name="Vector" d="M0,0H24V24H0Z" fill="#07612c" opacity="0"/>
-    </g>
-  </g>
-</svg>

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

@@ -1,12 +1,168 @@
-import { View, Text } from 'react-native'
+import {
-import React from 'react'
+  View,
+  Text,
+  Pressable,
+  Appearance,
+  SafeAreaView,
+  ScrollView,
+  StyleSheet,
+  Platform,
+  Dimensions,
+  StatusBar,
+  Image,
+} from "react-native";
+import React from "react";
+import { connect } from "react-redux";
+import { useNavigation } from "@react-navigation/native";
+import Svg, { Path } from "react-native-svg"
+
+//components
+import Navbar from "../../../../components/Navbar";
+
+//style
+import tw from "tailwind-rn";
+import Colors from "../../../../constants/Colors";
+import fontSize from "../../../../constants/fontSize";
+
+//assets
+import bookImage from "../../..//OrdersFollowUp/assets/b1.png";
+
+const { height, width } = Dimensions.get("window");
+
+const ProfileBookmark = ({ bookmarkList }) => {
+  const colorScheme = Appearance.getColorScheme();
+  const navigation = useNavigation();
+
+  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: width / 5,
+              minWidth: 80,
+              height: ((width / 5) * 4) / 2.7,
+              minHeight: (80 * 4) / 2.7,
+            }}
+          />
+          <View style={tw("flex flex-col mr-2")}>
+            <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 ProfileBookmark = () => {
   return (
-    <View>
+    <SafeAreaView
-      <Text>ProfileBookmark</Text>
+      style={{
-    </View>
+        paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
-  )
+        position: "relative",
-}
+        backgroundColor: "white",
+      }}
+    >
+      <Navbar
+        headerOptions={{
+          logo: false,
+          menu: false,
+          hamburgerMenu: false,
+          title: "لیست علاقه‌مندی‌ها",
+          bookmark: false,
+          qr: false,
+          back: true,
+        }}
+      />
+      <ScrollView
+        contentContainerStyle={styles.contentContainerStyle}
+        style={styles.container}
+      >
+        <View style={tw("w-full mt-2 px-4")}>
+          <View style={tw("p-0 m-0 flex flex-col")}>
+            {bookmarkList.map((bookmark, index) => (
+              <Bookmark key={index} bookmark={bookmark} />
+            ))}
+          </View>
+        </View>
+      </ScrollView>
+    </SafeAreaView>
+  );
+};
+
+const mapStateToProps = (state) => ({
+  loading: state.userFactor.loading,
+});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(ProfileBookmark);
+
+const styles = StyleSheet.create({
+  contentContainerStyle: {
+    paddingBottom: 100,
+    position: "relative",
+  },
+  container: {
+    width: Dimensions.get("window").width,
+    backgroundColor: "white",
+    flexDirection: "column",
+    paddingVertical: 0,
+    paddingHorizontal: 0,
+  },
+});
 
-export default ProfileBookmark
+ProfileBookmark.defaultProps = {
+  bookmarkList: [
+    {
+      name: "کتاب آموزشی علوم تجربی",
+      grade: "پایه ششم ابتدایی",
+      image: bookImage,
+    },
+  ],
+};