From a8f52b6d1a5600c677c1635de2e45a69f2f886ac Mon Sep 17 00:00:00 2001
From: Nathaniel Hargrave <va7nfh@gmail.com>
Date: Mon, 13 Jul 2026 17:52:34 -0400
Subject: [PATCH 1/2] CIRC 0.5 updates: stale indicators, disable go, and reset
 all

---
 src/components/panels/ArmControlPanel.tsx  |  4 +-
 src/components/panels/MotorStatusPanel.tsx | 44 ++++++++++++++++++++--
 src/components/panels/NodeStatusPanel.tsx  | 29 ++++++++++----
 3 files changed, 65 insertions(+), 12 deletions(-)

diff --git a/src/components/panels/ArmControlPanel.tsx b/src/components/panels/ArmControlPanel.tsx
index b6deba6..6deef4c 100644
--- a/src/components/panels/ArmControlPanel.tsx
+++ b/src/components/panels/ArmControlPanel.tsx
@@ -373,7 +373,7 @@ const ArmControlPanel: React.FC = () => {
         />
       </label>
 
-      <button onClick={handleGo} disabled={!selectedPose}>
+      <button onClick={handleGo} disabled={!selectedPose || armState != "Idle"}>
         Go
       </button>
 
@@ -539,4 +539,4 @@ const ArmControlPanel: React.FC = () => {
   );
 };
 
-export default ArmControlPanel;
\ No newline at end of file
+export default ArmControlPanel;
diff --git a/src/components/panels/MotorStatusPanel.tsx b/src/components/panels/MotorStatusPanel.tsx
index 1f4ef08..4012b92 100644
--- a/src/components/panels/MotorStatusPanel.tsx
+++ b/src/components/panels/MotorStatusPanel.tsx
@@ -8,6 +8,7 @@ type MotorStatus = {
   velocity: number;
   output_current: number;
   active_errors: number;
+  remaining: number;
 };
 
 const MOTORS = {
@@ -121,6 +122,11 @@ const MotorStatusPanel: React.FC = () => {
     );
   };
 
+  const handleResetAll = () => {
+    (Object.entries(MOTORS) as [MotorKey, typeof MOTORS[MotorKey]][]).map(
+      ([key, { label, topic }]) => handleResetErrors(key, topic));
+  };
+
   useEffect(() => {
     if (!ros) return;
 
@@ -140,7 +146,8 @@ const MotorStatusPanel: React.FC = () => {
           [key]: {
             velocity: msg.velocity,
             output_current: msg.output_current,
-            active_errors: msg.active_errors
+            active_errors: msg.active_errors,
+            remaining: 2
           },
         }));
       };
@@ -152,8 +159,33 @@ const MotorStatusPanel: React.FC = () => {
     return () => unsubscribers.forEach(unsub => unsub());
   }, [ros]);
 
+  useEffect(() => {
+    const interval = window.setInterval(() => {
+      for (const key in motorStats) {
+      setMotorStats(prev => ({
+          ...prev,
+          [key]: prev[key as MotorKey]
+            ? {
+                ...prev[key as MotorKey],
+                remaining: prev[key as MotorKey]!.remaining - 0.1,
+              }
+            : prev[key as MotorKey],
+        }));
+      }
+    }, 100);
+
+    return () => window.clearInterval(interval);
+  }, [motorStats]);
+
   return (
     <div className="motor-panel">
+      <button
+        className="reset-button"
+        disabled={!ros}
+        onClick={handleResetAll}
+      >
+        Reset All
+      </button>
       <table className="motor-table">
         <thead>
           <tr>
@@ -169,10 +201,16 @@ const MotorStatusPanel: React.FC = () => {
             ([key, { label, topic }]) => {
               const stat = motorStats[key];
               var errorStr = '-';
+              var color = "#6c757d";
               if (stat) {
                 var errNames: string[] = [];
                 Object.keys(MotorError).forEach((key: string) => { if (stat.active_errors & MotorError[key]) errNames.push(key) })
                 errorStr = errNames.length ? errNames.join(', ') : "NONE";
+                color = errNames.length ? "#ef4444" : "#22c55e";
+                if (stat.remaining < 0) {
+                  errorStr = "STALE";
+                  color = "#ffc107";
+                }
               }
 
               return (
@@ -180,7 +218,7 @@ const MotorStatusPanel: React.FC = () => {
                   <td>{label}</td>
                   <td>{stat && Number.isFinite(stat.velocity) ? stat.velocity.toFixed(2) : '-'}</td>
                   <td>{stat && Number.isFinite(stat.output_current) ? `${stat.output_current.toFixed(2)}A` : '-'}</td>
-                  <td><span className="status-led" style={{ backgroundColor: errorStr == "NONE" ? "#22c55e" : "#ef4444" }}/><span style={{ paddingLeft: "8px" }}>{errorStr}</span></td>
+                  <td><span className="status-led" style={{ backgroundColor: color }}/><span style={{ paddingLeft: "8px" }}>{errorStr}</span></td>
                   <td>
                     <button
                       className="reset-button"
@@ -262,4 +300,4 @@ const MotorStatusPanel: React.FC = () => {
   );
 };
 
-export default MotorStatusPanel;
\ No newline at end of file
+export default MotorStatusPanel;
diff --git a/src/components/panels/NodeStatusPanel.tsx b/src/components/panels/NodeStatusPanel.tsx
index 56b361a..aa4cb70 100644
--- a/src/components/panels/NodeStatusPanel.tsx
+++ b/src/components/panels/NodeStatusPanel.tsx
@@ -13,6 +13,7 @@ const NodeStatusPanel: React.FC = () => {
   const { ros } = useROS();
 
   const [nodes, setNodes] = useState<Map<string, NodeInfo>>(new Map());
+  const [staleTime, setStaleTime] = useState<number>(0);
 
   useEffect(() => {
     if (!ros) return;
@@ -49,6 +50,7 @@ const NodeStatusPanel: React.FC = () => {
 
           return updated;
         });
+        setStaleTime(2);
       } catch (e) {
         console.error('Failed to parse node list:', e);
       }
@@ -61,10 +63,21 @@ const NodeStatusPanel: React.FC = () => {
     };
   }, [ros]);
 
+  useEffect(() => {
+    const interval = window.setInterval(() => {
+      setStaleTime(prev => {return prev - 0.1});
+    }, 100);
+
+    return () => window.clearInterval(interval);
+
+  });
+
   const sortedNodes = Array.from(nodes.entries()).sort(([a], [b]) =>
     a.localeCompare(b)
   );
 
+  const stale = staleTime < 0;
+
   return (
     <div className="node-panel">
       <table className="node-table">
@@ -89,15 +102,17 @@ const NodeStatusPanel: React.FC = () => {
                   <span
                     className="status-led"
                     style={{
-                      backgroundColor: info.online
-                        ? '#22c55e'
-                        : offline
-                          ? '#ef4444'
-                          : '#6b7280',
+                      backgroundColor: stale
+                        ? '#ffc107'
+                        : info.online
+                          ? '#22c55e'
+                          : offline
+                            ? '#ef4444'
+                            : '#6b7280',
                     }}
                   />
                   <span style={{ paddingLeft: 8 }}>
-                    {info.online ? 'Online' : offline ? 'Offline' : 'Unknown'}
+                    {stale ? 'Stale' : info.online ? 'Online' : offline ? 'Offline' : 'Unknown'}
                   </span>
                 </td>
 
@@ -154,4 +169,4 @@ const NodeStatusPanel: React.FC = () => {
   );
 };
 
-export default NodeStatusPanel;
\ No newline at end of file
+export default NodeStatusPanel;

From ca19f7a5547a0959a9a3ee2b32d5ce458e89281b Mon Sep 17 00:00:00 2001
From: Nathaniel <va7nfh@gmail.com>
Date: Mon, 13 Jul 2026 15:04:16 -0700
Subject: [PATCH 2/2] copilot suggestions

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
---
 src/components/panels/ArmControlPanel.tsx  |  2 +-
 src/components/panels/MotorStatusPanel.tsx | 28 ++++++++++------------
 src/components/panels/NodeStatusPanel.tsx  |  5 ++--
 3 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/src/components/panels/ArmControlPanel.tsx b/src/components/panels/ArmControlPanel.tsx
index 6deef4c..50e866d 100644
--- a/src/components/panels/ArmControlPanel.tsx
+++ b/src/components/panels/ArmControlPanel.tsx
@@ -373,7 +373,7 @@ const ArmControlPanel: React.FC = () => {
         />
       </label>
 
-      <button onClick={handleGo} disabled={!selectedPose || armState != "Idle"}>
+      <button onClick={handleGo} disabled={!selectedPose || armState !== 'Idle'}>
         Go
       </button>
 
diff --git a/src/components/panels/MotorStatusPanel.tsx b/src/components/panels/MotorStatusPanel.tsx
index 4012b92..e45261a 100644
--- a/src/components/panels/MotorStatusPanel.tsx
+++ b/src/components/panels/MotorStatusPanel.tsx
@@ -123,8 +123,9 @@ const MotorStatusPanel: React.FC = () => {
   };
 
   const handleResetAll = () => {
-    (Object.entries(MOTORS) as [MotorKey, typeof MOTORS[MotorKey]][]).map(
-      ([key, { label, topic }]) => handleResetErrors(key, topic));
+    (Object.entries(MOTORS) as [MotorKey, typeof MOTORS[MotorKey]][]).forEach(
+      ([key, { topic }]) => handleResetErrors(key, topic),
+    );
   };
 
   useEffect(() => {
@@ -161,22 +162,19 @@ const MotorStatusPanel: React.FC = () => {
 
   useEffect(() => {
     const interval = window.setInterval(() => {
-      for (const key in motorStats) {
-      setMotorStats(prev => ({
-          ...prev,
-          [key]: prev[key as MotorKey]
-            ? {
-                ...prev[key as MotorKey],
-                remaining: prev[key as MotorKey]!.remaining - 0.1,
-              }
-            : prev[key as MotorKey],
-        }));
-      }
+      setMotorStats(prev => {
+        const next = { ...prev };
+        (Object.keys(prev) as MotorKey[]).forEach(key => {
+          const stat = prev[key];
+          if (!stat) return;
+          next[key] = { ...stat, remaining: stat.remaining - 0.1 };
+        });
+        return next;
+      });
     }, 100);
 
     return () => window.clearInterval(interval);
-  }, [motorStats]);
-
+  }, []);
   return (
     <div className="motor-panel">
       <button
diff --git a/src/components/panels/NodeStatusPanel.tsx b/src/components/panels/NodeStatusPanel.tsx
index aa4cb70..f04d40c 100644
--- a/src/components/panels/NodeStatusPanel.tsx
+++ b/src/components/panels/NodeStatusPanel.tsx
@@ -65,12 +65,11 @@ const NodeStatusPanel: React.FC = () => {
 
   useEffect(() => {
     const interval = window.setInterval(() => {
-      setStaleTime(prev => {return prev - 0.1});
+      setStaleTime(prev => Math.max(-1, prev - 0.1));
     }, 100);
 
     return () => window.clearInterval(interval);
-
-  });
+  }, []);
 
   const sortedNodes = Array.from(nodes.entries()).sort(([a], [b]) =>
     a.localeCompare(b)