refactor: real-time system (#2228)

Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com> Co-authored-by: liyasthomas <liyascthomas@gmail.com>
2022-05-28 15:35:41 +06:00
parent 83bdd03f43
commit f6950bac0f
24 changed files with 2138 additions and 1819 deletions
--- a/packages/hoppscotch-app/newstore/MQTTSession.ts
+++ b/packages/hoppscotch-app/newstore/MQTTSession.ts
@@ -1,6 +1,6 @@
-import { pluck, distinctUntilChanged } from "rxjs/operators"
-import { Client as MQTTClient } from "paho-mqtt"
+import { distinctUntilChanged, pluck } from "rxjs/operators"
 import DispatchingStore, { defineDispatchers } from "./DispatchingStore"
+import { MQTTConnection } from "~/helpers/realtime/MQTTConnection"
 import {
  HoppRealtimeLog,
  HoppRealtimeLogLine,
@@ -12,11 +12,9 @@ type HoppMQTTRequest = {

 type HoppMQTTSession = {
  request: HoppMQTTRequest
-  connectingState: boolean
-  connectionState: boolean
  subscriptionState: boolean
  log: HoppRealtimeLog
-  socket: MQTTClient | null
+  socket: MQTTConnection
 }

 const defaultMQTTRequest: HoppMQTTRequest = {
@@ -25,10 +23,8 @@ const defaultMQTTRequest: HoppMQTTRequest = {

 const defaultMQTTSession: HoppMQTTSession = {
  request: defaultMQTTRequest,
-  connectionState: false,
-  connectingState: false,
  subscriptionState: false,
-  socket: null,
+  socket: new MQTTConnection(),
  log: [],
 }

@@ -48,21 +44,11 @@ const dispatchers = defineDispatchers({
      },
    }
  },
-  setSocket(_: HoppMQTTSession, { socket }: { socket: MQTTClient }) {
+  setConn(_: HoppMQTTSession, { socket }: { socket: MQTTConnection }) {
    return {
      socket,
    }
  },
-  setConnectionState(_: HoppMQTTSession, { state }: { state: boolean }) {
-    return {
-      connectionState: state,
-    }
-  },
-  setConnectingState(_: HoppMQTTSession, { state }: { state: boolean }) {
-    return {
-      connectingState: state,
-    }
-  },
  setSubscriptionState(_: HoppMQTTSession, { state }: { state: boolean }) {
    return {
      subscriptionState: state,
@@ -100,33 +86,15 @@ export function setMQTTEndpoint(newEndpoint: string) {
  })
 }

-export function setMQTTSocket(socket: MQTTClient) {
+export function setMQTTConn(socket: MQTTConnection) {
  MQTTSessionStore.dispatch({
-    dispatcher: "setSocket",
+    dispatcher: "setConn",
    payload: {
      socket,
    },
  })
 }

-export function setMQTTConnectionState(state: boolean) {
-  MQTTSessionStore.dispatch({
-    dispatcher: "setConnectionState",
-    payload: {
-      state,
-    },
-  })
-}
-
-export function setMQTTConnectingState(state: boolean) {
-  MQTTSessionStore.dispatch({
-    dispatcher: "setConnectingState",
-    payload: {
-      state,
-    },
-  })
-}
-
 export function setMQTTSubscriptionState(state: boolean) {
  MQTTSessionStore.dispatch({
    dispatcher: "setSubscriptionState",
@@ -179,7 +147,7 @@ export const MQTTSubscriptionState$ = MQTTSessionStore.subject$.pipe(
  distinctUntilChanged()
 )

-export const MQTTSocket$ = MQTTSessionStore.subject$.pipe(
+export const MQTTConn$ = MQTTSessionStore.subject$.pipe(
  pluck("socket"),
  distinctUntilChanged()
 )
--- a/packages/hoppscotch-app/newstore/SSESession.ts
+++ b/packages/hoppscotch-app/newstore/SSESession.ts
@@ -4,6 +4,7 @@ import {
  HoppRealtimeLog,
  HoppRealtimeLogLine,
 } from "~/helpers/types/HoppRealtimeLog"
+import { SSEConnection } from "~/helpers/realtime/SSEConnection"

 type HoppSSERequest = {
  endpoint: string
@@ -12,10 +13,8 @@ type HoppSSERequest = {

 type HoppSSESession = {
  request: HoppSSERequest
-  connectingState: boolean
-  connectionState: boolean
  log: HoppRealtimeLog
-  socket: EventSource | null
+  socket: SSEConnection
 }

 const defaultSSERequest: HoppSSERequest = {
@@ -25,9 +24,7 @@ const defaultSSERequest: HoppSSERequest = {

 const defaultSSESession: HoppSSESession = {
  request: defaultSSERequest,
-  connectionState: false,
-  connectingState: false,
-  socket: null,
+  socket: new SSEConnection(),
  log: [],
 }

@@ -56,21 +53,11 @@ const dispatchers = defineDispatchers({
      },
    }
  },
-  setSocket(_: HoppSSESession, { socket }: { socket: EventSource }) {
+  setSocket(_: HoppSSESession, { socket }: { socket: SSEConnection }) {
    return {
      socket,
    }
  },
-  setConnectionState(_: HoppSSESession, { state }: { state: boolean }) {
-    return {
-      connectionState: state,
-    }
-  },
-  setConnectingState(_: HoppSSESession, { state }: { state: boolean }) {
-    return {
-      connectingState: state,
-    }
-  },
  setLog(_: HoppSSESession, { log }: { log: HoppRealtimeLog }) {
    return {
      log,
@@ -112,7 +99,7 @@ export function setSSEEventType(newType: string) {
  })
 }

-export function setSSESocket(socket: EventSource) {
+export function setSSESocket(socket: SSEConnection) {
  SSESessionStore.dispatch({
    dispatcher: "setSocket",
    payload: {
@@ -121,23 +108,6 @@ export function setSSESocket(socket: EventSource) {
  })
 }

-export function setSSEConnectionState(state: boolean) {
-  SSESessionStore.dispatch({
-    dispatcher: "setConnectionState",
-    payload: {
-      state,
-    },
-  })
-}
-export function setSSEConnectingState(state: boolean) {
-  SSESessionStore.dispatch({
-    dispatcher: "setConnectingState",
-    payload: {
-      state,
-    },
-  })
-}
-
 export function setSSELog(log: HoppRealtimeLog) {
  SSESessionStore.dispatch({
    dispatcher: "setLog",
@@ -176,11 +146,6 @@ export const SSEConnectingState$ = SSESessionStore.subject$.pipe(
  distinctUntilChanged()
 )

-export const SSEConnectionState$ = SSESessionStore.subject$.pipe(
-  pluck("connectionState"),
-  distinctUntilChanged()
-)
-
 export const SSESocket$ = SSESessionStore.subject$.pipe(
  pluck("socket"),
  distinctUntilChanged()
--- a/packages/hoppscotch-app/newstore/SocketIOSession.ts
+++ b/packages/hoppscotch-app/newstore/SocketIOSession.ts
@@ -10,16 +10,16 @@ import {

 type SocketIO = SocketV2 | SocketV3 | SocketV4

+export type SIOClientVersion = "v4" | "v3" | "v2"
+
 type HoppSIORequest = {
  endpoint: string
  path: string
-  version: string
+  version: SIOClientVersion
 }

 type HoppSIOSession = {
  request: HoppSIORequest
-  connectingState: boolean
-  connectionState: boolean
  log: HoppRealtimeLog
  socket: SocketIO | null
 }
@@ -32,8 +32,6 @@ const defaultSIORequest: HoppSIORequest = {

 const defaultSIOSession: HoppSIOSession = {
  request: defaultSIORequest,
-  connectionState: false,
-  connectingState: false,
  socket: null,
  log: [],
 }
@@ -63,7 +61,10 @@ const dispatchers = defineDispatchers({
      },
    }
  },
-  setVersion(curr: HoppSIOSession, { newVersion }: { newVersion: string }) {
+  setVersion(
+    curr: HoppSIOSession,
+    { newVersion }: { newVersion: SIOClientVersion }
+  ) {
    return {
      request: {
        ...curr.request,
@@ -76,16 +77,6 @@ const dispatchers = defineDispatchers({
      socket,
    }
  },
-  setConnectionState(_: HoppSIOSession, { state }: { state: boolean }) {
-    return {
-      connectionState: state,
-    }
-  },
-  setConnectingState(_: HoppSIOSession, { state }: { state: boolean }) {
-    return {
-      connectingState: state,
-    }
-  },
  setLog(_: HoppSIOSession, { log }: { log: HoppRealtimeLog }) {
    return {
      log,
@@ -145,23 +136,6 @@ export function setSIOSocket(socket: SocketIO) {
  })
 }

-export function setSIOConnectionState(state: boolean) {
-  SIOSessionStore.dispatch({
-    dispatcher: "setConnectionState",
-    payload: {
-      state,
-    },
-  })
-}
-export function setSIOConnectingState(state: boolean) {
-  SIOSessionStore.dispatch({
-    dispatcher: "setConnectingState",
-    payload: {
-      state,
-    },
-  })
-}
-
 export function setSIOLog(log: HoppRealtimeLog) {
  SIOSessionStore.dispatch({
    dispatcher: "setLog",
@@ -200,11 +174,6 @@ export const SIOPath$ = SIOSessionStore.subject$.pipe(
  distinctUntilChanged()
 )

-export const SIOConnectingState$ = SIOSessionStore.subject$.pipe(
-  pluck("connectingState"),
-  distinctUntilChanged()
-)
-
 export const SIOConnectionState$ = SIOSessionStore.subject$.pipe(
  pluck("connectionState"),
  distinctUntilChanged()
--- a/packages/hoppscotch-app/newstore/WebSocketSession.ts
+++ b/packages/hoppscotch-app/newstore/WebSocketSession.ts
@@ -4,8 +4,9 @@ import {
  HoppRealtimeLog,
  HoppRealtimeLogLine,
 } from "~/helpers/types/HoppRealtimeLog"
+import { WSConnection } from "~/helpers/realtime/WSConnection"

-type HoppWSProtocol = {
+export type HoppWSProtocol = {
  value: string
  active: boolean
 }
@@ -17,10 +18,8 @@ type HoppWSRequest = {

 export type HoppWSSession = {
  request: HoppWSRequest
-  connectingState: boolean
-  connectionState: boolean
  log: HoppRealtimeLog
-  socket: WebSocket | null
+  socket: WSConnection
 }

 const defaultWSRequest: HoppWSRequest = {
@@ -30,9 +29,7 @@ const defaultWSRequest: HoppWSRequest = {

 const defaultWSSession: HoppWSSession = {
  request: defaultWSRequest,
-  connectionState: false,
-  connectingState: false,
-  socket: null,
+  socket: new WSConnection(),
  log: [],
 }

@@ -101,21 +98,11 @@ const dispatchers = defineDispatchers({
      },
    }
  },
-  setSocket(_: HoppWSSession, { socket }: { socket: WebSocket }) {
+  setSocket(_: HoppWSSession, { socket }: { socket: WSConnection }) {
    return {
      socket,
    }
  },
-  setConnectionState(_: HoppWSSession, { state }: { state: boolean }) {
-    return {
-      connectionState: state,
-    }
-  },
-  setConnectingState(_: HoppWSSession, { state }: { state: boolean }) {
-    return {
-      connectingState: state,
-    }
-  },
  setLog(_: HoppWSSession, { log }: { log: HoppRealtimeLog }) {
    return {
      log,
@@ -195,7 +182,7 @@ export function updateWSProtocol(
  })
 }

-export function setWSSocket(socket: WebSocket) {
+export function setWSSocket(socket: WSConnection) {
  WSSessionStore.dispatch({
    dispatcher: "setSocket",
    payload: {
@@ -204,23 +191,6 @@ export function setWSSocket(socket: WebSocket) {
  })
 }

-export function setWSConnectionState(state: boolean) {
-  WSSessionStore.dispatch({
-    dispatcher: "setConnectionState",
-    payload: {
-      state,
-    },
-  })
-}
-export function setWSConnectingState(state: boolean) {
-  WSSessionStore.dispatch({
-    dispatcher: "setConnectingState",
-    payload: {
-      state,
-    },
-  })
-}
-
 export function setWSLog(log: HoppRealtimeLog) {
  WSSessionStore.dispatch({
    dispatcher: "setLog",