From b372618cf76b1c9807047fa523ca532cc541fe01 Mon Sep 17 00:00:00 2001
From: Josh Finlay <josh@athenanetworks.com.au>
Date: Wed, 8 Jan 2025 10:34:59 +1000
Subject: [PATCH] Fixed MQTT commands and frontend event loading

- Fixed MQTT command handling by properly handling async callbacks
- Fixed frontend event loading to preserve loaded events
- Added proper state tracking for initial load
- Fixed useEffect dependencies
---
 backend/mqtt_integration.py |  3 ++-
 frontend/src/App.tsx        | 13 +++++++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/backend/mqtt_integration.py b/backend/mqtt_integration.py
index 2c527e6..e18ff63 100644
--- a/backend/mqtt_integration.py
+++ b/backend/mqtt_integration.py
@@ -98,7 +98,8 @@ class HomeAssistantMQTT:
             if topic == self.command_topic and self.command_callback:
                 command = decoded_payload.upper()
                 logger.debug(f"Processing command: {command}")
-                self.command_callback(command)
+                # Create task for async callback
+                asyncio.create_task(self.command_callback(command))
             else:
                 logger.debug(f"Message received on non-command topic: {topic}")
         except Exception as e:
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 8d9030e..9967251 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -33,6 +33,7 @@ function App() {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [isSettingsOpen, setIsSettingsOpen] = useState(false);
+  const [isInitialLoad, setIsInitialLoad] = useState(true);
 
   const formatDate = (isoString: string) => {
     const date = new Date(isoString);
@@ -52,6 +53,7 @@ function App() {
         setTotalEvents(eventsData.total);
         setSettings(settingsData);
         setGateStatus(statusData);
+        setIsInitialLoad(false);
       } catch (err) {
         setError('Failed to load data');
         console.error(err);
@@ -67,8 +69,8 @@ function App() {
         ]);
         setGateStatus(statusData);
         
-        // Update only if we're on the first page and don't have more events loaded
-        if (events.length <= 10 && !hasMoreEvents) {
+        // Only update events if this is the initial load or we haven't loaded more
+        if (isInitialLoad || (!hasMoreEvents && events.length <= 10)) {
           setEvents(eventsData.events);
           setHasMoreEvents(eventsData.hasMore);
           setTotalEvents(eventsData.total);
@@ -91,10 +93,13 @@ function App() {
       }
     }, 1000);
 
-    loadData();
+    // Only do initial load if we haven't loaded yet
+    if (isInitialLoad) {
+      loadData();
+    }
 
     return () => clearInterval(interval);
-  }, []);
+  }, [events, hasMoreEvents, isInitialLoad]);
 
   const handleGateControl = async () => {
     setLoading(true);