12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667 |
- import { Link } from 'react-router-dom'
- import { connect } from 'react-redux'
- import { Row, Col,Avatar, Input, Popover } from 'antd'
- import user from '../materials/user.png'
- import { actionSearchUser } from '../actions'
- import {UserOutlined } from '@ant-design/icons'
- import { actionFullProfilePageUser } from '../redux/saga'
- import LinkToUser from './LinkToUser'
- export const ResultUserFind = ({
- userFind = [],
- handleCancel,
-
- }) => {
- console.log('user find', userFind)
- return (
- <div className="ResultUserFind">
- {userFind?.map(({ _id, login, avatar }) => (
-
- <LinkToUser _id={_id} login={login} avatar={avatar} size={40} padding={'0px'} onClick={handleCancel} key={_id} />
- ))}
- </div>
- )
- }
- const SearchUser = ({ my_Id, onSearch, searchUser, onPageData }) => {
- const onSearchUser = (value) => onSearch(value)
- const { Search } = Input
- return (
- <>
- <Popover
- placement="bottom"
- destroyTooltipOnHide={true}
- size="large"
- content={
- <ResultUserFind
- my_Id={my_Id}
- size={'20px'}
- onPageData={onPageData}
- userFind={searchUser}
- />
- }
- >
- <Search
- style={{ width: '25%' }}
- placeholder="Enter search user"
- allowClear
- prefix={<UserOutlined />}
- enterButton="Search"
- size="large"
- onSearch={onSearchUser}
- />
- </Popover>
- </>
- )
- }
- export const CSearch = connect(
- (state) => ({
- aboutUser: state.userData?.aboutUser,
- searchUser: state.promise?.searchUser?.payload,
- my_Id: state.auth?.payload?.sub?.id || '',
- }),
- {
- onSearch: actionSearchUser,
- onPageData: actionFullProfilePageUser,
- },
- )(SearchUser)
|