3682 |
stevensc |
1 |
import React from 'react'
|
|
|
2 |
import { useSelector } from 'react-redux'
|
|
|
3 |
import { Search } from '@mui/icons-material'
|
|
|
4 |
|
|
|
5 |
import { debounce } from '@utils'
|
|
|
6 |
import { useFetch, useSearchQuery } from '@hooks'
|
|
|
7 |
|
|
|
8 |
import Input from '@components/UI/inputs/Input'
|
|
|
9 |
import TitleSection from '@components/UI/TitleSection'
|
|
|
10 |
import GroupsRequestsSendList from '@components/group/GroupsRequestsSendList'
|
|
|
11 |
|
|
|
12 |
const GroupsRequestsSendPage = () => {
|
|
|
13 |
const labels = useSelector(({ intl }) => intl.labels)
|
|
|
14 |
|
|
|
15 |
const { getStringParams, setParam } = useSearchQuery()
|
|
|
16 |
const { data, isLoading, refetch } = useFetch(
|
|
|
17 |
'/group/requests-sent' + getStringParams()
|
|
|
18 |
)
|
|
|
19 |
|
|
|
20 |
const handleSearch = debounce((e) => setParam('search', e.target.value))
|
|
|
21 |
|
|
|
22 |
return (
|
|
|
23 |
<>
|
|
|
24 |
<TitleSection title={labels.request_sent} />
|
|
|
25 |
<Input icon={<Search />} onChange={handleSearch} variant='search' />
|
|
|
26 |
<GroupsRequestsSendList
|
|
|
27 |
groups={data}
|
|
|
28 |
loading={isLoading}
|
|
|
29 |
onComplete={refetch}
|
|
|
30 |
/>
|
|
|
31 |
</>
|
|
|
32 |
)
|
|
|
33 |
}
|
|
|
34 |
|
|
|
35 |
export default GroupsRequestsSendPage
|