Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 2780 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 2780 Rev 3434
Línea 1... Línea 1...
1 
import React, { useEffect, useState } from 'react'
 1 
import React, { useEffect, useState } from 'react';
2 
import { connect } from 'react-redux'
 2 
import { connect } from 'react-redux';
3 
import {
 3 
import {
4 
  Avatar,
 4 
  Avatar,
5 
  List,
 5 
  List,
6 
  ListItem,
 6 
  ListItem,
7 
  ListItemAvatar,
 7 
  ListItemAvatar,
8 
  ListItemButton,
 8 
  ListItemButton,
9 
  ListItemText
 9 
  ListItemText
10 
} from '@mui/material'
 10 
} from '@mui/material';
Línea 11... Línea 11...
11 
 
 11 
 
12 
import { useDebounce } from '@hooks'
 12 
import { useDebounce } from '@hooks';
13 
import { getCurrentContacts, startConversation } from '@app/services/chats'
 13 
import { getCurrentContacts, startConversation } from '@app/services/chats';
Línea 14... Línea 14...
14 
import { addNotification } from '@app/redux/notification/notification.actions'
 14 
import { addNotification } from '@app/redux/notification/notification.actions';
15 
 
 15 
 
Línea 16... Línea 16...
16 
import Modal from '../UI/modal/Modal'
 16 
import Modal from '../UI/modal/Modal';
17 
import Input from '../UI/inputs/input'
 17 
import Input from '../UI/inputs/Input';
18 
 
 18 
 
19 
const ContactsModal = ({ show, onClose, onComplete, addNotification }) => {
 19 
const ContactsModal = ({ show, onClose, onComplete, addNotification }) => {
Línea 20... Línea 20...
20 
  const [search, setSearch] = useState('')
 20 
  const [search, setSearch] = useState('');
21 
  const debounceSearch = useDebounce(search, 500)
 21 
  const debounceSearch = useDebounce(search, 500);
22 
  const [contacts, setContacts] = useState([])
 22 
  const [contacts, setContacts] = useState([]);
23 
 
 23 
 
Línea 24... Línea 24...
24 
  const closeModal = () => {
 24 
  const closeModal = () => {
25 
    setContacts([])
 25 
    setContacts([]);
26 
    onClose()
 26 
    onClose();
27 
  }
 27 
  };
28 
 
 28 
 
29 
  const handleStartConversation = async (startConversationUrl) => {
 29 
  const handleStartConversation = async (startConversationUrl) => {
30 
    try {
 30 
    try {
31 
      const conversation = await startConversation(startConversationUrl)
 31 
      const conversation = await startConversation(startConversationUrl);
32 
      onComplete(conversation)
 32 
      onComplete(conversation);
Línea 33... Línea 33...
33 
      closeModal()
 33 
      closeModal();
34 
    } catch (error) {
 34 
    } catch (error) {
35 
      addNotification({ style: 'danger', msg: error.message })
 35 
      addNotification({ style: 'danger', msg: error.message });
36 
    }
 36 
    }
37 
  }
 37 
  };
38 
 
 38 
 
39 
  useEffect(() => {
 39 
  useEffect(() => {
Línea 40... Línea 40...
40 
    getCurrentContacts(debounceSearch)
 40 
    getCurrentContacts(debounceSearch)
41 
      .then((currentContacts) => setContacts(currentContacts))
 - 
 
42 
      .catch((error) => {
 - 
 
43 
        addNotification({ style: 'danger', msg: error.message })
 41 
      .then((currentContacts) => setContacts(currentContacts))
44 
      })
 - 
 
45 
  }, [debounceSearch])
 - 
 
46 
 
 - 
 
47 
  return (
 42 
      .catch((error) => {
48 
    <Modal
 43 
        addNotification({ style: 'danger', msg: error.message });
49 
      show={show}
 44 
      });
50 
      title='Iniciar conversación'
 45 
  }, [debounceSearch]);
51 
      onClose={closeModal}
 46 
 
Línea 52... Línea 47...
52 
      showFooter={false}
 47 
  return (
53 
    >
 48 
    <Modal show={show} title='Iniciar conversación' onClose={closeModal} showFooter={false}>
54 
      <Input
 49 
      <Input
Línea 55... Línea 50...
55 
        label='Escribe el nombre'
 50 
        label='Escribe el nombre'
56 
        placeholder='Escribe el nombre de la persona'
 51 
        placeholder='Escribe el nombre de la persona'
57 
        onChange={(e) => setSearch(e.target.value)}
 52 
        onChange={(e) => setSearch(e.target.value)}
58 
      />
 53 
      />
Línea 72... Línea 67...
72 
                </ListItemAvatar>
 67 
                </ListItemAvatar>
Línea 73... Línea 68...
73 
 
 68 
 
74 
                <ListItemText primary={name} />
 69 
                <ListItemText primary={name} />
75 
              </ListItemButton>
 70 
              </ListItemButton>
76 
            </ListItem>
 71 
            </ListItem>
77 
          )
 72 
          );
78 
        })}
 73 
        })}
79 
      </List>
 74 
      </List>
80 
    </Modal>
 75 
    </Modal>
81 
  )
 76 
  );
Línea 82... Línea 77...
82 
}
 77 
};
83 
 
 78 
 
84 
const mapDispatchToProps = {
 79 
const mapDispatchToProps = {
Línea 85... Línea 80...
85 
  addNotification: (notification) => addNotification(notification)
 80 
  addNotification: (notification) => addNotification(notification)