diff --git a/src/data/ws-panels.ts b/src/data/ws-panels.ts
index 88ec490d06..a38c4ed252 100644
--- a/src/data/ws-panels.ts
+++ b/src/data/ws-panels.ts
@@ -1,14 +1,25 @@
 import { createCollection, Connection } from "home-assistant-js-websocket";
 import { Panels } from "../types";
 
+const fetchPanels = (conn) =>
+  conn.sendMessagePromise({
+    type: "get_panels",
+  });
+
+const subscribeUpdates = (conn, store) =>
+  conn.subscribeEvents(
+    () => fetchPanels(conn).then((panels) => store.setState(panels, true)),
+    "panels_updated"
+  );
+
 export const subscribePanels = (
   conn: Connection,
   onChange: (panels: Panels) => void
 ) =>
   createCollection<Panels>(
     "_pnl",
-    () => conn.sendMessagePromise({ type: "get_panels" }),
-    undefined,
+    fetchPanels,
+    subscribeUpdates,
     conn,
     onChange
   );