Rev 5577 | Rev 5668 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { useState } from 'react'
import RecommendIcon from '@mui/icons-material/Recommend'
import FavoriteIcon from '@mui/icons-material/Favorite'
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
export const ReactionButton = () => {
const [settedReaction, setSettedReaction] = useState({
type: 'r',
icon: RecommendIcon,
})
const { icon: ReactionIcon } = settedReaction
const reactions = [
{
type: 'r',
icon: RecommendIcon,
},
{
type: 'f',
icon: FavoriteIcon,
},
{
type: 'v',
icon: VolunteerActivismIcon,
},
]
return (
<button type="button" className="reaction-btn">
<div className="reactions-list">
{reactions.map((reaction) => {
const { icon: Icon } = reaction
return (
<button
key={reaction.type}
onClick={() => setSettedReaction(reaction)}
>
<Icon />
</button>
)
})}
</div>
<ReactionIcon />
</button>
)
}