You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.1 KiB
39 lines
1.1 KiB
import React, {useEffect, useState} from 'react';
|
|
import { TouchableOpacity, View } from 'react-native';
|
|
import {AntDesign} from "@expo/vector-icons";
|
|
import {addLikeArtist, getLikeArtist, removeArtist} from '../../AsyncStorage/likeArtistStorage';
|
|
|
|
const LikeButton = ({ artist }) => {
|
|
const [isLiked, setIsLiked] = useState(false);
|
|
const [likedArtists, setLikedArtists] = useState([]);
|
|
|
|
useEffect(() => {
|
|
const fetchLikedArtists = async () => {
|
|
const artists = await getLikeArtist();
|
|
setLikedArtists(artists);
|
|
setIsLiked(artists.some((a) => a._id === artist._id));
|
|
};
|
|
fetchLikedArtists();
|
|
}, [artist]);
|
|
|
|
const handleLike = () => {
|
|
setIsLiked(true);
|
|
addLikeArtist(artist);
|
|
};
|
|
|
|
const handleDislike = () => {
|
|
setIsLiked(false);
|
|
removeArtist(artist._id);
|
|
};
|
|
|
|
return (
|
|
<TouchableOpacity onPress={isLiked ? handleDislike : handleLike}>
|
|
<View>
|
|
<AntDesign name="heart" size={24} color={isLiked ? 'gold' : 'black'} />
|
|
</View>
|
|
</TouchableOpacity>
|
|
);
|
|
}
|
|
|
|
|
|
export default LikeButton; |