Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 3945 Rev 3947
Línea 3... Línea 3...
3 
import React, { useState } from 'react'
 3 
import React, { useState } from 'react'
4 
import { useForm } from 'react-hook-form'
 4 
import { useForm } from 'react-hook-form'
5 
import { TbSend } from 'react-icons/tb'
 5 
import { TbSend } from 'react-icons/tb'
6 
import { connect } from 'react-redux'
 6 
import { connect } from 'react-redux'
7 
import { addNotification } from '../../../../redux/notification/notification.actions'
 7 
import { addNotification } from '../../../../redux/notification/notification.actions'
- 
 
 8 
import ConfirmModal from '../../../../shared/confirm-modal/ConfirmModal'
8 
import FormErrorFeedback from '../../../../shared/form-error-feedback/FormErrorFeedback'
 9 
import FormErrorFeedback from '../../../../shared/form-error-feedback/FormErrorFeedback'
9 
import FeedCommentTemplate from './FeedCommentTemplate'
 - 
 
Línea 10... Línea 10...
10 
 
 10 
 
11 
const FeedCommentSection = ({
 11 
const FeedCommentSection = ({
12 
    image = '',
 12 
    image = '',
13 
    addUrl = '',
 13 
    addUrl = '',
Línea 19... Línea 19...
19 
    const [commentsState, setCommentsState] = useState(comments);
 19 
    const [commentsState, setCommentsState] = useState(comments);
Línea 20... Línea 20...
20 
 
 20 
 
Línea 21... Línea 21...
21 
    const submitCommentHandler = (data) => {
 21 
    const submitCommentHandler = (data) => {
22 
 
 22 
 
Línea 23... Línea 23...
23 
        const currentFormData = new FormData();
 23 
        const currentFormData = new FormData();
24 
        Object.entries(data).forEach(([key, value])=> currentFormData.append(key, value))
 24 
        Object.entries(data).forEach(([key, value]) => currentFormData.append(key, value))
25 
 
 25 
 
Línea 90... Línea 90...
90 
        <div className='commentSection'>
 90 
        <div className='commentSection'>
91 
            <div className={`comment-sec comment-sec`}>
 91 
            <div className={`comment-sec comment-sec`}>
92 
                <ul>
 92 
                <ul>
93 
                    {comments.reverse().map((comment) => {
 93 
                    {comments.reverse().map((comment) => {
94 
                        return (
 94 
                        return (
95 
                            <FeedCommentTemplate
 95 
                            <FeedCommentSection.CommentTemplate
96 
                                commentData={comment}
 96 
                                commentData={comment}
97 
                                onDeleteHandler={deleteCommentHandler}
 97 
                                onDeleteHandler={deleteCommentHandler}
98 
                                key={comment.unique}
 98 
                                key={comment.unique}
99 
                            />
 99 
                            />
100 
                        );
 100 
                        );
Línea 103... Línea 103...
103 
            </div>
 103 
            </div>
104 
        </div>
 104 
        </div>
105 
    )
 105 
    )
106 
}
 106 
}
Línea -... Línea 107...
- 
 
 107 
 
- 
 
 108 
const CommentTemplate = ({ onDeleteHandler, commentData }) => {
- 
 
 109 
 
- 
 
 110 
    const {
- 
 
 111 
        user_name,
- 
 
 112 
        user_url,
- 
 
 113 
        user_image,
- 
 
 114 
        link_delete,
- 
 
 115 
        time_elapsed,
- 
 
 116 
        comment,
- 
 
 117 
        unique,
- 
 
 118 
    } = commentData;
- 
 
 119 
 
- 
 
 120 
    const [showConfirmModal, setShowConfirmModal] = useState(false);
- 
 
 121 
 
- 
 
 122 
    const handleShowConfirmModal = () => setShowConfirmModal(!showConfirmModal)
- 
 
 123 
 
- 
 
 124 
    const handleModalAccept = () => onDeleteHandler(unique, link_delete)
- 
 
 125 
 
- 
 
 126 
    return (
- 
 
 127 
        <>
- 
 
 128 
            <li>
- 
 
 129 
                <div className="comment-list">
- 
 
 130 
                    <div className={`comment comment-${unique}`}>
- 
 
 131 
                        <div className='commentHeader'>
- 
 
 132 
                            <img
- 
 
 133 
                                src={user_image}
- 
 
 134 
                                alt="user-image"
- 
 
 135 
                                className='userImage'
- 
 
 136 
                            />
- 
 
 137 
                            <div className='info'>
- 
 
 138 
                                <a href={user_url}>
- 
 
 139 
                                    <h3>{user_name}</h3>
- 
 
 140 
                                </a>
- 
 
 141 
                                <span>
- 
 
 142 
                                    <img
- 
 
 143 
                                        src="/images/clock.png"
- 
 
 144 
                                        alt="Clock"
- 
 
 145 
                                        className='mr-2'
- 
 
 146 
                                    />
- 
 
 147 
                                    {time_elapsed}
- 
 
 148 
                                    {link_delete &&
- 
 
 149 
                                        <button
- 
 
 150 
                                            className="btn-comment-trash"
- 
 
 151 
                                            onClick={handleShowConfirmModal}
- 
 
 152 
                                        >
- 
 
 153 
                                            <i className="fa fa-trash"></i>
- 
 
 154 
                                        </button>
- 
 
 155 
                                    }
- 
 
 156 
                                </span>
- 
 
 157 
                            </div>
- 
 
 158 
                        </div>
- 
 
 159 
                        <p>{comment}</p>
- 
 
 160 
                    </div>
- 
 
 161 
                </div>
- 
 
 162 
            </li>
- 
 
 163 
            <ConfirmModal
- 
 
 164 
                show={showConfirmModal}
- 
 
 165 
                onClose={() => setShowConfirmModal(false)}
- 
 
 166 
                onAccept={handleModalAccept}
- 
 
 167 
                acceptLabel="Aceptar"
- 
 
 168 
            />
- 
 
 169 
        </>
- 
 
 170 
    );
- 
 
 171 
};
- 
 
 172 
 
107 
 
 173 
 
- 
 
 174 
FeedCommentSection.CommentsList = CommentsList
Línea 108... Línea 175...
108 
FeedCommentSection.CommentsList = CommentsList
 175 
FeedCommentSection.CommentTemplate = CommentTemplate
109 
 
 176 
 
110 
const mapDispatchToProps = {
 177 
const mapDispatchToProps = {