Proyectos de Subversion LeadersLinked - SPA

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1453 stevensc 1
import React, { useEffect, useState } from 'react'
2
import { useSelector } from 'react-redux'
1454 stevensc 3
import {
4
  Avatar,
5
  List,
6
  ListItem,
7
  ListItemAvatar,
8
  ListItemButton,
9
  ListItemText
10
} from '@mui/material'
5 stevensc 11
 
1453 stevensc 12
import { axios } from '../../utils'
1454 stevensc 13
 
2073 stevensc 14
import Input from '../UI/inputs/input'
15
import Modal from '../UI/modal/Modal'
2075 stevensc 16
import useDebounce from '@app/hooks/useDebounce'
1453 stevensc 17
 
5 stevensc 18
const StartConversationModal = ({ show, setConversation, onClose }) => {
1454 stevensc 19
  const [users, setUsers] = useState([])
1453 stevensc 20
  const [search, setSearch] = useState('')
2075 stevensc 21
  const debouncedSearch = useDebounce(search, 500)
1453 stevensc 22
  const labels = useSelector(({ intl }) => intl.labels)
5 stevensc 23
 
24
  const searchUsers = async (value) => {
25
    try {
1453 stevensc 26
      const { data } = await axios.get('/helpers/search-people?search=' + value)
1454 stevensc 27
      if (data.success) setUsers(data.data)
5 stevensc 28
    } catch (error) {
1453 stevensc 29
      console.log('>>: error > ', error)
5 stevensc 30
    }
1453 stevensc 31
  }
5 stevensc 32
 
1454 stevensc 33
  const openChat = (uuid) => {
5 stevensc 34
    axios.get(`/inmail/${uuid}`).then(({ data }) => {
35
      if (data.success) {
36
        const newConversation = data.data.find(
37
          (conversation) => conversation.uuid === uuid
1453 stevensc 38
        )
39
        setConversation(newConversation)
5 stevensc 40
      }
1453 stevensc 41
    })
5 stevensc 42
 
1453 stevensc 43
    onClose()
44
  }
5 stevensc 45
 
46
  useEffect(() => {
2075 stevensc 47
    searchUsers(debouncedSearch)
48
  }, [debouncedSearch])
5 stevensc 49
 
50
  return (
1453 stevensc 51
    <Modal title={labels.create_inmail} show={show} onClose={onClose}>
2073 stevensc 52
      <Input
1454 stevensc 53
        label={labels.write_name}
54
        placeholder={labels.write_person_name}
2074 stevensc 55
        onChange={(e) => setSearch(e.target.value)}
56
        value={search}
1454 stevensc 57
      />
1453 stevensc 58
 
1454 stevensc 59
      <List sx={{ width: '100%' }}>
60
        {users.map((user) => {
61
          const { text, value } = user
62
 
1453 stevensc 63
          return (
1454 stevensc 64
            <ListItem key={value} disablePadding disableRipple>
1614 stevensc 65
              <ListItemButton disableRipple onClick={() => openChat(value)}>
1454 stevensc 66
                <ListItemAvatar>
67
                  <Avatar alt={`${text} image`} src='' />
68
                </ListItemAvatar>
69
 
70
                <ListItemText primary={text} />
71
              </ListItemButton>
72
            </ListItem>
1453 stevensc 73
          )
74
        })}
1454 stevensc 75
      </List>
5 stevensc 76
    </Modal>
1453 stevensc 77
  )
78
}
5 stevensc 79
 
1453 stevensc 80
export default StartConversationModal