Proyectos de Subversion LeadersLinked - SPA

Rev

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

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