Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5202 | Rev 5204 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
5185 stevensc 1 
/* eslint-disable camelcase */
4346 stevensc 2 
/* eslint-disable react/prop-types */
888 stevensc 3 
import React, { useEffect, useState } from 'react'
5187 stevensc 4 
import { useDispatch } from 'react-redux'
5 
import { addNotification } from '../redux/notification/notification.actions'
3713 stevensc 6 
import { axios } from '../utils'
5185 stevensc 7 
import ChatMail from './inmail/inmail'
1 www 8 
import Sidebar from './inmail/sidebar'
9 
 
5189 stevensc 10 
const DEFAULT_PAGES = { current: 1, last: 1 }
2704 stevensc 11 
 
5186 stevensc 12 
const Inmail = () => {
5185 stevensc 13 
  const [messages, setMessages] = useState([])
5189 stevensc 14 
  const [pages, setPages] = useState(DEFAULT_PAGES)
5185 stevensc 15 
  const [selectedConversation, setSelectedConversation] = useState(null)
5187 stevensc 16 
  const [loading, setLoading] = useState(false)
5203 stevensc 17 
 
5187 stevensc 18 
  const dispatch = useDispatch()
5203 stevensc 19 
  const controller = new AbortController()
4354 stevensc 20 
 
5199 stevensc 21 
  const getMessages = async (url = '', page = DEFAULT_PAGES.current) => {
5185 stevensc 22 
    try {
5187 stevensc 23 
      setLoading(true)
5203 stevensc 24 
      const { data: response } = await axios.get(`${url}?page=${page}`, { signal: controller.signal })
891 stevensc 25 
 
5187 stevensc 26 
      if (!response.success) {
27 
        const errorMessage = response.data
28 
 
29 
        dispatch(addNotification({ style: 'danger', msg: errorMessage.message }))
30 
        return
5185 stevensc 31 
      }
1734 stevensc 32 
 
5189 stevensc 33 
      if (page === 1) {
34 
        setMessages(response.data)
35 
      } else {
5200 stevensc 36 
        const newMessages = response.data
37 
        setMessages((prevMessages) => ([...prevMessages, ...newMessages]))
5187 stevensc 38 
      }
39 
 
5190 stevensc 40 
      setPages((prevPages) => ({ ...prevPages, current: response.pagination.current, last: response.pagination.last }))
5185 stevensc 41 
    } catch (error) {
5203 stevensc 42 
      if (axios.isCancel(error)) {
43 
        console.log('Request canceled', error.message)
44 
      } else {
45 
        const errorMessage = new Error(error)
46 
        dispatch(addNotification({ style: 'danger', msg: errorMessage.message }))
47 
      }
5189 stevensc 48 
    } finally {
49 
      setLoading(false)
5185 stevensc 50 
    }
51 
  }
1774 stevensc 52 
 
5187 stevensc 53 
  const handleSend = async (sendUrl = '', message = {}) => {
54 
    try {
55 
      const formData = new FormData()
5185 stevensc 56 
 
5187 stevensc 57 
      Object.entries(message).forEach(([key, value]) => formData.append(key, value))
5185 stevensc 58 
 
5187 stevensc 59 
      const { data: response } = await axios.post(sendUrl, formData)
60 
      setMessages(prev => [response.data, ...prev])
61 
    } catch (error) {
5189 stevensc 62 
      const errorMessage = new Error(error)
63 
      dispatch(addNotification({ style: 'danger', msg: errorMessage.message }))
1 www 64 
    }
5185 stevensc 65 
  }
727 stevensc 66 
 
5189 stevensc 67 
  const changeConversation = (conversation) => {
68 
    setSelectedConversation(conversation)
69 
  }
5187 stevensc 70 
 
5202 stevensc 71 
  const getMoreMessages = async () => {
5203 stevensc 72 
    if (pages.current + 1 > pages.last) {
73 
      return null
74 
    }
75 
    if (loading) {
76 
      await controller.abort()
77 
    }
5202 stevensc 78 
 
5203 stevensc 79 
    getMessages(selectedConversation.messages_link, pages.current + 1)
5185 stevensc 80 
  }
1 www 81 
 
5185 stevensc 82 
  useEffect(() => {
83 
    let timer
5187 stevensc 84 
    if (!loading && selectedConversation) {
5185 stevensc 85 
      timer = setTimeout(() => {
5200 stevensc 86 
        getMessages(selectedConversation.messages_link)
5185 stevensc 87 
      }, 2000)
1 www 88 
    }
5185 stevensc 89 
    return () => {
90 
      clearTimeout(timer)
91 
    }
5187 stevensc 92 
  }, [loading, selectedConversation])
888 stevensc 93 
 
5185 stevensc 94 
  useEffect(() => {
5189 stevensc 95 
    setPages(DEFAULT_PAGES)
5199 stevensc 96 
    if (selectedConversation) getMessages(selectedConversation.messages_link)
5189 stevensc 97 
  }, [selectedConversation])
1734 stevensc 98 
 
5185 stevensc 99 
  return (
5187 stevensc 100 
  <div className="messages-sec container">
101 
    <div className="row">
102 
      <div className={`col-12 col-md-4 ${selectedConversation && 'msgs-hide'}`}>
103 
        <Sidebar
104 
          setConversation={changeConversation}
105 
          selectedConversation={selectedConversation}
106 
        />
5185 stevensc 107 
      </div>
5187 stevensc 108 
      <div className={`col-12 col-md-8 ${!selectedConversation && 'msgs-hide'}`}>
109 
        <ChatMail
110 
          messages={messages}
111 
          selectedConversation={selectedConversation}
112 
          setConversation={changeConversation}
113 
          getMoreMessages={() => getMoreMessages()}
114 
          onSend={handleSend}
115 
        />
116 
      </div>
5185 stevensc 117 
    </div>
5187 stevensc 118 
  </div>
5185 stevensc 119 
  )
3074 stevensc 120 
}
121 
 
5185 stevensc 122 
export default Inmail