Proyectos de Subversion LeadersLinked - SPA

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
5 stevensc 1
import { useEffect, useState } from 'react'
1668 stevensc 2
import { useDispatch } from 'react-redux'
5 stevensc 3
 
1709 stevensc 4
import { axios } from '@app/utils'
1668 stevensc 5
import { addNotification } from '@app/redux/notification/notification.actions'
1677 stevensc 6
import { showReportModal } from '@app/redux/report/report.actions'
1668 stevensc 7
 
2774 stevensc 8
export function useMessages(messagesUrl) {
1675 stevensc 9
  const [loading, setLoading] = useState(false)
5 stevensc 10
  const [messages, setMessages] = useState([])
11
  const [currentPage, setCurrentPage] = useState(1)
12
  const [pages, setPages] = useState(1)
1668 stevensc 13
  const dispatch = useDispatch()
5 stevensc 14
 
1709 stevensc 15
  function compareMessages(ref = [], newValue = []) {
1714 stevensc 16
    const set = new Set(ref.map((obj) => obj.id))
17
    const difference = newValue.filter((obj) => !set.has(obj.id))
1709 stevensc 18
    return difference
19
  }
20
 
1714 stevensc 21
  const messagesAdapter = (message) => {
22
    const {
23
      u,
24
      side,
25
      type,
26
      filename,
27
      m,
28
      mtype,
29
      date,
30
      time,
31
      id,
32
      uuid,
33
      message: content
34
    } = message
35
 
36
    return {
37
      id: id ?? uuid,
1715 stevensc 38
      content: m || content || filename || '',
1714 stevensc 39
      send: u === 1 || side === 'left',
40
      contentType: mtype || type,
1715 stevensc 41
      time: time || date,
1714 stevensc 42
      ...message
43
    }
44
  }
45
 
1668 stevensc 46
  const getMessages = async ({ url = '', page = 1 }) => {
1712 stevensc 47
    if (!url) return
1673 stevensc 48
 
1730 stevensc 49
    return axios.get(`${url}?page=${page}`).then(({ data: response }) => {
50
      const { data, success, pagination } = response
5 stevensc 51
 
1730 stevensc 52
      if (!success) {
53
        throw new Error('Ha ocurrido un error al obtener los mensajes')
54
      }
5 stevensc 55
 
1730 stevensc 56
      const resMessages = data.items ?? data
57
      const adapterMessages = resMessages.map((mes) => messagesAdapter(mes))
58
 
59
      return {
60
        currentPage: pagination ? pagination.current : data.page,
61
        messages: adapterMessages,
62
        lastPage: pagination ? pagination.last : data.pages
63
      }
64
    })
5 stevensc 65
  }
66
 
1668 stevensc 67
  const loadMoreMessages = async ({ url = '', page = 2 }) => {
1730 stevensc 68
    setLoading(true)
1668 stevensc 69
    try {
70
      const response = await getMessages({ url, page })
71
      const { messages } = response
5 stevensc 72
 
1668 stevensc 73
      setMessages((prevState) => [...prevState, ...messages])
74
    } catch (error) {
75
      dispatch(addNotification({ style: 'danger', msg: error.message }))
1730 stevensc 76
    } finally {
77
      setLoading(false)
1668 stevensc 78
    }
5 stevensc 79
  }
80
 
1673 stevensc 81
  const heartBeat = async ({ url }) => {
1668 stevensc 82
    try {
83
      const { lastPage, messages: resMessages } = await getMessages({ url })
5 stevensc 84
 
1680 stevensc 85
      setPages(lastPage)
1674 stevensc 86
      setMessages((prevState) => {
1709 stevensc 87
        const diff = compareMessages(prevState, resMessages)
88
        if (!diff.length) return prevState
1680 stevensc 89
        return [...diff, ...prevState]
1674 stevensc 90
      })
1668 stevensc 91
    } catch (error) {
92
      dispatch(addNotification({ style: 'danger', msg: error.message }))
5 stevensc 93
    }
1668 stevensc 94
  }
5 stevensc 95
 
1668 stevensc 96
  const changePage = () => {
97
    if (currentPage >= pages) return
5 stevensc 98
    setCurrentPage((prevState) => prevState + 1)
99
  }
100
 
1680 stevensc 101
  const markReport = (id) => {
102
    setMessages((prevMessages) => {
103
      return prevMessages.map((message) =>
1692 stevensc 104
        message.id === id
1699 stevensc 105
          ? {
106
              ...message,
1715 stevensc 107
              content: 'Contenido reportado',
1699 stevensc 108
              url_abuse_report: '',
1715 stevensc 109
              contentType: 'text'
1699 stevensc 110
            }
1692 stevensc 111
          : message
1680 stevensc 112
      )
113
    })
1677 stevensc 114
  }
5 stevensc 115
 
1677 stevensc 116
  const handleReport = ({ url, id }) => {
117
    dispatch(
118
      showReportModal({
119
        reportUrl: url,
120
        type: 'mensaje',
1680 stevensc 121
        onComplete: () => markReport(id)
1677 stevensc 122
      })
123
    )
124
  }
125
 
5 stevensc 126
  useEffect(() => {
1692 stevensc 127
    setMessages([])
128
    setCurrentPage(1)
129
    setPages(1)
1676 stevensc 130
  }, [messagesUrl])
131
 
132
  useEffect(() => {
133
    if (currentPage === 1) return
1668 stevensc 134
    loadMoreMessages({ url: messagesUrl, page: currentPage })
1730 stevensc 135
  }, [messagesUrl, currentPage])
1668 stevensc 136
 
137
  useEffect(() => {
1730 stevensc 138
    const messagesInterval = setInterval(() => {
1668 stevensc 139
      heartBeat({ url: messagesUrl })
5 stevensc 140
    }, 2000)
141
 
142
    return () => {
1730 stevensc 143
      clearInterval(messagesInterval)
5 stevensc 144
    }
1730 stevensc 145
  }, [messagesUrl])
5 stevensc 146
 
147
  return {
1668 stevensc 148
    messages,
149
    loading,
1677 stevensc 150
    loadMore: changePage,
151
    report: handleReport
5 stevensc 152
  }
153
}