Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 4635 Rev 5373
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { useState, useLayoutEffect, useRef } from 'react';
 2 
import React, { useState, useLayoutEffect, useRef } from 'react'
3 
import { BiDotsVerticalRounded } from 'react-icons/bi';
 3 
import { BiDotsVerticalRounded } from 'react-icons/bi'
4 
import DeleteOutline from '@mui/icons-material/DeleteOutline'
 4 
import DeleteOutline from '@mui/icons-material/DeleteOutline'
5 
import { axios } from '../utils';
 5 
import { axios } from '../utils'
Línea 6... Línea -...
6 
 
 - 
 
7 
import ProfileInfo from '../dashboard/components/home-section/ProfileInfo';
 6 
 
8 
import SocialNetworks from '../dashboard/components/home-section/SocialNetworks';
 7 
import SocialNetworks from '../dashboard/components/home-section/SocialNetworks'
Línea 9... Línea 8...
9 
import ConfirmModal from '../shared/confirm-modal/ConfirmModal';
 8 
import ConfirmModal from '../shared/confirm-modal/ConfirmModal'
10 
 
 9 
 
- 
 
 10 
import { useDispatch } from 'react-redux'
- 
 
 11 
import { addNotification } from '../redux/notification/notification.actions'
Línea 11... Línea 12...
11 
import { useDispatch } from 'react-redux';
 12 
import ProfileInfo from '../shared/profile/edit/profile-info/ProfileInfo'
12 
import { addNotification } from '../redux/notification/notification.actions';
 13 
import { profileTypes } from '../shared/profile/Profile.types'
13 
 
 14 
 
14 
const Notifications = ({ backendVars }) => {
 15 
const Notifications = ({ backendVars }) => {
15 
  const { image, fullName, country, visits, connections, description } = backendVars
 16 
  const { image, uuid } = backendVars
16 
  const [notifications, setNotifications] = useState([])
 17 
  const [notifications, setNotifications] = useState([])
17 
  const [displayOption, setDisplayOption] = useState(false)
 18 
  const [displayOption, setDisplayOption] = useState(false)
Línea 18... Línea 19...
18 
  const [confirmModalShow, setConfirmModalShow] = useState(false);
 19 
  const [confirmModalShow, setConfirmModalShow] = useState(false)
Línea 42... Línea 43...
42 
          ? dispatch(addNotification({ style: 'danger', msg: data.data }))
 43 
          ? dispatch(addNotification({ style: 'danger', msg: data.data }))
43 
          : dispatch(addNotification({ style: 'success', msg: data.data }))
 44 
          : dispatch(addNotification({ style: 'success', msg: data.data }))
44 
      })
 45 
      })
45 
      .catch(err => {
 46 
      .catch(err => {
46 
        dispatch(addNotification({
 47 
        dispatch(addNotification({
47 
          style: "danger",
 48 
          style: 'danger',
48 
          msg: 'Disculpe, ha ocurrido un error marcando notificaciones como leidas',
 49 
          msg: 'Disculpe, ha ocurrido un error marcando notificaciones como leidas'
49 
        }))
 50 
        }))
50 
        console.log('>>: err > ', err)
 51 
        console.log('>>: err > ', err)
51 
      })
 52 
      })
52 
  }
 53 
  }
Línea 56... Línea 57...
56 
      .then(({ data }) => {
 57 
      .then(({ data }) => {
57 
        if (!data.success) dispatch(addNotification({ style: 'danger', msg: data.data }))
 58 
        if (!data.success) dispatch(addNotification({ style: 'danger', msg: data.data }))
58 
        dispatch(addNotification({ style: 'success', msg: data.data }))
 59 
        dispatch(addNotification({ style: 'success', msg: data.data }))
59 
        setNotifications([])
 60 
        setNotifications([])
60 
      })
 61 
      })
61 
      .catch(err => dispatch(addNotification({ style: "danger", msg: `Error: ${err}` })))
 62 
      .catch(err => dispatch(addNotification({ style: 'danger', msg: `Error: ${err}` })))
62 
  }
 63 
  }
Línea 63... Línea 64...
63 
 
 64 
 
64 
  const deleteNotification = (url) => {
 65 
  const deleteNotification = (url) => {
65 
    axios.post(url)
 66 
    axios.post(url)
Línea 68... Línea 69...
68 
          return dispatch(addNotification({ style: 'danger', msg: response.data }))
 69 
          return dispatch(addNotification({ style: 'danger', msg: response.data }))
69 
        }
 70 
        }
70 
        dispatch(addNotification({ style: 'success', msg: response.data }))
 71 
        dispatch(addNotification({ style: 'success', msg: response.data }))
71 
        setNotifications((prevNotifications) => prevNotifications.filter((notification) => notification.link_delete !== url))
 72 
        setNotifications((prevNotifications) => prevNotifications.filter((notification) => notification.link_delete !== url))
72 
      })
 73 
      })
73 
      .catch(err => dispatch(addNotification({ style: "danger", msg: `Error: ${err}` })))
 74 
      .catch(err => dispatch(addNotification({ style: 'danger', msg: `Error: ${err}` })))
74 
  }
 75 
  }
Línea 75... Línea 76...
75 
 
 76 
 
76 
  useLayoutEffect(() => {
 77 
  useLayoutEffect(() => {
77 
    const handleClickOutside = (event) => {
 78 
    const handleClickOutside = (event) => {
78 
      if (menuOptions.current && !menuOptions.current.contains(event.target)) {
 79 
      if (menuOptions.current && !menuOptions.current.contains(event.target)) {
79 
        setDisplayOption(false)
 80 
        setDisplayOption(false)
80 
      }
 81 
      }
81 
    }
 82 
    }
Línea 82... Línea 83...
82 
    document.addEventListener("mousedown", handleClickOutside);
 83 
    document.addEventListener('mousedown', handleClickOutside)
83 
 
 84 
 
84 
    return () => {
 85 
    return () => {
85 
      document.removeEventListener("mousedown", handleClickOutside);
 86 
      document.removeEventListener('mousedown', handleClickOutside)
Línea 86... Línea 87...
86 
    };
 87 
    }
87 
  }, [menuOptions]);
 88 
  }, [menuOptions])
88 
 
 89 
 
Línea 89... Línea 90...
89 
  useLayoutEffect(() => {
 90 
  useLayoutEffect(() => {
90 
    handleNotifications()
 91 
    handleNotifications()
91 
  }, []);
 92 
  }, [])
92 
 
 93 
 
93 
  return (
 94 
  return (
94 
    <>
 95 
    <>
- 
 
 96 
      <section className="notifications-page">
95 
      <section className="notifications-page">
 97 
        <div className="notifications-grid">
96 
        <div className="notifications-grid">
 98 
          <div className='main-left-sidebar d-none d-md-flex'>
97 
          <div className='main-left-sidebar d-none d-md-flex'>
 - 
 
98 
            <ProfileInfo
 - 
 
99 
              image={image}
 - 
 
100 
              fullName={fullName}
 - 
 
101 
              description={description}
 99 
            <ProfileInfo
102 
              visits={visits}
 100 
              entityId={uuid}
103 
              country={country}
 101 
              image={image}
104 
              connections={connections}
 102 
              profileType={profileTypes.USER}
105 
            />
 103 
            />
Línea 144... Línea 142...
144 
                      <span>
 142 
                      <span>
145 
                        {element.time_elapsed}
 143 
                        {element.time_elapsed}
146 
                      </span>
 144 
                      </span>
147 
                    </div>
 145 
                    </div>
148 
                  </li>
 146 
                  </li>
149 
                )
 147 
                  )
150 
                :
 - 
 
151 
                <div className="empty-section">
 148 
                : <div className="empty-section">
152 
                  <h2>No hay notificaciones</h2>
 149 
                  <h2>No hay notificaciones</h2>
153 
                </div>
 150 
                </div>
154 
              }
 151 
              }
155 
            </ul>
 152 
            </ul>
156 
          </div>
 153 
          </div>
Línea 164... Línea 161...
164 
      />
 161 
      />
165 
    </>
 162 
    </>
166 
  )
 163 
  )
167 
}
 164 
}
Línea 168... Línea -...
168 
 
 - 
 
169 
export default Notifications
 165 
 
- 
 
 166 
export default Notifications