Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useEffect, useState } from 'react'
import { axios } from '../../utils'
import { Modal } from 'react-bootstrap'
import { useSelector } from 'react-redux'

const StartConversationModal = ({ show, setConversation, onClose }) => {
  const [inmailPersons, setInmailPersons] = useState([])

  const [search, setSearch] = useState('')
  const labels = useSelector(({ intl }) => intl.labels)

  const handleSearch = ({ target }) => {
    setSearch(target.value)
  }

  const searchUsers = async (value) => {
    try {
      const { data } = await axios.get('/helpers/search-people?search=' + value)
      if (data.success) setInmailPersons(data.data)
    } catch (error) {
      console.log('>>: error > ', error)
    }
  }

  const handleInmailPerson = (uuid) => {
    axios.get(`/inmail/${uuid}`).then(({ data }) => {
      if (data.success) {
        const newConversation = data.data.find(
          (conversation) => conversation.uuid === uuid
        )
        setConversation(newConversation)
      }
    })

    onClose()
  }

  useEffect(() => {
    searchUsers(search)
  }, [search])

  return (
    <Modal show={show} onHide={onClose}>
      <Modal.Header closeButton>
        <Modal.Title>{labels.create_inmail}</Modal.Title>
      </Modal.Header>
      <Modal.Body>
        <div className="form-group">
          <label htmlFor="search-people">{labels.write_name}</label>
          <input
            type="email"
            className="form-control"
            aria-describedby="Buscador de personas"
            placeholder={labels.write_person_name}
            onChange={handleSearch}
          />
        </div>
        <div className="container">
          {inmailPersons.map((person) => {
            return (
              <div className="row" key={person.value}>
                <div className="col-8">
                  <p>{person.text}</p>
                </div>
                <div className="col-4">
                  <button
                    className="btn btn-primary"
                    onClick={() => handleInmailPerson(person.value)}
                  >
                    <i className="fa fa-check" />
                  </button>
                </div>
              </div>
            )
          })}
        </div>
      </Modal.Body>
    </Modal>
  )
}

export default StartConversationModal