Proyectos de Subversion LeadersLinked - SPA

Rev

Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3158 stevensc 1
import React, { useState } from 'react'
2
import { useNavigate } from 'react-router-dom'
3
import { useDispatch } from 'react-redux'
4
import { Typography } from '@mui/material'
5
 
6
import { useValues } from '@hooks'
7
import { deleteValue } from '@services/habits/values'
8
import { addNotification } from '@store/notification/notification.actions'
9
 
10
import Widget from '@components/UI/Widget'
11
import Options from '@components/UI/Option'
12
import ConfirmModal from '@components/modals/ConfirmModal'
13
 
14
export default function ValueItem({
15
  value: { id, name, description, actions }
16
}) {
17
  const [show, setShow] = useState(false)
18
  const navigate = useNavigate()
19
  const dispatch = useDispatch()
20
 
21
  const { removeValue, getValueById } = useValues()
22
  const currentValue = getValueById(id)
23
 
24
  const toggleConfirmModal = () => setShow(!show)
25
 
26
  const handleDelete = async () => {
27
    try {
28
      const response = await deleteValue(currentValue.actions.link_delete)
29
      dispatch(addNotification({ style: 'success', msg: response }))
30
      removeValue(id)
31
    } catch (error) {
32
      dispatch(addNotification({ style: 'danger', msg: error.message }))
33
    }
34
  }
35
 
36
  return (
37
    <>
38
      <Widget>
39
        <Widget.Header
40
          title={name}
41
          renderAction={() => (
42
            <Options>
43
              {actions.link_edit && (
44
                <Options.Item onClick={() => navigate(`edit/${id}`)}>
45
                  Editar
46
                </Options.Item>
47
              )}
48
              {actions.link_delete && (
49
                <Options.Item onClick={toggleConfirmModal}>Borrar</Options.Item>
50
              )}
51
            </Options>
52
          )}
53
        />
54
 
55
        <Widget.Body>
56
          <Typography>{description}</Typography>
57
        </Widget.Body>
58
      </Widget>
59
      <ConfirmModal
60
        show={show}
61
        onClose={toggleConfirmModal}
62
        title='Borrar'
63
        message='¿Estás seguro de que quieres borrar este valor?'
64
        onAccept={handleDelete}
65
      />
66
    </>
67
  )
68
}