Rev 6779 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { useEffect, useState } from 'react'
import { useSelector } from 'react-redux'
import parse from 'html-react-parser'
import IconButton from '@mui/material/IconButton'
import EditIcon from '@mui/icons-material/Edit'
import OverviewModal from './OverviewModal'
import EmptySection from '../UI/EmptySection'
const Overview = ({ overview: defaultValue, id, isEdit }) => {
const [overview, setOverview] = useState('')
const [isModalOpen, setIsModalOpen] = useState(false)
const labels = useSelector(({ intl }) => intl.labels)
const toggleModal = () => {
setIsModalOpen(!isModalOpen)
}
useEffect(() => {
setOverview(defaultValue)
}, [defaultValue])
return (
<>
<div className="profile-attr">
<div className="profile-attr-header">
<h2>Visión general</h2>
{isEdit && (
<IconButton onClick={toggleModal}>
<EditIcon />
</IconButton>
)}
</div>
{overview ? (
parse(overview)
) : (
<EmptySection align="left" message={labels.empty} />
)}
</div>
<OverviewModal
isOpen={isModalOpen}
id={id}
overview={overview}
closeModal={toggleModal}
onComplete={(newOverview) => setOverview(newOverview)}
/>
</>
)
}
export default Overview