[claude] App-state aware WebSocket reconnect on foreground (#33) (#77)

artifacts/mobile/components/ConnectionBadge.tsx

@@ -11,6 +11,7 @@ const STATUS_CONFIG: Record<ConnectionStatus, { color: string; label: string }>
   connecting: { color: "#F59E0B", label: "Connecting" },
   connected: { color: "#10B981", label: "Live" },
   disconnected: { color: "#6B7280", label: "Offline" },
+  reconnecting: { color: "#F59E0B", label: "Reconnecting" },
   error: { color: "#EF4444", label: "Error" },
 };
 
@@ -18,7 +19,7 @@ export function ConnectionBadge({ status }: { status: ConnectionStatus }) {
   const pulseAnim = useRef(new Animated.Value(1)).current;
 
   useEffect(() => {
-    if (status === "connecting") {
+    if (status === "connecting" || status === "reconnecting") {
       const pulse = Animated.loop(
         Animated.sequence([
           Animated.timing(pulseAnim, { toValue: 0.3, duration: 600, useNativeDriver: true }),