Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3639 | Rev 3816 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3639 Rev 3814
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { useState } from "react";
 2 
import React, { useState } from "react";
- 
 
 3 
import { axios } from "../utils";
3 
import { addNotification } from "../redux/notification/notification.actions";
 4 
import { addNotification } from "../redux/notification/notification.actions";
4 
import ConfirmationBox from "../shared/confirmation-box/ConfirmationBox";
 5 
import ConfirmationBox from "../shared/confirmation-box/ConfirmationBox";
5 
import Spinner from "../shared/loading-spinner/Spinner";
 6 
import Spinner from "../shared/loading-spinner/Spinner";
6 
import { axios } from "../utils";
 - 
 
7 
import styled from 'styled-components'
 7 
import styled from 'styled-components'
Línea 8... Línea 8...
8 
 
 8 
 
9 
const StyledSpinnerContainer = styled.div`
 9 
const StyledSpinnerContainer = styled.div`
10 
  position: absolute;
 10 
  position: absolute;
Línea 16... Línea 16...
16 
  display: flex;
 16 
  display: flex;
17 
  justify-content: center;
 17 
  justify-content: center;
18 
  align-items: center;
 18 
  align-items: center;
19 
  z-index: 300;
 19 
  z-index: 300;
20 
`;
 20 
`;
- 
 
 21 
 
- 
 
 22 
 
21 
const Profile = (props) => {
 23 
const Profile = ({
22 
  // props destructuring
 - 
 
23 
  const {
 - 
 
24 
    image,
 24 
  image,
25 
    name,
 25 
  name,
26 
	email,
26 
  email,
27 
	network,
 27 
  network,
28 
    status,
 28 
  status,
29 
    link_view,
 29 
  link_view,
30 
    link_edit,
 30 
  link_edit,
31 
    link_delete,
 31 
  link_delete,
32 
    link_cancel,
 32 
  link_cancel,
33 
    link_block,
 33 
  link_block,
34 
    link_reject,
 34 
  link_reject,
35 
    link_accept,
 35 
  link_accept,
36 
    link_inmail,
 36 
  link_inmail,
37 
    link_request,
 37 
  link_request,
38 
    link_unblock,
 38 
  link_unblock,
39 
    link_unfollow,
 39 
  link_unfollow,
40 
    link_approve,
 40 
  link_approve,
41 
    link_leave,
 41 
  link_leave,
42 
    link_admin,
 42 
  link_admin,
43 
	link_impersonate,
 43 
  link_impersonate,
44 
    fetchCallback,
 44 
  fetchCallback,
45 
    isTopData = false,
 45 
  isTopData = false,
46 
    btnAcceptTitle = 'Ver perfil',
 46 
  btnAcceptTitle = 'Ver perfil',
47 
    btnCancelTitle = 'Borrar perfil',
 47 
  btnCancelTitle = 'Borrar perfil',
48 
    btnEditTitle = 'Editar perfil'
 48 
  btnEditTitle = 'Editar perfil'
49 
  } = props;
 49 
}) => {
Línea 50... Línea 50...
50 
 
 50 
 
51 
  const getImpersonateUrl = async (url = '') => {
 51 
  const getImpersonateUrl = async (url = '') => {
52 
    try {
 52 
    try {
53 
      const { data } = await axios.get(url)
 53 
      const { data } = await axios.get(url)
54 
      if (data.success) window.location.href = data.data;
 54 
      if (data.success) window.location.href = data.data;
55 
    } catch (error) {
 55 
    } catch (error) {
56 
      console.log('>>: error > ', error)
 56 
      console.log('>>: error > ', error)
57 
    }
 57 
    }
Línea 58... Línea -...
58 
  }
 - 
 
59 
 
 58 
  }
60 
  // states
 - 
 
61 
  const [showConfirmationBox, setShowConfirmationBox] = useState(false);
 - 
 
62 
  const [showCancelConfirmationBox, setShowCancelConfirmationBox] = useState(false);
 - 
 
63 
  const [showBlockConfirmationBox, setShowBlockConfirmationBox] = useState(false);
 - 
 
64 
  const [showRejectConfirmationBox, setShowRejectConfirmationBox] = useState(false);
 - 
 
65 
  const [showApproveConfirmationBox, setShowApproveConfirmationBox] = useState(false);
 - 
 
66 
  const [showRequestConfirmationBox, setShowRequestConfirmationBox] = useState(false);
 - 
 
67 
  const [showUnblockConfirmationBox, setShowUnblockConfirmationBox] = useState(false);
 - 
 
68 
  const [showLeaveConfirmationBox, setShowLeaveConfirmationBox] = useState(false);
 59 
 
- 
 
 60 
  const [showConfirmationBox, setShowConfirmationBox] = useState(null)
69 
 
 61 
  const [loading, setLoading] = useState(false)
70 
  const [loading, setLoading] = useState(false)
 - 
 
71 
  const handleShowConfirmationBox = (show = !showConfirmationBox) => {
 62 
 
72 
    setShowConfirmationBox(show);
 63 
  const handleShowConfirmation = (type) => setShowConfirmationBox(type)
73 
  };
 64 
 
74 
  const handleCancelConfirmationBox = (show = !showConfirmationBox) => {
 65 
  const linkOptions = {
75 
    setShowCancelConfirmationBox(show);
 66 
    view: link_view,
76 
  };
 67 
    edit: link_edit,
77 
  const handleBlockConfirmationBox = (show = !showConfirmationBox) => {
 - 
 
78 
    setShowBlockConfirmationBox(show);
 68 
    delete: link_delete,
79 
  };
 69 
    cancel: link_cancel,
80 
  const handleRejectConfirmationBox = (show = !showConfirmationBox) => {
 - 
 
81 
    setShowRejectConfirmationBox(show);
 70 
    block: link_block,
82 
  };
 71 
    reject: link_reject,
83 
  const handleApproveConfirmationBox = (show = !showConfirmationBox) => {
 - 
 
84 
    setShowApproveConfirmationBox(show);
 72 
    accept: link_accept,
85 
  };
 73 
    inmail: link_inmail,
86 
  const handleRequestConfirmationBox = (show = !showConfirmationBox) => {
 - 
 
87 
    setShowRequestConfirmationBox(show);
 74 
    request: link_request,
88 
  };
 75 
    unblock: link_unblock,
89 
  const handleUnblockConfirmationBox = (show = !showConfirmationBox) => {
 - 
 
90 
    setShowUnblockConfirmationBox(show);
 76 
    unfollow: link_unfollow,
91 
  };
 77 
    approve: link_approve,
92 
  const handleLeaveConfirmationBox = (show = !showConfirmationBox) => {
 78 
    leave: link_leave,
Línea 93... Línea 79...
93 
    setShowLeaveConfirmationBox(show);
 79 
    admin: link_admin,
94 
  };
 80 
  }
95 
 
 81 
 
96 
  const handleCancelApply = (url = link_delete) => {
 82 
  const handleCancelApply = (url = link_delete) => {
Línea 143... Línea 129...
143 
  }
 129 
  }
Línea 144... Línea 130...
144 
 
 130 
 
145 
  return (
 131 
  return (
146 
    <div className='profile_info'>
 132 
    <div className='profile_info'>
147 
      <div className={`${image ? 'd-flex' : 'd-block'} position-relative`}>
 133 
      <div className={`${image ? 'd-flex' : 'd-block'} position-relative`}>
148 
        {!!image &&
 134 
        {image &&
149 
          <div className='profile_info_header_imgContainer'>
 135 
          <div className='profile_info_header_imgContainer'>
150 
            <img src={image} className="object-fit-contain" style={{ maxHeight: '100px' }} alt="group image" />
 136 
            <img src={image} className="object-fit-contain" style={{ maxHeight: '100px' }} alt="group image" />
151 
          </div>
 137 
          </div>
152 
        }
 138 
        }
153 
        <div
 139 
        <div
154 
          className={`${image ? 'col-8 d-flex flex-column align-items-start' : 'col-12'} ${isTopData ? 'justify-content-end' : 'justify-content-center'}`}>
 140 
          className={`${image ? 'col-8 d-flex flex-column align-items-start' : 'col-12'} ${isTopData ? 'justify-content-end' : 'justify-content-center'}`}>
155 
          <h3 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
 141 
          <h3 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
156 
            {name}
 142 
            {name}
- 
 
 143 
          </h3>
- 
 
 144 
          {(isTopData && email) &&
- 
 
 145 
            <h4 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
- 
 
 146 
              {email}
- 
 
 147 
            </h4>
- 
 
 148 
          }
- 
 
 149 
          {network &&
- 
 
 150 
            <h4 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
- 
 
 151 
              {network}
- 
 
 152 
            </h4>
157 
          </h3>
 153 
          }
158 
          {isTopData &&
 - 
 
159 
		 {email &&
 - 
 
160 
          <h4 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
 - 
 
161 
            {email}
 - 
 
162 
          </h4>
 - 
 
163 
			}
 - 
 
164 
			{network &&
 - 
 
165 
          <h4 className={`${status ? '' : "w-100 text-left"} ${isTopData ? 'mb-2' : ''} w-100`}>
 - 
 
166 
            {network}
 - 
 
167 
          </h4>
 - 
 
168 
			}
- 
 
169 
          {
 - 
 
170 
            isTopData
 - 
 
171 
            &&
 154 
          {isTopData &&
172 
            <ul>
 155 
            <ul>
173 
              {link_view &&
 156 
              {link_view &&
174 
                <li>
 157 
                <li>
175 
                  <a
 158 
                  <a
176 
                    href={link_view}
 - 
 
177 
                    data-link={link_view}
 159 
                    href={link_view}
178 
                    className="btn btn-secondary ellipsis"
 160 
                    className="btn btn-primary ellipsis"
179 
                  >
 161 
                  >
180 
                    {btnAcceptTitle}
 162 
                    {btnAcceptTitle}
181 
                  </a>
 163 
                  </a>
182 
                </li>
 164 
                </li>
183 
              }
 165 
              }
184 
              {link_inmail &&
 166 
              {link_inmail &&
185 
                <li>
 167 
                <li>
186 
                  <a
 168 
                  <a
187 
                    href={link_inmail}
 - 
 
188 
                    data-link={link_inmail}
 169 
                    href={link_inmail}
189 
                    className="btn btn-primary"
 170 
                    className="btn btn-secondary"
190 
                  >
 171 
                  >
191 
                    Mensaje
 172 
                    Mensaje
192 
                  </a>
 173 
                  </a>
193 
                </li>
 174 
                </li>
Línea 201... Línea 182...
201 
          </h4>
 182 
          </h4>
202 
        }
 183 
        }
203 
      </div>
 184 
      </div>
204 
      <hr />
 185 
      <hr />
205 
      <ul>
 186 
      <ul>
206 
        {
 - 
 
207 
          link_view && !isTopData && (
 187 
        {(link_view && !isTopData) &&
208 
            <li>
 - 
 
209 
              <a
 - 
 
210 
                href={link_view}
 - 
 
211 
                data-link={link_view}
 - 
 
212 
                title=""
 - 
 
213 
                className="btn btn-secondary"
 - 
 
214 
              >
 - 
 
215 
                {btnAcceptTitle}
 - 
 
216 
              </a>
 - 
 
217 
            </li>
 - 
 
218 
          )
 - 
 
219 
        }
 - 
 
220 
        {
 - 
 
221 
          link_edit && (
 - 
 
222 
            <li>
 - 
 
223 
              <a
 - 
 
224 
                href={link_edit}
 - 
 
225 
                data-link={link_edit}
 - 
 
226 
                title=""
 - 
 
227 
                className="btn btn-tertiary"
 - 
 
228 
              >
 - 
 
229 
                {btnEditTitle}
 - 
 
230 
              </a>
 - 
 
231 
            </li>
 - 
 
232 
          )
 - 
 
233 
        }
 - 
 
234 
        {
 - 
 
235 
          link_approve
 - 
 
236 
          &&
 - 
 
237 
          <li>
 188 
          <li>
238 
            <a
 189 
            <a
239 
              href="#"
 190 
              href={link_view}
240 
              className="btn btn-tertiary"
 191 
              className="btn btn-tertiary"
241 
              onClick={(e) => {
 - 
 
242 
                e.preventDefault();
 - 
 
243 
                handleApproveConfirmationBox();
 - 
 
244 
              }}
 - 
 
245 
            >
 192 
            >
246 
              Aprobar
 193 
              {btnAcceptTitle}
247 
            </a>
 194 
            </a>
248 
          </li>
 195 
          </li>
249 
        }
 196 
        }
250 
        {
 - 
 
251 
          link_accept
 197 
        {link_edit &&
252 
          &&
 - 
 
253 
          <li>
 198 
          <li>
254 
            <a
 199 
            <a
- 
 
 200 
              href={link_edit}
- 
 
 201 
              data-link={link_edit}
255 
              href="#"
 202 
              title=""
256 
              className="btn btn-tertiary"
 203 
              className="btn btn-tertiary"
257 
              onClick={(e) => {
 - 
 
258 
                e.preventDefault();
 - 
 
259 
                handleApproveConfirmationBox();
 - 
 
260 
              }}
 - 
 
261 
            >
 204 
            >
262 
              Aceptar
 205 
              {btnEditTitle}
263 
            </a>
 206 
            </a>
264 
          </li>
 207 
          </li>
265 
        }
 208 
        }
266 
        {
 - 
 
267 
          link_reject &&
 209 
        {link_approve &&
268 
          <li>
 210 
          <li>
269 
            <a
 211 
            <button
270 
              href="#"
 - 
 
271 
              className="btn btn-primary"
 212 
              className="btn btn-tertiary"
272 
              onClick={(e) => {
 - 
 
273 
                e.preventDefault();
 - 
 
274 
                handleRejectConfirmationBox();
 213 
              onClick={() => handleShowConfirmation('aprove')}
275 
              }}
 - 
 
276 
            >
 214 
            >
277 
              Rechazar
 215 
              Aprobar
278 
            </a>
 216 
            </button>
279 
          </li>
 217 
          </li>
280 
        }
 218 
        }
281 
        {
 - 
 
282 
          link_delete &&
 219 
        {link_accept &&
283 
          <li>
 220 
          <li>
284 
            <a
 221 
            <button
285 
              href="#"
 - 
 
286 
              className="btn btn-primary"
 222 
              className="btn btn-tertiary"
287 
              onClick={(e) => {
 - 
 
288 
                e.preventDefault();
 - 
 
289 
                handleShowConfirmationBox();
 223 
              onClick={() => handleShowConfirmation('accept')}
290 
              }}
 - 
 
291 
            >
 224 
            >
292 
              {btnCancelTitle}
 225 
              Aceptar
293 
            </a>
 226 
            </button>
294 
          </li>
 227 
          </li>
295 
        }
 228 
        }
- 
 
 229 
        {link_reject &&
- 
 
 230 
          <li>
- 
 
 231 
            <button
- 
 
 232 
              className="btn btn-tertiary"
- 
 
 233 
              onClick={() => handleShowConfirmation('reject')}
- 
 
 234 
            >
- 
 
 235 
              Rechazar
- 
 
 236 
            </button>
- 
 
 237 
          </li >
296 
        {
 238 
        }
297 
          link_inmail && !isTopData
 239 
        {link_delete &&
- 
 
 240 
          <li>
- 
 
 241 
            <button
- 
 
 242 
              className="btn btn-tertiary"
- 
 
 243 
              onClick={() => handleShowConfirmation('delete')}
298 
          &&
 244 
            >
- 
 
 245 
              {btnCancelTitle}
- 
 
 246 
            </button>
- 
 
 247 
          </li >
- 
 
 248 
        }
- 
 
 249 
        {(link_inmail && !isTopData) &&
299 
          <li>
 250 
          <li>
300 
            <a
 251 
            <a
301 
              href={link_inmail}
 252 
              href={link_inmail}
302 
              data-link={link_inmail}
 - 
 
303 
              title=""
 - 
 
304 
              className="btn btn-primary"
 253 
              className="btn btn-secondary"
305 
            >
 254 
            >
306 
              Mensaje
 255 
              Mensaje
307 
            </a>
 256 
            </a>
308 
          </li>
 257 
          </li>
309 
        }
 258 
        }
310 
        {
 - 
 
311 
          link_admin &&
 259 
        {link_admin &&
312 
          <li>
 260 
          <li>
313 
            <a
 261 
            <a
314 
              onClick={() => getManageUrl()}
 262 
              onClick={() => getManageUrl()}
315 
              data-link={link_admin}
 263 
              data-link={link_admin}
316 
              title="Administrar empresa"
 264 
              title="Administrar empresa"
317 
              className="btn btn-primary"
 265 
              className="btn btn-secondary"
318 
            >
 266 
            >
319 
              Administrar
 267 
              Administrar
320 
            </a>
 268 
            </a>
321 
          </li>
 269 
          </li>
322 
        }
 270 
        }
323 
        {
 - 
 
324 
          link_unfollow
 271 
        {link_unfollow &&
325 
          &&
 - 
 
326 
          <li>
 272 
          <li>
327 
            <a
 273 
            <a
328 
              onClick={() => handleUnfollow(link_unfollow)}
 274 
              onClick={() => handleUnfollow(link_unfollow)}
329 
              data-link={link_unfollow}
 275 
              data-link={link_unfollow}
330 
              title="Administrar empresa"
 276 
              title="Administrar empresa"
331 
              className="btn btn-primary"
 277 
              className="btn btn-secondary"
332 
            >
 278 
            >
333 
              Dejar de seguir
 279 
              Dejar de seguir
334 
            </a>
 280 
            </a>
335 
          </li>
 281 
          </li>
336 
        }
 282 
        }
Línea 337... Línea -...
337 
 
 - 
 
338 
        {
 283 
 
339 
          link_block &&
 284 
        {link_block &&
340 
          <li>
 285 
          <li>
341 
            <a
 - 
 
342 
              href="#"
 286 
            <button
343 
              className="btn btn-primary"
 - 
 
344 
              onClick={(e) => {
 - 
 
345 
                e.preventDefault();
 287 
              className="btn btn-tertiary"
346 
                handleBlockConfirmationBox();
 - 
 
347 
              }}
 288 
              onClick={() => handleShowConfirmation('block')}
348 
            >
 289 
            >
- 
 
 290 
              Bloquear
- 
 
 291 
            </button>
- 
 
 292 
          </li >
- 
 
 293 
        }
- 
 
 294 
        {link_unblock &&
- 
 
 295 
          <li>
- 
 
 296 
            <button
- 
 
 297 
              className="btn btn-tertiary"
349 
              Bloquear
 298 
              onClick={() => handleShowConfirmation('unblock')}
- 
 
 299 
            >
- 
 
 300 
              Desbloquear
350 
            </a>
 301 
            </button>
351 
          </li>
 302 
          </li>
352 
        }
 - 
 
353 
        {
 - 
 
354 
          link_unblock && (
 - 
 
355 
            <li>
 - 
 
356 
              <a
 - 
 
357 
                href="#"
 - 
 
358 
                className="btn btn-tertiary"
 - 
 
359 
                onClick={(e) => {
 - 
 
360 
                  e.preventDefault();
 - 
 
361 
                  handleUnblockConfirmationBox();
 - 
 
362 
                }}
 - 
 
363 
              >
 - 
 
364 
                Desbloquear
 - 
 
365 
              </a>
 - 
 
366 
            </li>
 - 
 
367 
          )
 - 
 
368 
        }
 - 
 
369 
        {
 303 
        }
370 
          link_request
 - 
 
371 
          &&
 304 
        {link_request &&
372 
          <li>
 305 
          <li>
373 
            <a
 - 
 
374 
              href="#"
 306 
            <button
375 
              className="btn btn-tertiary"
 - 
 
376 
              onClick={(e) => {
 - 
 
377 
                e.preventDefault();
 307 
              className="btn btn-tertiary"
378 
                handleRequestConfirmationBox();
 - 
 
379 
              }}
 308 
              onClick={() => handleShowConfirmation('request')}
380 
            >
 309 
            >
381 
              Conectar
 310 
              Conectar
382 
            </a>
 311 
            </button>
383 
          </li>
 312 
          </li >
384 
        }
 - 
 
385 
        {
 313 
        }
386 
          link_cancel
 - 
 
387 
          &&
 314 
        {link_cancel &&
388 
          <li>
 315 
          <li>
389 
            <a
 - 
 
390 
              href="#"
 316 
            <button
391 
              className="btn btn-primary"
 - 
 
392 
              onClick={(e) => {
 - 
 
393 
                e.preventDefault();
 317 
              className="btn btn-tertiary"
394 
                handleCancelConfirmationBox();
 - 
 
395 
              }}
 318 
              onClick={() => handleShowConfirmation('cancel')}
396 
            >
 319 
            >
397 
              Cancelar
 320 
              Cancelar
398 
            </a>
 321 
            </button>
399 
          </li>
 322 
          </li >
400 
        }
 - 
 
401 
        {
 323 
        }
402 
          link_leave &&
 324 
        {link_leave &&
403 
          <li>
 325 
          <li>
404 
            <a
 - 
 
405 
              href="#"
 326 
            <button
406 
              className="btn btn-tertiary"
 - 
 
407 
              onClick={(e) => {
 - 
 
408 
                e.preventDefault();
 327 
              className="btn btn-tertiary"
409 
                handleLeaveConfirmationBox();
 - 
 
410 
              }}
 328 
              onClick={() => handleShowConfirmation('leave')}
411 
            >
 329 
            >
412 
              Abandonar
 330 
              Abandonar
413 
            </a>
 331 
            </button>
414 
          </li>
 332 
          </li >
415 
        }
 333 
        }
416 
      </ul>
 - 
 
417 
      {
 334 
      </ul >
418 
        link_delete &&
 335 
      {link_delete &&
419 
        <div style={{ position: "relative" }}>
 336 
        <div style={{ position: "relative" }}>
420 
          <ConfirmationBox
 337 
          <ConfirmationBox
421 
            show={showConfirmationBox}
 338 
            show={showConfirmationBox}
422 
            onClose={() => handleShowConfirmationBox(false)}
 339 
            onClose={() => handleShowConfirmation(null)}
423 
            onAccept={() => handleCancelApply(link_delete)}
 340 
            onAccept={() => handleCancelApply(linkOptions[showConfirmationBox])}
424 
          />
 341 
          />
425 
        </div>
 342 
        </div>
426 
      }
 - 
 
427 
      {
 343 
      }
428 
        link_cancel && (
 - 
 
429 
          <div style={{ position: "relative" }}>
 - 
 
430 
            <ConfirmationBox
 - 
 
431 
              show={showCancelConfirmationBox}
 - 
 
432 
              onClose={() => handleCancelConfirmationBox(false)}
 - 
 
433 
              onAccept={() => handleCancelApply(link_cancel)}
 - 
 
434 
            />
 344 
      {link_impersonate &&
435 
          </div>
 - 
 
436 
        )
 - 
 
437 
      }
 - 
 
438 
      {
 - 
 
439 
        link_block && (
 - 
 
440 
          <div style={{ position: "relative" }}>
 - 
 
441 
            <ConfirmationBox
 - 
 
442 
              show={showBlockConfirmationBox}
 - 
 
443 
              onClose={() => handleBlockConfirmationBox(false)}
 - 
 
444 
              onAccept={() => handleCancelApply(link_block)}
 345 
        <li>
445 
            />
 - 
 
446 
          </div>
 - 
 
447 
        )
 - 
 
448 
      }
 - 
 
449 
      {
 - 
 
450 
        link_accept && (
 - 
 
451 
          <div style={{ position: "relative" }}>
 - 
 
452 
            <ConfirmationBox
 - 
 
453 
              show={showApproveConfirmationBox}
 - 
 
454 
              onClose={() => handleApproveConfirmationBox(false)}
 - 
 
455 
              onAccept={() => handleCancelApply(link_accept)}
 346 
          <a
456 
            />
 - 
 
457 
          </div>
 - 
 
458 
        )
 - 
 
459 
      }
 - 
 
460 
      {
 - 
 
461 
        link_approve && (
 347 
            href="#"
462 
          <div style={{ position: "relative" }}>
 348 
            className="btn btn-primary"
463 
            <ConfirmationBox
 - 
 
464 
              show={showApproveConfirmationBox}
 - 
 
465 
              onClose={() => handleApproveConfirmationBox(false)}
 - 
 
466 
              onAccept={() => handleCancelApply(link_approve)}
 - 
 
467 
            />
 - 
 
468 
          </div>
 - 
 
469 
        )
 - 
 
470 
      }
 - 
 
471 
      {
 - 
 
472 
        link_reject && (
 - 
 
473 
          <div style={{ position: "relative" }}>
 349 
            onClick={(e) => {
474 
            <ConfirmationBox
 350 
              e.preventDefault()
475 
              show={showRejectConfirmationBox}
 - 
 
476 
              onClose={() => handleRejectConfirmationBox(false)}
 - 
 
477 
              onAccept={() => handleCancelApply(link_reject)}
 351 
              getImpersonateUrl(link_impersonate)
478 
            />
 - 
 
479 
          </div>
 - 
 
480 
        )
 - 
 
481 
      }
 - 
 
482 
      {
 - 
 
483 
        link_request && (
 - 
 
484 
          <div style={{ position: "relative" }}>
 - 
 
485 
            <ConfirmationBox
 - 
 
486 
              show={showRequestConfirmationBox}
 - 
 
487 
              onClose={() => handleRequestConfirmationBox(false)}
 - 
 
488 
              onAccept={() => handleCancelApply(link_request)}
 352 
            }}
489 
            />
 - 
 
490 
          </div>
 - 
 
491 
        )
 - 
 
492 
      }
 - 
 
493 
      {
 - 
 
494 
        link_unblock && (
 - 
 
495 
          <div style={{ position: "relative" }}>
 353 
          >
496 
            <ConfirmationBox
 - 
 
497 
              show={showUnblockConfirmationBox}
 - 
 
498 
              onClose={() => handleUnblockConfirmationBox(false)}
 - 
 
499 
              onAccept={() => handleCancelApply(link_unblock)}
 354 
            Personificar
500 
            />
 355 
          </a>
501 
          </div>
 - 
 
502 
        )
 356 
        </li>
503 
      }
 357 
      }
504 
      {
 - 
 
505 
        link_leave && (
 - 
 
506 
          <div style={{ position: "relative" }}>
 - 
 
507 
            <ConfirmationBox
 - 
 
508 
              show={showLeaveConfirmationBox}
 - 
 
509 
              onClose={() => handleLeaveConfirmationBox(false)}
 - 
 
510 
              onAccept={() => handleCancelApply(link_leave)}
 - 
 
511 
            />
 - 
 
512 
          </div>
 - 
 
513 
        )
 - 
 
514 
      }
 - 
 
515 
        {
 - 
 
516 
          link_impersonate
- 
 
517 
          &&
 - 
 
518 
          <li>
 - 
 
519 
            <a
 - 
 
520 
			 href="#" onClick={() => getImpersonateUrl(link_impersonate)} > Personificar </a>
 - 
 
521 
          </li>
 - 
 
522 
        }
 - 
 
523 
      {
 358 
      {
524 
        loading &&
 359 
        loading &&
525 
        <StyledSpinnerContainer>
 360 
        <StyledSpinnerContainer>
526 
          <Spinner />
 361 
          <Spinner />
527 
        </StyledSpinnerContainer>
 362 
        </StyledSpinnerContainer>