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
  )