Refactor engine and market status fetching to use callbacks and improve error handling

src/components/landing/PortfolioSection.tsx

@@ -402,38 +402,38 @@ export default function PortfolioSection() {
     return () => window.clearInterval(interval);
   }, [refreshStatus]);
 
-  useEffect(() => {
+  const refreshEngineStatus = useCallback(async () => {
-    const fetchStatus = async () => {
+    try {
-      try {
+      const res = await apiRequest("GET", "/engine/status");
-        const res = await apiRequest("GET", "/engine/status");
+      const data = await res.json();
-        const data = await res.json();
+      setEngineStatus(data);
-        setEngineStatus(data);
+    } catch {
-      } catch {
+      setEngineStatus(null);
-        setEngineStatus(null);
+    }
-      }
-    };
-
-    fetchStatus();
-    const id = window.setInterval(fetchStatus, 5000);
-    return () => window.clearInterval(id);
   }, []);
 
   useEffect(() => {
-    const fetchMarketStatus = async () => {
+    void refreshEngineStatus();
-      try {
+    const id = window.setInterval(refreshEngineStatus, 5000);
-        const res = await apiRequest("GET", "/market/status");
-        const data = await res.json();
-        setMarketStatus(data);
-      } catch {
-        setMarketStatus(null);
-      }
-    };
-
-    fetchMarketStatus();
-    const id = window.setInterval(fetchMarketStatus, 5000);
     return () => window.clearInterval(id);
+  }, [refreshEngineStatus]);
+
+  const refreshMarketStatus = useCallback(async () => {
+    try {
+      const res = await apiRequest("GET", "/market/status");
+      const data = await res.json();
+      setMarketStatus(data);
+    } catch {
+      setMarketStatus(null);
+    }
   }, []);
 
+  useEffect(() => {
+    void refreshMarketStatus();
+    const id = window.setInterval(refreshMarketStatus, 5000);
+    return () => window.clearInterval(id);
+  }, [refreshMarketStatus]);
+
   useEffect(() => {
     if (prefersReducedMotion) {
       setIsVisible(true);
@@ -800,10 +800,21 @@ export default function PortfolioSection() {
           description: result?.message || result?.status || "Unable to start strategy.",
         });
       }
+    } catch (error: any) {
+      const message = error?.message || "Unable to start strategy.";
+      if (String(message).includes("401:")) {
+        setLoginPromptOpen(true);
+      }
+      toast({
+        title: "Start failed",
+        description: message,
+      });
     } finally {
       setIsStarting(false);
       await Promise.allSettled([
         refreshStatus(),
+        refreshEngineStatus(),
+        refreshMarketStatus(),
         refreshBrokerData({ includeEquityCurve: true }),
       ]);
     }
@@ -859,10 +870,21 @@ export default function PortfolioSection() {
           description: result?.message || result?.status || "Unable to resume strategy.",
         });
       }
+    } catch (error: any) {
+      const message = error?.message || "Unable to resume strategy.";
+      if (String(message).includes("401:")) {
+        setLoginPromptOpen(true);
+      }
+      toast({
+        title: "Resume failed",
+        description: message,
+      });
     } finally {
       setIsResuming(false);
       await Promise.allSettled([
         refreshStatus(),
+        refreshEngineStatus(),
+        refreshMarketStatus(),
         refreshBrokerData({ includeEquityCurve: true }),
       ]);
     }
@@ -873,10 +895,17 @@ export default function PortfolioSection() {
     try {
       await stopStrategy();
       setFreshStartRequested(false);
+    } catch (error: any) {
+      toast({
+        title: "Stop failed",
+        description: error?.message || "Unable to stop strategy.",
+      });
     } finally {
       setIsStopping(false);
       await Promise.allSettled([
         refreshStatus(),
+        refreshEngineStatus(),
+        refreshMarketStatus(),
         refreshBrokerData({ includeEquityCurve: true }),
       ]);
     }