Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7217 | Rev 7220 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
7212 stevensc 1 
import React, { useEffect, useRef, useState } from 'react'
7209 stevensc 2 
import { axios } from '../../utils'
7213 stevensc 3 
import { useHistory, useLocation } from 'react-router-dom'
7209 stevensc 4 
import { addNotification } from '../../redux/notification/notification.actions'
7212 stevensc 5 
import { useDispatch, useSelector } from 'react-redux'
6 
import { Col, Container, Row } from 'react-bootstrap'
7218 stevensc 7 
import styled from 'styled-components'
8 
 
7212 stevensc 9 
import QuestionCard from '../../components/my-coach/QuestionCard'
10 
import ConfirmModal from '../../components/modals/ConfirmModal'
7217 stevensc 11 
import AnswerCard from '../../components/my-coach/AnswerCard'
7209 stevensc 12 
 
7218 stevensc 13 
const StyledSection = styled(Col)`
14 
  display: flex;
15 
  flex-direction: column;
16 
  gap: 0.5rem;
17 
  margin: auto;
18 
`
19 
 
7209 stevensc 20 
const MyCoachViewPage = () => {
7212 stevensc 21 
  const [question, setQuestion] = useState({})
7216 stevensc 22 
  const [answers, setAnswers] = useState([])
7212 stevensc 23 
  const [modalShow, setModalShow] = useState(null)
24 
  const addUrl = useRef('')
25 
  const actionUrl = useRef('')
26 
  const labels = useSelector(({ intl }) => intl.labels)
7209 stevensc 27 
  const dispatch = useDispatch()
28 
  const { pathname } = useLocation()
7213 stevensc 29 
  const history = useHistory()
7209 stevensc 30 
 
31 
  const getQuestion = () => {
32 
    axios
7211 stevensc 33 
      .get(pathname, {
7209 stevensc 34 
        headers: {
35 
          'Content-Type': 'application/json',
36 
        },
37 
      })
38 
      .then((response) => {
39 
        const { data, success } = response.data
40 
 
41 
        if (!success) {
42 
          const errorMessage =
43 
            typeof data === 'string'
44 
              ? data
45 
              : 'Error interno. Por favor, inténtelo de nuevo más tarde.'
46 
 
47 
          dispatch(addNotification({ style: 'danger', msg: errorMessage }))
48 
          return
49 
        }
50 
 
7212 stevensc 51 
        addUrl.current = data.link_answers_add
52 
        setQuestion(data)
7209 stevensc 53 
      })
54 
      .catch((error) => {
55 
        dispatch(
56 
          addNotification({
57 
            style: 'danger',
58 
            msg: 'Error interno. Por favor, inténtelo de nuevo más tarde.',
59 
          })
60 
        )
61 
        throw new Error(error)
62 
      })
63 
  }
64 
 
7212 stevensc 65 
  const confirmDelete = () => {
66 
    axios
67 
      .post(actionUrl.current)
68 
      .then((response) => {
69 
        const { data, success } = response.data
70 
 
71 
        if (!success) {
72 
          const errorMessage =
73 
            typeof data === 'string'
74 
              ? data
75 
              : 'Ha ocurrido un error, por favor intente más tarde.'
76 
 
77 
          dispatch(addNotification({ style: 'danger', msg: errorMessage }))
78 
          return
79 
        }
80 
 
7213 stevensc 81 
        closeModal()
7212 stevensc 82 
        dispatch(addNotification({ style: 'success', msg: data }))
7214 stevensc 83 
        history.replace('/my-coach')
7212 stevensc 84 
      })
85 
      .catch((error) => {
86 
        dispatch(
87 
          addNotification({
88 
            style: 'danger',
89 
            msg: 'Ha ocurrido un error, por favor intente más tarde.',
90 
          })
91 
        )
92 
        throw new Error(error)
93 
      })
94 
  }
95 
 
96 
  const deleteQuestion = (url) => {
97 
    actionUrl.current = url
98 
    setModalShow('delete')
99 
  }
100 
 
101 
  const editQuestion = (url) => {
102 
    actionUrl.current = url
103 
    setModalShow('edit')
104 
  }
105 
 
106 
  const closeModal = () => {
107 
    actionUrl.current = ''
108 
    setModalShow(null)
109 
  }
110 
 
7209 stevensc 111 
  useEffect(() => {
112 
    getQuestion()
113 
  }, [])
114 
 
7216 stevensc 115 
  useEffect(() => {
116 
    if (question.link_answers) {
117 
      axios
118 
        .get(question.link_answers)
119 
        .then((response) => {
120 
          const { data, success } = response.data
121 
 
122 
          if (!success) {
123 
            const errorMessage =
124 
              typeof data === 'string'
125 
                ? data
126 
                : 'Error interno. Por favor, inténtelo de nuevo más tarde.'
127 
 
128 
            dispatch(addNotification({ style: 'danger', msg: errorMessage }))
129 
            return
130 
          }
131 
 
7217 stevensc 132 
          setAnswers(data.items)
7216 stevensc 133 
        })
134 
        .catch((error) => {
135 
          dispatch(
136 
            addNotification({
137 
              style: 'danger',
138 
              msg: 'Error interno. Por favor, inténtelo de nuevo más tarde.',
139 
            })
140 
          )
141 
          throw new Error(error)
142 
        })
143 
    }
144 
  }, [question])
145 
 
7212 stevensc 146 
  return (
147 
    <>
148 
      <Container as="section" className="companies-info">
149 
        <div className="company-title">
150 
          <h1 className="title mx-auto">{labels.my_coach}</h1>
151 
        </div>
152 
        <Row>
7218 stevensc 153 
          <StyledSection md="8">
7212 stevensc 154 
            <QuestionCard
155 
              key={question.uuid}
156 
              onEdit={editQuestion}
157 
              onDelete={deleteQuestion}
158 
              {...question}
159 
            />
7217 stevensc 160 
            {answers.map((answer) => (
161 
              <AnswerCard key={answer.unique} {...answer} />
162 
            ))}
7218 stevensc 163 
          </StyledSection>
7212 stevensc 164 
        </Row>
165 
      </Container>
166 
      <ConfirmModal
167 
        show={modalShow === 'delete'}
168 
        onClose={closeModal}
169 
        onAccept={confirmDelete}
170 
      />
171 
    </>
172 
  )
7209 stevensc 173 
}
174 
 
175 
export default MyCoachViewPage