Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5577 | Rev 5668 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 5577 Rev 5667
Línea 1... Línea 1...
1 
import React, { useState } from 'react'
 1 
import React, { useState } from 'react'
2 
import RecommendIcon from '@mui/icons-material/Recommend'
 2 
import RecommendIcon from '@mui/icons-material/Recommend'
3 
import FavoriteIcon from '@mui/icons-material/Favorite'
 3 
import FavoriteIcon from '@mui/icons-material/Favorite'
4 
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
 4 
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
Línea -... Línea 5...
- 
 
 5 
 
5 
 
 6 
export const ReactionButton = () => {
- 
 
 7 
  const [settedReaction, setSettedReaction] = useState({
- 
 
 8 
    type: 'r',
- 
 
 9 
    icon: RecommendIcon,
- 
 
 10 
  })
6 
const withReaction = (Component, currentReaction) => {
 11 
 
- 
 
 12 
  const { icon: ReactionIcon } = settedReaction
- 
 
 13 
 
- 
 
 14 
  const reactions = [
- 
 
 15 
    {
- 
 
 16 
      type: 'r',
- 
 
 17 
      icon: RecommendIcon,
- 
 
 18 
    },
- 
 
 19 
    {
- 
 
 20 
      type: 'f',
- 
 
 21 
      icon: FavoriteIcon,
- 
 
 22 
    },
- 
 
 23 
    {
- 
 
 24 
      type: 'v',
- 
 
 25 
      icon: VolunteerActivismIcon,
- 
 
 26 
    },
- 
 
 27 
  ]
7 
  const [reaction, setReaction] = useState(currentReaction)
 28 
 
8 
  return (
 29 
  return (
9 
    <>
 30 
    <button type="button" className="reaction-btn">
- 
 
 31 
      <div className="reactions-list">
- 
 
 32 
        {reactions.map((reaction) => {
- 
 
 33 
          const { icon: Icon } = reaction
10 
      <div className="reactions-list">
 34 
 
- 
 
 35 
          return (
- 
 
 36 
            <button
- 
 
 37 
              key={reaction.type}
- 
 
 38 
              onClick={() => setSettedReaction(reaction)}
11 
        <RecommendIcon />
 39 
            >
12 
        <FavoriteIcon />
 40 
              <Icon />
- 
 
 41 
            </button>
- 
 
 42 
          )
13 
        <VolunteerActivismIcon />
 43 
        })}
14 
      </div>
 44 
      </div>
15 
      <Component reaction />
 - 
 
16 
    </>
 - 
 
17 
  )
 - 
 
18 
}
 - 
 
19 
const LikeButton = ({ currentReactions, isLiked }) => {
 - 
 
20 
  return (
 - 
 
21 
    <button
 - 
 
22 
      type="button"
 - 
 
23 
      id={feedIsLiked ? `btn-unlike-${feed_unique}` : `btn-like-${feed_unique}`}
 - 
 
24 
      className={feedIsLiked ? 'btn-unlike' : 'btn-like'}
 - 
 
25 
      onClick={() => likeHandler(feedIsLiked ? feed_unlike_url : feed_like_url)}
 - 
 
26 
    >
 - 
 
27 
      {isLiked ? (
 - 
 
28 
        <i className="mr-1 fa fa-heart" />
 - 
 
29 
      ) : (
 - 
 
30 
        <i className="mr-1 fa fa-heart-o" />
 - 
 
31 
      )}
 - 
 
32 
      {currentReactions}
 45 
      <ReactionIcon />
33 
    </button>
 46 
    </button>
34 
  )
 47 
  )
35 
}
 - 
 
36 
 
 -