diff --git a/web/src/api/ws.jsx b/web/src/api/ws.jsx
index 8324632be..9aab6e1e5 100644
--- a/web/src/api/ws.jsx
+++ b/web/src/api/ws.jsx
@@ -3,7 +3,7 @@ import { baseUrl } from './baseUrl';
 import { produce } from 'immer';
 import { useCallback, useContext, useEffect, useRef, useReducer } from 'preact/hooks';
 
-const initialState = Object.freeze({ __connected: false });
+const initialState = Object.freeze({ __connected: false, __reconnectAttempts: 0 });
 export const WS = createContext({ state: initialState, connection: null });
 
 const defaultCreateWebsocket = (url) => new WebSocket(url);
@@ -80,6 +80,12 @@ export function useWs(watchTopic, publishTopic) {
 
   const send = useCallback(
     (payload, retain = false) => {
+      // if ws is closed but user has interacted with page
+      // refresh to ensure state is up to date
+      if (ws.readyState == WebSocket.CLOSED) {
+        location.reload();
+      }
+
       ws.send(
         JSON.stringify({
           topic: publishTopic || watchTopic,