fix: Refactor WebSocketStatus out to reuse

src/client/views/dashboard/Dashboard.tsx

@@ -19,6 +19,7 @@ import {
 import CIcon from "@coreui/icons-react"
 import { cilRss } from "@coreui/icons"
 import { AppState } from "../../store"
+import { WebSocketStatus } from "../settings/WebsocketStatus"
 
 function Dashboard() {
   const { measurementRate, measurementCount, deviceStatistics } = useSelector((state: AppState) => {
@@ -100,7 +101,7 @@ function Dashboard() {
         </div>
       )}
 
-      {websocketStatus !== "open" && <CAlert color="danger">Not connected to the server</CAlert>}
+      <WebSocketStatus websocketStatus={websocketStatus} />
     </div>
   )
 }

src/client/views/settings/WebsocketStatus.tsx

@@ -0,0 +1,15 @@
+import { CAlert } from "@coreui/react"
+import { AppWebSocketStatus } from "../../store"
+
+interface WebSocketStatusProps {
+  websocketStatus: AppWebSocketStatus
+}
+
+function WebSocketStatus(props: WebSocketStatusProps) {
+  if (props.websocketStatus !== "open") {
+    return <CAlert color="danger">Not connected to the Venus Influx Loader</CAlert>
+  }
+  return null
+}
+
+export { WebSocketStatus }