adriano.andrade
/
projeto-hit
mirror of https://github.com/AdrianoRobson/projeto-hit.git
1
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: adriano.andrade:4d3cab53331a7397a46f8d7c5236fb638de8e9d5
Branches Tags
adriano.andrade:feat_faro
adriano.andrade:gertec
adriano.andrade:master
adriano.andrade:feat-resolve-contact-duplicate
adriano.andrade:merge-socket
adriano.andrade:feat-hitphone-integration
adriano.andrade:updates-el-lojas
adriano.andrade:feat-scaling-ticket-remote-creation
adriano.andrade:websocket
..
compare: adriano.andrade:eb1d0f23036d92610f4479ee088a3589e2bd6736
Branches Tags
adriano.andrade:feat_faro
adriano.andrade:gertec
adriano.andrade:master
adriano.andrade:feat-resolve-contact-duplicate
adriano.andrade:merge-socket
adriano.andrade:feat-hitphone-integration
adriano.andrade:updates-el-lojas
adriano.andrade:feat-scaling-ticket-remote-creation
adriano.andrade:websocket

3 Commits
4d3cab5333 ... eb1d0f2303

Author SHA1 Message Date
willian-pessoa eb1d0f2303 feat: verificar ticket id antes de atualizar lista de msgs 2024-05-09 16:01:21 -03:00
willian-pessoa dac57f9d48 refactor: restantes das conexoes para a conexao ws global 2024-05-09 15:59:02 -03:00
willian-pessoa 5981f9dd5e refactor: mais 7 conexoes movidas para conexao ws global 2024-05-09 15:31:30 -03:00
19 changed files with 280 additions and 211 deletions
Show Stats Expand all files Collapse all files

4
frontend/src/components/MessagesList/index.js
View File

@ -452,14 +452,14 @@ const MessagesList = ({ ticketId, isGroup }) => {
onAppMessageMessagesList = (data) => { onAppMessageMessagesList = (data) => {
if (data.action === "create") { if (data.action === "create" && data.ticket.id === ticketId) {
dispatch({ type: "ADD_MESSAGE", payload: data.message }) dispatch({ type: "ADD_MESSAGE", payload: data.message })
scrollToBottom() scrollToBottom()
} }
if (data.action === "update") { if (data.action === "update" && data.ticket.id === ticketId) {
dispatch({ type: "UPDATE_MESSAGE", payload: data.message }) dispatch({ type: "UPDATE_MESSAGE", payload: data.message })
} }
} }

28
frontend/src/components/PositionModal/index.js
View File

@ -3,8 +3,8 @@ import React, { useState, useEffect, useRef, useContext } from "react"
import * as Yup from "yup" import * as Yup from "yup"
import { Formik, Form, Field } from "formik" import { Formik, Form, Field } from "formik"
import { toast } from "react-toastify" import { toast } from "react-toastify"
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from "../../services/socket"
import { import {
makeStyles, makeStyles,
@ -51,8 +51,8 @@ const useStyles = makeStyles((theme) => ({
})) }))
const PositionSchema = Yup.object().shape({ const PositionSchema = Yup.object().shape({
name: Yup.string() name: Yup.string()
.required("Required"), .required("Required"),
}) })
const PositionModal = ({ const PositionModal = ({
@ -66,14 +66,14 @@ const PositionModal = ({
const isMounted = useRef(true) const isMounted = useRef(true)
const initialState = { const initialState = {
name: "", name: "",
} }
const [position, setPosition] = useState(initialState) const [position, setPosition] = useState(initialState)
// const [selectedQueueIds, setSelectedQueueIds] = useState([]) // const [selectedQueueIds, setSelectedQueueIds] = useState([])
const { setting } = useContext(AuthContext) const { setting } = useContext(AuthContext)
const [settings, setSettings] = useState(setting) const [settings, setSettings] = useState(setting)
useEffect(() => { useEffect(() => {
return () => { return () => {
@ -87,9 +87,9 @@ const PositionModal = ({
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsPosition = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -98,10 +98,12 @@ const PositionModal = ({
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsPosition)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsPosition)
} }
}, []) }, [])
@ -141,7 +143,7 @@ const PositionModal = ({
const handleSavePosition = async (values) => { const handleSavePosition = async (values) => {
try { try {
if (positionId) { if (positionId) {
await api.put(`/positions/${positionId}`, values) await api.put(`/positions/${positionId}`, values)
handleClose() handleClose()
@ -154,7 +156,7 @@ const PositionModal = ({
handleClose() handleClose()
toast.success("Cargo salvo com sucesso") toast.success("Cargo salvo com sucesso")
} }
} catch (err) { } catch (err) {
toastError(err) toastError(err)
} }
@ -201,7 +203,7 @@ const PositionModal = ({
className={classes.textField} className={classes.textField}
fullWidth fullWidth
/> />
</div> </div>
{/* <div> {/* <div>
{ {
((settings && getSettingValue('quickAnswerByQueue') === 'enabled')) && ( ((settings && getSettingValue('quickAnswerByQueue') === 'enabled')) && (

24
frontend/src/components/QrcodeModal/index.js
View File

@ -1,6 +1,8 @@
import React, { useEffect, useState, useContext } from "react"; import React, { useEffect, useState, useContext } from "react";
import QRCode from "qrcode.react"; import QRCode from "qrcode.react";
import openSocket from "socket.io-client"; //import openSocket from "socket.io-client";
import { socket } from "../../services/socket";
import toastError from "../../errors/toastError"; import toastError from "../../errors/toastError";
import { Dialog, DialogContent, Paper, Typography } from "@material-ui/core"; import { Dialog, DialogContent, Paper, Typography } from "@material-ui/core";
@ -31,9 +33,9 @@ const QrcodeModal = ({ open, onClose, whatsAppId }) => {
useEffect(() => { useEffect(() => {
if (!whatsAppId) return; if (!whatsAppId) return;
const socket = openSocket(process.env.REACT_APP_BACKEND_URL); //const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
socket.on("whatsappSession", data => { const onWhatsAppSessionQrCode = data => {
if (data.action === "update" && data.session.id === whatsAppId) { if (data.action === "update" && data.session.id === whatsAppId) {
setQrCode(data.session.qrcode); setQrCode(data.session.qrcode);
} }
@ -42,21 +44,23 @@ const QrcodeModal = ({ open, onClose, whatsAppId }) => {
onClose(); onClose();
} }
if (data.action === "error") { if (data.action === "error") {
console.log('user.profile: ', user.profile) console.log('user.profile: ', user.profile)
if(user.profile === 'master'){ if (user.profile === 'master') {
alert(data.msg) alert(data.msg)
} }
} }
}); }
socket.on("whatsappSession", onWhatsAppSessionQrCode);
return () => { return () => {
socket.disconnect(); socket.off("whatsappSession", onWhatsAppSessionQrCode);
}; };
}, [whatsAppId, onClose, user.profile]); }, [whatsAppId, onClose, user.profile]);

14
frontend/src/components/QueueModal/index.js
View File

@ -23,8 +23,8 @@ import { IconButton, InputAdornment } from "@material-ui/core"
import { Colorize } from "@material-ui/icons" import { Colorize } from "@material-ui/icons"
import { AuthContext } from '../../context/Auth/AuthContext' import { AuthContext } from '../../context/Auth/AuthContext'
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from "../../services/socket"
const useStyles = makeStyles(theme => ({ const useStyles = makeStyles(theme => ({
@ -92,9 +92,9 @@ const QueueModal = ({ open, onClose, queueId }) => {
}, [setting]) }, [setting])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsQueueModal = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -103,10 +103,12 @@ const QueueModal = ({ open, onClose, queueId }) => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsQueueModal)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsQueueModal)
} }
}, []) }, [])

24
frontend/src/components/QuickAnswersModal/index.js
View File

@ -3,8 +3,8 @@ import React, { useState, useEffect, useRef, useContext } from "react"
import * as Yup from "yup" import * as Yup from "yup"
import { Formik, Form, Field } from "formik" import { Formik, Form, Field } from "formik"
import { toast } from "react-toastify" import { toast } from "react-toastify"
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from "../../services/socket"
import { import {
makeStyles, makeStyles,
@ -79,7 +79,7 @@ const QuickAnswersModal = ({
const [quickAnswer, setQuickAnswer] = useState(initialState) const [quickAnswer, setQuickAnswer] = useState(initialState)
const [selectedQueueIds, setSelectedQueueIds] = useState([]) const [selectedQueueIds, setSelectedQueueIds] = useState([])
const { user, setting, getSettingValue } = useContext(AuthContext) const { user, setting, getSettingValue } = useContext(AuthContext)
const [settings, setSettings] = useState(setting) const [settings, setSettings] = useState(setting)
useEffect(() => { useEffect(() => {
return () => { return () => {
@ -92,18 +92,18 @@ const QuickAnswersModal = ({
}, [setting]) }, [setting])
useEffect(() => { useEffect(() => {
setSelectedQueueIds([]) setSelectedQueueIds([])
if (open && selectedQueueIds.length === 0 && !quickAnswerId) { if (open && selectedQueueIds.length === 0 && !quickAnswerId) {
setSelectedQueueIds(user.queues.map(q => q.id)) setSelectedQueueIds(user.queues.map(q => q.id))
} }
}, [open,]) }, [open,])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsQuickAnswersModal = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -112,14 +112,16 @@ const QuickAnswersModal = ({
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsQuickAnswersModal)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsQuickAnswersModal)
} }
}, []) }, [])
useEffect(() => { useEffect(() => {
// setSelectedQueueIds([]) // setSelectedQueueIds([])
@ -139,7 +141,7 @@ const QuickAnswersModal = ({
if (isMounted.current) { if (isMounted.current) {
setQuickAnswer(data) setQuickAnswer(data)
if (data?.queues) { if (data?.queues) {
const quickQueueIds = data.queues?.map((queue) => queue.id) const quickQueueIds = data.queues?.map((queue) => queue.id)
setSelectedQueueIds(quickQueueIds) setSelectedQueueIds(quickQueueIds)
} }

14
frontend/src/components/StatusChatEndModal/index.js
View File

@ -3,8 +3,8 @@ import React, { useState, useEffect, useRef, useContext } from "react"
import * as Yup from "yup" import * as Yup from "yup"
import { Formik, Form, Field } from "formik" import { Formik, Form, Field } from "formik"
import { toast } from "react-toastify" import { toast } from "react-toastify"
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from "../../services/socket"
import { import {
makeStyles, makeStyles,
@ -91,9 +91,9 @@ const StatusChatEndModal = ({
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsStatusChatEndModal = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -102,10 +102,12 @@ const StatusChatEndModal = ({
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsStatusChatEndModal)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsStatusChatEndModal)
} }
}, []) }, [])

19
frontend/src/components/TransferTicketModal/index.js
View File

@ -1,6 +1,7 @@
import React, { useState, useContext, useMemo, useEffect } from "react" import React, { useState, useContext, useMemo, useEffect } from "react"
import { useHistory } from "react-router-dom" import { useHistory } from "react-router-dom"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import Button from "@material-ui/core/Button" import Button from "@material-ui/core/Button"
import Dialog from "@material-ui/core/Dialog" import Dialog from "@material-ui/core/Dialog"
@ -110,9 +111,9 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsTransferTicketModal = (data) => {
console.log('settings updated ----------------------------xxxxxxxxxxxx') console.log('settings updated ----------------------------xxxxxxxxxxxx')
if (data.action === 'update') { if (data.action === 'update') {
@ -123,10 +124,12 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsTransferTicketModal)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsTransferTicketModal)
} }
}, []) }, [])
@ -194,7 +197,7 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
const { data } = await api.get(`/users/all`, { const { data } = await api.get(`/users/all`, {
params: { userId: user.id }, params: { userId: user.id },
}) })
setUsers(data.users) setUsers(data.users)
setQueuesByWhats(data.queues) setQueuesByWhats(data.queues)
setQueues(data.queues) setQueues(data.queues)
@ -228,7 +231,7 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
{i18n.t("transferTicketModal.title")} {i18n.t("transferTicketModal.title")}
</DialogTitle> </DialogTitle>
<DialogContent dividers > <DialogContent dividers >
<FormControl variant="outlined" className={classes.maxWidth} style={{marginBottom: '8px'}}> <FormControl variant="outlined" className={classes.maxWidth} style={{ marginBottom: '8px' }}>
{/* <InputLabel>{i18n.t("transferTicketModal.fieldQueueLabel")}</InputLabel> */} {/* <InputLabel>{i18n.t("transferTicketModal.fieldQueueLabel")}</InputLabel> */}
<InputLabel>{'Usuário'}</InputLabel> <InputLabel>{'Usuário'}</InputLabel>
@ -247,7 +250,7 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
</MenuItem> </MenuItem>
))} ))}
</Select> </Select>
</FormControl> </FormControl>
<FormControl variant="outlined" className={classes.maxWidth}> <FormControl variant="outlined" className={classes.maxWidth}>
<InputLabel>{i18n.t("transferTicketModal.fieldQueuePlaceholder")}</InputLabel> <InputLabel>{i18n.t("transferTicketModal.fieldQueuePlaceholder")}</InputLabel>

59
frontend/src/pages/Campaign/index.js
View File

@ -1,7 +1,8 @@
import React, { useState, useCallback, useEffect, useReducer, useContext } from 'react' import React, { useState, useCallback, useEffect, useReducer, useContext } from 'react'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from '../../services/socket'
import { makeStyles } from '@material-ui/core/styles' import { makeStyles } from '@material-ui/core/styles'
import { green } from '@material-ui/core/colors' import { green } from '@material-ui/core/colors'
@ -13,11 +14,11 @@ import {
IconButton, IconButton,
Table, Table,
TableHead, TableHead,
Paper, Paper,
} from '@material-ui/core' } from '@material-ui/core'
import { import {
Edit, Edit,
DeleteOutline, DeleteOutline,
// Restore // Restore
} from '@material-ui/icons' } from '@material-ui/icons'
@ -26,7 +27,7 @@ import MainHeader from '../../components/MainHeader'
import MainHeaderButtonsWrapper from '../../components/MainHeaderButtonsWrapper' import MainHeaderButtonsWrapper from '../../components/MainHeaderButtonsWrapper'
import Title from '../../components/Title' import Title from '../../components/Title'
import TableRowSkeleton from '../../components/TableRowSkeleton' import TableRowSkeleton from '../../components/TableRowSkeleton'
import CampaignModal from '../../components/CampaignModal' import CampaignModal from '../../components/CampaignModal'
import ConfirmationModal from '../../components/ConfirmationModal' import ConfirmationModal from '../../components/ConfirmationModal'
import QrcodeModal from '../../components/QrcodeModal' import QrcodeModal from '../../components/QrcodeModal'
@ -51,7 +52,7 @@ const reducer = (state, action) => {
const campaigns = action.payload const campaigns = action.payload
return [...state, ...campaigns] return [...state, ...campaigns]
} }
if (action.type === "UPDATE_CAMPAIGNS") { if (action.type === "UPDATE_CAMPAIGNS") {
const campaign = action.payload const campaign = action.payload
const campaignIndex = state.findIndex((c) => c.id === campaign.id) const campaignIndex = state.findIndex((c) => c.id === campaign.id)
@ -109,7 +110,7 @@ const useStyles = makeStyles((theme) => ({
buttonProgress: { buttonProgress: {
color: green[500], color: green[500],
}, },
})) }))
const Campaign = () => { const Campaign = () => {
//-------- //--------
@ -124,7 +125,7 @@ const Campaign = () => {
const [qrModalOpen, setQrModalOpen] = useState(false) const [qrModalOpen, setQrModalOpen] = useState(false)
const [selectedCampaign, setSelectedCampaign] = useState(null) const [selectedCampaign, setSelectedCampaign] = useState(null)
const [confirmModalOpen, setConfirmModalOpen] = useState(false) const [confirmModalOpen, setConfirmModalOpen] = useState(false)
const [campaigns, dispatch] = useReducer(reducer, []) const [campaigns, dispatch] = useReducer(reducer, [])
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
@ -152,7 +153,7 @@ const Campaign = () => {
const delayDebounceFn = setTimeout(() => { const delayDebounceFn = setTimeout(() => {
const fetchContacts = async () => { const fetchContacts = async () => {
try { try {
const { data } = await apiBroker.get('/campaign', { const { data } = await apiBroker.get('/campaign', {
params: { params: {
@ -160,7 +161,7 @@ const Campaign = () => {
baseURL: process.env.REACT_APP_BACKEND_URL_PRIVATE, baseURL: process.env.REACT_APP_BACKEND_URL_PRIVATE,
identifier: 'campaign' identifier: 'campaign'
} }
}) })
dispatch({ type: "LOAD_CAMPAIGNS", payload: data.campaign }) dispatch({ type: "LOAD_CAMPAIGNS", payload: data.campaign })
setLoading(false) setLoading(false)
@ -174,7 +175,7 @@ const Campaign = () => {
}, 500) }, 500)
return () => clearTimeout(delayDebounceFn) return () => clearTimeout(delayDebounceFn)
}, [user.id]) }, [user.id])
const handleOpenCampaignModal = () => { const handleOpenCampaignModal = () => {
setSelectedCampaign(null) setSelectedCampaign(null)
@ -184,12 +185,12 @@ const Campaign = () => {
const handleCloseCampaignModal = useCallback(() => { const handleCloseCampaignModal = useCallback(() => {
setCampaignModalOpen(false) setCampaignModalOpen(false)
setSelectedCampaign(null) setSelectedCampaign(null)
}, [setSelectedCampaign, setCampaignModalOpen]) }, [setSelectedCampaign, setCampaignModalOpen])
const handleStart = async (campaign) => { const handleStart = async (campaign) => {
try { try {
const { data } = await apiBroker.post(`/campaign/start/${campaign.id}`) const { data } = await apiBroker.post(`/campaign/start/${campaign.id}`)
dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign }) dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign })
@ -200,10 +201,10 @@ const Campaign = () => {
} }
} }
const handleStop = async (campaign) => { const handleStop = async (campaign) => {
try { try {
const { data } = await apiBroker.post(`/campaign/stop/${campaign.id}`) const { data } = await apiBroker.post(`/campaign/stop/${campaign.id}`)
dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign }) dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign })
@ -245,7 +246,7 @@ const Campaign = () => {
setConfirmModalOpen(true) setConfirmModalOpen(true)
} }
const handleSubmitConfirmationModal = async () => { const handleSubmitConfirmationModal = async () => {
if (confirmModalInfo.action === 'delete') { if (confirmModalInfo.action === 'delete') {
try { try {
@ -293,13 +294,12 @@ const Campaign = () => {
)} )}
</> </>
) )
} }
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
const onContactsBulkCampaing = (data) => {
socket.on("contactsBulkInsertOnQueueStatus", (data) => {
if (data.action === 'update') { if (data.action === 'update') {
if (String(data.insertOnQueue.adminId) === String(user.id)) { if (String(data.insertOnQueue.adminId) === String(user.id)) {
@ -312,19 +312,24 @@ const Campaign = () => {
} }
} }
}) }
socket.on('campaign', (data) => { socket.on("contactsBulkInsertOnQueueStatus", onContactsBulkCampaing)
const onCampaignCampaign = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign }) dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign })
} }
}) }
socket.on('campaign', onCampaignCampaign)
return () => { return () => {
socket.disconnect() socket.off("campaign", onCampaignCampaign)
socket.off("contactsBulkInsertOnQueueStatus", onContactsBulkCampaing)
} }
}, [user.id]) }, [user.id])

26
frontend/src/pages/Connections/index.js
View File

@ -2,7 +2,8 @@ import React, { useState, useCallback, useEffect, useContext } from 'react'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import { format, parseISO } from 'date-fns' import { format, parseISO } from 'date-fns'
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from '../../services/socket'
import { makeStyles } from '@material-ui/core/styles' import { makeStyles } from '@material-ui/core/styles'
import { green, red, yellow, grey } from '@material-ui/core/colors' import { green, red, yellow, grey } from '@material-ui/core/colors'
@ -144,7 +145,7 @@ const Connections = () => {
const [selectedWhatsApp, setSelectedWhatsApp] = useState(null) const [selectedWhatsApp, setSelectedWhatsApp] = useState(null)
const [confirmModalOpen, setConfirmModalOpen] = useState(false) const [confirmModalOpen, setConfirmModalOpen] = useState(false)
const [diskSpaceInfo, setDiskSpaceInfo] = useState({}) const [diskSpaceInfo, setDiskSpaceInfo] = useState({})
const [settings, setSettings] = useState([]) const [settings, setSettings] = useState([])
@ -388,7 +389,7 @@ const Connections = () => {
getSettingValue('whatsaAppCloudApi') === 'disabled') && ( getSettingValue('whatsaAppCloudApi') === 'disabled') && (
<CustomToolTip title={'Whatsapp Cloud API está desativado'}> <CustomToolTip title={'Whatsapp Cloud API está desativado'}>
<FiberManualRecord style={{ color: grey[500] }} /> <FiberManualRecord style={{ color: grey[500] }} />
</CustomToolTip> </CustomToolTip>
)} )}
{whatsApp.status === 'OPENING' && !whatsApp.isOfficial && ( {whatsApp.status === 'OPENING' && !whatsApp.isOfficial && (
<CircularProgress size={24} className={classes.buttonProgress} /> <CircularProgress size={24} className={classes.buttonProgress} />
@ -433,7 +434,7 @@ const Connections = () => {
try { try {
await api.post(`/restartwhatsappsession/0`, { await api.post(`/restartwhatsappsession/0`, {
params: { status: 'status' }, params: { status: 'status' },
}) })
setClicks((buttons) => setClicks((buttons) =>
buttons.map((e) => { buttons.map((e) => {
@ -451,15 +452,17 @@ const Connections = () => {
}, []) }, [])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('diskSpaceMonit', (data) => { const onDiskSpaceMonitConnections = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setDiskSpaceInfo(data.diskSpace) setDiskSpaceInfo(data.diskSpace)
} }
}) }
socket.on('settings', (data) => { socket.on('diskSpaceMonit', onDiskSpaceMonitConnections)
const onSettingsConnections = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -468,10 +471,13 @@ const Connections = () => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsConnections)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsConnections)
socket.off("diskSpaceMonit", onDiskSpaceMonitConnections)
} }
}, []) }, [])

22
frontend/src/pages/Contacts/index.js
View File

@ -1,5 +1,6 @@
import React, { useState, useEffect, useReducer, useCallback, useContext } from "react" import React, { useState, useEffect, useReducer, useCallback, useContext } from "react"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { toast } from "react-toastify" import { toast } from "react-toastify"
import { useHistory } from "react-router-dom" import { useHistory } from "react-router-dom"
@ -260,9 +261,9 @@ const Contacts = () => {
}, [searchParam, pageNumber]) }, [searchParam, pageNumber])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("contactsBulkInsertOnQueueStatus", (data) => { const onContactsBulkContacts = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
if (String(data.insertOnQueue.adminId) === String(user.id)) { if (String(data.insertOnQueue.adminId) === String(user.id)) {
@ -278,9 +279,11 @@ const Contacts = () => {
} }
} }
}) }
socket.on("contact", (data) => { socket.on("contactsBulkInsertOnQueueStatus", onContactsBulkContacts)
const onContactContacts = (data) => {
if (data.action === "update" || data.action === "create") { if (data.action === "update" || data.action === "create") {
dispatch({ type: "UPDATE_CONTACTS", payload: data.contact }) dispatch({ type: "UPDATE_CONTACTS", payload: data.contact })
} }
@ -288,10 +291,13 @@ const Contacts = () => {
if (data.action === "delete") { if (data.action === "delete") {
dispatch({ type: "DELETE_CONTACT", payload: +data.contactId }) dispatch({ type: "DELETE_CONTACT", payload: +data.contactId })
} }
}) }
socket.on("contact", onContactContacts)
return () => { return () => {
socket.disconnect() socket.off("contact", onContactContacts)
socket.off("contactsBulkInsertOnQueueStatus", onContactsBulkContacts)
} }
}, [user, history]) }, [user, history])
@ -536,7 +542,7 @@ const Contacts = () => {
open={contactModalOpen} open={contactModalOpen}
onClose={handleCloseContactModal} onClose={handleCloseContactModal}
aria-labelledby="form-dialog-title" aria-labelledby="form-dialog-title"
contactId={selectedContactId} contactId={selectedContactId}
></ContactModal> ></ContactModal>
<ContactCreateTicketModal <ContactCreateTicketModal
modalOpen={isCreateTicketModalOpen} modalOpen={isCreateTicketModalOpen}

57
frontend/src/pages/Dashboard/index.js
View File

@ -17,7 +17,8 @@ import { AuthContext } from "../../context/Auth/AuthContext"
// import { i18n } from "../../translate/i18n"; // import { i18n } from "../../translate/i18n";
import Chart from "./Chart" import Chart from "./Chart"
import PieChart from "./PieChart" import PieChart from "./PieChart"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import api from "../../services/api" import api from "../../services/api"
import { Can } from "../../components/Can" import { Can } from "../../components/Can"
@ -291,7 +292,7 @@ const Dashboard = () => {
const { data } = await api.get("/reports/user/services", { const { data } = await api.get("/reports/user/services", {
params: { userId: null, startDate: dateToday, endDate: dateToday, userQueues: selectedQueue }, params: { userId: null, startDate: dateToday, endDate: dateToday, userQueues: selectedQueue },
}) })
dispatch({ type: "RESET" }) dispatch({ type: "RESET" })
dispatch({ type: "LOAD_QUERY", payload: data.usersProfile }) dispatch({ type: "LOAD_QUERY", payload: data.usersProfile })
@ -301,7 +302,7 @@ const Dashboard = () => {
}) })
setTicketStatusChatEnd(ticketStatusChatEndData.reportStatusChatEnd) setTicketStatusChatEnd(ticketStatusChatEndData.reportStatusChatEnd)
} catch (err) { } catch (err) {
} }
@ -356,46 +357,54 @@ const Dashboard = () => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("ticketStatus", (data) => { const onTicketsStatusDashboard = (data) => {
if (data.action === "update") { if (data.action === "update") {
setStatus("") setStatus("")
setStatus(data.ticketStatus.status) setStatus(data.ticketStatus.status)
} }
}) }
socket.on("onlineStatus", (data) => { socket.on("ticketStatus", onTicketsStatusDashboard)
const onOnlineStatusDashboard = (data) => {
if (data.action === "logout" || data.action === "update") { if (data.action === "logout" || data.action === "update") {
dispatch({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime }) dispatch({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime })
} else if (data.action === "delete") { } else if (data.action === "delete") {
dispatch({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime }) dispatch({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime })
} }
}) }
socket.on("user", (data) => { socket.on("onlineStatus", onOnlineStatusDashboard)
const onUserDashboard = (data) => {
if (data.action === "delete") { if (data.action === "delete") {
dispatch({ type: "DELETE_USER", payload: +data.userId }) dispatch({ type: "DELETE_USER", payload: +data.userId })
} }
}) }
socket.on("user", onUserDashboard)
return () => { return () => {
socket.disconnect() socket.off("user", onUserDashboard)
socket.off("onlineStatus", onOnlineStatusDashboard)
socket.off("ticketStatus", onTicketsStatusDashboard)
} }
}, []) }, [])
const handleSelectedQueue = useCallback((queueSelected) => { const handleSelectedQueue = useCallback((queueSelected) => {
if(queueSelected !== 'All'){ if (queueSelected !== 'All') {
const queueIndex = user?.queues?.findIndex((q) => q.id === parseInt(queueSelected)); const queueIndex = user?.queues?.findIndex((q) => q.id === parseInt(queueSelected));
const queueIds = [] const queueIds = []
queueIds.push(user?.queues[queueIndex]?.id); queueIds.push(user?.queues[queueIndex]?.id);
setSelectedQueue(queueIds); setSelectedQueue(queueIds);
}else{ } else {
const queueIds = user?.queues?.map((queue) => queue.id); const queueIds = user?.queues?.map((queue) => queue.id);
setSelectedQueue(queueIds); setSelectedQueue(queueIds);
} }
},[user, setSelectedQueue]) }, [user, setSelectedQueue])
useEffect(() => { useEffect(() => {
if (ticketStatusChange === "") return if (ticketStatusChange === "") return
@ -468,14 +477,14 @@ const Dashboard = () => {
</Typography> </Typography>
</Grid> </Grid>
<Grid style={{ display: 'flex', flexDirection: 'column', padding: '10px 0', alignItems: 'start' }}> <Grid style={{ display: 'flex', flexDirection: 'column', padding: '10px 0', alignItems: 'start' }}>
<SelectField <SelectField
func={handleSelectedQueue} func={handleSelectedQueue}
textBoxFieldSelected={'All'} textBoxFieldSelected={'All'}
emptyField={false} emptyField={false}
header={'Filas'} header={'Filas'}
currencies={user.queues.map((obj) => { currencies={user.queues.map((obj) => {
return { 'value': obj.id, 'label': obj.name } return { 'value': obj.id, 'label': obj.name }
})} /> })} />
</Grid> </Grid>
<Grid container spacing={3}> <Grid container spacing={3}>
<Grid item xs={12} sm={6} md={6} lg={4}> <Grid item xs={12} sm={6} md={6} lg={4}>
@ -532,7 +541,7 @@ const Dashboard = () => {
<Grid item container spacing={3}> <Grid item container spacing={3}>
<Grid item xs={12} sm={12} md={6} lg={6}> <Grid item xs={12} sm={12} md={6} lg={6}>
<Paper className={classes.fixedHeightPaper} variant="outlined"> <Paper className={classes.fixedHeightPaper} variant="outlined">
<Chart allTickets={usersOnlineInfo} selectedQueue = {selectedQueue}/> <Chart allTickets={usersOnlineInfo} selectedQueue={selectedQueue} />
</Paper> </Paper>
</Grid> </Grid>
<Grid item xs={12} sm={12} md={6} lg={6}> <Grid item xs={12} sm={12} md={6} lg={6}>

13
frontend/src/pages/Position/index.js
View File

@ -1,5 +1,6 @@
import React, { useState, useContext, useEffect, useReducer } from "react" import React, { useState, useContext, useEffect, useReducer } from "react"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { import {
Button, Button,
@ -125,9 +126,9 @@ const Position = () => {
}, [searchParam, pageNumber]) }, [searchParam, pageNumber])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("position", (data) => { const onPositionPosition = (data) => {
if (data.action === "update" || data.action === "create") { if (data.action === "update" || data.action === "create") {
dispatch({ type: "UPDATE_POSITIONS", payload: data.position }) dispatch({ type: "UPDATE_POSITIONS", payload: data.position })
} }
@ -138,10 +139,12 @@ const Position = () => {
payload: +data.positionId, payload: +data.positionId,
}) })
} }
}) }
socket.on("position", onPositionPosition)
return () => { return () => {
socket.disconnect() socket.off("position", onPositionPosition)
} }
}, []) }, [])

24
frontend/src/pages/Queues/index.js
View File

@ -1,6 +1,7 @@
import React, { useEffect, useReducer, useState, useContext } from 'react' import React, { useEffect, useReducer, useState, useContext } from 'react'
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from '../../services/socket'
import { import {
Button, Button,
@ -91,7 +92,7 @@ const reducer = (state, action) => {
const Queues = () => { const Queues = () => {
const classes = useStyles() const classes = useStyles()
const { user, setting, getSettingValue } = useContext(AuthContext) const { user, setting, getSettingValue } = useContext(AuthContext)
const [queues, dispatch] = useReducer(reducer, []) const [queues, dispatch] = useReducer(reducer, [])
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
@ -120,12 +121,12 @@ const Queues = () => {
setLoading(false) setLoading(false)
} }
})() })()
}, []) }, [])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('queue', (data) => { const onQueueQueues = (data) => {
if (data.action === 'update' || data.action === 'create') { if (data.action === 'update' || data.action === 'create') {
dispatch({ type: 'UPDATE_QUEUES', payload: data.queue }) dispatch({ type: 'UPDATE_QUEUES', payload: data.queue })
} }
@ -133,9 +134,11 @@ const Queues = () => {
if (data.action === 'delete') { if (data.action === 'delete') {
dispatch({ type: 'DELETE_QUEUE', payload: data.queueId }) dispatch({ type: 'DELETE_QUEUE', payload: data.queueId })
} }
}) }
socket.on('settings', (data) => { socket.on('queue', onQueueQueues)
const onSettingsQueues = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -144,10 +147,13 @@ const Queues = () => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsQueues)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsQueues)
socket.off("queue", onQueueQueues)
} }
}, []) }, [])

12
frontend/src/pages/QuickAnswers/index.js
View File

@ -1,5 +1,6 @@
import React, { useState, useContext, useEffect, useReducer } from "react" import React, { useState, useContext, useEffect, useReducer } from "react"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { import {
Button, Button,
@ -125,9 +126,9 @@ const QuickAnswers = () => {
}, [searchParam, pageNumber]) }, [searchParam, pageNumber])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("quickAnswer", (data) => { const onQuickAnswerQuickAnswers = (data) => {
if (data.action === "update" || data.action === "create") { if (data.action === "update" || data.action === "create") {
dispatch({ type: "UPDATE_QUICK_ANSWERS", payload: data.quickAnswer }) dispatch({ type: "UPDATE_QUICK_ANSWERS", payload: data.quickAnswer })
} }
@ -138,10 +139,11 @@ const QuickAnswers = () => {
payload: +data.quickAnswerId, payload: +data.quickAnswerId,
}) })
} }
}) }
socket.on("quickAnswer", onQuickAnswerQuickAnswers)
return () => { return () => {
socket.disconnect() socket.off("quickAnswer", onQuickAnswerQuickAnswers)
} }
}, []) }, [])

79
frontend/src/pages/Report/index.js
View File

@ -18,7 +18,8 @@ import MaterialTable from 'material-table'
import LogoutIcon from '@material-ui/icons/CancelOutlined' import LogoutIcon from '@material-ui/icons/CancelOutlined'
import apiBroker from "../../services/apiBroker" import apiBroker from "../../services/apiBroker"
import fileDownload from 'js-file-download' import fileDownload from 'js-file-download'
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { i18n } from "../../translate/i18n" import { i18n } from "../../translate/i18n"
import Switch from '@mui/material/Switch' import Switch from '@mui/material/Switch'
@ -239,7 +240,7 @@ let columnsData = [
{ title: `Espera`, field: 'waiting_time' }, { title: `Espera`, field: 'waiting_time' },
{ title: `Mensagens`, field: 'messagesToFilter', searchable: true, hidden: true }, { title: `Mensagens`, field: 'messagesToFilter', searchable: true, hidden: true },
{ title: `Link`, field: 'link', searchable: false, hidden: true, export: true }, { title: `Link`, field: 'link', searchable: false, hidden: true, export: true },
] ]
let columnsDataSuper = [ let columnsDataSuper = [
{ title: `Tipo`, field: 'isRemote' }, { title: `Tipo`, field: 'isRemote' },
@ -381,10 +382,10 @@ const Report = () => {
const tickets = data.tickets.map(ticket => { const tickets = data.tickets.map(ticket => {
ticket.isRemote = ticket.isRemote ? 'Remoto' : 'Comum'; ticket.isRemote = ticket.isRemote ? 'Remoto' : 'Comum';
return ({ return ({
...ticket, ...ticket,
messagesToFilter: ticket.messages.map(message => message.body).join(' '), messagesToFilter: ticket.messages.map(message => message.body).join(' '),
link: `${process.env.REACT_APP_FRONTEND_URL}/tickets/${ticket.id}` link: `${process.env.REACT_APP_FRONTEND_URL}/tickets/${ticket.id}`
}) })
}) })
dispatchQ({ type: "LOAD_QUERY", payload: tickets }) dispatchQ({ type: "LOAD_QUERY", payload: tickets })
setHasMore(data.hasMore) setHasMore(data.hasMore)
@ -591,9 +592,9 @@ const Report = () => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("queryOnQueueStatus", (data) => { const onQueryOnQueueStatusReport = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
if (String(data.queryOnQueue.adminId) === String(userA.id)) { if (String(data.queryOnQueue.adminId) === String(userA.id)) {
@ -604,35 +605,39 @@ const Report = () => {
} }
} }
}) }
socket.on("queryOnQueueStatus", onQueryOnQueueStatusReport)
const onOnlineStatusReport = (data) => {
let date = new Date().toLocaleDateString('pt-BR').split('/')
let dateToday = `${date[2]}-${date[1]}-${date[0]}`
if (data.action === "logout" || (data.action === "update" &&
((`${startDate}` === `${endDate}`) && (`${endDate}` === `${dateToday}`) && (`${startDate}` === `${dateToday}`)))) {
dispatchQ({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime })
}
else if (data.action === "delete") {
dispatchQ({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime })
}
}
const onUserReport = (data) => {
if (data.action === "delete") {
dispatch({ type: "DELETE_USER", payload: +data.userId })
}
}
if (reportOption === '2') { if (reportOption === '2') {
socket.on("onlineStatus", onOnlineStatusReport)
socket.on("onlineStatus", (data) => { socket.on("user", onUserReport)
let date = new Date().toLocaleDateString('pt-BR').split('/')
let dateToday = `${date[2]}-${date[1]}-${date[0]}`
if (data.action === "logout" || (data.action === "update" &&
((`${startDate}` === `${endDate}`) && (`${endDate}` === `${dateToday}`) && (`${startDate}` === `${dateToday}`)))) {
dispatchQ({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime })
}
else if (data.action === "delete") {
dispatchQ({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime })
}
})
socket.on("user", (data) => {
if (data.action === "delete") {
dispatch({ type: "DELETE_USER", payload: +data.userId })
}
})
} }
else if (reportOption === "1") { else if (reportOption === "1") {
@ -641,7 +646,9 @@ const Report = () => {
} }
return () => { return () => {
socket.disconnect() socket.off("onlineStatus", onOnlineStatusReport)
socket.off("user", onUserReport)
socket.off("queryOnQueueStatus", onQueryOnQueueStatusReport)
} }
@ -687,7 +694,7 @@ const Report = () => {
const renderSwitch = (param) => { const renderSwitch = (param) => {
if(userA.profile !== 'supervisor'){ if (userA.profile !== 'supervisor') {
switch (param) { switch (param) {
case 'empty': case 'empty':
return ( return (
@ -880,7 +887,7 @@ const Report = () => {
<> <>
<MTable data={query} <MTable data={query}
columns={userA.profile !== 'supervisor' ? columnsData : columnsDataSuper} columns={userA.profile !== 'supervisor' ? columnsData : columnsDataSuper}
hasChild={userA.profile !== 'supervisor' ? true :false} hasChild={userA.profile !== 'supervisor' ? true : false}
removeClickRow={false} removeClickRow={false}
handleScroll={handleScroll} handleScroll={handleScroll}

20
frontend/src/pages/SchedulesReminder/index.js
View File

@ -28,8 +28,8 @@ import { render } from '@testing-library/react'
// import Modal from "../../../..ChatEnd/ModalChatEnd"; // import Modal from "../../../..ChatEnd/ModalChatEnd";
import Modal from "../../components/ModalUpdateScheduleReminder" import Modal from "../../components/ModalUpdateScheduleReminder"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
@ -204,11 +204,9 @@ const SchedulesReminder = () => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("schedulingNotify", (data) => {
const onSchedulingNotifySchedulesRemider = (data) => {
setLoading(true) setLoading(true)
@ -228,10 +226,12 @@ const SchedulesReminder = () => {
setLoading(false) setLoading(false)
}) }
socket.on("schedulingNotify", onSchedulingNotifySchedulesRemider)
return () => { return () => {
socket.disconnect() socket.off("schedulingNotify", onSchedulingNotifySchedulesRemider)
} }
}, []) }, [])
@ -300,9 +300,9 @@ const SchedulesReminder = () => {
useEffect(() => { useEffect(() => {
if (!loading) { if (!loading) {
setData(query.map(({ scheduleReminder, ...others }) => ( setData(query.map(({ scheduleReminder, ...others }) => (
{ {

15
frontend/src/pages/Settings/index.js
View File

@ -1,5 +1,6 @@
import React, { useState, useEffect, useContext } from 'react' import React, { useState, useEffect, useContext } from 'react'
import openSocket from 'socket.io-client' //import openSocket from 'socket.io-client'
import { socket } from '../../services/socket.js'
import { makeStyles } from '@material-ui/core/styles' import { makeStyles } from '@material-ui/core/styles'
import Paper from '@material-ui/core/Paper' import Paper from '@material-ui/core/Paper'
@ -124,9 +125,9 @@ const Settings = () => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => { const onSettingsSettings = (data) => {
console.log('settings updated ----------------------------') console.log('settings updated ----------------------------')
if (data.action === 'update') { if (data.action === 'update') {
@ -137,10 +138,12 @@ const Settings = () => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsSettings)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsSettings)
} }
}, []) }, [])
@ -641,7 +644,7 @@ const Settings = () => {
</Select> </Select>
</Paper> </Paper>
</Container> </Container>
</div> </div>
</div> </div>
)} )}
/> />

19
frontend/src/pages/StatusChatEnd/index.js
View File

@ -1,5 +1,6 @@
import React, { useState, useContext, useEffect, useReducer } from "react" import React, { useState, useContext, useEffect, useReducer } from "react"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { import {
Button, Button,
@ -115,7 +116,7 @@ const StatusChatEnd = () => {
const { data } = await api.get("/statusChatEnd", { const { data } = await api.get("/statusChatEnd", {
params: { searchParam, pageNumber }, params: { searchParam, pageNumber },
}) })
setChecked(data?.statusChatEnd?.map(s => s.isDefault ? true : false)) setChecked(data?.statusChatEnd?.map(s => s.isDefault ? true : false))
dispatch({ type: "LOAD_STATUS_CHAT_END", payload: data.statusChatEnd }) dispatch({ type: "LOAD_STATUS_CHAT_END", payload: data.statusChatEnd })
@ -131,9 +132,9 @@ const StatusChatEnd = () => {
}, [searchParam, pageNumber]) }, [searchParam, pageNumber])
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("statusChatEnd", (data) => { const onStatusChatEndStatusChatEnd = (data) => {
if (data.action === "update" || data.action === "create") { if (data.action === "update" || data.action === "create") {
dispatch({ type: "UPDATE_STATUS_CHAT_END", payload: data.statusChatEnd }) dispatch({ type: "UPDATE_STATUS_CHAT_END", payload: data.statusChatEnd })
} }
@ -144,10 +145,12 @@ const StatusChatEnd = () => {
payload: +data.statusChatEndId, payload: +data.statusChatEndId,
}) })
} }
}) }
socket.on("statusChatEnd", onStatusChatEndStatusChatEnd)
return () => { return () => {
socket.disconnect() socket.off("statusChatEnd", onStatusChatEndStatusChatEnd)
} }
}, []) }, [])
@ -187,14 +190,14 @@ const StatusChatEnd = () => {
} }
const handleChange = async (event, statusChatEnd, index) => { const handleChange = async (event, statusChatEnd, index) => {
const newChecked = new Array(statusChatEnds.length).fill(false) const newChecked = new Array(statusChatEnds.length).fill(false)
newChecked[index] = event.target.checked newChecked[index] = event.target.checked
setChecked(newChecked) setChecked(newChecked)
try { try {
const { id } = statusChatEnd const { id } = statusChatEnd
await api.put(`/statusChatEnd/${id}`, { isDefault: event.target.checked }) await api.put(`/statusChatEnd/${id}`, { isDefault: event.target.checked })
toast.success("Status de encerramento padrão salvo com sucesso") toast.success("Status de encerramento padrão salvo com sucesso")
} catch (error) { } catch (error) {

18
frontend/src/pages/Users/index.js
View File

@ -1,6 +1,7 @@
import React, { useState, useEffect, useReducer, useContext } from "react" import React, { useState, useEffect, useReducer, useContext } from "react"
import { toast } from "react-toastify" import { toast } from "react-toastify"
import openSocket from "socket.io-client" //import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import { makeStyles } from "@material-ui/core/styles" import { makeStyles } from "@material-ui/core/styles"
import Paper from "@material-ui/core/Paper" import Paper from "@material-ui/core/Paper"
@ -165,9 +166,9 @@ const Users = () => {
useEffect(() => { useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL) //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("user", (data) => { const onUserUsers = (data) => {
if (data.action === "update" || data.action === "create") { if (data.action === "update" || data.action === "create") {
dispatch({ type: "UPDATE_USERS", payload: data.user }) dispatch({ type: "UPDATE_USERS", payload: data.user })
} }
@ -175,10 +176,11 @@ const Users = () => {
if (data.action === "delete") { if (data.action === "delete") {
dispatch({ type: "DELETE_USER", payload: +data.userId }) dispatch({ type: "DELETE_USER", payload: +data.userId })
} }
}) }
socket.on("user", onUserUsers)
socket.on('settings', (data) => { const onSettingsUsers = (data) => {
if (data.action === 'update') { if (data.action === 'update') {
setSettings((prevState) => { setSettings((prevState) => {
const aux = [...prevState] const aux = [...prevState]
@ -187,10 +189,12 @@ const Users = () => {
return aux return aux
}) })
} }
}) }
socket.on('settings', onSettingsUsers)
return () => { return () => {
socket.disconnect() socket.off("settings", onSettingsUsers)
socket.off("user", onUserUsers)
} }
}, []) }, [])