@desplega.ai/agent-swarm 1.20.0 → 1.51.2

package/src/commands/onboard/steps/health-check.tsx

@@ -0,0 +1,171 @@
+import { Select, Spinner } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useEffect, useRef, useState } from "react";
+import type { StepProps } from "../types.ts";
+
+type HealthStatus = "waiting_api" | "waiting_agents" | "healthy" | "timeout";
+
+interface AgentStatus {
+  name: string;
+  registered: boolean;
+}
+
+export function HealthCheckStep({ state, addLog, goToNext }: StepProps) {
+  const [status, setStatus] = useState<HealthStatus>("waiting_api");
+  const [elapsed, setElapsed] = useState(0);
+  const [agents, setAgents] = useState<AgentStatus[]>([]);
+  const executed = useRef(false);
+
+  useEffect(() => {
+    if (executed.current) return;
+    executed.current = true;
+
+    const apiUrl = `http://localhost:${state.apiPort || 3013}`;
+    const apiTimeout = 60_000;
+    const agentTimeout = 90_000;
+    const pollInterval = 3_000;
+
+    let cancelled = false;
+    const start = Date.now();
+
+    const poll = async () => {
+      // Phase 1: Wait for API health
+      while (!cancelled) {
+        const now = Date.now() - start;
+        setElapsed(Math.floor(now / 1000));
+
+        if (now > apiTimeout) {
+          setStatus("timeout");
+          return;
+        }
+
+        try {
+          const res = await fetch(`${apiUrl}/health`);
+          if (res.ok) {
+            addLog("API server is healthy");
+            setStatus("waiting_agents");
+            break;
+          }
+        } catch {
+          // Not ready yet
+        }
+        await new Promise((r) => setTimeout(r, pollInterval));
+      }
+
+      // Phase 2: Wait for agents to register
+      const expectedNames = Object.keys(state.agentIds);
+      const agentStart = Date.now();
+
+      while (!cancelled) {
+        const now = Date.now() - agentStart;
+        setElapsed(Math.floor((Date.now() - start) / 1000));
+
+        if (now > agentTimeout) {
+          addLog("Agent registration timed out — some agents may still be booting");
+          setStatus("healthy"); // Continue anyway
+          return;
+        }
+
+        try {
+          const res = await fetch(`${apiUrl}/api/agents`, {
+            headers: { Authorization: `Bearer ${state.apiKey}` },
+          });
+          if (res.ok) {
+            const data = (await res.json()) as { agents: { name: string }[] };
+            const registeredNames = new Set(data.agents.map((a) => a.name));
+            const statuses = expectedNames.map((name) => ({
+              name,
+              registered: registeredNames.has(name),
+            }));
+            setAgents(statuses);
+
+            if (statuses.every((s) => s.registered)) {
+              addLog(`All ${statuses.length} agents registered`);
+              setStatus("healthy");
+              return;
+            }
+          }
+        } catch {
+          // API might have restarted
+        }
+        await new Promise((r) => setTimeout(r, pollInterval));
+      }
+    };
+
+    poll();
+    return () => {
+      cancelled = true;
+    };
+  }, [state.agentIds, state.apiKey, state.apiPort, addLog]);
+
+  useEffect(() => {
+    if (status === "healthy") {
+      const timer = setTimeout(() => goToNext(), 500);
+      return () => clearTimeout(timer);
+    }
+  }, [status, goToNext]);
+
+  if (status === "waiting_api") {
+    return (
+      <Box padding={1}>
+        <Spinner label={`Waiting for API server... (${elapsed}s / 60s)`} />
+      </Box>
+    );
+  }
+
+  if (status === "waiting_agents") {
+    return (
+      <Box flexDirection="column" padding={1}>
+        <Text color="green">{"✓"} API server is healthy</Text>
+        <Spinner label={`Waiting for agents to register... (${elapsed}s)`} />
+        {agents.length > 0 && (
+          <Box flexDirection="column" marginTop={1}>
+            {agents.map((a) => (
+              <Text key={a.name} color={a.registered ? "green" : "yellow"}>
+                {a.registered ? "✓" : "…"} {a.name}
+              </Text>
+            ))}
+          </Box>
+        )}
+      </Box>
+    );
+  }
+
+  if (status === "healthy") {
+    return (
+      <Box flexDirection="column" padding={1}>
+        <Text color="green">{"✓"} API server is healthy</Text>
+        {agents.map((a) => (
+          <Text key={a.name} color={a.registered ? "green" : "yellow"}>
+            {a.registered ? "✓" : "…"} {a.name}
+          </Text>
+        ))}
+      </Box>
+    );
+  }
+
+  // Timeout
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text color="red">{"✗"} API health check timed out after 60s</Text>
+      <Text dimColor>Try: docker compose logs --tail 50</Text>
+      <Box marginTop={1}>
+        <Select
+          options={[
+            { label: "Retry", value: "retry" },
+            { label: "Continue anyway", value: "continue" },
+          ]}
+          onChange={(value) => {
+            if (value === "retry") {
+              executed.current = false;
+              setStatus("waiting_api");
+              setElapsed(0);
+            } else {
+              goToNext();
+            }
+          }}
+        />
+      </Box>
+    </Box>
+  );
+}

package/src/commands/onboard/steps/integration-github.tsx

@@ -0,0 +1,105 @@
+import { TextInput } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useState } from "react";
+import type { StepProps } from "../types.ts";
+
+type SubStep = "token" | "email" | "name";
+
+export function IntegrationGitHubStep({ goToNext }: StepProps) {
+  const [subStep, setSubStep] = useState<SubStep>("token");
+  const [token, setToken] = useState("");
+  const [email, setEmail] = useState("");
+  const [error, setError] = useState("");
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold>GitHub Integration</Text>
+      <Text dimColor>Lets agents push code, create PRs, and manage repositories.</Text>
+      <Box marginTop={1} flexDirection="column">
+        <Text>
+          Create a Personal Access Token at{" "}
+          <Text color="cyan" underline>
+            github.com/settings/tokens
+          </Text>
+        </Text>
+        <Text dimColor>Required scope: repo</Text>
+      </Box>
+
+      {error && (
+        <Box marginTop={1}>
+          <Text color="red">{error}</Text>
+        </Box>
+      )}
+
+      {subStep === "token" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text bold>GitHub Token (GITHUB_TOKEN):</Text>
+          <TextInput
+            key="github-token"
+            placeholder="ghp_..."
+            onSubmit={(value) => {
+              const trimmed = value.trim();
+              if (!trimmed) {
+                setError("Token is required.");
+                return;
+              }
+              setError("");
+              setToken(trimmed);
+              setSubStep("email");
+            }}
+          />
+        </Box>
+      )}
+
+      {subStep === "email" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text dimColor>Token: {token.slice(0, 8)}...</Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>GitHub Email (GITHUB_EMAIL):</Text>
+            <TextInput
+              key="github-email"
+              placeholder="you@example.com"
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("Email is required.");
+                  return;
+                }
+                setError("");
+                setEmail(trimmed);
+                setSubStep("name");
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+
+      {subStep === "name" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text dimColor>Token: {token.slice(0, 8)}...</Text>
+          <Text dimColor>Email: {email}</Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>GitHub Name (GITHUB_NAME):</Text>
+            <TextInput
+              key="github-name"
+              placeholder="Your Name"
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("Name is required.");
+                  return;
+                }
+                setError("");
+                goToNext({
+                  githubToken: token,
+                  githubEmail: email,
+                  githubName: trimmed,
+                });
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+    </Box>
+  );
+}

package/src/commands/onboard/steps/integration-gitlab.tsx

@@ -0,0 +1,79 @@
+import { TextInput } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useState } from "react";
+import type { StepProps } from "../types.ts";
+
+type SubStep = "token" | "email";
+
+export function IntegrationGitLabStep({ goToNext }: StepProps) {
+  const [subStep, setSubStep] = useState<SubStep>("token");
+  const [token, setToken] = useState("");
+  const [error, setError] = useState("");
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold>GitLab Integration</Text>
+      <Text dimColor>Alternative to GitHub for code hosting and CI/CD.</Text>
+      <Box marginTop={1} flexDirection="column">
+        <Text>
+          Create a Personal Access Token at{" "}
+          <Text color="cyan" underline>
+            gitlab.com/-/user_settings/personal_access_tokens
+          </Text>
+        </Text>
+        <Text dimColor>Required scopes: api, read_repository, write_repository</Text>
+      </Box>
+
+      {error && (
+        <Box marginTop={1}>
+          <Text color="red">{error}</Text>
+        </Box>
+      )}
+
+      {subStep === "token" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text bold>GitLab Token (GITLAB_TOKEN):</Text>
+          <TextInput
+            key="gitlab-token"
+            placeholder="glpat-..."
+            onSubmit={(value) => {
+              const trimmed = value.trim();
+              if (!trimmed) {
+                setError("Token is required.");
+                return;
+              }
+              setError("");
+              setToken(trimmed);
+              setSubStep("email");
+            }}
+          />
+        </Box>
+      )}
+
+      {subStep === "email" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text dimColor>Token: {token.slice(0, 8)}...</Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>GitLab Email (GITLAB_EMAIL):</Text>
+            <TextInput
+              key="gitlab-email"
+              placeholder="you@example.com"
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("Email is required.");
+                  return;
+                }
+                setError("");
+                goToNext({
+                  gitlabToken: token,
+                  gitlabEmail: trimmed,
+                });
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+    </Box>
+  );
+}

package/src/commands/onboard/steps/integration-menu.tsx

@@ -0,0 +1,58 @@
+import { Select } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useState } from "react";
+import type { OnboardState, StepProps } from "../types.ts";
+
+type IntegrationKey = keyof OnboardState["integrations"];
+
+const INTEGRATIONS: { key: IntegrationKey; label: string; description: string }[] = [
+  { key: "github", label: "GitHub", description: "Push code, create PRs" },
+  { key: "slack", label: "Slack", description: "Team notifications, chat" },
+  { key: "gitlab", label: "GitLab", description: "Code hosting, CI/CD" },
+  { key: "sentry", label: "Sentry", description: "Error tracking, monitoring" },
+];
+
+const CONTINUE_VALUE = "continue";
+
+export function IntegrationMenuStep({ goToNext, addLog }: StepProps) {
+  const [selections, setSelections] = useState<Record<IntegrationKey, boolean>>({
+    github: false,
+    slack: false,
+    gitlab: false,
+    sentry: false,
+  });
+
+  const options = [
+    ...INTEGRATIONS.map((i) => ({
+      label: `${selections[i.key] ? "[x]" : "[ ]"} ${i.label} \u2014 ${i.description}`,
+      value: i.key,
+    })),
+    { label: "Continue \u2192", value: CONTINUE_VALUE },
+  ];
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold>Which integrations do your agents need?</Text>
+      <Text dimColor>Toggle integrations on/off, then select Continue.</Text>
+      <Box marginTop={1}>
+        <Select
+          options={options}
+          onChange={(value) => {
+            if (value === CONTINUE_VALUE) {
+              const enabled = INTEGRATIONS.filter((i) => selections[i.key]).map((i) => i.label);
+              if (enabled.length > 0) {
+                addLog(`Integrations: ${enabled.join(", ")}`);
+              } else {
+                addLog("Integrations: none");
+              }
+              goToNext({ integrations: { ...selections } });
+              return;
+            }
+            const key = value as IntegrationKey;
+            setSelections((prev) => ({ ...prev, [key]: !prev[key] }));
+          }}
+        />
+      </Box>
+    </Box>
+  );
+}

package/src/commands/onboard/steps/integration-sentry.tsx

@@ -0,0 +1,79 @@
+import { TextInput } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useState } from "react";
+import type { StepProps } from "../types.ts";
+
+type SubStep = "token" | "org";
+
+export function IntegrationSentryStep({ goToNext }: StepProps) {
+  const [subStep, setSubStep] = useState<SubStep>("token");
+  const [token, setToken] = useState("");
+  const [error, setError] = useState("");
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold>Sentry Integration</Text>
+      <Text dimColor>Error tracking and monitoring for your agents.</Text>
+      <Box marginTop={1} flexDirection="column">
+        <Text>
+          Create an Auth Token at{" "}
+          <Text color="cyan" underline>
+            sentry.io/settings/auth-tokens/
+          </Text>
+        </Text>
+        <Text dimColor>Required scopes: project:read, org:read, event:read</Text>
+      </Box>
+
+      {error && (
+        <Box marginTop={1}>
+          <Text color="red">{error}</Text>
+        </Box>
+      )}
+
+      {subStep === "token" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text bold>Sentry Auth Token (SENTRY_AUTH_TOKEN):</Text>
+          <TextInput
+            key="sentry-token"
+            placeholder="sntrys_..."
+            onSubmit={(value) => {
+              const trimmed = value.trim();
+              if (!trimmed) {
+                setError("Auth token is required.");
+                return;
+              }
+              setError("");
+              setToken(trimmed);
+              setSubStep("org");
+            }}
+          />
+        </Box>
+      )}
+
+      {subStep === "org" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text dimColor>Token: {token.slice(0, 10)}...</Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>Sentry Organization (SENTRY_ORG):</Text>
+            <TextInput
+              key="sentry-org"
+              placeholder="my-org"
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("Organization is required.");
+                  return;
+                }
+                setError("");
+                goToNext({
+                  sentryToken: token,
+                  sentryOrg: trimmed,
+                });
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+    </Box>
+  );
+}

package/src/commands/onboard/steps/integration-slack.tsx

@@ -0,0 +1,165 @@
+import { Select, TextInput } from "@inkjs/ui";
+import { Box, Text } from "ink";
+import { useState } from "react";
+import type { StepProps } from "../types.ts";
+
+type SubStep = "manifest_options" | "app_created" | "bot_token" | "app_token";
+
+const MANIFEST_URL =
+  "https://raw.githubusercontent.com/desplega-ai/agent-swarm/main/slack-manifest.json";
+
+async function copyToClipboard(text: string): Promise<boolean> {
+  try {
+    await Bun.$`echo ${text} | pbcopy`.quiet();
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+export function IntegrationSlackStep({ goToNext }: StepProps) {
+  const [subStep, setSubStep] = useState<SubStep>("manifest_options");
+  const [copied, setCopied] = useState(false);
+  const [botToken, setBotToken] = useState("");
+  const [error, setError] = useState("");
+
+  return (
+    <Box flexDirection="column" padding={1}>
+      <Text bold>Slack Integration</Text>
+      <Text dimColor>Team notifications, task updates, and chat with agents.</Text>
+
+      {error && (
+        <Box marginTop={1}>
+          <Text color="red">{error}</Text>
+        </Box>
+      )}
+
+      {subStep === "manifest_options" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text>To set up Slack, you need to create a Slack App using the provided manifest.</Text>
+          <Box marginTop={1}>
+            <Select
+              options={[
+                { label: "Copy manifest URL to clipboard", value: "copy" },
+                { label: "Show manifest URL", value: "show" },
+                { label: "Skip — I already have a Slack app", value: "skip" },
+              ]}
+              onChange={async (value) => {
+                if (value === "copy") {
+                  const ok = await copyToClipboard(MANIFEST_URL);
+                  setCopied(ok);
+                  setSubStep("app_created");
+                } else if (value === "show") {
+                  setCopied(false);
+                  setSubStep("app_created");
+                } else {
+                  setSubStep("bot_token");
+                }
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+
+      {subStep === "app_created" && (
+        <Box marginTop={1} flexDirection="column">
+          {copied ? (
+            <Text color="green">Manifest URL copied to clipboard!</Text>
+          ) : (
+            <Box flexDirection="column">
+              <Text>Manifest URL:</Text>
+              <Text color="cyan" underline>
+                {MANIFEST_URL}
+              </Text>
+            </Box>
+          )}
+          <Box marginTop={1} flexDirection="column">
+            <Text>Steps:</Text>
+            <Text>
+              1. Go to{" "}
+              <Text color="cyan" underline>
+                api.slack.com/apps
+              </Text>{" "}
+              and click "Create New App"
+            </Text>
+            <Text>2. Choose "From a manifest" and select your workspace</Text>
+            <Text>3. Paste the manifest JSON (or use the URL above)</Text>
+            <Text>4. Click "Create" and install to your workspace</Text>
+          </Box>
+          <Box marginTop={1}>
+            <Select
+              options={[{ label: "Continue — I've created the app", value: "continue" }]}
+              onChange={() => setSubStep("bot_token")}
+            />
+          </Box>
+        </Box>
+      )}
+
+      {subStep === "bot_token" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text>
+            Find your Bot Token under <Text bold>OAuth & Permissions</Text> in the Slack app
+            settings.
+          </Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>Bot Token (SLACK_BOT_TOKEN):</Text>
+            <TextInput
+              key="slack-bot-token"
+              placeholder="xoxb-..."
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("Bot token is required. Please enter it above.");
+                  return;
+                }
+                if (!trimmed.startsWith("xoxb-")) {
+                  setError("Bot token should start with xoxb- — please check and re-enter.");
+                  return;
+                }
+                setError("");
+                setBotToken(trimmed);
+                setSubStep("app_token");
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+
+      {subStep === "app_token" && (
+        <Box marginTop={1} flexDirection="column">
+          <Text dimColor>Bot Token: {botToken.slice(0, 10)}...</Text>
+          <Box marginTop={1} flexDirection="column">
+            <Text>
+              Find your App-Level Token under <Text bold>Basic Information → App-Level Tokens</Text>
+              .
+            </Text>
+            <Text dimColor>Create one with connections:write scope if you don't have one.</Text>
+          </Box>
+          <Box marginTop={1} flexDirection="column">
+            <Text bold>App Token (SLACK_APP_TOKEN):</Text>
+            <TextInput
+              key="slack-app-token"
+              placeholder="xapp-..."
+              onSubmit={(value) => {
+                const trimmed = value.trim();
+                if (!trimmed) {
+                  setError("App token is required. Please enter it above.");
+                  return;
+                }
+                if (!trimmed.startsWith("xapp-")) {
+                  setError("App token should start with xapp- — please check and re-enter.");
+                  return;
+                }
+                setError("");
+                goToNext({
+                  slackBotToken: botToken,
+                  slackAppToken: trimmed,
+                });
+              }}
+            />
+          </Box>
+        </Box>
+      )}
+    </Box>
+  );
+}