agent-relay-server 0.6.1 → 0.7.0

package/public/dashboard/constants.js

@@ -0,0 +1,28 @@
+export const PREF_PREFIX = "ar-";
+export const HUMAN_AGENT_ID = "user";
+export const INBOX_OPERATOR_ID = HUMAN_AGENT_ID;
+export const DEFAULT_COMPOSE = { from: "", to: "", body: "", channel: "", subject: "", claimable: false };
+export const DEFAULT_INBOX_COMPOSE = { toMode: "agent", to: "", body: "", channel: "", subject: "", claimable: false };
+export const DEFAULT_PAIR_MESSAGE = { pairId: "", from: "", body: "", subject: "" };
+export const DEFAULT_PAIR_INVITE = { requesterId: "", targetId: "", objective: "" };
+export const DEFAULT_AGENT_SPAWN = { provider: "codex", approvalMode: "guarded", cwd: "", label: "" };
+export const CLOSED_TASK_STATUSES = new Set(["done", "failed", "canceled"]);
+export const WAITING_TASK_STATUSES = new Set(["open", "blocked"]);
+export const STATUS_SORT_ORDER = { online: 0, idle: 1, busy: 2, offline: 3 };
+export const LIVE_REFRESH_MS = 5_000;
+export const AGENT_TYPE_ICONS = {
+  codex: "ti-terminal-2",
+  claude: "claude-sol",
+  user: "ti-user",
+  system: "ti-server",
+  channel: "ti-messages",
+  agent: "ti-robot",
+};
+export const AGENT_TYPE_TITLES = {
+  codex: "Codex agent",
+  claude: "Claude agent",
+  user: "Human operator",
+  system: "System",
+  channel: "Channel",
+  agent: "Agent",
+};

package/public/dashboard/display.js

@@ -0,0 +1,345 @@
+import { HUMAN_AGENT_ID } from "./constants.js";
+import {
+  isBuiltInAgent, isChannelAgent, agentType, agentTypeIcon, agentTypeTitle,
+  isAgentStale, agentSupportsControlActions, messageBody, emptyAttention,
+  isClaimableTaskWaiting, isClaimableMessageWaiting, targetMatchesAgent,
+} from "./utils.js";
+
+function displayName(agent) {
+  if (!agent) return "?";
+  return agent.label || agent.name || agent.id.slice(-12);
+}
+
+function displayTarget(target) {
+  if (!target) return "?";
+  if (target === "broadcast") return "broadcast";
+  if (target.startsWith("tag:")) return "#" + target.slice(4);
+  if (target.startsWith("cap:")) return target.slice(4);
+  if (target.startsWith("label:")) return target.slice(6);
+  const agent = this.agentsById[target];
+  return agent ? this.displayName(agent) : target.slice(-8);
+}
+
+function conversationTitle(thread) {
+  if (!thread) return "Inbox";
+  return this.displayTarget(thread.peer);
+}
+
+function messagePreview(msg) {
+  const text = msg?.subject || messageBody(msg) || "";
+  return text.length > 90 ? text.slice(0, 90) + "..." : text;
+}
+
+function agentPair(agent) {
+  return agent ? this.pairsByAgentId[agent.id] : null;
+}
+
+function pairPeerId(pair, agentId) {
+  if (!pair) return "";
+  return pair.requesterId === agentId ? pair.targetId : pair.requesterId;
+}
+
+function pairBadgeClass(pair) {
+  if (pair?.status === "active") return "bg-success-lt";
+  if (pair?.status === "pending") return "bg-warning-lt";
+  return "bg-secondary-lt";
+}
+
+function pairStatusClass(pair) {
+  if (pair?.status === "active") return "bg-success";
+  if (pair?.status === "pending") return "bg-warning";
+  if (pair?.status === "rejected" || pair?.status === "expired") return "bg-danger";
+  return "bg-secondary";
+}
+
+function pairBadgeLabel(pair, agentId) {
+  if (!pair) return "";
+  const peer = this.displayTarget(pairPeerId(pair, agentId));
+  if (pair.status === "active") return "paired with " + peer;
+  if (pair.status === "pending" && pair.requesterId === agentId) return "invite to " + peer;
+  if (pair.status === "pending") return "invite from " + peer;
+  return pair.status;
+}
+
+function pairTitle(pair, agentId) {
+  if (!pair) return "";
+  const label = pairBadgeLabel.call(this, pair, agentId);
+  const objective = pair.objective ? " - " + pair.objective : "";
+  return `${label} (${pair.id})${objective}`;
+}
+
+function agentAttention(agent) {
+  if (!agent) return emptyAttention();
+  const thread = this.allInboxThreads.find((item) => item.peer === agent.id && !item.archived);
+  const pair = this.agentPair(agent);
+  const pendingPairInvite = pair?.status === "pending";
+  const claimableTasks = countAgentClaimableWaiting(this, agent);
+  const attention = {
+    unread: thread?.attention?.unread || 0,
+    needsHumanResponse: false,
+    agentQuestion: Boolean(thread?.attention?.agentQuestion),
+    pendingPairInvite,
+    claimableTasks,
+  };
+  attention.total = attention.unread +
+    (attention.agentQuestion ? 1 : 0) +
+    (attention.pendingPairInvite ? 1 : 0) +
+    attention.claimableTasks;
+  attention.score = attention.unread * 10 +
+    (attention.agentQuestion ? 3 : 0) +
+    (attention.pendingPairInvite ? 4 : 0) +
+    attention.claimableTasks * 2;
+  return attention;
+}
+
+function countAgentClaimableWaiting(vm, agent) {
+  const taskCount = vm.tasks.filter((task) => isClaimableTaskWaiting(task) && targetMatchesAgent(task.target, agent)).length;
+  const messageCount = vm.messages.filter((msg) => isClaimableMessageWaiting(msg) && targetMatchesAgent(msg.to, agent)).length;
+  return taskCount + messageCount;
+}
+
+function agentAttentionTitle(agent) {
+  const attention = agentAttention.call(this, agent);
+  const parts = [];
+  if (attention.unread) parts.push(`${attention.unread} unread`);
+  if (attention.agentQuestion) parts.push("agent asked a question");
+  if (attention.pendingPairInvite) parts.push("pair invite pending");
+  if (attention.claimableTasks) parts.push(`${attention.claimableTasks} claimable waiting`);
+  return parts.join(", ");
+}
+
+function presenceBadges(attention, pair) {
+  const badges = [];
+  if (pair?.status === "active") badges.push({ label: "paired", className: "bg-success-lt" });
+  if (pair?.status === "pending") badges.push({ label: "pair invite pending", className: "bg-warning-lt" });
+  if (attention.unread) badges.push({ label: attention.unread + " unread", className: "bg-danger-lt" });
+  if (attention.agentQuestion) badges.push({ label: "question", className: "bg-info-lt" });
+  if (attention.claimableTasks) badges.push({ label: attention.claimableTasks + " claimable", className: "bg-orange-lt" });
+  return badges;
+}
+
+function agentPresence(agent) {
+  const attention = agentAttention.call(this, agent);
+  const pair = this.agentPair(agent);
+  const stale = isAgentStale(this, agent);
+  const reconnecting = agent?.status !== "offline" && !agent?.ready && stale;
+  const starting = agent?.status !== "offline" && !agent?.ready && !stale;
+  const unreadIdle = attention.unread > 0 && agent?.status !== "busy";
+
+  if (agent?.status === "offline") {
+    return { label: "offline", tone: "secondary", icon: "ti-plug-off", stale: false, reconnecting: false, badges: presenceBadges(attention, pair) };
+  }
+  if (reconnecting) {
+    return { label: "reconnecting", tone: "danger", icon: "ti-refresh", stale, reconnecting, badges: presenceBadges(attention, pair) };
+  }
+  if (starting) {
+    return { label: "online, not ready", tone: "warning", icon: "ti-loader", stale, reconnecting, badges: presenceBadges(attention, pair) };
+  }
+  if (agent?.status === "busy") {
+    return { label: "busy in turn", tone: "warning", icon: "ti-player-play", stale, reconnecting, badges: presenceBadges(attention, pair) };
+  }
+  if (pair?.status === "active") {
+    return { label: "paired", tone: "success", icon: "ti-link", stale, reconnecting, badges: presenceBadges(attention, pair) };
+  }
+  if (unreadIdle) {
+    return { label: "idle, unread", tone: "danger", icon: "ti-bell", stale, reconnecting, badges: presenceBadges(attention, pair) };
+  }
+  return { label: agent?.status === "idle" ? "idle" : "ready", tone: "success", icon: "ti-circle-check", stale, reconnecting, badges: presenceBadges(attention, pair) };
+}
+
+function agentPresenceBadges(agent) {
+  return agentPresence.call(this, agent).badges;
+}
+
+function agentStatusClass(agent) {
+  const presence = agentPresence.call(this, agent);
+  return [
+    agent?.status || "offline",
+    agent?.status !== "offline" && !agent?.ready ? "not-ready" : "",
+    presence.stale ? "stale" : "",
+    presence.reconnecting ? "reconnecting" : "",
+    presence.label === "paired" ? "paired" : "",
+    presence.label === "idle, unread" ? "attention" : "",
+  ].filter(Boolean).join(" ");
+}
+
+function severityClass(severity) {
+  if (severity === "critical") return "bg-danger-lt";
+  if (severity === "warning") return "bg-warning-lt";
+  return "bg-info-lt";
+}
+
+function integrationPresence(integration) {
+  const stats = integration?.taskStats || {};
+  if ((stats.waitingTasks || 0) > 0) return { label: "waiting", tone: "warning", icon: "ti-alert-circle" };
+  if ((stats.openTasks || 0) > 0) return { label: "active", tone: "info", icon: "ti-activity" };
+  if (!integration?.configured) return { label: "observed only", tone: "secondary", icon: "ti-eye" };
+  if (integration.observed) return { label: "quiet", tone: "success", icon: "ti-circle-check" };
+  return { label: "configured", tone: "primary", icon: "ti-plug-connected" };
+}
+
+function connectorPresence(connector) {
+  const runtime = connector?.runtime || {};
+  if (runtime.status === "error") return { label: "error", tone: "danger", icon: "ti-alert-triangle" };
+  if (runtime.status === "warn") return { label: "warning", tone: "warning", icon: "ti-alert-circle" };
+  if (runtime.running) return { label: "running", tone: "success", icon: "ti-circle-check" };
+  if (runtime.enabled === false) return { label: "disabled", tone: "secondary", icon: "ti-player-pause" };
+  if (runtime.status === "ok") return { label: "ok", tone: "success", icon: "ti-circle-check" };
+  return { label: "unknown", tone: "secondary", icon: "ti-help-circle" };
+}
+
+function orchestratorHealthLabel(orch) {
+  const health = orch?.health;
+  if (!health || health.status === "ok") return orch?.version ? "current" : "unknown version";
+  if ((health.issues || []).some((issue) => issue.code === "protocol-mismatch")) return "protocol mismatch";
+  if ((health.issues || []).some((issue) => issue.code === "outdated")) return "outdated";
+  if (health.restartRequired) return "restart required";
+  return health.status;
+}
+
+function orchestratorHealthClass(orch) {
+  const status = orch?.health?.status;
+  if (status === "error") return "bg-danger-lt";
+  if (status === "warn") return "bg-warning-lt";
+  return "bg-success-lt";
+}
+
+function agentChannels(agent) {
+  if (!agent) return [];
+  return (this.channels || []).filter((ch) => ch.agentId === agent.id);
+}
+
+function channelPresence(channel) {
+  if (!channel) return { label: "unknown", tone: "secondary", icon: "ti-plug-off" };
+  if (channel.targetHealth?.status === "error") return { label: "target broken", tone: "danger", icon: "ti-alert-triangle" };
+  if (channel.targetHealth?.status === "warning") return { label: "target warning", tone: "warning", icon: "ti-alert-circle" };
+  if (channel.status === "offline") return { label: "offline", tone: "secondary", icon: "ti-plug-off" };
+  if (!channel.ready) return { label: "not ready", tone: "warning", icon: "ti-loader" };
+  if (channel.status === "busy") return { label: "busy", tone: "warning", icon: "ti-activity" };
+  return { label: "ready", tone: "success", icon: "ti-circle-check" };
+}
+
+function agentStatusTitle(agent) {
+  if (!agent) return "";
+  if (agent.status === "offline") return "offline";
+  if (isAgentStale(this, agent) && !agent.ready) return "reconnecting";
+  if (isAgentStale(this, agent)) return "stale heartbeat";
+  if (agent.status === "busy") return "busy in turn";
+  if (this.agentPair(agent)?.status === "active") return "paired";
+  if (agentAttention.call(this, agent).unread) return "idle but has unread";
+  if (agent.ready) return agent.status;
+
+  const lastSeenMs = new Date(agent.lastSeen).getTime();
+  if (!Number.isFinite(lastSeenMs)) return "Trying to reconnect...";
+  const ageSec = Math.max(0, ((this.now || Date.now()) - lastSeenMs) / 1000);
+  return ageSec <= 45 ? "Starting up..." : "Trying to reconnect...";
+}
+
+function timeAgo(iso) {
+  if (!iso) return "";
+  const ts = new Date(iso).getTime();
+  if (!Number.isFinite(ts)) return "";
+  const diff = Math.max(0, ((this.now || Date.now()) - ts) / 1000);
+  if (diff < 60) return Math.floor(diff) + "s ago";
+  if (diff < 3600) return Math.floor(diff / 60) + "m ago";
+  if (diff < 86400) return Math.floor(diff / 3600) + "h ago";
+  return Math.floor(diff / 86400) + "d ago";
+}
+
+function fmtTime(iso) {
+  if (!iso) return "";
+  return new Date(iso).toLocaleString();
+}
+
+function healthAlertClass(status) {
+  if (status === "error") return "alert-danger";
+  if (status === "degraded") return "alert-warning";
+  return "alert-success";
+}
+
+function activityKindClass(kind) {
+  if (kind === "question") return "bg-info-lt";
+  if (kind === "task") return "bg-warning-lt";
+  if (kind === "pair") return "bg-success-lt";
+  if (kind === "operator") return "bg-primary-lt";
+  if (kind === "reply") return "bg-purple-lt";
+  return "bg-secondary-lt";
+}
+
+export { agentAttention, inboxComposeTarget };
+
+export function createDisplayMethods() {
+  return {
+    displayName,
+    displayTarget,
+    conversationTitle,
+    messageBody,
+    messagePreview,
+    agentPair,
+    pairPeerId,
+    pairBadgeClass,
+    pairStatusClass,
+    pairBadgeLabel,
+    pairTitle,
+    agentAttention,
+    agentAttentionTitle,
+    agentType,
+    agentTypeIcon,
+    agentTypeTitle,
+    agentPresence,
+    agentPresenceBadges,
+    agentStatusClass,
+    severityClass,
+    agentStatusTitle,
+    isBuiltInAgent,
+    agentChannels,
+    channelPresence,
+    connectorPresence,
+    integrationPresence,
+    orchestratorHealthLabel,
+    orchestratorHealthClass,
+    composeTargetAllowsClaimable,
+    inboxComposeTargetAllowsClaimable,
+    agentSupportsControlActions,
+    timeAgo,
+    fmtTime,
+    healthAlertClass,
+    activityKindClass,
+  };
+}
+
+function composeTargetAllowsClaimable() {
+  return matchingComposeRecipientCount(this, this.compose.to) > 1;
+}
+
+function inboxComposeTargetAllowsClaimable() {
+  return matchingComposeRecipientCount(this, inboxComposeTarget(this)) > 1;
+}
+
+function matchingComposeRecipientCount(vm, target) {
+  if (!target) return 0;
+  const candidates = vm.composeAgents.filter((agent) => !isBuiltInAgent(agent) && !isChannelAgent(agent));
+  if (target === "broadcast") return candidates.length;
+  if (vm.agentsById[target]) return 1;
+  if (target.startsWith("tag:")) {
+    const tag = target.slice(4);
+    return candidates.filter((agent) => (agent.tags || []).includes(tag)).length;
+  }
+  if (target.startsWith("cap:")) {
+    const cap = target.slice(4);
+    return candidates.filter((agent) => (agent.capabilities || []).includes(cap)).length;
+  }
+  if (target.startsWith("label:")) {
+    const label = target.slice(6);
+    return candidates.filter((agent) => agent.label === label).length;
+  }
+  return 1;
+}
+
+function inboxComposeTarget(vm) {
+  const target = vm.inboxCompose.to;
+  if (!target) return "";
+  if (vm.inboxCompose.toMode === "tag") return "tag:" + target;
+  if (vm.inboxCompose.toMode === "cap") return "cap:" + target;
+  return target;
+}

package/public/dashboard/state.js

@@ -0,0 +1,129 @@
+import { PREF_PREFIX } from "./constants.js";
+
+export function loadPref(key, fallback) {
+  try {
+    const value = localStorage.getItem(PREF_PREFIX + key);
+    return value !== null ? JSON.parse(value) : fallback;
+  } catch {
+    return fallback;
+  }
+}
+
+export function savePref(key, value) {
+  localStorage.setItem(PREF_PREFIX + key, JSON.stringify(value));
+}
+
+export function initialState() {
+  return {
+    view: loadPref("view", "overview"),
+
+    showOffline: loadPref("showOffline", false),
+    showBuiltIns: loadPref("showBuiltIns", false),
+    autoRefresh: loadPref("autoRefresh", true),
+    agentSort: loadPref("agentSort", "status"),
+    agentSortDir: loadPref("agentSortDir", "asc"),
+    agentPresetFilter: loadPref("agentPresetFilter", ""),
+
+    agents: [],
+    agentsById: {},
+    orchestrators: [],
+    pairs: [],
+    messages: [],
+    tasks: [],
+    integrations: [],
+    channels: [],
+    connectors: [],
+    taskEvents: [],
+    taskEventCache: {},
+    stats: {},
+    health: null,
+    now: Date.now(),
+    authToken: loadPref("authToken", ""),
+    inboxReadCursors: loadPref("inboxReadCursors", {}),
+    inboxArchivedThreads: loadPref("inboxArchivedThreads", {}),
+    inboxDrafts: loadPref("inboxDrafts", {}),
+    inboxSearch: "",
+    inboxSort: loadPref("inboxSort", "attention"),
+    inboxSortDir: loadPref("inboxSortDir", "desc"),
+    inboxShowArchived: loadPref("inboxShowArchived", false),
+    operatorActivity: loadPref("operatorActivity", []),
+    activityEvents: [],
+    activityFilter: loadPref("activityFilter", ""),
+
+    selectedAgent: "",
+    agentDetailOpen: false,
+    agentDetailId: "",
+    channelDetailOpen: false,
+    channelDetailId: "",
+    selectedInboxThread: "",
+    replyTo: null,
+    composeOpen: false,
+    agentSpawnOpen: false,
+    orchestratorSpawnOpen: false,
+    spawnOrchId: "",
+    spawnProvider: "claude",
+    spawnCwd: "",
+    spawnLabel: "",
+    spawnApproval: "guarded",
+    spawnPrompt: "",
+    spawnDirListing: null,
+    agentDirectoryBrowser: { open: false, loading: false, path: "", parent: "", home: "", cwd: "", entries: [], error: "" },
+    pairInviteOpen: false,
+    pairMessageOpen: false,
+    threadOpen: false,
+    threadMessages: [],
+    taskEventsOpen: false,
+    commandPaletteOpen: false,
+    commandQuery: "",
+    connected: false,
+    authNeeded: false,
+
+    compose: { from: "", to: "", body: "", channel: "", subject: "", claimable: false },
+    agentSpawn: { provider: "codex", approvalMode: "guarded", cwd: "", label: "" },
+    pairInvite: { requesterId: "", targetId: "", objective: "" },
+    pairMessage: { pairId: "", from: "", body: "", subject: "" },
+    inboxCompose: { toMode: "agent", to: "", body: "", channel: "", subject: "", claimable: false },
+
+    confirmModal: { show: false, title: "", message: "", action: null },
+    renameModal: { show: false, agentId: "", label: "" },
+
+    channelFilter: "",
+    tagFilter: "",
+    agentStatusFilter: loadPref("agentStatusFilter", ""),
+    agentTagFilter: loadPref("agentTagFilter", ""),
+    pairStatusFilter: loadPref("pairStatusFilter", "open"),
+    taskStatusFilter: "",
+    taskSourceFilter: "",
+
+    chartInstances: {},
+    _es: null,
+    _clockTimer: null,
+    _refreshTimer: null,
+    _refreshInFlight: false,
+  };
+}
+
+export function watchPersistedPrefs(vm) {
+  vm.$watch("showOffline", (value) => vm.save("showOffline", value));
+  vm.$watch("showBuiltIns", (value) => vm.save("showBuiltIns", value));
+  vm.$watch("autoRefresh", (value) => {
+    vm.save("autoRefresh", value);
+    if (value) vm.startAutoRefresh();
+    else vm.stopAutoRefresh();
+  });
+  vm.$watch("agentSort", (value) => vm.save("agentSort", value));
+  vm.$watch("agentSortDir", (value) => vm.save("agentSortDir", value));
+  vm.$watch("agentPresetFilter", (value) => vm.save("agentPresetFilter", value));
+  vm.$watch("agentStatusFilter", (value) => vm.save("agentStatusFilter", value));
+  vm.$watch("agentTagFilter", (value) => vm.save("agentTagFilter", value));
+  vm.$watch("pairStatusFilter", (value) => vm.save("pairStatusFilter", value));
+  vm.$watch("inboxSort", (value) => vm.save("inboxSort", value));
+  vm.$watch("inboxSortDir", (value) => vm.save("inboxSortDir", value));
+  vm.$watch("inboxShowArchived", (value) => vm.save("inboxShowArchived", value));
+  vm.$watch("activityFilter", (value) => vm.save("activityFilter", value));
+  vm.$watch("view", (value, oldValue) => {
+    vm.save("view", value);
+    if (oldValue === "analytics") vm.destroyAllCharts();
+    if (value === "analytics") vm.$nextTick(() => vm.renderCharts());
+  });
+}