|
|
import { |
|
|
View, |
|
|
Text, |
|
|
Pressable, |
|
|
Appearance, |
|
|
SafeAreaView, |
|
|
ScrollView, |
|
|
StyleSheet, |
|
|
Platform, |
|
|
Dimensions, |
|
|
StatusBar, |
|
|
Image, |
|
|
mobile, |
|
|
} 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"; |
|
|
import { userFavorite } from "../../../../redux/actions"; |
|
|
|
|
|
//components |
|
|
import Navbar from "../../../../components/Navbar"; |
|
|
import Empty from "../../../../components/Empty"; |
|
|
|
|
|
//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 ios = Platform.OS === "ios"; |
|
|
|
|
|
const ProfileBookmark = ({ bookmarkList, getList }) => { |
|
|
React.useEffect(() => { |
|
|
getList(); |
|
|
}, []); |
|
|
|
|
|
return ( |
|
|
<SafeAreaView |
|
|
style={{ |
|
|
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, |
|
|
}} |
|
|
/> |
|
|
{bookmarkList?.length > 0 ? ( |
|
|
<ScrollView |
|
|
contentContainerStyle={styles.contentContainerStyle} |
|
|
style={styles.container} |
|
|
> |
|
|
<View style={tw("w-full mt-2 px-4")}> |
|
|
<View style={tw("p-0 m-0 flex")}> |
|
|
{bookmarkList?.map((bookmark, index) => ( |
|
|
<Bookmark key={index} bookmark={bookmark} /> |
|
|
))} |
|
|
</View> |
|
|
</View> |
|
|
</ScrollView> |
|
|
) : ( |
|
|
<Empty text="لیست علاقهمندیها خالی است." /> |
|
|
)} |
|
|
</SafeAreaView> |
|
|
); |
|
|
}; |
|
|
|
|
|
const Bookmark = ({ bookmark }) => { |
|
|
const colorScheme = Appearance.getColorScheme(); |
|
|
|
|
|
return ( |
|
|
<Pressable |
|
|
style={[ |
|
|
tw("flex flex-row-reverse rounded-md justify-between px-3.5 py-2 bg-red-100"), |
|
|
{ |
|
|
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 = { |
|
|
getList: userFavorite.list, |
|
|
}; |
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(ProfileBookmark); |
|
|
|
|
|
const styles = StyleSheet.create({ |
|
|
contentContainerStyle: { |
|
|
paddingBottom: 100, |
|
|
position: "relative", |
|
|
}, |
|
|
container: { |
|
|
backgroundColor: "white", |
|
|
flexDirection: "column", |
|
|
paddingVertical: 0, |
|
|
paddingHorizontal: 0, |
|
|
}, |
|
|
}); |
|
|
|
|
|
// ProfileBookmark.defaultProps = { |
|
|
// bookmarkList: [ |
|
|
// { |
|
|
// name: "کتاب آموزشی علوم تجربی", |
|
|
// grade: "پایه ششم ابتدایی", |
|
|
// image: bookImage, |
|
|
// }, |
|
|
// ], |
|
|
// };
|
|
|
|