Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */

import React, { useState } from 'react'

import parse from 'html-react-parser'

import EditIcon from '@mui/icons-material/EditOutlined'

import DeleteIcon from '@mui/icons-material/DeleteOutline'

import { axios } from '../../../../../../utils'

import ConfirmationBox from '../../../../../../shared/confirmation-box/ConfirmationBox'

const ExperienceCard = ({ experience, months, isEdit = false, onEdit = () => { }, setExperiences = () => { } }) => {

  const [isShowModal, setIsShowModal] = useState(false)

  const deleteExperience = async () => {

    await axios.post(experience.link_delete)

      .then(({ data: response }) => {

        if (response.success) return setExperiences(response.data)

      });

  };

  return (

    <div className='card__items'>

      <div className="card__options-container">

        <h4>{experience.title}</h4>

        {isEdit &&

          <div className='card__options-icons position-relative'>

            <button className='button-icon' onClick={() => onEdit('Experiencia', experience.link_edit, experience.description || ' ')}>

              <EditIcon />

            </button>

            <button className='button-icon' onClick={() => setIsShowModal(true)}>

              <DeleteIcon />

            </button>

            <ConfirmationBox

              show={isShowModal}

              onClose={() => setIsShowModal(false)}

              onAccept={deleteExperience}

            />

          </div>

        }

      </div>

      <p>{experience.company}</p>

      <span>{`${typeof experience.industry === 'object' ? experience.industry.name : experience.industry} / ${experience.size}`}</span>

      <span>

        {`${months[experience.from_month - 1]} ${experience.from_year}`} -{' '}

        {experience.to_year ? `${months[experience.to_month - 1]} ${experience.to_year}` : 'Actual'}

      </span>

      <p>{experience.formatted_adress}</p>

      {experience.description && parse(experience.description)}

    </div>

  )

}

export default ExperienceCard