frontend/src/components/MessagesList/index.js

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

frontend/src/components/PositionModal/index.js

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

frontend/src/components/QrcodeModal/index.js

@@ -1,8 +1,6 @@
 import React, { useEffect, useState, useContext } from "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 { Dialog, DialogContent, Paper, Typography } from "@material-ui/core";
@@ -33,9 +31,9 @@ const QrcodeModal = ({ open, onClose, whatsAppId }) => {
 
 	useEffect(() => {
 		if (!whatsAppId) return;
-		//const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
+		const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
 
-		const onWhatsAppSessionQrCode = data => {
+		socket.on("whatsappSession", data => {
 			if (data.action === "update" && data.session.id === whatsAppId) {
 				setQrCode(data.session.qrcode);
 			}
@@ -48,19 +46,17 @@ const QrcodeModal = ({ open, onClose, whatsAppId }) => {
 
 					console.log('user.profile: ', user.profile)
 
-				if (user.profile === 'master') {
+				if(user.profile === 'master'){
 
 					alert(data.msg)
 
 				} 
 				
 			}
-		}
+		});
-
-		socket.on("whatsappSession", onWhatsAppSessionQrCode);
 
 		return () => {
-			socket.off("whatsappSession", onWhatsAppSessionQrCode);
+			socket.disconnect();
 		};
 	}, [whatsAppId, onClose, user.profile]);
 

frontend/src/components/QueueModal/index.js

@@ -23,8 +23,8 @@ import { IconButton, InputAdornment } from "@material-ui/core"
 import { Colorize } from "@material-ui/icons"
 
 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 => ({
@@ -92,9 +92,9 @@ const QueueModal = ({ open, onClose, queueId }) => {
 	}, [setting])
 
 	useEffect(() => {
-		//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+		const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-		const onSettingsQueueModal = (data) => {
+		socket.on('settings', (data) => {
 			if (data.action === 'update') {
 				setSettings((prevState) => {
 					const aux = [...prevState]
@@ -103,12 +103,10 @@ const QueueModal = ({ open, onClose, queueId }) => {
 					return aux
 				})
 			}
-		}
+		})
-
-		socket.on('settings', onSettingsQueueModal)
 
 		return () => {
-			socket.off("settings", onSettingsQueueModal)
+			socket.disconnect()
 		}
 	}, [])
 

frontend/src/components/QuickAnswersModal/index.js

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

frontend/src/components/StatusChatEndModal/index.js

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

frontend/src/components/TransferTicketModal/index.js

@@ -1,7 +1,6 @@
 import React, { useState, useContext, useMemo, 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 Button from "@material-ui/core/Button"
 import Dialog from "@material-ui/core/Dialog"
@@ -111,9 +110,9 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
 
 
 	useEffect(() => {
-		//const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+		const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-		const onSettingsTransferTicketModal = (data) => {
+		socket.on('settings', (data) => {
 			console.log('settings updated ----------------------------xxxxxxxxxxxx')
 
 			if (data.action === 'update') {
@@ -124,12 +123,10 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
 					return aux
 				})
 			}
-		}
+		})
-
-		socket.on('settings', onSettingsTransferTicketModal)
 
 		return () => {
-			socket.off("settings", onSettingsTransferTicketModal)
+			socket.disconnect()
 		}
 	}, [])
 
@@ -231,7 +228,7 @@ const TransferTicketModal = ({ modalOpen, onClose, ticketid }) => {
 					{i18n.t("transferTicketModal.title")}
 				</DialogTitle>
 				<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>{'Usuário'}</InputLabel>

frontend/src/pages/Campaign/index.js

@@ -1,8 +1,7 @@
 import React, { useState, useCallback, useEffect, useReducer, useContext } from 'react'
 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 { green } from '@material-ui/core/colors'
@@ -297,9 +296,10 @@ const Campaign = () => {
     }  
 
     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 (String(data.insertOnQueue.adminId) === String(user.id)) {
@@ -312,24 +312,19 @@ const Campaign = () => {
                 }
 
             }
-        }
+        })
 
-        socket.on("contactsBulkInsertOnQueueStatus", onContactsBulkCampaing)
+        socket.on('campaign', (data) => { 
-
-        const onCampaignCampaign = (data) => {
 
             if (data.action === 'update') {
                 dispatch({ type: "UPDATE_CAMPAIGNS", payload: data.campaign })
             }
-        }
+        }) 
-
-        socket.on('campaign', onCampaignCampaign)
 
    
 
         return () => {
-            socket.off("campaign", onCampaignCampaign)
+            socket.disconnect()
-            socket.off("contactsBulkInsertOnQueueStatus", onContactsBulkCampaing)
         }
     }, [user.id])
 

frontend/src/pages/Connections/index.js

@@ -2,8 +2,7 @@ import React, { useState, useCallback, useEffect, useContext } from 'react'
 import { toast } from 'react-toastify'
 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 { green, red, yellow, grey } from '@material-ui/core/colors'
@@ -452,17 +451,15 @@ const Connections = () => {
   }, [])
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onDiskSpaceMonitConnections = (data) => {
+    socket.on('diskSpaceMonit', (data) => {
       if (data.action === 'update') {
         setDiskSpaceInfo(data.diskSpace)
       }
-    }
+    })
 
-    socket.on('diskSpaceMonit', onDiskSpaceMonitConnections)
+    socket.on('settings', (data) => {
-
-    const onSettingsConnections = (data) => {
       if (data.action === 'update') {
         setSettings((prevState) => {
           const aux = [...prevState]
@@ -471,13 +468,10 @@ const Connections = () => {
           return aux
         })
       }
-    }
+    })
-
-    socket.on('settings', onSettingsConnections)
 
     return () => {
-      socket.off("settings", onSettingsConnections)
+      socket.disconnect()
-      socket.off("diskSpaceMonit", onDiskSpaceMonitConnections)
     }
   }, [])
 

frontend/src/pages/Contacts/index.js

@@ -1,6 +1,5 @@
 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 { useHistory } from "react-router-dom"
 
@@ -261,9 +260,9 @@ const Contacts = () => {
   }, [searchParam, pageNumber])
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onContactsBulkContacts = (data) => {
+    socket.on("contactsBulkInsertOnQueueStatus", (data) => {
       if (data.action === 'update') {
 
         if (String(data.insertOnQueue.adminId) === String(user.id)) {
@@ -279,11 +278,9 @@ const Contacts = () => {
         }
 
       }
-    }
+    })
 
-    socket.on("contactsBulkInsertOnQueueStatus", onContactsBulkContacts)
+    socket.on("contact", (data) => {
-
-    const onContactContacts = (data) => {
       if (data.action === "update" || data.action === "create") {
         dispatch({ type: "UPDATE_CONTACTS", payload: data.contact })
       }
@@ -291,13 +288,10 @@ const Contacts = () => {
       if (data.action === "delete") {
         dispatch({ type: "DELETE_CONTACT", payload: +data.contactId })
       }
-    }
+    })
-
-    socket.on("contact", onContactContacts)
 
     return () => {
-      socket.off("contact", onContactContacts)
+      socket.disconnect()
-      socket.off("contactsBulkInsertOnQueueStatus", onContactsBulkContacts)
     }
   }, [user, history])
 

frontend/src/pages/Dashboard/index.js

@@ -17,8 +17,7 @@ import { AuthContext } from "../../context/Auth/AuthContext"
 // import { i18n } from "../../translate/i18n";
 import Chart from "./Chart"
 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 { Can } from "../../components/Can"
@@ -357,54 +356,46 @@ const Dashboard = () => {
 
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onTicketsStatusDashboard = (data) => {
+    socket.on("ticketStatus", (data) => {
       if (data.action === "update") {
         setStatus("")
         setStatus(data.ticketStatus.status)
       }
-    }
+    })
 
-    socket.on("ticketStatus", onTicketsStatusDashboard)
+    socket.on("onlineStatus", (data) => {
-
-    const onOnlineStatusDashboard = (data) => {
       if (data.action === "logout" || data.action === "update") {
 
         dispatch({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime })
       } else if (data.action === "delete") {
         dispatch({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime })
       }
-    }
+    })
 
-    socket.on("onlineStatus", onOnlineStatusDashboard)
+    socket.on("user", (data) => {
-
-    const onUserDashboard = (data) => {
       if (data.action === "delete") {
         dispatch({ type: "DELETE_USER", payload: +data.userId })
       }
-    }
+    })
-
-    socket.on("user", onUserDashboard)
 
     return () => {
-      socket.off("user", onUserDashboard)
+      socket.disconnect()
-      socket.off("onlineStatus", onOnlineStatusDashboard)
-      socket.off("ticketStatus", onTicketsStatusDashboard)
     }
   }, [])
   
   const handleSelectedQueue = useCallback((queueSelected) => {
-    if (queueSelected !== 'All') {
+    if(queueSelected !== 'All'){
       const queueIndex = user?.queues?.findIndex((q) => q.id === parseInt(queueSelected));
       const queueIds = []
       queueIds.push(user?.queues[queueIndex]?.id);
       setSelectedQueue(queueIds);
-    } else {
+    }else{
       const queueIds = user?.queues?.map((queue) => queue.id);
       setSelectedQueue(queueIds);
     }
-  }, [user, setSelectedQueue])
+  },[user, setSelectedQueue])
 
   useEffect(() => {
     if (ticketStatusChange === "") return
@@ -541,7 +532,7 @@ const Dashboard = () => {
                 <Grid item container spacing={3}>
                   <Grid item xs={12} sm={12} md={6} lg={6}>
                     <Paper className={classes.fixedHeightPaper} variant="outlined">
-                      <Chart allTickets={usersOnlineInfo} selectedQueue={selectedQueue} />
+                      <Chart allTickets={usersOnlineInfo} selectedQueue = {selectedQueue}/>
                     </Paper>
                   </Grid>
                   <Grid item xs={12} sm={12} md={6} lg={6}>

frontend/src/pages/Position/index.js

@@ -1,6 +1,5 @@
 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 {
   Button,
@@ -126,9 +125,9 @@ const Position = () => {
   }, [searchParam, pageNumber])
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onPositionPosition = (data) => {
+    socket.on("position", (data) => {
       if (data.action === "update" || data.action === "create") {
         dispatch({ type: "UPDATE_POSITIONS", payload: data.position })
       }
@@ -139,12 +138,10 @@ const Position = () => {
           payload: +data.positionId,
         })
       }
-    }
+    })
-
-    socket.on("position", onPositionPosition)
 
     return () => {
-      socket.off("position", onPositionPosition)
+      socket.disconnect()
     }
   }, [])
 

frontend/src/pages/Queues/index.js

@@ -1,7 +1,6 @@
 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 {
   Button,
@@ -124,9 +123,9 @@ const Queues = () => {
   }, []) 
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onQueueQueues = (data) => {
+    socket.on('queue', (data) => {
       if (data.action === 'update' || data.action === 'create') {
         dispatch({ type: 'UPDATE_QUEUES', payload: data.queue })
       }
@@ -134,11 +133,9 @@ const Queues = () => {
       if (data.action === 'delete') {
         dispatch({ type: 'DELETE_QUEUE', payload: data.queueId })
       }
-    }
+    })
 
-    socket.on('queue', onQueueQueues)
+    socket.on('settings', (data) => {
-
-    const onSettingsQueues = (data) => {
       if (data.action === 'update') {
         setSettings((prevState) => {
           const aux = [...prevState]
@@ -147,13 +144,10 @@ const Queues = () => {
           return aux
         })
       }
-    }
+    })
-
-    socket.on('settings', onSettingsQueues)
 
     return () => {
-      socket.off("settings", onSettingsQueues)
+      socket.disconnect()
-      socket.off("queue", onQueueQueues)
     }
   }, [])
 

frontend/src/pages/QuickAnswers/index.js

@@ -1,6 +1,5 @@
 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 {
   Button,
@@ -126,9 +125,9 @@ const QuickAnswers = () => {
   }, [searchParam, pageNumber])
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onQuickAnswerQuickAnswers = (data) => {
+    socket.on("quickAnswer", (data) => {
       if (data.action === "update" || data.action === "create") {
         dispatch({ type: "UPDATE_QUICK_ANSWERS", payload: data.quickAnswer })
       }
@@ -139,11 +138,10 @@ const QuickAnswers = () => {
           payload: +data.quickAnswerId,
         })
       }
-    }
+    })
-    socket.on("quickAnswer", onQuickAnswerQuickAnswers)
 
     return () => {
-      socket.off("quickAnswer", onQuickAnswerQuickAnswers)
+      socket.disconnect()
     }
   }, [])
 

frontend/src/pages/Report/index.js

@@ -18,8 +18,7 @@ import MaterialTable from 'material-table'
 import LogoutIcon from '@material-ui/icons/CancelOutlined'
 import apiBroker from "../../services/apiBroker"
 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 Switch from '@mui/material/Switch'
 
@@ -592,9 +591,9 @@ const Report = () => {
 
   useEffect(() => {
 
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onQueryOnQueueStatusReport = (data) => {
+    socket.on("queryOnQueueStatus", (data) => {
       if (data.action === 'update') {
 
         if (String(data.queryOnQueue.adminId) === String(userA.id)) {
@@ -605,11 +604,12 @@ const Report = () => {
         }
 
       }
-    }
+    })
 
-    socket.on("queryOnQueueStatus", onQueryOnQueueStatusReport)
+    if (reportOption === '2') {
 
-    const onOnlineStatusReport = (data) => {
+
+      socket.on("onlineStatus", (data) => {
 
         let date = new Date().toLocaleDateString('pt-BR').split('/')
         let dateToday = `${date[2]}-${date[1]}-${date[0]}`
@@ -624,20 +624,15 @@ const Report = () => {
           dispatchQ({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime })
         }
 
-    }
+      })
 
-    const onUserReport = (data) => {
+      socket.on("user", (data) => {
 
         if (data.action === "delete") {
           dispatch({ type: "DELETE_USER", payload: +data.userId })
         }
-    }
+      })
 
-    if (reportOption === '2') {
-
-      socket.on("onlineStatus", onOnlineStatusReport)
-
-      socket.on("user", onUserReport)
 
     }
     else if (reportOption === "1") {
@@ -646,9 +641,7 @@ const Report = () => {
     }
 
     return () => {
-      socket.off("onlineStatus", onOnlineStatusReport)
+      socket.disconnect()
-      socket.off("user", onUserReport)
-      socket.off("queryOnQueueStatus", onQueryOnQueueStatusReport)
     }
 
 
@@ -694,7 +687,7 @@ const Report = () => {
 
 
   const renderSwitch = (param) => {
-    if (userA.profile !== 'supervisor') {
+    if(userA.profile !== 'supervisor'){
       switch (param) {
         case 'empty':
           return (
@@ -887,7 +880,7 @@ const Report = () => {
                 <>
                   <MTable data={query}
                     columns={userA.profile !== 'supervisor' ? columnsData : columnsDataSuper}
-                    hasChild={userA.profile !== 'supervisor' ? true : false}
+                    hasChild={userA.profile !== 'supervisor' ? true :false}
                     removeClickRow={false}
 
                     handleScroll={handleScroll}

frontend/src/pages/SchedulesReminder/index.js

@@ -28,8 +28,8 @@ import { render } from '@testing-library/react'
 // import Modal from "../../../..ChatEnd/ModalChatEnd";  
 import Modal from "../../components/ModalUpdateScheduleReminder"
 
-//import openSocket from "socket.io-client"
+import openSocket from "socket.io-client"
-import { socket } from "../../services/socket"
+
 
 
 
@@ -204,9 +204,11 @@ const SchedulesReminder = () => {
 
   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)
 
@@ -226,12 +228,10 @@ const SchedulesReminder = () => {
       setLoading(false)
 
 
-    }
+    })
-
-    socket.on("schedulingNotify", onSchedulingNotifySchedulesRemider)
 
     return () => {
-      socket.off("schedulingNotify", onSchedulingNotifySchedulesRemider)
+      socket.disconnect()
     }
   }, [])
 

frontend/src/pages/Settings/index.js

@@ -1,6 +1,5 @@
 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 Paper from '@material-ui/core/Paper'
@@ -125,9 +124,9 @@ const Settings = () => {
 
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onSettingsSettings = (data) => {
+    socket.on('settings', (data) => {
       console.log('settings updated ----------------------------')
 
       if (data.action === 'update') {
@@ -138,12 +137,10 @@ const Settings = () => {
           return aux
         })
       }
-    }
+    })
-
-    socket.on('settings', onSettingsSettings)
 
     return () => {
-      socket.off("settings", onSettingsSettings)
+      socket.disconnect()
     }
   }, [])
 

frontend/src/pages/StatusChatEnd/index.js

@@ -1,6 +1,5 @@
 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 {
   Button,
@@ -132,9 +131,9 @@ const StatusChatEnd = () => {
   }, [searchParam, pageNumber])
 
   useEffect(() => {
-    //const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL)
 
-    const onStatusChatEndStatusChatEnd = (data) => {
+    socket.on("statusChatEnd", (data) => {
       if (data.action === "update" || data.action === "create") {
         dispatch({ type: "UPDATE_STATUS_CHAT_END", payload: data.statusChatEnd })
       }
@@ -145,12 +144,10 @@ const StatusChatEnd = () => {
           payload: +data.statusChatEndId,
         })
       }
-    }
+    })
-
-    socket.on("statusChatEnd", onStatusChatEndStatusChatEnd)
 
     return () => {
-      socket.off("statusChatEnd", onStatusChatEndStatusChatEnd)
+      socket.disconnect()
     }
   }, [])
 

frontend/src/pages/Users/index.js

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