Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import React from "react";
import { useState } from "react";
import ConfirmModal from "../../../../shared/confirm-modal/ConfirmModal";

const FeedCommentTemplate = ({ onDeleteHandler, commentData }) => {

  const {
    user_name,
    user_url,
    user_image,
    link_delete,
    time_elapsed,
    comment,
    unique,
  } = commentData;

  const [showConfirmModal, setShowConfirmModal] = useState(false);

  const handleShowConfirmModal = () => setShowConfirmModal(!showConfirmModal)

  const handleModalAccept = () => onDeleteHandler(unique, link_delete)

  return (
    <React.Fragment>
      <li>
        <div className="comment-list">
          <div className={`comment comment-${unique}`}>
            <div className='commentHeader'>
              <img
                src={user_image}
                alt="user-image"
                className='userImage'
              />
              <div className='info'>
                <a href={user_url}>
                  <h3>{user_name}</h3>
                </a>
                <span>
                  <img
                    src="/images/clock.png"
                    alt=""
                    style={{ marginRight: ".2rem" }}
                  />
                  {time_elapsed}
                  {link_delete &&
                    <button
                      href="#"
                      className="btn-comment-trash"
                      data-link={link_delete}
                      data-comment-unique={unique}
                      onClick={handleShowConfirmModal}
                    >
                      <i className="fa fa-trash"></i>
                    </button>
                  }
                </span>
              </div>
            </div>
            <p>{comment}</p>
          </div>
        </div>
      </li>
      <ConfirmModal
        show={showConfirmModal}
        onClose={() => setShowConfirmModal(false)}
        onAccept={handleModalAccept}
        acceptLabel="Aceptar"
      />
    </React.Fragment >
  );
};

export default FeedCommentTemplate;