Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 1659 | Rev 1661 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1657 stevensc 1 
import React, { useMemo, useState } from 'react'
1650 stevensc 2 
import { Link } from 'react-router-dom'
1657 stevensc 3 
import { useDispatch, useSelector } from 'react-redux'
1650 stevensc 4 
 
1657 stevensc 5 
import { axios } from '@app/utils'
6 
import { addNotification } from '@app/redux/notification/notification.actions'
7 
import { removeComment } from '@app/redux/feed/feed.actions'
8 
import { showReportModal } from '@app/redux/report/report.actions'
9 
 
1650 stevensc 10 
import { StyledCommentList, StyledCommentTemplate } from './comments-ui'
11 
import Options from '@app/components/UI/Option'
12 
import ConfirmModal from '@app/components/modals/ConfirmModal'
13 
 
1657 stevensc 14 
export default function CommentsList({ comments }) {
1650 stevensc 15 
  return (
16 
    <>
17 
      <StyledCommentList>
18 
        {comments.map((comment) => {
19 
          return (
20 
            <li key={comment.unique}>
1657 stevensc 21 
              <CommentsList.Item comment={comment} />
1650 stevensc 22 
            </li>
23 
          )
24 
        })}
25 
      </StyledCommentList>
26 
    </>
27 
  )
28 
}
29 
 
1657 stevensc 30 
function Comment({ comment }) {
1650 stevensc 31 
  const {
32 
    unique,
33 
    user_url,
34 
    user_name,
35 
    time_elapsed,
36 
    comment: content,
1657 stevensc 37 
    link_delete,
38 
    link_abuse_report,
39 
    feedId
1650 stevensc 40 
  } = comment
1657 stevensc 41 
  const [showConfirmModal, setShowConfirmModal] = useState(false)
42 
  const labels = useSelector(({ intl }) => intl.labels)
43 
  const dispatch = useDispatch()
1650 stevensc 44 
 
1657 stevensc 45 
  const toggleModal = () => setShowConfirmModal(!showConfirmModal)
46 
 
47 
  const reportComment = () =>
48 
    dispatch(
49 
      showReportModal({
50 
        reportUrl: link_abuse_report,
51 
        type: 'Comentario',
52 
        onComplete: () => dispatch(removeComment({ commentId: unique, feedId }))
53 
      })
54 
    )
55 
 
56 
  const deleteComment = ({ id, deleteUrl }) => {
57 
    axios
58 
      .post(deleteUrl)
59 
      .then((response) => {
60 
        const { success, data } = response.data
61 
 
62 
        if (!success) {
63 
          const errorMessage =
64 
            typeof data === 'string'
65 
              ? data
66 
              : 'Error interno. Intente más tarde.'
67 
          throw new Error(errorMessage)
68 
        }
69 
 
70 
        dispatch(addNotification({ style: 'success', msg: data }))
71 
        dispatch(removeComment({ feedId, commentId: id }))
72 
      })
73 
      .catch((error) => {
74 
        dispatch(addNotification({ style: 'danger', msg: error.message }))
75 
      })
1650 stevensc 76 
  }
77 
 
1660 stevensc 78 
  const actions = useMemo(() => {
79 
    const options = []
80 
    if (link_delete) {
81 
      options.push({ label: 'Borrar', action: toggleModal })
82 
    }
83 
 
84 
    if (link_abuse_report) {
85 
      options.push({ label: 'Reportar', action: reportComment })
86 
    }
87 
 
88 
    return options
89 
  }, [link_delete, link_abuse_report])
90 
 
1650 stevensc 91 
  return (
92 
    <>
93 
      <StyledCommentTemplate>
94 
        <div className='content'>
95 
          <div className='info'>
96 
            <Link to={user_url}>
97 
              <h3>{user_name}</h3>
98 
            </Link>
99 
            <span>{time_elapsed}</span>
100 
          </div>
1657 stevensc 101 
 
1660 stevensc 102 
          <Options options={actions} />
1657 stevensc 103 
 
1650 stevensc 104 
          <p>{content}</p>
105 
        </div>
106 
      </StyledCommentTemplate>
1657 stevensc 107 
 
1650 stevensc 108 
      <ConfirmModal
109 
        show={showConfirmModal}
110 
        onClose={toggleModal}
1657 stevensc 111 
        onAccept={() => deleteComment({ id: unique, deleteUrl: link_delete })}
1650 stevensc 112 
        acceptLabel={labels.accept}
113 
      />
114 
    </>
115 
  )
116 
}
117 
 
118 
CommentsList.Item = Comment