Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useEffect, useRef, useState } from 'react'
import { axios, scrollToBottom } from '../../utils'
import { useDispatch } from 'react-redux'
import { addNotification } from '../../redux/notification/notification.actions'
import useMessages from '../../hooks/useMessages'
import InboxIcon from '@mui/icons-material/Inbox'

import Chat from './Chat'
import EmptySection from '../UI/EmptySection'
import ConfirmModal from '../modals/ConfirmModal'

const InmailChat = ({ conversation, changeConversation }) => {
  const [isShowConfirm, setIsShowConfirm] = useState(false)
  const messagesList = useRef(null)
  const options = useRef([])
  const dispatch = useDispatch()

  const { messages, loadMore, loading, reset } = useMessages(
    conversation?.messages_link
  )

  const deleteConversation = () => {
    axios.post(conversation.delete_link).then(({ data: response }) => {
      const { success, data } = response

      if (!success) {
        dispatch(addNotification({ style: 'danger', msg: data }))
        return
      }

      dispatch(addNotification({ style: 'success', msg: data }))
      toggleConfirmModal()
      changeConversation(null)
    })
  }

  const toggleConfirmModal = () => {
    setIsShowConfirm(!isShowConfirm)
  }

  useEffect(() => {
    reset()

    if (conversation.delete_link) {
      options.current.push({
        label: 'Borrar convesación',
        action: toggleConfirmModal,
      })
    }
  }, [conversation])

  return (
    <>
      <Chat>
        <Chat.Header
          options={options.current}
          onClose={() => changeConversation(null)}
        >
          <Chat.Title url={conversation.profile}>
            {conversation.name}
          </Chat.Title>
        </Chat.Header>
        {!messages.length ? (
          <EmptySection
            Icon={<InboxIcon />}
            message="No hay mensajes en esta conversación"
            align="center"
          />
        ) : (
          <Chat.List
            messages={messages}
            onPagination={loadMore}
            loading={loading}
            scrollRef={messagesList}
          />
        )}
        <Chat.SubmitForm
          sendUrl={conversation.send_link}
          uploadUrl={conversation.send_link}
          onSubmit={() => scrollToBottom(messagesList)}
        />
      </Chat>
      <ConfirmModal
        show={isShowConfirm}
        onClose={toggleConfirmModal}
        onAccept={deleteConversation}
      />
    </>
  )
}

export default InmailChat