Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3244 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3244 Rev 3719
Línea 1... Línea 1...
1 
import React, { useState } from 'react'
 1 
import React, { useState } from 'react';
2 
import { useNavigate } from 'react-router-dom'
 2 
import { useNavigate } from 'react-router-dom';
3 
import { useDispatch } from 'react-redux'
 3 
import { useDispatch } from 'react-redux';
4 
import { Typography } from '@mui/material'
 4 
import { Typography } from '@mui/material';
5 
 
 5 
 
6 
import { useGoals } from '@hooks'
 6 
import { useGoals } from '@hooks';
7 
import { deleteGoal } from '@services/habits/goals'
 7 
import { deleteGoal } from '@services/habits/goals';
8 
import { addNotification } from '@store/notification/notification.actions'
 8 
import { addNotification } from '@store/notification/notification.actions';
9 
 
 9 
 
10 
import Widget from '@app/components/UI/Widget'
 10 
import Widget from '@app/components/UI/Widget';
11 
import Options from '@components/UI/Option'
 11 
import Options from '@components/UI/Option';
12 
import ConfirmModal from '@components/modals/ConfirmModal'
 12 
import ConfirmModal from '@components/modals/ConfirmModal';
13 
 
 13 
 
14 
export default function GoalItem({
 14 
export default function GoalItem({
15 
  goal: {
 15 
  goal: {
16 
    id = 1,
 16 
    id = 1,
17 
    name = 'Test',
 17 
    name = 'Test',
18 
    description = 'Prueba',
 18 
    description = 'Prueba',
19 
    actions = {
 19 
    actions = {
20 
      link_edit:
 20 
      link_edit:
21 
        'https://dev-services.leaderslinked.com/habits/goals/edit/cfede10c-f576-4a06-bbba-282ee88011fd',
 21 
        'https://dev-services.leaderslinked.com/habits/goals/edit/cfede10c-f576-4a06-bbba-282ee88011fd',
22 
      link_delete:
 22 
      link_delete:
23 
        'https://dev-services.leaderslinked.com/habits/goals/delete/cfede10c-f576-4a06-bbba-282ee88011fd'
 23 
        'https://dev-services.leaderslinked.com/habits/goals/delete/cfede10c-f576-4a06-bbba-282ee88011fd'
24 
    }
 24 
    }
25 
  }
 25 
  }
26 
}) {
 26 
}) {
27 
  const [show, setShow] = useState(false)
 27 
  const [show, setShow] = useState(false);
28 
  const navigate = useNavigate()
 28 
  const navigate = useNavigate();
29 
  const dispatch = useDispatch()
 29 
  const dispatch = useDispatch();
30 
 
 30 
 
31 
  const { deleteGoal: removeGoal, getGoalById } = useGoals()
 31 
  const { deleteGoal: removeGoal, getGoalById } = useGoals();
32 
  const currentGoal = getGoalById(id)
 32 
  const currentGoal = getGoalById(id);
33 
 
 33 
 
34 
  const toggleConfirmModal = () => setShow(!show)
 34 
  const toggleConfirmModal = () => setShow(!show);
35 
 
 35 
 
36 
  const handleDelete = async () => {
 36 
  const handleDelete = async () => {
37 
    try {
 37 
    try {
38 
      const response = await deleteGoal(currentGoal.actions.link_delete)
 38 
      const response = await deleteGoal(currentGoal.actions.link_delete);
39 
      dispatch(addNotification({ style: 'success', msg: response }))
 39 
      dispatch(addNotification({ style: 'success', msg: response }));
40 
      removeGoal(id)
 40 
      removeGoal(id);
41 
    } catch (error) {
 41 
    } catch (error) {
42 
      dispatch(addNotification({ style: 'danger', msg: error.message }))
 42 
      dispatch(addNotification({ style: 'danger', msg: error.message }));
43 
    }
 43 
    }
44 
  }
 44 
  };
45 
 
 45 
 
46 
  return (
 46 
  return (
47 
    <>
 47 
    <>
48 
      <Widget>
 48 
      <Widget>
49 
        <Widget.Header
 49 
        <Widget.Header
50 
          title={name}
 50 
          title={name}
51 
          renderAction={() => (
 51 
          renderAction={() => (
52 
            <Options>
 52 
            <Options>
53 
              {actions.link_edit && (
 53 
              {actions.link_edit && (
54 
                <Options.Item onClick={() => navigate(`edit/${id}`)}>
 54 
                <Options.Item onClick={() => navigate(`edit/${id}`)}>Editar</Options.Item>
55 
                  Editar
 - 
 
56 
                </Options.Item>
 - 
 
57 
              )}
 55 
              )}
58 
              {actions.link_delete && (
 56 
              {actions.link_delete && (
59 
                <Options.Item onClick={toggleConfirmModal}>Borrar</Options.Item>
 57 
                <Options.Item onClick={toggleConfirmModal}>Borrar</Options.Item>
60 
              )}
 58 
              )}
61 
            </Options>
 59 
            </Options>
62 
          )}
 60 
          )}
63 
        />
 61 
        />
64 
        <Widget.Body>
 62 
        <Widget.Body>
65 
          <Typography>{description}</Typography>
 63 
          <Typography>{description}</Typography>
66 
        </Widget.Body>
 64 
        </Widget.Body>
67 
      </Widget>
 65 
      </Widget>
68 
      <ConfirmModal
 66 
      <ConfirmModal
69 
        show={show}
 67 
        show={show}
70 
        onClose={toggleConfirmModal}
 68 
        onClose={toggleConfirmModal}
71 
        title='Borrar'
 69 
        title='Borrar'
72 
        message='¿Estás seguro de que quieres borrar esta meta?'
 70 
        message='¿Estás seguro de que quieres borrar esta meta?'
73 
        onAccept={handleDelete}
 71 
        onAccept={handleDelete}
74 
      />
 72 
      />
75 
    </>
 73 
    </>
76 
  )
 74 
  );
77 
}
 75 
}