Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3694 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3694 Rev 3719
Línea 1... Línea 1...
1
import React, { useState } from 'react';
1
import React from 'react';
2
import Search from '@mui/icons-material/Search';
2
import Search from '@mui/icons-material/Search';
3
import { Box, styled } from '@mui/material';
-
 
4
import { useSelector } from 'react-redux';
3
import { useSelector } from 'react-redux';
5
 
4
 
6
import { debounce } from '@utils';
5
import { debounce } from '@utils';
7
import { useFetch, useSearchQuery } from '@hooks';
6
import { useFetch, useSearchQuery } from '@hooks';
8
 
7
 
9
import TitleSection from '@components/UI/TitleSection';
8
import TitleSection from '@components/UI/TitleSection';
10
import Input from '@components/UI/inputs/Input';
9
import Input from '@components/UI/inputs/Input';
11
import Pagination from '@components/common/Pagination';
10
import Pagination from '@components/common/Pagination';
12
import PeopleViewedMyProfileList from '@components/profile/PeopleViewedMyProfileList';
11
import PeopleViewedMyProfileList from '@components/profile/PeopleViewedMyProfileList';
13
 
12
 
14
const PeopleViewedMyProfilePage = () => {
13
const PeopleViewedMyProfilePage = () => {
15
  const labels = useSelector(({ intl }) => intl.labels);
14
  const labels = useSelector(({ intl }) => intl.labels);
16
 
15
 
17
  const { getStringParams, setParam } = useSearchQuery();
16
  const { getStringParams, setParam } = useSearchQuery();
18
  const { data, isLoading, refetch } = useFetch(
17
  const { data, isLoading, refetch } = useFetch(
19
    '/profile/people-viewed-profile' + getStringParams()
18
    '/profile/people-viewed-profile' + getStringParams()
20
  );
19
  );
21
 
20
 
22
  const handleSearch = debounce((e) => setParam('search', e.target.value));
21
  const handleSearch = debounce((e) => setParam('search', e.target.value));
23
 
22
 
24
  return (
23
  return (
25
    <>
24
    <>
26
      <TitleSection title={labels.who_has_seen_my_profile} />
25
      <TitleSection title={labels.who_has_seen_my_profile} />
27
      <Input icon={<Search />} onChange={handleSearch} variant='search' />
26
      <Input icon={<Search />} onChange={handleSearch} variant='search' />
28
      <PeopleViewedMyProfileList
27
      <PeopleViewedMyProfileList
29
        profiles={data.current?.items}
28
        profiles={data.current?.items}
30
        loading={isLoading}
29
        loading={isLoading}
31
        onComplete={refetch}
30
        onComplete={refetch}
32
      />
31
      />
33
      <Pagination
32
      <Pagination
34
        page={data.current?.page}
33
        page={data.current?.page}
35
        pages={data.total?.pages}
34
        pages={data.total?.pages}
36
        onChange={(page) => setParam('page', page)}
35
        onChange={(page) => setParam('page', page)}
37
      />
36
      />
38
    </>
37
    </>
39
  );
38
  );
40
};
39
};
41
 
40
 
42
export default PeopleViewedMyProfilePage;
41
export default PeopleViewedMyProfilePage;