useBridgeStatus

import { useBridgeStatus } from "@deskctl/sdk";

function BridgeIndicator({ bridgeId }: { bridgeId: string }) {
  const { state, online, responseTime, isChecking } = useBridgeStatus(bridgeId, {
    interval: 10000,
  });

  return (
    <div>
      <span>
        {state === "checking" && "⏳ Checking..."}
        {state === "online" && "🟢 Online"}
        {state === "offline" && "🔴 Offline"}
        {state === "unknown" && "⚪ Unknown"}
      </span>
      {responseTime && <span>{responseTime}ms</span>}
    </div>
  );
}

import { useBridgesStatus, useBridges } from "@deskctl/sdk";

function BridgeSelector() {
  const { bridges } = useBridges();
  const bridgeIds = Array.from(bridges.keys());
  const { statuses, isChecking } = useBridgesStatus(bridgeIds, { interval: 15000 });

  if (isChecking && Object.keys(statuses).length === 0) {
    return <div>Checking bridges...</div>;
  }

  return (
    <select>
      {bridgeIds.map((id) => {
        const bridge = bridges.get(id);
        const status = statuses[id];
        return (
          <option key={id} disabled={!status?.online}>
            {bridge?.name} {status?.online ? "(online)" : "(offline)"}
          </option>
        );
      })}
    </select>
  );
}

{
  state: BridgeStatusState; // "checking" | "online" | "offline" | "unknown"
  online: boolean; // Whether bridge is online
  responseTime: number | null; // Response time in ms
  lastChecked: number | null; // Timestamp of last check
  isChecking: boolean; // Whether a check is in progress
  // Plus all React Query properties (data, isLoading, refetch, etc.)
}

{
  statuses: Record<string, PingResult>; // Status for each bridge
  isChecking: boolean; // Whether a check is in progress
  // Plus all React Query properties
}

type BridgeStatusState = "checking" | "online" | "offline" | "unknown";

interface PingResult {
  online: boolean; // Whether bridge responded
  responseTime: number | null; // Response time in ms
  lastChecked: number; // Timestamp of last check
}

import { useBridges, useBridgesStatus } from "@deskctl/sdk";

function BridgeList() {
  const { bridges } = useBridges();
  const bridgeIds = Array.from(bridges.keys());
  const { statuses, isChecking } = useBridgesStatus(bridgeIds, { interval: 5000 });

  if (isChecking && Object.keys(statuses).length === 0) {
    return <div>Checking bridges...</div>;
  }

  return (
    <ul className="bridge-list">
      {bridgeIds.map((id) => {
        const bridge = bridges.get(id);
        const status = statuses[id];

        return (
          <li key={id} className={status?.online ? "online" : "offline"}>
            <span className="indicator">
              {status?.online ? "Connected" : "Disconnected"}
            </span>
            <span className="name">{bridge?.name}</span>
            {status?.responseTime && (
              <span className="latency">{status.responseTime}ms</span>
            )}
          </li>
        );
      })}
    </ul>
  );
}