- updated websocket context and add heatmap support; refactor CameraSettingFields and SightingWidget components

src/context/WebsocketContext.ts

@@ -9,8 +9,16 @@ type InfoSocketState = {
   send?: (msg: string) => void;
 };
 
+type heatmapSocketState = {
+  data: null;
+  readyState: ReadyState;
+  sendJson: (msg: unknown) => void;
+  send?: (msg: string) => void;
+};
+
 export type WebsocketContextValue = {
   info: InfoSocketState;
+  heatmap?: heatmapSocketState;
 };
 
 export const WebsocketContext = createContext<WebsocketContextValue | null>(null);
@@ -22,3 +30,4 @@ const useWebSocketContext = () => {
 };
 
 export const useInfoBarSocket = () => useWebSocketContext().info;
+export const useHeatmapSocket = () => useWebSocketContext().heatmap;

src/context/providers/WebSocketProvider.tsx

@@ -32,7 +32,7 @@ const WebSocketProvider = ({ children }: WebSocketProviderProps) => {
         sendJson: infoSocket.sendJsonMessage,
       },
     }),
-    [infoSocket.readyState, infoSocket.sendJsonMessage, systemData]
+    [systemData, infoSocket.readyState, infoSocket.sendJsonMessage]
   );
   return <WebsocketContext.Provider value={value}>{children}</WebsocketContext.Provider>;
 };