Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 2875 Rev 2932
Línea 1... Línea 1...
1
import React, { useEffect, useState } from 'react'
1
import React from 'react'
2
import { useDispatch, useSelector } from 'react-redux'
2
import { useSelector } from 'react-redux'
3
import { Search } from '@mui/icons-material'
3
import { Search } from '@mui/icons-material'
Línea 4... Línea 4...
4
 
4
 
5
import { debounce } from '../../utils'
5
import { debounce } from '@utils'
6
import { searchEntities } from '../../services/items'
-
 
7
import { addNotification } from '../../redux/notification/notification.actions'
-
 
8
 
-
 
9
import Spinner from '../../components/UI/Spinner'
-
 
10
import Input from '../../components/UI/inputs/Input'
-
 
11
import TitleSection from '../../components/UI/TitleSection'
-
 
12
import EmptySection from '../../components/UI/EmptySection'
-
 
13
import ProfileItem from '../../components/profile/ProfileItem'
-
 
Línea 14... Línea 6...
14
import PaginationComponent from '../../components/UI/PaginationComponent'
6
import { useFetch, useSearchQuery } from '@hooks'
15
 
7
 
16
const PeopleYouMayKnowPage = () => {
8
import Input from '@components/UI/inputs/Input'
17
  const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([])
-
 
18
  const [currentPage, setCurrentPage] = useState(1)
9
import TitleSection from '@components/UI/TitleSection'
19
  const [totalPages, setTotalPages] = useState(1)
-
 
Línea -... Línea 10...
-
 
10
import PaginationComponent from '@components/UI/PaginationComponent'
20
  const [loading, setLoading] = useState(false)
11
import PeopleYouMayKnowList from '@components/connections/PeopleYouMayKnowList'
21
  const [search, setSearch] = useState('')
-
 
Línea 22... Línea 12...
22
 
12
 
23
  const labels = useSelector(({ intl }) => intl.labels)
-
 
24
  const dispatch = useDispatch()
-
 
25
 
13
const PeopleYouMayKnowPage = () => {
26
  const getPeopleYouMayKnow = async (search = '', page = 1) => {
14
  const labels = useSelector(({ intl }) => intl.labels)
27
    setLoading(true)
-
 
28
    try {
-
 
29
      const { success, data } = await searchEntities(
-
 
30
        'connection/people-you-may-know',
-
 
31
        search,
-
 
32
        page
-
 
33
      )
-
 
34
 
-
 
35
      if (!success) {
-
 
36
        dispatch(addNotification({ style: 'danger', msg: data }))
-
 
37
        setLoading(false)
-
 
38
        return
-
 
39
      }
-
 
40
 
-
 
41
      setPeopleYouMayKnow(data.current.items)
-
 
42
      setCurrentPage(data.current.page)
-
 
43
      setTotalPages(data.total.pages)
-
 
44
    } catch (error) {
-
 
45
      dispatch(addNotification({ style: 'danger', msg: error.message }))
15
 
46
    } finally {
16
  const { getStringParams, setParam } = useSearchQuery()
47
      setLoading(false)
17
  const { data, isLoading, refetch } = useFetch(
48
    }
-
 
49
  }
-
 
50
 
-
 
51
  const handleSearch = debounce((value) => setSearch(value), 500)
-
 
52
 
-
 
53
  const onChangePageHandler = (currentPage) => {
-
 
54
    setCurrentPage(currentPage)
-
 
55
  }
-
 
Línea 56... Línea 18...
56
 
18
    '/connection/people-you-may-know' + getStringParams()
57
  useEffect(() => {
19
  )
58
    getPeopleYouMayKnow(search, currentPage)
20
 
59
  }, [search, currentPage])
21
  const handleSearch = debounce((e) => setParam('search', e.target.value))
60
 
-
 
61
  return (
-
 
62
    <main className='companies-info container'>
-
 
63
      <TitleSection title={labels.people_you_may_know} />
-
 
64
      <Input icon={<Search />} onChange={handleSearch} variant='search' />
22
 
65
      {loading ? (
23
  return (
66
        <Spinner />
-
 
67
      ) : (
-
 
68
        <ul className='companies-list'>
24
    <>
69
          {peopleYouMayKnow.length ? (
-
 
70
            peopleYouMayKnow.map(({ id, ...rest }) => (
-
 
71
              <ProfileItem
-
 
72
                key={id}
-
 
73
                {...rest}
-
 
74
                fetchCallback={() => getPeopleYouMayKnow(search, currentPage)}
25
      <TitleSection title={labels.people_you_may_know} />
75
              />
-
 
76
            ))
-
 
77
          ) : (
-
 
78
            <EmptySection
26
      <Input icon={<Search />} onChange={handleSearch} variant='search' />
79
              align='left'
27
      <PeopleYouMayKnowList
80
              message={labels.datatable_szerorecords}
28
        connections={data.current?.items}
81
            />
29
        loading={isLoading}
82
          )}
30
        onComplete={refetch}
83
        </ul>
31
      />
84
      )}
32
 
85
      <PaginationComponent
33
      <PaginationComponent
86
        isRow
34
        isRow
87
        pages={totalPages}
35
        pages={data.total?.pages}
88
        currentActivePage={currentPage}
36
        currentActivePage={data.current?.page}
Línea 89... Línea 37...
89
        onChangePage={onChangePageHandler}
37
        onChangePage={(page) => setParam('page', page)}