From 894e495b56957c2d9df545a755cea6b1e0687ec6 Mon Sep 17 00:00:00 2001 From: Boubrid Ihab Date: Tue, 2 May 2023 23:53:12 +0100 Subject: [PATCH 1/4] Socket issue --- modern/src/SocketController.js | 54 +++++++++++++++++++++++++++++++--- 1 file changed, 50 insertions(+), 4 deletions(-) diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js index 7dd073fd75..c71a0f03e1 100644 --- a/modern/src/SocketController.js +++ b/modern/src/SocketController.js @@ -2,7 +2,10 @@ import React, { useEffect, useRef, useState } from 'react'; import { useDispatch, useSelector, connect } from 'react-redux'; import { useNavigate } from 'react-router-dom'; import { Snackbar } from '@mui/material'; -import { devicesActions, sessionActions } from './store'; +import { + devicesActions, + sessionActions, +} from './store'; import { useEffectAsync } from './reactHelper'; import { useTranslation } from './common/components/LocalizationProvider'; import { snackBarDurationLongMs } from './common/util/duration'; @@ -26,11 +29,19 @@ const SocketController = () => { const [events, setEvents] = useState([]); const [notifications, setNotifications] = useState([]); + const [timeKeepAlive, setTimeKeepAlive] = useState(); + const soundEvents = useAttributePreference('soundEvents', ''); const soundAlarms = useAttributePreference('soundAlarms', 'sos'); const features = useFeatures(); + const resetCounterKeepAlive = () => { + setTimeKeepAlive(new Date()); + }; + + const isConnected = () => Math.abs(new Date() - timeKeepAlive) < 10000; + const connectSocket = () => { const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'; const socket = new WebSocket(`${protocol}//${window.location.host}/api/socket`); @@ -44,11 +55,10 @@ const SocketController = () => { dispatch(sessionActions.updateSocket(false)); if (event.code !== logoutCode) { try { - const devicesResponse = await fetch('/api/devices'); + const [devicesResponse, positionsResponse] = await Promise.all([fetch('/api/devices'), fetch('/api/positions')]); if (devicesResponse.ok) { dispatch(devicesActions.update(await devicesResponse.json())); } - const positionsResponse = await fetch('/api/positions'); if (positionsResponse.ok) { dispatch(sessionActions.updatePositions(await positionsResponse.json())); } @@ -58,7 +68,7 @@ const SocketController = () => { } catch (error) { // ignore errors } - setTimeout(() => connectSocket(), 60000); + setTimeout(connectSocket, 10000); } }; @@ -76,9 +86,39 @@ const SocketController = () => { } setEvents(data.events); } + if (data) { + resetCounterKeepAlive(); + } }; }; + const keepAlive = async () => { + if (!isConnected) { + const socket = socketRef.current; + if (socket) { + socket.close(logoutCode); + } + try { + const [devicesResponse, positionsResponse] = await Promise.all([fetch('/api/devices'), fetch('/api/positions')]); + if (devicesResponse.ok) { + dispatch(devicesActions.update(await devicesResponse.json())); + } + if (positionsResponse.ok) { + dispatch(sessionActions.updatePositions(await positionsResponse.json())); + } + connectSocket(); + } catch (error) { + // ignore errors + } + } + }; + + useEffect(() => { + if (authenticated) { + setTimeout(keepAlive, 3000); + } + }, [timeKeepAlive]); + useEffectAsync(async () => { if (authenticated) { const response = await fetch('/api/devices'); @@ -87,6 +127,7 @@ const SocketController = () => { } else { throw Error(await response.text()); } + resetCounterKeepAlive(); connectSocket(); return () => { const socket = socketRef.current; @@ -123,6 +164,11 @@ const SocketController = () => { message={notification.message} autoHideDuration={snackBarDurationLongMs} onClose={() => setEvents(events.filter((e) => e.id !== notification.id))} + ContentProps={{ + sx: { + background: 'red', + }, + }} /> ))} From 575fb9060d0a028bc58e0110068dea1a27581d8a Mon Sep 17 00:00:00 2001 From: Boubrid Ihab Date: Wed, 3 May 2023 00:19:42 +0100 Subject: [PATCH 2/4] new changes concerning socket Issue --- modern/src/SocketController.js | 24 +++++------------------- 1 file changed, 5 insertions(+), 19 deletions(-) diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js index c71a0f03e1..8846bff0ed 100644 --- a/modern/src/SocketController.js +++ b/modern/src/SocketController.js @@ -29,18 +29,16 @@ const SocketController = () => { const [events, setEvents] = useState([]); const [notifications, setNotifications] = useState([]); - const [timeKeepAlive, setTimeKeepAlive] = useState(); + const [lastUpdate, setLastUpdate] = useState(); const soundEvents = useAttributePreference('soundEvents', ''); const soundAlarms = useAttributePreference('soundAlarms', 'sos'); const features = useFeatures(); - const resetCounterKeepAlive = () => { - setTimeKeepAlive(new Date()); - }; - - const isConnected = () => Math.abs(new Date() - timeKeepAlive) < 10000; + const resetCounterKeepAlive = () => setLastUpdate(new Date()); + + const isConnected = () => Math.abs(new Date() - lastUpdate) < 10000; const connectSocket = () => { const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'; @@ -99,13 +97,6 @@ const SocketController = () => { socket.close(logoutCode); } try { - const [devicesResponse, positionsResponse] = await Promise.all([fetch('/api/devices'), fetch('/api/positions')]); - if (devicesResponse.ok) { - dispatch(devicesActions.update(await devicesResponse.json())); - } - if (positionsResponse.ok) { - dispatch(sessionActions.updatePositions(await positionsResponse.json())); - } connectSocket(); } catch (error) { // ignore errors @@ -117,7 +108,7 @@ const SocketController = () => { if (authenticated) { setTimeout(keepAlive, 3000); } - }, [timeKeepAlive]); + }, [lastUpdate]); useEffectAsync(async () => { if (authenticated) { @@ -164,11 +155,6 @@ const SocketController = () => { message={notification.message} autoHideDuration={snackBarDurationLongMs} onClose={() => setEvents(events.filter((e) => e.id !== notification.id))} - ContentProps={{ - sx: { - background: 'red', - }, - }} /> ))} From 5200de6b34afd1d4da1a7f868b3be377725f4d8b Mon Sep 17 00:00:00 2001 From: Boubrid Ihab Date: Wed, 3 May 2023 00:22:49 +0100 Subject: [PATCH 3/4] fix lint --- modern/src/SocketController.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js index 8846bff0ed..64eb0faf06 100644 --- a/modern/src/SocketController.js +++ b/modern/src/SocketController.js @@ -37,7 +37,7 @@ const SocketController = () => { const features = useFeatures(); const resetCounterKeepAlive = () => setLastUpdate(new Date()); - + const isConnected = () => Math.abs(new Date() - lastUpdate) < 10000; const connectSocket = () => { From 611ac6b1d4ffb82f6d03d86cc50b09a438b3b47c Mon Sep 17 00:00:00 2001 From: Boubrid Ihab Date: Wed, 3 May 2023 00:56:50 +0100 Subject: [PATCH 4/4] add clearTimeOut to cancel old timeout --- modern/src/SocketController.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js index 64eb0faf06..b4e07b6b78 100644 --- a/modern/src/SocketController.js +++ b/modern/src/SocketController.js @@ -30,6 +30,7 @@ const SocketController = () => { const [notifications, setNotifications] = useState([]); const [lastUpdate, setLastUpdate] = useState(); + const [timeoutId, setTimeoutId] = useState(); const soundEvents = useAttributePreference('soundEvents', ''); const soundAlarms = useAttributePreference('soundAlarms', 'sos'); @@ -106,7 +107,8 @@ const SocketController = () => { useEffect(() => { if (authenticated) { - setTimeout(keepAlive, 3000); + clearTimeout(timeoutId); + setTimeoutId(setTimeout(keepAlive, 3000)); } }, [lastUpdate]);