Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 5126 Rev 5144
Línea 1... Línea 1...
1 
/* eslint-disable camelcase */
 1 
/* eslint-disable camelcase */
2 
import React, { useEffect, useState } from 'react'
 2 
import React, { useEffect, useState } from 'react'
3 
import { axios } from '../../../utils'
 - 
 
4 
import { connect } from 'react-redux'
 3 
import { connect } from 'react-redux'
- 
 
 4 
import { searchEntities } from '../../../services/search'
5 
import { addNotification } from '../../../redux/notification/notification.actions'
 5 
import { addNotification } from '../../../redux/notification/notification.actions'
6 
import Profile from '../../../components/Profile'
 6 
import Profile from '../../../components/Profile'
7 
import SearchList from '../../../components/SearchList'
 7 
import SearchList from '../../../components/SearchList'
8 
import Spinner from '../../../shared/loading-spinner/Spinner'
 8 
import Spinner from '../../../shared/loading-spinner/Spinner'
9 
import PaginationComponent from '../../../shared/pagination/PaginationComponent'
 9 
import PaginationComponent from '../../../shared/pagination/PaginationComponent'
10 
import EmptySection from '../../../shared/empty-section/EmptySection'
 10 
import EmptySection from '../../../shared/empty-section/EmptySection'
11 
import TitleSection from '../../../components/TitleSection'
 11 
import TitleSection from '../../../components/TitleSection'
- 
 
 12 
import { debounce } from '../../../utils'
Línea 12... Línea 13...
12 
 
 13 
 
13 
const MyConnections = () => {
 14 
const MyConnections = () => {
14 
  const [myConnections, setMyConnections] = useState([])
 15 
  const [myConnections, setMyConnections] = useState([])
15 
  const [currentPage, setCurrentPage] = useState(1)
 16 
  const [currentPage, setCurrentPage] = useState(1)
16 
  const [search, setSearch] = useState('')
 17 
  const [search, setSearch] = useState('')
17 
  const [pages, setPages] = useState(1)
 18 
  const [pages, setPages] = useState(1)
Línea -... Línea 19...
- 
 
 19 
  const [loading, setLoading] = useState(true)
- 
 
 20 
 
- 
 
 21 
  useEffect(() => {
- 
 
 22 
    fetchMyConnections(search, currentPage)
18 
  const [loading, setLoading] = useState(true)
 23 
  }, [currentPage, search])
19 
 
 24 
 
- 
 
 25 
  const fetchMyConnections = async (search = '', page = 1) => {
- 
 
 26 
    setLoading(true)
- 
 
 27 
 
20 
  const fetchMyConnections = async ({ search = '', page = 1 }) => {
 28 
    const response = await searchEntities('connection/invitations-received', search, page)
21 
    setLoading(true)
 29 
 
22 
    await axios
 30 
    if (!response.success) {
23 
      .get(`/connection/my-connections?search=${search}&page=${page}`)
 31 
      addNotification({ style: 'danger', msg: response.data })
- 
 
 32 
      setLoading(false)
- 
 
 33 
      return
24 
      .then(({ data: response }) => {
 34 
    }
25 
        if (response.success) {
 35 
 
26 
          setMyConnections(response.data.current.items)
 36 
    setMyConnections(response.data.current.items)
27 
          setCurrentPage(response.data.current.page)
 - 
 
28 
          setPages(response.data.total.pages)
 37 
    setCurrentPage(response.data.current.page)
29 
        }
 38 
    setPages(response.data.total.pages)
30 
      })
 39 
 
Línea 31... Línea 40...
31 
    setLoading(false)
 40 
    setLoading(false)
Línea 32... Línea -...
32 
  }
 - 
 
33 
 
 - 
 
34 
  const handleChangePage = (newPage) => setCurrentPage(newPage)
 - 
 
35 
 
 - 
 
36 
  useEffect(() => {
 - 
 
37 
    fetchMyConnections({
 41 
  }
Línea 38... Línea 42...
38 
      search,
 42 
 
39 
      page: currentPage
 43 
  const handleChangePage = (newPage) => setCurrentPage(newPage)
40 
    })
 44 
 
41 
  }, [currentPage, search])
 45 
  const handleSearch = (value) => debounce(setSearch(value), 500)
42 
 
 46 
 
- 
 
 47 
  return (
- 
 
 48 
    <section className="companies-info container">
43 
  return (
 49 
      <TitleSection title={LABELS.FIRST_LEVEL_PERSONS} />
44 
    <section className="companies-info container">
 50 
      <SearchList onChange={handleSearch} />
45 
      <TitleSection title={LABELS.FIRST_LEVEL_PERSONS} />
 51 
      <div className="companies-list">
46 
      <SearchList onChange={(value) => setSearch(value)} />
 52 
        {loading && <Spinner />}
47 
      <div className="companies-list">
 53 
        {(!loading && Boolean(!myConnections.length)) && <EmptySection align='left' message={LABELS.DATATABLE_SZERORECORDS} />}
48 
        {myConnections.length
 54 
        {(!loading && Boolean(myConnections.length)) &&
49 
          ? myConnections.map(({ image, name, link_view, link_inmail, link_cancel, link_block }, id) =>
 55 
          myConnections.map(({ image, name, link_view, link_inmail, link_cancel, link_block }, id) =>
Línea 57... Línea 63...
57 
              link_cancel={link_cancel}
 63 
              link_cancel={link_cancel}
58 
              link_block={link_block}
 64 
              link_block={link_block}
59 
              fetchCallback={fetchMyConnections}
 65 
              fetchCallback={fetchMyConnections}
60 
            />
 66 
            />
61 
          )
 67 
          )
62 
          : <EmptySection align='left' message={LABELS.DATATABLE_SZERORECORDS} />
 - 
 
63 
        }
 68 
        }
64 
        {loading && <Spinner />}
 - 
 
65 
      </div>
 69 
      </div>
66 
      <PaginationComponent
 70 
      <PaginationComponent
67 
        onChangePage={handleChangePage}
 71 
        onChangePage={handleChangePage}
68 
        pages={pages}
 72 
        pages={pages}
69 
        currentActivePage={currentPage}
 73 
        currentActivePage={currentPage}