|  |  | @ -32,9 +32,20 @@ const Navbar = ({ | 
			
		
	
		
		
			
				
					
					|  |  |  |   setBoxPosition, |  |  |  |   setBoxPosition, | 
			
		
	
		
		
			
				
					
					|  |  |  |   headerOptions, |  |  |  |   headerOptions, | 
			
		
	
		
		
			
				
					
					|  |  |  |   addToBookmark, |  |  |  |   addToBookmark, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   deleteBookmark, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   userFavoriteList, | 
			
		
	
		
		
			
				
					
					|  |  |  | }) => { |  |  |  | }) => { | 
			
		
	
		
		
			
				
					
					|  |  |  |   const navigation = useNavigation(); |  |  |  |   const navigation = useNavigation(); | 
			
		
	
		
		
			
				
					
					|  |  |  |   const colorScheme = Appearance.getColorScheme(); |  |  |  |   const colorScheme = Appearance.getColorScheme(); | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  | 
 | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   const isActiveBookmark = React.useMemo(() => { | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |     return userFavoriteList.filter((object) => | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |       headerOptions.bookmarkItem?.productId | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |         ? object.productId === headerOptions.bookmarkItem?.productId | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |         : object.contentId === headerOptions.bookmarkItem?.contentId | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |     ).length; | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   }, [headerOptions, userFavoriteList]); | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  | 
 | 
			
		
	
		
		
			
				
					
					|  |  |  |   const Button = useCallback(({ icon, route }) => { |  |  |  |   const Button = useCallback(({ icon, route }) => { | 
			
		
	
		
		
			
				
					
					|  |  |  |     return ( |  |  |  |     return ( | 
			
		
	
		
		
			
				
					
					|  |  |  |       <TouchableOpacity |  |  |  |       <TouchableOpacity | 
			
		
	
	
		
		
			
				
					|  |  | @ -242,23 +253,48 @@ const Navbar = ({ | 
			
		
	
		
		
			
				
					
					|  |  |  |             /> |  |  |  |             /> | 
			
		
	
		
		
			
				
					
					|  |  |  |           </> |  |  |  |           </> | 
			
		
	
		
		
			
				
					
					|  |  |  |         )} |  |  |  |         )} | 
			
		
	
		
		
			
				
					
					|  |  |  |         {headerOptions?.bookmark && ( |  |  |  |         {headerOptions?.bookmark && | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |           <Ionicons |  |  |  |           (isActiveBookmark ? ( | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             name="bookmark-outline" |  |  |  |             <Ionicons | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             style={tw("mr-2")} |  |  |  |               name="bookmark" | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             size={24} |  |  |  |               style={tw("mr-2")} | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             color={"#52796F"} |  |  |  |               size={24} | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             onPress={() => |  |  |  |               color={"#52796F"} | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |               headerOptions?.bookmarkItem?.contentId |  |  |  |               onPress={() => | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                 ? addToBookmark({ |  |  |  |                 headerOptions?.bookmarkItem?.contentId | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                     contentId: headerOptions?.bookmarkItem?.contentId, |  |  |  |                   ? deleteBookmark({ | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                   }) |  |  |  |                       id: userFavoriteList.filter( | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                 : addToBookmark({ |  |  |  |                         (object) => | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                     productId: headerOptions?.bookmarkItem?.productId, |  |  |  |                           object.contentId === | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |                   }) |  |  |  |                           headerOptions.bookmarkItem?.contentId | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |             } |  |  |  |                       )[0].id, | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |           /> |  |  |  |                     }) | 
			
				
				
			
		
	
		
		
			
				
					
					|  |  |  |         )} |  |  |  |                   : deleteBookmark({ | 
			
				
				
			
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                       id: userFavoriteList.filter( | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                         (object) => | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                           object.productId === | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                           headerOptions.bookmarkItem?.productId | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                       )[0].id, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                     }) | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               } | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |             /> | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |           ) : ( | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |             <Ionicons | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               name="bookmark-outline" | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               style={tw("mr-2")} | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               size={24} | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               color={"#52796F"} | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               onPress={() => | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                 headerOptions?.bookmarkItem?.contentId | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                   ? addToBookmark({ | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                       contentId: headerOptions?.bookmarkItem?.contentId, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                     }) | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                   : addToBookmark({ | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                       productId: headerOptions?.bookmarkItem?.productId, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |                     }) | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |               } | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |             /> | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |           ))} | 
			
		
	
		
		
			
				
					
					|  |  |  |         {headerOptions?.menu && ( |  |  |  |         {headerOptions?.menu && ( | 
			
		
	
		
		
			
				
					
					|  |  |  |           <Entypo name="dots-three-vertical" size={24} color="#52796F" /> |  |  |  |           <Entypo name="dots-three-vertical" size={24} color="#52796F" /> | 
			
		
	
		
		
			
				
					
					|  |  |  |         )} |  |  |  |         )} | 
			
		
	
	
		
		
			
				
					|  |  | @ -267,10 +303,13 @@ const Navbar = ({ | 
			
		
	
		
		
			
				
					
					|  |  |  |   ); |  |  |  |   ); | 
			
		
	
		
		
			
				
					
					|  |  |  | }; |  |  |  | }; | 
			
		
	
		
		
			
				
					
					|  |  |  | 
 |  |  |  | 
 | 
			
		
	
		
		
			
				
					
					|  |  |  | const mapStateToProps = (state) => ({}); |  |  |  | const mapStateToProps = (state) => ({ | 
			
				
				
			
		
	
		
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   userFavoriteList: state.userFavorite.list, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  | }); | 
			
		
	
		
		
			
				
					
					|  |  |  | 
 |  |  |  | 
 | 
			
		
	
		
		
			
				
					
					|  |  |  | const mapDispatchToProps = { |  |  |  | const mapDispatchToProps = { | 
			
		
	
		
		
			
				
					
					|  |  |  |   addToBookmark: userFavorite.add, |  |  |  |   addToBookmark: userFavorite.add, | 
			
		
	
		
		
			
				
					
					|  |  |  |  |  |  |  |   deleteBookmark: userFavorite.del, | 
			
		
	
		
		
			
				
					
					|  |  |  | }; |  |  |  | }; | 
			
		
	
		
		
			
				
					
					|  |  |  | 
 |  |  |  | 
 | 
			
		
	
		
		
			
				
					
					|  |  |  | export default connect(mapStateToProps, mapDispatchToProps)(Navbar); |  |  |  | export default connect(mapStateToProps, mapDispatchToProps)(Navbar); | 
			
		
	
	
		
		
			
				
					|  |  | 
 |