Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 1453 Rev 1454
Línea 1... Línea 1...
1 
import React, { useEffect, useState } from 'react'
 1 
import React, { useEffect, useState } from 'react'
2 
import { useSelector } from 'react-redux'
 2 
import { useSelector } from 'react-redux'
- 
 
 3 
import {
- 
 
 4 
  Avatar,
- 
 
 5 
  List,
- 
 
 6 
  ListItem,
- 
 
 7 
  ListItemAvatar,
- 
 
 8 
  ListItemButton,
- 
 
 9 
  ListItemText
3 
import CheckIcon from '@mui/icons-material/Check'
 10 
} from '@mui/material'
Línea 4... Línea 11...
4 
 
 11 
 
- 
 
 12 
import { axios } from '../../utils'
5 
import { axios } from '../../utils'
 13 
 
- 
 
 14 
import Modal from 'components/UI/modal/Modal'
Línea 6... Línea 15...
6 
import Modal from 'components/UI/modal/Modal'
 15 
import TextInput from 'components/UI/inputs/TextInput'
7 
 
 16 
 
8 
const StartConversationModal = ({ show, setConversation, onClose }) => {
 - 
 
9 
  const [inmailPersons, setInmailPersons] = useState([])
 17 
const StartConversationModal = ({ show, setConversation, onClose }) => {
10 
 
 18 
  const [users, setUsers] = useState([])
Línea 11... Línea 19...
11 
  const [search, setSearch] = useState('')
 19 
  const [search, setSearch] = useState('')
12 
  const labels = useSelector(({ intl }) => intl.labels)
 - 
 
13 
 
 - 
 
Línea 14... Línea 20...
14 
  const handleSearch = ({ target }) => {
 20 
  const labels = useSelector(({ intl }) => intl.labels)
15 
    setSearch(target.value)
 21 
 
16 
  }
 22 
  const handleSearch = (value) => setSearch(value)
17 
 
 23 
 
18 
  const searchUsers = async (value) => {
 24 
  const searchUsers = async (value) => {
19 
    try {
 25 
    try {
20 
      const { data } = await axios.get('/helpers/search-people?search=' + value)
 26 
      const { data } = await axios.get('/helpers/search-people?search=' + value)
21 
      if (data.success) setInmailPersons(data.data)
 27 
      if (data.success) setUsers(data.data)
Línea 22... Línea 28...
22 
    } catch (error) {
 28 
    } catch (error) {
23 
      console.log('>>: error > ', error)
 29 
      console.log('>>: error > ', error)
24 
    }
 30 
    }
25 
  }
 31 
  }
26 
 
 32 
 
27 
  const handleInmailPerson = (uuid) => {
 33 
  const openChat = (uuid) => {
Línea 41... Línea 47...
41 
    searchUsers(search)
 47 
    searchUsers(search)
42 
  }, [search])
 48 
  }, [search])
Línea 43... Línea 49...
43 
 
 49 
 
44 
  return (
 50 
  return (
45 
    <Modal title={labels.create_inmail} show={show} onClose={onClose}>
 - 
 
46 
      <div className='form-group'>
 - 
 
47 
        <label htmlFor='search-people'>{labels.write_name}</label>
 51 
    <Modal title={labels.create_inmail} show={show} onClose={onClose}>
48 
        <input
 52 
      <TextInput
49 
          type='email'
 53 
        type='text'
50 
          className='form-control'
 54 
        label={labels.write_name}
51 
          aria-describedby='Buscador de personas'
 55 
        name='search-contact'
52 
          placeholder={labels.write_person_name}
 56 
        placeholder={labels.write_person_name}
53 
          onChange={handleSearch}
 57 
        onChange={(e) => handleSearch(e.target.value)}
- 
 
 58 
      />
- 
 
 59 
 
54 
        />
 60 
      <List sx={{ width: '100%' }}>
- 
 
 61 
        {users.map((user) => {
Línea 55... Línea -...
55 
      </div>
 - 
 
56 
 
 - 
 
57 
      <div className='container'>
 62 
          const { text, value } = user
58 
        {inmailPersons.map((person) => {
 63 
 
59 
          return (
 64 
          return (
60 
            <div className='row' key={person.value}>
 65 
            <ListItem key={value} disablePadding disableRipple>
61 
              <div className='col-8'>
 - 
 
62 
                <p>{person.text}</p>
 66 
              <ListItemButton disableRipple onClick={() => openChat(user)}>
63 
              </div>
 67 
                <ListItemAvatar>
- 
 
 68 
                  <Avatar alt={`${text} image`} src='' />
64 
              <div className='col-4'>
 69 
                </ListItemAvatar>
65 
                <button
 - 
 
66 
                  className='btn btn-primary'
 - 
 
67 
                  onClick={() => handleInmailPerson(person.value)}
 - 
 
68 
                >
 70 
 
69 
                  <CheckIcon />
 - 
 
70 
                </button>
 71 
                <ListItemText primary={text} />
71 
              </div>
 72 
              </ListItemButton>
72 
            </div>
 73 
            </ListItem>
73 
          )
 74 
          )
74 
        })}
 75 
        })}
75 
      </div>
 76 
      </List>
76 
    </Modal>
 77 
    </Modal>
Línea 77... Línea 78...
77 
  )
 78 
  )