Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 5345 Rev 5916
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { Suspense, useRef, useState } from 'react'
 2 
import React, { useRef, useState } from 'react'
- 
 
 3 
import { axios } from '../../utils'
- 
 
 4 
import { useDispatch } from 'react-redux'
- 
 
 5 
import { addNotification } from '../../redux/notification/notification.actions'
- 
 
 6 
 
3 
import AttachFileIcon from '@mui/icons-material/AttachFile'
 7 
import AttachFileIcon from '@mui/icons-material/AttachFile'
4 
import SentimentVerySatisfiedRoundedIcon from '@mui/icons-material/SentimentVerySatisfiedRounded'
 8 
import SentimentVerySatisfiedRoundedIcon from '@mui/icons-material/SentimentVerySatisfiedRounded'
5 
import Emojione from '../../chat/chat/personal-chat/emojione/Emojione'
 9 
import Emojione from '../../chat/chat/personal-chat/emojione/Emojione'
- 
 
 10 
 
- 
 
 11 
const SendFileModal = React.lazy(() =>
6 
const SendFileModal = React.lazy(() => import('../../chat/chat/personal-chat/send-file-modal/SendFileModal'))
 12 
  import('../../chat/chat/personal-chat/send-file-modal/SendFileModal')
- 
 
 13 
)
Línea 7... Línea 14...
7 
 
 14 
 
8 
const TextBox = ({
 15 
const TextBox = ({
9 
  uploadUrl = '',
 16 
  uploadUrl = '',
10 
  isNotSeen = false,
 17 
  isNotSeen = false,
11 
  markRead = () => false,
 18 
  markRead = () => false,
12 
  onSend
 19 
  onSend,
- 
 
 20 
}) => {
13 
}) => {
 21 
  const [isShowFileModal, setIsShowFileModal] = useState(false)
14 
  const [showEmojiTab, setShowEmojiTab] = useState(false)
 22 
  const [showEmojiTab, setShowEmojiTab] = useState(false)
15 
  const [showFileModal, setShowFileModal] = useState(false)
 23 
  const [loading, setLoading] = useState(false)
Línea 16... Línea 24...
16 
  const textAreaEl = useRef(null)
 24 
  const textAreaEl = useRef(null)
Línea 17... Línea 25...
17 
 
 25 
 
- 
 
 26 
  const dispatch = useDispatch()
- 
 
 27 
 
- 
 
 28 
  const handleShowEmojiTab = () => {
- 
 
 29 
    setShowEmojiTab(!showEmojiTab)
- 
 
 30 
  }
- 
 
 31 
 
Línea 18... Línea 32...
18 
  const handleshowFileModal = () => setShowFileModal(!showFileModal)
 32 
  const toggleFileModal = () => {
19 
 
 33 
    setIsShowFileModal(!isShowFileModal)
20 
  const handleShowEmojiTab = () => setShowEmojiTab(!showEmojiTab)
 34 
  }
21 
 
 35 
 
Línea 41... Línea 55...
41 
    await onSend(message)
 55 
    await onSend(message)
42 
    e.target.value = ''
 56 
    e.target.value = ''
43 
    setShowEmojiTab(false)
 57 
    setShowEmojiTab(false)
44 
  }
 58 
  }
Línea -... Línea 59...
- 
 
 59 
 
- 
 
 60 
  const sendFile = (file) => {
- 
 
 61 
    setLoading(true)
- 
 
 62 
    const formData = new FormData()
- 
 
 63 
    formData.append('file', file)
- 
 
 64 
 
- 
 
 65 
    axios
- 
 
 66 
      .post(uploadUrl, formData)
- 
 
 67 
      .then(({ data: response }) => {
- 
 
 68 
        const { success, data } = response
- 
 
 69 
        if (!success) {
- 
 
 70 
          const errorMessage =
- 
 
 71 
            typeof data === 'string' ? data : 'Ha ocurrido un error'
- 
 
 72 
          dispatch(addNotification({ style: 'success', msg: errorMessage }))
- 
 
 73 
          return
- 
 
 74 
        }
- 
 
 75 
 
- 
 
 76 
        toggleFileModal()
- 
 
 77 
      })
- 
 
 78 
      .finally(() => setLoading(false))
- 
 
 79 
  }
45 
 
 80 
 
46 
  return (
 81 
  return (
47 
        <>
 82 
    <>
48 
            <div className="chat-text_box">
 83 
      <div className="chat-text_box">
- 
 
 84 
        <button className="btn" onClick={toggleFileModal}>
- 
 
 85 
          <AttachFileIcon />
49 
                <AttachFileIcon onClick={handleshowFileModal} />
 86 
        </button>
- 
 
 87 
        <button className="btn" onClick={handleShowEmojiTab}>
- 
 
 88 
          <SentimentVerySatisfiedRoundedIcon />
50 
                <SentimentVerySatisfiedRoundedIcon onClick={handleShowEmojiTab} />
 89 
        </button>
51 
                <textarea
 90 
        <textarea
52 
                    placeholder={CHAT_LABELS.WRITE_A_MESSAGE}
 91 
          placeholder={CHAT_LABELS.WRITE_A_MESSAGE}
53 
                    onKeyDown={onKeyDown}
 92 
          onKeyDown={onKeyDown}
54 
                    ref={textAreaEl}
 93 
          ref={textAreaEl}
55 
                    onFocus={() => isNotSeen && markRead()}
 94 
          onFocus={() => isNotSeen && markRead()}
- 
 
 95 
        />
- 
 
 96 
        <div
56 
                />
 97 
          className="emojione-container"
- 
 
 98 
          style={{ display: showEmojiTab ? 'block' : 'none' }}
57 
                <div className="emojione-container" style={{ display: showEmojiTab ? 'block' : 'none' }}>
 99 
        >
58 
                    <Emojione onClickEmoji={handleClickEmoji} />
 100 
          <Emojione onClickEmoji={handleClickEmoji} />
59 
                </div>
 101 
        </div>
60 
            </div>
 102 
      </div>
61 
            {showFileModal &&
 103 
      <SendFileModal
62 
                <Suspense fallback={null}>
 104 
        isShow={isShowFileModal}
63 
                    <SendFileModal
 105 
        onHide={toggleFileModal}
64 
                        show={true}
 - 
 
65 
                        onHide={() => setShowFileModal(false)}
 - 
 
66 
                        urlUpload={uploadUrl}
 - 
 
67 
                    />
 106 
        onComplete={sendFile}
68 
                </Suspense>
 107 
        loading={loading}
69 
            }
 108 
      />
70 
        </>
 109 
    </>
71 
  )
 110 
  )
Línea 72... Línea 111...
72 
}
 111 
}