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

refactor: criado conexao web socket global e movido alguns listeners para ela

websocket
willian-pessoa 2024-05-08 18:02:31 -03:00
parent 914fde7803
commit a5d3f19e1a
7 changed files with 122 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/src/components/NotificationsPopOver/index.js
View File

@ -2,7 +2,8 @@ import React, { useState, useRef, useEffect, useContext } from "react"
import { useHistory } from "react-router-dom"
import { format } from "date-fns"
import openSocket from "socket.io-client"
//import openSocket from "socket.io-client"
import { socket } from "../../services/socket"
import useSound from "use-sound"
import Popover from "@material-ui/core/Popover"
@ -132,7 +133,7 @@ const NotificationsPopOver = () => {
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("reload_page", (data) => {
@ -193,7 +194,8 @@ const NotificationsPopOver = () => {
return () => {
socket.disconnect()
socket.removeAllListeners('reload_page');
socket.removeAllListeners('onlineStatus');
}
}, [user.id, handleLogout, user.profile])
@ -201,12 +203,17 @@ const NotificationsPopOver = () => {
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on("connect", () => socket.emit("joinNotification"))
const onConnectNotifications = () => {
socket.emit("joinNotification")
}
onConnectNotifications()
socket.on("ticket", data => {
socket.on("connect", onConnectNotifications)
const onTicketNotifications = data => {
if (data.action === "updateUnread" || data.action === "delete") {
@ -232,25 +239,18 @@ const NotificationsPopOver = () => {
return prevState
})
}
})
socket.on("appMessage", data => {
}
socket.on("ticket", onTicketNotifications)
const onAppMessageNotifications = data => {
if (
data.action === "create" &&
!data.message.read &&
(data.ticket.userId === user?.id || !data.ticket.userId)
) {
setNotifications(prevState => {
// prevState.forEach((e)=>{
//
// })
@ -265,8 +265,6 @@ const NotificationsPopOver = () => {
return [data.ticket, ...prevState]
})
const shouldNotNotificate = (data.message.ticketId === ticketIdRef.current && document.visibilityState === "visible") ||
(data.ticket.userId && data.ticket.userId !== user?.id) ||
data.ticket.isGroup || !data.ticket.userId
@ -275,14 +273,19 @@ const NotificationsPopOver = () => {
handleNotifications(data)
}
})
}
socket.on("appMessage", onAppMessageNotifications)
socket.on('notifyPeding', data => {
if (settings?.length > 0 && getSettingValue('notificationTransferQueue') === 'enabled') handleNotifications("", data);
});
return () => {
socket.disconnect()
socket.off('connect', onConnectNotifications);
socket.off('ticket', onTicketNotifications);
socket.off('appMessage', onAppMessageNotifications);
socket.removeAllListeners('notifyPeding');
}
}, [user, settings])

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

@ -22,7 +22,8 @@ import MarkdownWrapper from "../MarkdownWrapper"
import { Tooltip } from "@material-ui/core"
import { AuthContext } from "../../context/Auth/AuthContext"
import toastError from "../../errors/toastError"
import openSocket from 'socket.io-client'
//import openSocket from 'socket.io-client'
import { socket } from "../../services/socket"
const useStyles = makeStyles(theme => ({
ticket: {
@ -151,7 +152,7 @@ const TicketListItem = ({ ticket, remoteTicketsControll, settings }) => {
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('remoteTickesControll', (data) => {
console.log('REMOTE TICKETS CONTROLL UPDATE2: ', data.tickets)
@ -160,8 +161,7 @@ const TicketListItem = ({ ticket, remoteTicketsControll, settings }) => {
}
})
socket.on('settings', (data) => {
const onSettingsTicketListItem = (data) => {
if (data.action === 'update') {
setSettings((prevState) => {
const aux = [...prevState]
@ -170,11 +170,13 @@ const TicketListItem = ({ ticket, remoteTicketsControll, settings }) => {
return aux
})
}
})
}
socket.on('settings', onSettingsTicketListItem)
return () => {
socket.disconnect()
socket.removeAllListeners('remoteTickesControll');
socket.off('settings', onSettingsTicketListItem);
}
}, [])

37
frontend/src/components/TicketsList/index.js
View File

@ -1,7 +1,7 @@
import React, { useState, useEffect, useReducer, useContext } from "react"
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 List from "@material-ui/core/List"
@ -243,7 +243,7 @@ const TicketsList = (props) => {
// if (tab=='search')return
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
const shouldUpdateTicket = ticket =>
(!ticket.userId || ticket.userId === user?.id || showAll) &&
@ -252,18 +252,19 @@ const TicketsList = (props) => {
const notBelongsToUserQueues = ticket =>
ticket.queueId && selectedQueueIds.indexOf(ticket.queueId) === -1
socket.on("connect", () => {
const onConnectTicketList = () => {
if (status) {
socket.emit("joinTickets", status)
} else {
socket.emit("joinNotification")
}
}
})
onConnectTicketList()
socket.on("connect", onConnectTicketList)
socket.on("ticket", data => {
const onTicketTicketList = data => {
if (data.action === "updateUnread") {
@ -292,10 +293,11 @@ const TicketsList = (props) => {
if (data.action === "delete") {
dispatch({ type: "DELETE_TICKET", payload: data.ticketId })
}
})
}
socket.on("ticket", onTicketTicketList)
socket.on("appMessage", data => {
const onAppMessageTicketList = data => {
if (data.action === "create" && shouldUpdateTicket(data.ticket)) {
@ -307,7 +309,9 @@ const TicketsList = (props) => {
payload: data,
})
}
})
}
socket.on("appMessage", onAppMessageTicketList)
socket.on("contact", data => {
if (data.action === "update") {
@ -326,8 +330,7 @@ const TicketsList = (props) => {
}
})
socket.on('settings', (data) => {
const onSettingsTicketList = (data) => {
if (data.action === 'update') {
setSettings((prevState) => {
const aux = [...prevState]
@ -336,11 +339,17 @@ const TicketsList = (props) => {
return aux
})
}
})
}
socket.on('settings', onSettingsTicketList)
return () => {
socket.disconnect()
socket.off("ticket", onTicketTicketList)
socket.off('appMessage', onAppMessageTicketList);
socket.removeAllListeners("contact")
socket.off('connect', onConnectTicketList);
socket.off('settings', onSettingsTicketList);
socket.removeAllListeners('remoteTickesControll');
}
}, [status, showAll, user, selectedQueueIds, tab])

14
frontend/src/hooks/useAuth.js/index.js
View File

@ -1,6 +1,7 @@
import { useState, useEffect } from 'react'
import { useHistory } from 'react-router-dom'
import openSocket from 'socket.io-client'
//import openSocket from 'socket.io-client'
import { socket } from '../../services/socket'
import { toast } from 'react-toastify'
@ -90,7 +91,7 @@ const useAuth = () => {
}, [])
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('user', (data) => {
if (data.action === 'update' && data.user.id === user.id) {
@ -98,7 +99,7 @@ const useAuth = () => {
}
})
socket.on('settings', (data) => {
const onSettingsAuth = (data) => {
if (data.action === 'update') {
setSetting((prevState) => {
const aux = [...prevState]
@ -107,10 +108,13 @@ const useAuth = () => {
return aux
})
}
})
}
socket.on('settings', onSettingsAuth)
return () => {
socket.disconnect()
socket.removeAllListeners('user');
socket.off('settings', onSettingsAuth);
}
}, [user])

10
frontend/src/hooks/useWhatsApps/index.js
View File

@ -1,5 +1,7 @@
import { useState, useEffect, useReducer } from "react";
import openSocket from "socket.io-client";
//import openSocket from "socket.io-client";
import { socket } from "../../services/socket";
import toastError from "../../errors/toastError";
@ -126,7 +128,7 @@ const useWhatsApps = () => {
}, []);
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
socket.on("whatsapp", data => {
if (data.action === "update") {
@ -158,7 +160,9 @@ const useWhatsApps = () => {
return () => {
socket.disconnect();
socket.removeAllListeners('whatsapp');
socket.removeAllListeners('whatsappSession');
socket.removeAllListeners('whatsappSessionMonit');
};
}, []);

11
frontend/src/layout/MainListItems.js
View File

@ -32,6 +32,7 @@ import { WhatsAppsContext } from '../context/WhatsApp/WhatsAppsContext'
import { AuthContext } from '../context/Auth/AuthContext'
import { Can } from '../components/Can'
import openSocket from 'socket.io-client'
import { socket } from '../services/socket'
import api from '../services/api'
@ -118,9 +119,9 @@ const MainListItems = (props) => {
}
useEffect(() => {
const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
socket.on('settings', (data) => {
const onSettingsMainListItem = (data) => {
if (data.action === 'update') {
setSettings((prevState) => {
const aux = [...prevState]
@ -129,10 +130,12 @@ const MainListItems = (props) => {
return aux
})
}
})
}
socket.on('settings', onSettingsMainListItem)
return () => {
socket.disconnect()
socket.off('settings', onSettingsMainListItem);
}
}, [])

6
frontend/src/services/socket.js 100644
View File

@ -0,0 +1,6 @@
import { io } from 'socket.io-client';
// "undefined" means the URL will be computed from the `window.location` object
const URL = process.env.REACT_APP_BACKEND_URL
export const socket = io(URL);