feat(web): MS23-P3-003 OpenClaw provider config UI

apps/orchestrator/package.json

@@ -22,6 +22,7 @@
     "@anthropic-ai/sdk": "^0.72.1",
     "@mosaic/config": "workspace:*",
     "@mosaic/shared": "workspace:*",
+    "@nestjs/axios": "^4.0.1",
     "@nestjs/bullmq": "^11.0.4",
     "@nestjs/common": "^11.1.12",
     "@nestjs/config": "^4.0.2",

apps/orchestrator/src/api/providers/openclaw/openclaw.provider-factory.ts

@@ -0,0 +1,17 @@
+import { HttpService } from "@nestjs/axios";
+import { Injectable } from "@nestjs/common";
+import type { AgentProviderConfig } from "@prisma/client";
+import { EncryptionService } from "../../../security/encryption.service";
+import { OpenClawProvider } from "./openclaw.provider";
+
+@Injectable()
+export class OpenClawProviderFactory {
+  constructor(
+    private readonly encryptionService: EncryptionService,
+    private readonly httpService: HttpService
+  ) {}
+
+  createProvider(config: AgentProviderConfig): OpenClawProvider {
+    return new OpenClawProvider(config, this.encryptionService, this.httpService);
+  }
+}

apps/orchestrator/src/api/providers/openclaw/openclaw.provider.spec.ts

@@ -0,0 +1,270 @@
+import type { HttpService } from "@nestjs/axios";
+import { ServiceUnavailableException } from "@nestjs/common";
+import type { AgentProviderConfig } from "@prisma/client";
+import { Readable } from "node:stream";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { EncryptionService } from "../../../security/encryption.service";
+import { OpenClawProvider } from "./openclaw.provider";
+
+describe("OpenClawProvider", () => {
+  let provider: OpenClawProvider;
+  let httpService: {
+    axiosRef: {
+      get: ReturnType<typeof vi.fn>;
+      post: ReturnType<typeof vi.fn>;
+    };
+  };
+  let encryptionService: {
+    decryptIfNeeded: ReturnType<typeof vi.fn>;
+  };
+
+  const config: AgentProviderConfig = {
+    id: "cfg-openclaw-1",
+    workspaceId: "workspace-1",
+    name: "openclaw-home",
+    provider: "openclaw",
+    gatewayUrl: "https://gateway.example.com/",
+    credentials: {
+      apiToken: "enc:token-value",
+      displayName: "Home OpenClaw",
+    },
+    isActive: true,
+    createdAt: new Date("2026-03-07T15:00:00.000Z"),
+    updatedAt: new Date("2026-03-07T15:00:00.000Z"),
+  };
+
+  beforeEach(() => {
+    httpService = {
+      axiosRef: {
+        get: vi.fn(),
+        post: vi.fn(),
+      },
+    };
+
+    encryptionService = {
+      decryptIfNeeded: vi.fn().mockReturnValue("plain-token"),
+    };
+
+    provider = new OpenClawProvider(
+      config,
+      encryptionService as unknown as EncryptionService,
+      httpService as unknown as HttpService
+    );
+  });
+
+  it("maps listSessions from OpenClaw API", async () => {
+    httpService.axiosRef.get.mockResolvedValue({
+      data: {
+        sessions: [
+          {
+            id: "session-1",
+            status: "running",
+            createdAt: "2026-03-07T15:01:00.000Z",
+            updatedAt: "2026-03-07T15:02:00.000Z",
+          },
+        ],
+        total: 1,
+        cursor: "next-cursor",
+      },
+    });
+
+    const result = await provider.listSessions("cursor-1", 25);
+
+    expect(httpService.axiosRef.get).toHaveBeenCalledWith(
+      "https://gateway.example.com/api/sessions",
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+        params: {
+          cursor: "cursor-1",
+          limit: 25,
+        },
+      }
+    );
+    expect(result).toEqual({
+      sessions: [
+        {
+          id: "session-1",
+          providerId: "openclaw-home",
+          providerType: "openclaw",
+          status: "active",
+          createdAt: new Date("2026-03-07T15:01:00.000Z"),
+          updatedAt: new Date("2026-03-07T15:02:00.000Z"),
+        },
+      ],
+      total: 1,
+      cursor: "next-cursor",
+    });
+    expect(encryptionService.decryptIfNeeded).toHaveBeenCalledWith("enc:token-value");
+  });
+
+  it("returns null from getSession when OpenClaw returns 404", async () => {
+    httpService.axiosRef.get.mockRejectedValue({
+      response: {
+        status: 404,
+      },
+    });
+
+    await expect(provider.getSession("missing-session")).resolves.toBeNull();
+  });
+
+  it("maps getMessages response", async () => {
+    httpService.axiosRef.get.mockResolvedValue({
+      data: {
+        messages: [
+          {
+            id: "message-1",
+            sessionId: "session-1",
+            role: "agent",
+            content: "hello",
+            timestamp: "2026-03-07T15:03:00.000Z",
+            metadata: {
+              tokens: 128,
+            },
+          },
+        ],
+      },
+    });
+
+    const result = await provider.getMessages("session-1", 20, "before-cursor");
+
+    expect(httpService.axiosRef.get).toHaveBeenCalledWith(
+      "https://gateway.example.com/api/messages",
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+        params: {
+          sessionId: "session-1",
+          limit: 20,
+          before: "before-cursor",
+        },
+      }
+    );
+    expect(result).toEqual([
+      {
+        id: "message-1",
+        sessionId: "session-1",
+        role: "assistant",
+        content: "hello",
+        timestamp: new Date("2026-03-07T15:03:00.000Z"),
+        metadata: {
+          tokens: 128,
+        },
+      },
+    ]);
+  });
+
+  it("maps inject and control endpoints", async () => {
+    httpService.axiosRef.post
+      .mockResolvedValueOnce({
+        data: {
+          accepted: true,
+          messageId: "message-2",
+        },
+      })
+      .mockResolvedValueOnce({ data: {} })
+      .mockResolvedValueOnce({ data: {} })
+      .mockResolvedValueOnce({ data: {} });
+
+    await expect(provider.injectMessage("session-1", "barge in")).resolves.toEqual({
+      accepted: true,
+      messageId: "message-2",
+    });
+
+    await provider.pauseSession("session-1");
+    await provider.resumeSession("session-1");
+    await provider.killSession("session-1", false);
+
+    expect(httpService.axiosRef.post).toHaveBeenNthCalledWith(
+      1,
+      "https://gateway.example.com/api/sessions/session-1/inject",
+      { content: "barge in" },
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+      }
+    );
+    expect(httpService.axiosRef.post).toHaveBeenNthCalledWith(
+      2,
+      "https://gateway.example.com/api/sessions/session-1/pause",
+      {},
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+      }
+    );
+    expect(httpService.axiosRef.post).toHaveBeenNthCalledWith(
+      3,
+      "https://gateway.example.com/api/sessions/session-1/resume",
+      {},
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+      }
+    );
+    expect(httpService.axiosRef.post).toHaveBeenNthCalledWith(
+      4,
+      "https://gateway.example.com/api/sessions/session-1/kill",
+      { force: false },
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+        },
+      }
+    );
+  });
+
+  it("parses SSE stream messages", async () => {
+    const stream = Readable.from([
+      'data: {"id":"message-stream","sessionId":"session-stream","role":"assistant","content":"stream hello","timestamp":"2026-03-07T16:00:00.000Z"}\n\n',
+      "data: [DONE]\n\n",
+    ]);
+
+    httpService.axiosRef.get.mockResolvedValue({
+      data: stream,
+    });
+
+    const messages: Array<unknown> = [];
+    for await (const message of provider.streamMessages("session-stream")) {
+      messages.push(message);
+    }
+
+    expect(httpService.axiosRef.get).toHaveBeenCalledWith(
+      "https://gateway.example.com/api/sessions/session-stream/stream",
+      {
+        headers: {
+          Authorization: "Bearer plain-token",
+          Accept: "text/event-stream",
+        },
+        responseType: "stream",
+      }
+    );
+
+    expect(messages).toEqual([
+      {
+        id: "message-stream",
+        sessionId: "session-stream",
+        role: "assistant",
+        content: "stream hello",
+        timestamp: new Date("2026-03-07T16:00:00.000Z"),
+      },
+    ]);
+  });
+
+  it("throws ServiceUnavailableException for request failures", async () => {
+    httpService.axiosRef.get.mockRejectedValue(new Error("gateway unreachable"));
+
+    await expect(provider.listSessions()).rejects.toBeInstanceOf(ServiceUnavailableException);
+  });
+
+  it("returns false from isAvailable when gateway check fails", async () => {
+    httpService.axiosRef.get.mockRejectedValue(new Error("gateway unreachable"));
+
+    await expect(provider.isAvailable()).resolves.toBe(false);
+  });
+});

apps/orchestrator/src/api/providers/openclaw/openclaw.provider.ts

@@ -0,0 +1,703 @@
+import { HttpService } from "@nestjs/axios";
+import { Injectable, ServiceUnavailableException } from "@nestjs/common";
+import type {
+  AgentMessage,
+  AgentMessageRole,
+  AgentSession,
+  AgentSessionList,
+  AgentSessionStatus,
+  IAgentProvider,
+  InjectResult,
+} from "@mosaic/shared";
+import type { AgentProviderConfig } from "@prisma/client";
+import { randomUUID } from "node:crypto";
+import { EncryptionService } from "../../../security/encryption.service";
+
+const DEFAULT_SESSION_LIMIT = 50;
+const DEFAULT_MESSAGE_LIMIT = 50;
+const MAX_MESSAGE_LIMIT = 200;
+const OPENCLAW_PROVIDER_TYPE = "openclaw";
+const API_TOKEN_KEYS = ["apiToken", "token", "bearerToken"] as const;
+const DISPLAY_NAME_KEYS = ["displayName", "label"] as const;
+
+type JsonRecord = Record<string, unknown>;
+type AsyncChunkStream = AsyncIterable<string | Uint8Array | Buffer>;
+
+interface HttpErrorWithResponse {
+  response?: {
+    status?: number;
+  };
+}
+
+@Injectable()
+export class OpenClawProvider implements IAgentProvider {
+  readonly providerId: string;
+  readonly providerType = OPENCLAW_PROVIDER_TYPE;
+  readonly displayName: string;
+
+  constructor(
+    private readonly config: AgentProviderConfig,
+    private readonly encryptionService: EncryptionService,
+    private readonly httpService: HttpService
+  ) {
+    this.providerId = this.config.name;
+    this.displayName = this.resolveDisplayName();
+  }
+
+  validateBaseUrl(): void {
+    void this.resolveBaseUrl();
+  }
+
+  validateToken(): void {
+    void this.resolveApiToken();
+  }
+
+  async listSessions(cursor?: string, limit = DEFAULT_SESSION_LIMIT): Promise<AgentSessionList> {
+    const safeLimit = this.normalizeLimit(limit, DEFAULT_SESSION_LIMIT);
+    const params: Record<string, number | string> = { limit: safeLimit };
+    if (typeof cursor === "string" && cursor.length > 0) {
+      params.cursor = cursor;
+    }
+
+    try {
+      const response = await this.httpService.axiosRef.get(this.buildUrl("/api/sessions"), {
+        headers: this.authHeaders(),
+        params,
+      });
+
+      const page = this.extractSessionPage(response.data);
+      const sessions = page.records
+        .map((record) => this.toAgentSession(record))
+        .filter((session): session is AgentSession => session !== null);
+
+      return {
+        sessions,
+        total: page.total ?? sessions.length,
+        ...(page.cursor !== undefined ? { cursor: page.cursor } : {}),
+      };
+    } catch (error) {
+      throw this.toServiceUnavailable("list sessions", error);
+    }
+  }
+
+  async getSession(sessionId: string): Promise<AgentSession | null> {
+    try {
+      const response = await this.httpService.axiosRef.get(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}`),
+        {
+          headers: this.authHeaders(),
+        }
+      );
+
+      const payload = this.unwrapContainer(response.data, ["session", "data"]);
+      return this.toAgentSession(payload);
+    } catch (error) {
+      if (this.getHttpStatus(error) === 404) {
+        return null;
+      }
+
+      throw this.toServiceUnavailable(`get session ${sessionId}`, error);
+    }
+  }
+
+  async getMessages(
+    sessionId: string,
+    limit = DEFAULT_MESSAGE_LIMIT,
+    before?: string
+  ): Promise<AgentMessage[]> {
+    const safeLimit = this.normalizeLimit(limit, DEFAULT_MESSAGE_LIMIT);
+    const params: Record<string, number | string> = {
+      sessionId,
+      limit: safeLimit,
+    };
+
+    if (typeof before === "string" && before.length > 0) {
+      params.before = before;
+    }
+
+    try {
+      const response = await this.httpService.axiosRef.get(this.buildUrl("/api/messages"), {
+        headers: this.authHeaders(),
+        params,
+      });
+
+      return this.extractMessageRecords(response.data)
+        .map((record) => this.toAgentMessage(record, sessionId))
+        .filter((message): message is AgentMessage => message !== null);
+    } catch (error) {
+      throw this.toServiceUnavailable(`get messages for session ${sessionId}`, error);
+    }
+  }
+
+  async injectMessage(sessionId: string, content: string): Promise<InjectResult> {
+    try {
+      const response = await this.httpService.axiosRef.post(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}/inject`),
+        { content },
+        {
+          headers: this.authHeaders(),
+        }
+      );
+
+      const payload = this.isRecord(response.data) ? response.data : {};
+
+      return {
+        accepted: typeof payload.accepted === "boolean" ? payload.accepted : true,
+        ...(this.readString(payload.messageId) !== undefined
+          ? { messageId: this.readString(payload.messageId) }
+          : {}),
+      };
+    } catch (error) {
+      throw this.toServiceUnavailable(`inject message into session ${sessionId}`, error);
+    }
+  }
+
+  async pauseSession(sessionId: string): Promise<void> {
+    try {
+      await this.httpService.axiosRef.post(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}/pause`),
+        {},
+        {
+          headers: this.authHeaders(),
+        }
+      );
+    } catch (error) {
+      throw this.toServiceUnavailable(`pause session ${sessionId}`, error);
+    }
+  }
+
+  async resumeSession(sessionId: string): Promise<void> {
+    try {
+      await this.httpService.axiosRef.post(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}/resume`),
+        {},
+        {
+          headers: this.authHeaders(),
+        }
+      );
+    } catch (error) {
+      throw this.toServiceUnavailable(`resume session ${sessionId}`, error);
+    }
+  }
+
+  async killSession(sessionId: string, force = true): Promise<void> {
+    try {
+      await this.httpService.axiosRef.post(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}/kill`),
+        { force },
+        {
+          headers: this.authHeaders(),
+        }
+      );
+    } catch (error) {
+      throw this.toServiceUnavailable(`kill session ${sessionId}`, error);
+    }
+  }
+
+  async *streamMessages(sessionId: string): AsyncIterable<AgentMessage> {
+    try {
+      const response = await this.httpService.axiosRef.get(
+        this.buildUrl(`/api/sessions/${encodeURIComponent(sessionId)}/stream`),
+        {
+          headers: this.authHeaders({
+            Accept: "text/event-stream",
+          }),
+          responseType: "stream",
+        }
+      );
+
+      const stream = this.asAsyncChunkStream(response.data);
+      if (!stream) {
+        throw new Error("OpenClaw stream response is not readable");
+      }
+
+      const decoder = new TextDecoder();
+      let buffer = "";
+      let streamDone = false;
+
+      for await (const chunk of stream) {
+        const textChunk =
+          typeof chunk === "string" ? chunk : decoder.decode(chunk, { stream: true });
+        buffer += textChunk.replace(/\r\n/gu, "\n");
+
+        const events = buffer.split("\n\n");
+        buffer = events.pop() ?? "";
+
+        for (const event of events) {
+          const data = this.extractSseData(event);
+          if (data === null) {
+            continue;
+          }
+
+          if (data === "[DONE]") {
+            streamDone = true;
+            break;
+          }
+
+          const message = this.toAgentMessage(this.tryParseJson(data) ?? data, sessionId);
+          if (message !== null) {
+            yield message;
+          }
+        }
+
+        if (streamDone) {
+          break;
+        }
+      }
+
+      if (!streamDone && buffer.trim().length > 0) {
+        const data = this.extractSseData(buffer.trim());
+        if (data !== null && data !== "[DONE]") {
+          const message = this.toAgentMessage(this.tryParseJson(data) ?? data, sessionId);
+          if (message !== null) {
+            yield message;
+          }
+        }
+      }
+    } catch (error) {
+      throw this.toServiceUnavailable(`stream messages for session ${sessionId}`, error);
+    }
+  }
+
+  async isAvailable(): Promise<boolean> {
+    try {
+      this.validateBaseUrl();
+      this.validateToken();
+
+      await this.httpService.axiosRef.get(this.buildUrl("/api/sessions"), {
+        headers: this.authHeaders(),
+        params: { limit: 1 },
+      });
+
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
+  private extractSessionPage(payload: unknown): {
+    records: unknown[];
+    total?: number;
+    cursor?: string;
+  } {
+    if (Array.isArray(payload)) {
+      return {
+        records: payload,
+        total: payload.length,
+      };
+    }
+
+    if (!this.isRecord(payload)) {
+      return {
+        records: [],
+      };
+    }
+
+    let records: unknown[] = [];
+    if (Array.isArray(payload.sessions)) {
+      records = payload.sessions;
+    } else if (Array.isArray(payload.items)) {
+      records = payload.items;
+    } else if (Array.isArray(payload.data)) {
+      records = payload.data;
+    }
+
+    const total = typeof payload.total === "number" ? payload.total : undefined;
+    const cursor = this.readString(payload.cursor) ?? this.readString(payload.nextCursor);
+
+    return {
+      records,
+      total,
+      ...(cursor !== undefined ? { cursor } : {}),
+    };
+  }
+
+  private extractMessageRecords(payload: unknown): unknown[] {
+    if (Array.isArray(payload)) {
+      return payload;
+    }
+
+    if (!this.isRecord(payload)) {
+      return [];
+    }
+
+    if (Array.isArray(payload.messages)) {
+      return payload.messages;
+    }
+
+    if (Array.isArray(payload.items)) {
+      return payload.items;
+    }
+
+    if (Array.isArray(payload.data)) {
+      return payload.data;
+    }
+
+    return [];
+  }
+
+  private unwrapContainer(payload: unknown, keys: string[]): unknown {
+    if (!this.isRecord(payload)) {
+      return payload;
+    }
+
+    for (const key of keys) {
+      if (key in payload) {
+        return payload[key];
+      }
+    }
+
+    return payload;
+  }
+
+  private toAgentSession(record: unknown): AgentSession | null {
+    if (!this.isRecord(record)) {
+      return null;
+    }
+
+    const id =
+      this.readString(record.id) ??
+      this.readString(record.sessionId) ??
+      this.readString(record.key);
+    if (!id) {
+      return null;
+    }
+
+    const createdAt = this.parseDate(record.createdAt ?? record.spawnedAt ?? record.startedAt);
+    const updatedAt = this.parseDate(
+      record.updatedAt ?? record.completedAt ?? record.lastActivityAt ?? record.endedAt,
+      createdAt
+    );
+
+    const label =
+      this.readString(record.label) ??
+      this.readString(record.title) ??
+      this.readString(record.name) ??
+      undefined;
+
+    const parentSessionId = this.readString(record.parentSessionId) ?? undefined;
+    const metadata = this.toMetadata(record.metadata);
+
+    return {
+      id,
+      providerId: this.providerId,
+      providerType: this.providerType,
+      ...(label !== undefined ? { label } : {}),
+      status: this.toSessionStatus(this.readString(record.status)),
+      ...(parentSessionId !== undefined ? { parentSessionId } : {}),
+      createdAt,
+      updatedAt,
+      ...(metadata !== undefined ? { metadata } : {}),
+    };
+  }
+
+  private toAgentMessage(value: unknown, fallbackSessionId?: string): AgentMessage | null {
+    if (typeof value === "string") {
+      const content = value.trim();
+      if (content.length === 0 || fallbackSessionId === undefined) {
+        return null;
+      }
+
+      return {
+        id: randomUUID(),
+        sessionId: fallbackSessionId,
+        role: "assistant",
+        content,
+        timestamp: new Date(),
+      };
+    }
+
+    let candidate: JsonRecord | null = null;
+
+    if (this.isRecord(value) && this.isRecord(value.message)) {
+      candidate = value.message;
+    } else if (this.isRecord(value)) {
+      candidate = value;
+    }
+
+    if (candidate === null) {
+      return null;
+    }
+
+    const sessionId = this.readString(candidate.sessionId) ?? fallbackSessionId;
+    if (!sessionId) {
+      return null;
+    }
+
+    const content = this.extractMessageContent(
+      candidate.content ?? candidate.text ?? candidate.message
+    );
+    if (content.length === 0) {
+      return null;
+    }
+
+    const metadata = this.toMetadata(candidate.metadata);
+
+    return {
+      id: this.readString(candidate.id) ?? this.readString(candidate.messageId) ?? randomUUID(),
+      sessionId,
+      role: this.toMessageRole(this.readString(candidate.role) ?? this.readString(candidate.type)),
+      content,
+      timestamp: this.parseDate(candidate.timestamp ?? candidate.createdAt),
+      ...(metadata !== undefined ? { metadata } : {}),
+    };
+  }
+
+  private extractMessageContent(content: unknown): string {
+    if (typeof content === "string") {
+      return content.trim();
+    }
+
+    if (Array.isArray(content)) {
+      const parts: string[] = [];
+
+      for (const part of content) {
+        if (typeof part === "string") {
+          const trimmed = part.trim();
+          if (trimmed.length > 0) {
+            parts.push(trimmed);
+          }
+          continue;
+        }
+
+        if (!this.isRecord(part)) {
+          continue;
+        }
+
+        const text = this.readString(part.text) ?? this.readString(part.content);
+        if (text !== undefined && text.trim().length > 0) {
+          parts.push(text.trim());
+        }
+      }
+
+      return parts.join("\n\n").trim();
+    }
+
+    if (this.isRecord(content)) {
+      const text = this.readString(content.text) ?? this.readString(content.content);
+      return text?.trim() ?? "";
+    }
+
+    return "";
+  }
+
+  private toSessionStatus(status?: string): AgentSessionStatus {
+    switch (status?.toLowerCase()) {
+      case "active":
+      case "running":
+        return "active";
+      case "paused":
+        return "paused";
+      case "completed":
+      case "done":
+      case "succeeded":
+        return "completed";
+      case "failed":
+      case "error":
+      case "killed":
+      case "terminated":
+      case "cancelled":
+        return "failed";
+      case "idle":
+      case "pending":
+      case "queued":
+      default:
+        return "idle";
+    }
+  }
+
+  private toMessageRole(role?: string): AgentMessageRole {
+    switch (role?.toLowerCase()) {
+      case "assistant":
+      case "agent":
+        return "assistant";
+      case "system":
+        return "system";
+      case "tool":
+        return "tool";
+      case "operator":
+      case "user":
+      default:
+        return "user";
+    }
+  }
+
+  private normalizeLimit(value: number, fallback: number): number {
+    const normalized = Number.isFinite(value) ? Math.trunc(value) : fallback;
+    if (normalized < 1) {
+      return 1;
+    }
+
+    return Math.min(normalized, MAX_MESSAGE_LIMIT);
+  }
+
+  private parseDate(value: unknown, fallback = new Date()): Date {
+    if (value instanceof Date) {
+      return value;
+    }
+
+    if (typeof value === "string" || typeof value === "number") {
+      const parsed = new Date(value);
+      if (!Number.isNaN(parsed.getTime())) {
+        return parsed;
+      }
+    }
+
+    return fallback;
+  }
+
+  private toMetadata(value: unknown): Record<string, unknown> | undefined {
+    if (this.isRecord(value)) {
+      return value;
+    }
+
+    return undefined;
+  }
+
+  private resolveDisplayName(): string {
+    const credentials = this.readCredentials();
+
+    for (const key of DISPLAY_NAME_KEYS) {
+      const value = this.readString(credentials[key]);
+      if (value !== undefined) {
+        return value;
+      }
+    }
+
+    return this.config.name;
+  }
+
+  private resolveBaseUrl(): string {
+    const configRecord = this.config as unknown as JsonRecord;
+    const rawBaseUrl =
+      this.readString(this.config.gatewayUrl) ?? this.readString(configRecord.baseUrl);
+
+    if (rawBaseUrl === undefined) {
+      throw new Error(`OpenClaw provider ${this.providerId} is missing gateway URL`);
+    }
+
+    try {
+      const parsed = new URL(rawBaseUrl);
+      return parsed.toString().replace(/\/$/u, "");
+    } catch {
+      throw new Error(`OpenClaw provider ${this.providerId} has invalid gateway URL`);
+    }
+  }
+
+  private resolveApiToken(): string {
+    const configRecord = this.config as unknown as JsonRecord;
+    const credentials = this.readCredentials();
+
+    const rawToken =
+      this.readString(configRecord.apiToken) ??
+      this.readString(configRecord.token) ??
+      this.readString(configRecord.bearerToken) ??
+      this.findFirstString(credentials, API_TOKEN_KEYS);
+
+    if (rawToken === undefined) {
+      throw new Error(`OpenClaw provider ${this.providerId} is missing apiToken credentials`);
+    }
+
+    try {
+      return this.encryptionService.decryptIfNeeded(rawToken);
+    } catch (error) {
+      throw new Error(`Failed to decrypt API token: ${this.toErrorMessage(error)}`);
+    }
+  }
+
+  private readCredentials(): JsonRecord {
+    return this.isRecord(this.config.credentials) ? this.config.credentials : {};
+  }
+
+  private findFirstString(record: JsonRecord, keys: readonly string[]): string | undefined {
+    for (const key of keys) {
+      const value = this.readString(record[key]);
+      if (value !== undefined) {
+        return value;
+      }
+    }
+
+    return undefined;
+  }
+
+  private authHeaders(extraHeaders: Record<string, string> = {}): Record<string, string> {
+    return {
+      Authorization: `Bearer ${this.resolveApiToken()}`,
+      ...extraHeaders,
+    };
+  }
+
+  private buildUrl(path: string): string {
+    return new URL(path, `${this.resolveBaseUrl()}/`).toString();
+  }
+
+  private extractSseData(rawEvent: string): string | null {
+    const lines = rawEvent.split("\n");
+    const dataLines = lines
+      .filter((line) => line.startsWith("data:"))
+      .map((line) => line.slice(5).trimStart());
+
+    if (dataLines.length > 0) {
+      return dataLines.join("\n").trim();
+    }
+
+    const trimmed = rawEvent.trim();
+    if (trimmed.startsWith("{") || trimmed.startsWith("[")) {
+      return trimmed;
+    }
+
+    return null;
+  }
+
+  private tryParseJson(value: string): unknown {
+    try {
+      return JSON.parse(value) as unknown;
+    } catch {
+      return null;
+    }
+  }
+
+  private asAsyncChunkStream(value: unknown): AsyncChunkStream | null {
+    if (value !== null && typeof value === "object" && Symbol.asyncIterator in value) {
+      return value as AsyncChunkStream;
+    }
+
+    return null;
+  }
+
+  private isRecord(value: unknown): value is JsonRecord {
+    return typeof value === "object" && value !== null && !Array.isArray(value);
+  }
+
+  private readString(value: unknown): string | undefined {
+    if (typeof value !== "string") {
+      return undefined;
+    }
+
+    const trimmed = value.trim();
+    return trimmed.length > 0 ? trimmed : undefined;
+  }
+
+  private getHttpStatus(error: unknown): number | undefined {
+    if (typeof error !== "object" || error === null || !("response" in error)) {
+      return undefined;
+    }
+
+    const response = (error as HttpErrorWithResponse).response;
+    return typeof response?.status === "number" ? response.status : undefined;
+  }
+
+  private toServiceUnavailable(operation: string, error: unknown): ServiceUnavailableException {
+    return new ServiceUnavailableException(
+      `OpenClaw provider ${this.providerId} failed to ${operation}: ${this.toErrorMessage(error)}`
+    );
+  }
+
+  private toErrorMessage(error: unknown): string {
+    if (error instanceof Error) {
+      return error.message;
+    }
+
+    return String(error);
+  }
+}

apps/orchestrator/src/api/providers/providers.module.spec.ts

@@ -0,0 +1,131 @@
+import { Logger } from "@nestjs/common";
+import type { AgentProviderConfig } from "@prisma/client";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { PrismaService } from "../../prisma/prisma.service";
+import { AgentProviderRegistry } from "../agents/agent-provider.registry";
+import { OpenClawProviderFactory } from "./openclaw/openclaw.provider-factory";
+import { ProvidersModule } from "./providers.module";
+
+type MockOpenClawProvider = {
+  providerId: string;
+  validateBaseUrl: ReturnType<typeof vi.fn>;
+  validateToken: ReturnType<typeof vi.fn>;
+  isAvailable: ReturnType<typeof vi.fn>;
+};
+
+describe("ProvidersModule", () => {
+  let moduleRef: ProvidersModule;
+  let prisma: {
+    agentProviderConfig: {
+      findMany: ReturnType<typeof vi.fn>;
+    };
+  };
+  let registry: {
+    registerProvider: ReturnType<typeof vi.fn>;
+  };
+  let factory: {
+    createProvider: ReturnType<typeof vi.fn>;
+  };
+
+  const config: AgentProviderConfig = {
+    id: "cfg-openclaw-1",
+    workspaceId: "workspace-1",
+    name: "openclaw-home",
+    provider: "openclaw",
+    gatewayUrl: "https://gateway.example.com",
+    credentials: { apiToken: "enc:token-value" },
+    isActive: true,
+    createdAt: new Date("2026-03-07T15:00:00.000Z"),
+    updatedAt: new Date("2026-03-07T15:00:00.000Z"),
+  };
+
+  beforeEach(() => {
+    prisma = {
+      agentProviderConfig: {
+        findMany: vi.fn(),
+      },
+    };
+
+    registry = {
+      registerProvider: vi.fn(),
+    };
+
+    factory = {
+      createProvider: vi.fn(),
+    };
+
+    moduleRef = new ProvidersModule(
+      prisma as unknown as PrismaService,
+      registry as unknown as AgentProviderRegistry,
+      factory as unknown as OpenClawProviderFactory
+    );
+  });
+
+  it("registers reachable OpenClaw providers", async () => {
+    const provider: MockOpenClawProvider = {
+      providerId: "openclaw-home",
+      validateBaseUrl: vi.fn(),
+      validateToken: vi.fn(),
+      isAvailable: vi.fn().mockResolvedValue(true),
+    };
+
+    prisma.agentProviderConfig.findMany.mockResolvedValue([config]);
+    factory.createProvider.mockReturnValue(provider);
+
+    await moduleRef.onModuleInit();
+
+    expect(prisma.agentProviderConfig.findMany).toHaveBeenCalledWith({
+      where: {
+        provider: "openclaw",
+        isActive: true,
+      },
+      orderBy: [{ createdAt: "asc" }, { id: "asc" }],
+    });
+    expect(factory.createProvider).toHaveBeenCalledWith(config);
+    expect(provider.validateBaseUrl).toHaveBeenCalledTimes(1);
+    expect(provider.validateToken).toHaveBeenCalledTimes(1);
+    expect(provider.isAvailable).toHaveBeenCalledTimes(1);
+    expect(registry.registerProvider).toHaveBeenCalledWith(provider);
+  });
+
+  it("skips provider registration when gateway is unreachable", async () => {
+    const warnSpy = vi.spyOn(Logger.prototype, "warn").mockImplementation(() => undefined);
+    const provider: MockOpenClawProvider = {
+      providerId: "openclaw-home",
+      validateBaseUrl: vi.fn(),
+      validateToken: vi.fn(),
+      isAvailable: vi.fn().mockResolvedValue(false),
+    };
+
+    prisma.agentProviderConfig.findMany.mockResolvedValue([config]);
+    factory.createProvider.mockReturnValue(provider);
+
+    await moduleRef.onModuleInit();
+
+    expect(registry.registerProvider).not.toHaveBeenCalled();
+    expect(warnSpy).toHaveBeenCalledWith(
+      expect.stringContaining("Skipping OpenClaw provider openclaw-home")
+    );
+  });
+
+  it("skips provider registration when token decryption fails", async () => {
+    const errorSpy = vi.spyOn(Logger.prototype, "error").mockImplementation(() => undefined);
+    const provider: MockOpenClawProvider = {
+      providerId: "openclaw-home",
+      validateBaseUrl: vi.fn(),
+      validateToken: vi.fn().mockImplementation(() => {
+        throw new Error("Failed to decrypt API token");
+      }),
+      isAvailable: vi.fn().mockResolvedValue(true),
+    };
+
+    prisma.agentProviderConfig.findMany.mockResolvedValue([config]);
+    factory.createProvider.mockReturnValue(provider);
+
+    await moduleRef.onModuleInit();
+
+    expect(registry.registerProvider).not.toHaveBeenCalled();
+    expect(errorSpy).toHaveBeenCalledWith(expect.stringContaining("token decryption failed"));
+    expect(provider.isAvailable).not.toHaveBeenCalled();
+  });
+});

apps/orchestrator/src/api/providers/providers.module.ts

@@ -0,0 +1,94 @@
+import { HttpModule } from "@nestjs/axios";
+import { Logger, Module, OnModuleInit } from "@nestjs/common";
+import type { AgentProviderConfig } from "@prisma/client";
+import { PrismaModule } from "../../prisma/prisma.module";
+import { PrismaService } from "../../prisma/prisma.service";
+import { EncryptionService } from "../../security/encryption.service";
+import { AgentProviderRegistry } from "../agents/agent-provider.registry";
+import { AgentsModule } from "../agents/agents.module";
+import { OpenClawProviderFactory } from "./openclaw/openclaw.provider-factory";
+
+const OPENCLAW_PROVIDER_TYPE = "openclaw";
+
+@Module({
+  imports: [
+    AgentsModule,
+    PrismaModule,
+    HttpModule.register({
+      timeout: 10000,
+      maxRedirects: 5,
+    }),
+  ],
+  providers: [EncryptionService, OpenClawProviderFactory],
+})
+export class ProvidersModule implements OnModuleInit {
+  private readonly logger = new Logger(ProvidersModule.name);
+
+  constructor(
+    private readonly prisma: PrismaService,
+    private readonly registry: AgentProviderRegistry,
+    private readonly openClawProviderFactory: OpenClawProviderFactory
+  ) {}
+
+  async onModuleInit(): Promise<void> {
+    const configs = await this.prisma.agentProviderConfig.findMany({
+      where: {
+        provider: OPENCLAW_PROVIDER_TYPE,
+        isActive: true,
+      },
+      orderBy: [{ createdAt: "asc" }, { id: "asc" }],
+    });
+
+    for (const config of configs) {
+      await this.registerProvider(config);
+    }
+  }
+
+  private async registerProvider(config: AgentProviderConfig): Promise<void> {
+    const provider = this.openClawProviderFactory.createProvider(config);
+
+    try {
+      provider.validateBaseUrl();
+    } catch (error) {
+      this.logger.warn(
+        `Skipping OpenClaw provider ${config.name}: invalid configuration (${this.toErrorMessage(error)})`
+      );
+      return;
+    }
+
+    try {
+      provider.validateToken();
+    } catch (error) {
+      this.logger.error(
+        `Skipping OpenClaw provider ${config.name}: token decryption failed (${this.toErrorMessage(error)})`
+      );
+      return;
+    }
+
+    try {
+      const available = await provider.isAvailable();
+      if (!available) {
+        this.logger.warn(
+          `Skipping OpenClaw provider ${config.name}: gateway ${config.gatewayUrl} is unreachable`
+        );
+        return;
+      }
+    } catch (error) {
+      this.logger.warn(
+        `Skipping OpenClaw provider ${config.name}: gateway ${config.gatewayUrl} is unreachable (${this.toErrorMessage(error)})`
+      );
+      return;
+    }
+
+    this.registry.registerProvider(provider);
+    this.logger.log(`Registered OpenClaw provider ${provider.providerId}`);
+  }
+
+  private toErrorMessage(error: unknown): string {
+    if (error instanceof Error) {
+      return error.message;
+    }
+
+    return String(error);
+  }
+}

apps/orchestrator/src/app.module.ts

@@ -7,6 +7,7 @@ import { AgentsModule } from "./api/agents/agents.module";
 import { MissionControlModule } from "./api/mission-control/mission-control.module";
 import { QueueApiModule } from "./api/queue/queue-api.module";
 import { AgentProvidersModule } from "./api/agent-providers/agent-providers.module";
+import { ProvidersModule } from "./api/providers/providers.module";
 import { CoordinatorModule } from "./coordinator/coordinator.module";
 import { BudgetModule } from "./budget/budget.module";
 import { CIModule } from "./ci";
@@ -54,6 +55,7 @@ import { orchestratorConfig } from "./config/orchestrator.config";
     HealthModule,
     AgentsModule,
     AgentProvidersModule,
+    ProvidersModule,
     MissionControlModule,
     QueueApiModule,
     CoordinatorModule,

apps/orchestrator/src/security/encryption.service.ts

@@ -0,0 +1,85 @@
+import { Injectable } from "@nestjs/common";
+import { ConfigService } from "@nestjs/config";
+import { createDecipheriv, hkdfSync } from "node:crypto";
+
+const ALGORITHM = "aes-256-gcm";
+const ENCRYPTED_PREFIX = "enc:";
+const IV_LENGTH = 12;
+const AUTH_TAG_LENGTH = 16;
+const DERIVED_KEY_LENGTH = 32;
+const HKDF_SALT = "mosaic.crypto.v1";
+const HKDF_INFO = "mosaic-db-secret-encryption";
+
+@Injectable()
+export class EncryptionService {
+  private key: Buffer | null = null;
+
+  constructor(private readonly configService: ConfigService) {}
+
+  decryptIfNeeded(value: string): string {
+    if (!this.isEncrypted(value)) {
+      return value;
+    }
+
+    return this.decrypt(value);
+  }
+
+  decrypt(encrypted: string): string {
+    if (!this.isEncrypted(encrypted)) {
+      throw new Error("Value is not encrypted");
+    }
+
+    const payloadBase64 = encrypted.slice(ENCRYPTED_PREFIX.length);
+
+    try {
+      const payload = Buffer.from(payloadBase64, "base64");
+      if (payload.length < IV_LENGTH + AUTH_TAG_LENGTH) {
+        throw new Error("Encrypted payload is too short");
+      }
+
+      const iv = payload.subarray(0, IV_LENGTH);
+      const authTag = payload.subarray(payload.length - AUTH_TAG_LENGTH);
+      const ciphertext = payload.subarray(IV_LENGTH, payload.length - AUTH_TAG_LENGTH);
+
+      const decipher = createDecipheriv(ALGORITHM, this.getOrCreateKey(), iv);
+      decipher.setAuthTag(authTag);
+
+      return Buffer.concat([decipher.update(ciphertext), decipher.final()]).toString("utf8");
+    } catch {
+      throw new Error("Failed to decrypt value");
+    }
+  }
+
+  isEncrypted(value: string): boolean {
+    return value.startsWith(ENCRYPTED_PREFIX);
+  }
+
+  private getOrCreateKey(): Buffer {
+    if (this.key !== null) {
+      return this.key;
+    }
+
+    const secret = this.configService.get<string>("MOSAIC_SECRET_KEY");
+    if (!secret) {
+      throw new Error(
+        "orchestrator: MOSAIC_SECRET_KEY is required. Set it in your config or via MOSAIC_SECRET_KEY."
+      );
+    }
+
+    if (secret.length < 32) {
+      throw new Error("MOSAIC_SECRET_KEY must be at least 32 characters");
+    }
+
+    this.key = Buffer.from(
+      hkdfSync(
+        "sha256",
+        Buffer.from(secret, "utf8"),
+        Buffer.from(HKDF_SALT, "utf8"),
+        Buffer.from(HKDF_INFO, "utf8"),
+        DERIVED_KEY_LENGTH
+      )
+    );
+
+    return this.key;
+  }
+}

apps/web/src/app/(authenticated)/settings/agent-providers/page.tsx

@@ -0,0 +1,528 @@
+"use client";
+
+import {
+  useCallback,
+  useEffect,
+  useState,
+  type ChangeEvent,
+  type ReactElement,
+  type SyntheticEvent,
+} from "react";
+import { Pencil, Trash2 } from "lucide-react";
+import { FleetSettingsNav } from "@/components/settings/FleetSettingsNav";
+import {
+  createAgentProvider,
+  deleteAgentProvider,
+  fetchAgentProviders,
+  updateAgentProvider,
+  type AgentProviderConfig,
+  type CreateAgentProviderRequest,
+  type UpdateAgentProviderRequest,
+} from "@/lib/api/agent-providers";
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select";
+import { Switch } from "@/components/ui/switch";
+
+interface ProviderFormData {
+  name: string;
+  provider: "openclaw";
+  gatewayUrl: string;
+  apiToken: string;
+  isActive: boolean;
+}
+
+const NAME_PATTERN = /^[a-zA-Z0-9-]+$/;
+
+const INITIAL_FORM: ProviderFormData = {
+  name: "",
+  provider: "openclaw",
+  gatewayUrl: "",
+  apiToken: "",
+  isActive: true,
+};
+
+function getErrorMessage(error: unknown, fallback: string): string {
+  if (error instanceof Error && error.message.trim().length > 0) {
+    return error.message;
+  }
+
+  return fallback;
+}
+
+function isValidHttpsUrl(value: string): boolean {
+  try {
+    const parsed = new URL(value);
+    return parsed.protocol === "https:";
+  } catch {
+    return false;
+  }
+}
+
+function formatCreatedDate(value: string): string {
+  const parsed = new Date(value);
+  if (Number.isNaN(parsed.getTime())) {
+    return "Unknown";
+  }
+
+  return new Intl.DateTimeFormat(undefined, {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+  }).format(parsed);
+}
+
+function validateForm(form: ProviderFormData, isEditing: boolean): string | null {
+  const name = form.name.trim();
+  if (name.length === 0) {
+    return "Name is required.";
+  }
+
+  if (!NAME_PATTERN.test(name)) {
+    return "Name must contain only letters, numbers, and hyphens.";
+  }
+
+  const gatewayUrl = form.gatewayUrl.trim();
+  if (gatewayUrl.length === 0) {
+    return "Gateway URL is required.";
+  }
+
+  if (!isValidHttpsUrl(gatewayUrl)) {
+    return "Gateway URL must be a valid https:// URL.";
+  }
+
+  if (!isEditing && form.apiToken.trim().length === 0) {
+    return "API token is required when creating a provider.";
+  }
+
+  return null;
+}
+
+export default function AgentProvidersSettingsPage(): ReactElement {
+  const [providers, setProviders] = useState<AgentProviderConfig[]>([]);
+  const [isLoading, setIsLoading] = useState<boolean>(true);
+  const [isRefreshing, setIsRefreshing] = useState<boolean>(false);
+  const [error, setError] = useState<string | null>(null);
+  const [successMessage, setSuccessMessage] = useState<string | null>(null);
+
+  const [isDialogOpen, setIsDialogOpen] = useState<boolean>(false);
+  const [editingProvider, setEditingProvider] = useState<AgentProviderConfig | null>(null);
+  const [form, setForm] = useState<ProviderFormData>(INITIAL_FORM);
+  const [formError, setFormError] = useState<string | null>(null);
+  const [isSaving, setIsSaving] = useState<boolean>(false);
+
+  const [deleteTarget, setDeleteTarget] = useState<AgentProviderConfig | null>(null);
+  const [isDeleting, setIsDeleting] = useState<boolean>(false);
+
+  const loadProviders = useCallback(async (showLoadingState: boolean): Promise<void> => {
+    if (showLoadingState) {
+      setIsLoading(true);
+    } else {
+      setIsRefreshing(true);
+    }
+
+    try {
+      const data = await fetchAgentProviders();
+      setProviders(data);
+      setError(null);
+    } catch (loadError: unknown) {
+      setError(getErrorMessage(loadError, "Failed to load agent providers."));
+    } finally {
+      setIsLoading(false);
+      setIsRefreshing(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    void loadProviders(true);
+  }, [loadProviders]);
+
+  function openCreateDialog(): void {
+    setEditingProvider(null);
+    setForm(INITIAL_FORM);
+    setFormError(null);
+    setIsDialogOpen(true);
+  }
+
+  function openEditDialog(provider: AgentProviderConfig): void {
+    setEditingProvider(provider);
+    setForm({
+      name: provider.name,
+      provider: "openclaw",
+      gatewayUrl: provider.gatewayUrl,
+      apiToken: "",
+      isActive: provider.isActive,
+    });
+    setFormError(null);
+    setIsDialogOpen(true);
+  }
+
+  function closeDialog(): void {
+    if (isSaving) {
+      return;
+    }
+
+    setIsDialogOpen(false);
+    setEditingProvider(null);
+    setForm(INITIAL_FORM);
+    setFormError(null);
+  }
+
+  async function handleSubmit(event: SyntheticEvent): Promise<void> {
+    event.preventDefault();
+    setFormError(null);
+    setSuccessMessage(null);
+
+    const validationError = validateForm(form, editingProvider !== null);
+    if (validationError !== null) {
+      setFormError(validationError);
+      return;
+    }
+
+    const name = form.name.trim();
+    const gatewayUrl = form.gatewayUrl.trim();
+    const apiToken = form.apiToken.trim();
+
+    try {
+      setIsSaving(true);
+
+      if (editingProvider) {
+        const updatePayload: UpdateAgentProviderRequest = {
+          name,
+          provider: form.provider,
+          gatewayUrl,
+          isActive: form.isActive,
+        };
+
+        if (apiToken.length > 0) {
+          updatePayload.credentials = { apiToken };
+        }
+
+        await updateAgentProvider(editingProvider.id, updatePayload);
+        setSuccessMessage(`Updated provider "${name}".`);
+      } else {
+        const createPayload: CreateAgentProviderRequest = {
+          name,
+          provider: form.provider,
+          gatewayUrl,
+          credentials: { apiToken },
+          isActive: form.isActive,
+        };
+
+        await createAgentProvider(createPayload);
+        setSuccessMessage(`Added provider "${name}".`);
+      }
+
+      setIsDialogOpen(false);
+      setEditingProvider(null);
+      setForm(INITIAL_FORM);
+      await loadProviders(false);
+    } catch (saveError: unknown) {
+      setFormError(getErrorMessage(saveError, "Unable to save agent provider."));
+    } finally {
+      setIsSaving(false);
+    }
+  }
+
+  async function handleDeleteProvider(): Promise<void> {
+    if (!deleteTarget) {
+      return;
+    }
+
+    try {
+      setIsDeleting(true);
+      await deleteAgentProvider(deleteTarget.id);
+      setSuccessMessage(`Deleted provider "${deleteTarget.name}".`);
+      setDeleteTarget(null);
+      await loadProviders(false);
+    } catch (deleteError: unknown) {
+      setError(getErrorMessage(deleteError, "Failed to delete agent provider."));
+    } finally {
+      setIsDeleting(false);
+    }
+  }
+
+  return (
+    <div className="max-w-6xl mx-auto p-6 space-y-6">
+      <div className="space-y-4">
+        <div>
+          <h1 className="text-3xl font-bold">Agent Providers</h1>
+          <p className="text-muted-foreground mt-1">
+            Register OpenClaw gateways and API tokens used for external agent sessions.
+          </p>
+        </div>
+        <FleetSettingsNav />
+      </div>
+
+      <Card>
+        <CardHeader className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+          <div>
+            <CardTitle>OpenClaw Gateways</CardTitle>
+            <CardDescription>
+              Add one or more OpenClaw gateway endpoints and control which ones are active.
+            </CardDescription>
+          </div>
+          <div className="flex items-center gap-2">
+            <Button
+              variant="outline"
+              onClick={() => {
+                void loadProviders(false);
+              }}
+              disabled={isLoading || isRefreshing}
+            >
+              {isRefreshing ? "Refreshing..." : "Refresh"}
+            </Button>
+            <Button onClick={openCreateDialog}>Add Provider</Button>
+          </div>
+        </CardHeader>
+
+        <CardContent className="space-y-3">
+          {error ? (
+            <p className="text-sm text-destructive" role="alert">
+              {error}
+            </p>
+          ) : null}
+
+          {successMessage ? <p className="text-sm text-emerald-600">{successMessage}</p> : null}
+
+          {isLoading ? (
+            <p className="text-sm text-muted-foreground">Loading agent providers...</p>
+          ) : providers.length === 0 ? (
+            <p className="text-sm text-muted-foreground">
+              No agent providers configured yet. Add one to register an OpenClaw gateway.
+            </p>
+          ) : (
+            providers.map((provider) => (
+              <div
+                key={provider.id}
+                className="rounded-lg border p-4 flex flex-col gap-4 md:flex-row md:items-start md:justify-between"
+              >
+                <div className="space-y-2 min-w-0">
+                  <div className="flex items-center gap-2 flex-wrap">
+                    <p className="font-semibold truncate">{provider.name}</p>
+                    <Badge variant={provider.isActive ? "default" : "secondary"}>
+                      {provider.isActive ? "Active" : "Inactive"}
+                    </Badge>
+                    <Badge variant="outline">{provider.provider}</Badge>
+                  </div>
+                  <p className="text-sm text-muted-foreground break-all">
+                    Gateway URL: {provider.gatewayUrl}
+                  </p>
+                  <p className="text-sm text-muted-foreground">
+                    Created: {formatCreatedDate(provider.createdAt)}
+                  </p>
+                </div>
+
+                <div className="flex items-center gap-2">
+                  <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => {
+                      openEditDialog(provider);
+                    }}
+                  >
+                    <Pencil className="h-4 w-4 mr-2" />
+                    Edit
+                  </Button>
+                  <Button
+                    variant="destructive"
+                    size="sm"
+                    onClick={() => {
+                      setDeleteTarget(provider);
+                    }}
+                  >
+                    <Trash2 className="h-4 w-4 mr-2" />
+                    Delete
+                  </Button>
+                </div>
+              </div>
+            ))
+          )}
+        </CardContent>
+      </Card>
+
+      <Dialog
+        open={isDialogOpen}
+        onOpenChange={(nextOpen) => {
+          if (!nextOpen) {
+            closeDialog();
+            return;
+          }
+
+          setIsDialogOpen(true);
+        }}
+      >
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>
+              {editingProvider ? "Edit Agent Provider" : "Add Agent Provider"}
+            </DialogTitle>
+            <DialogDescription>
+              Configure an OpenClaw gateway URL and API token for agent provider registration.
+            </DialogDescription>
+          </DialogHeader>
+
+          <form onSubmit={(event) => void handleSubmit(event)} className="space-y-4">
+            <div className="space-y-2">
+              <Label htmlFor="agent-provider-name">Name</Label>
+              <Input
+                id="agent-provider-name"
+                value={form.name}
+                onChange={(event: ChangeEvent<HTMLInputElement>) => {
+                  setForm((previous) => ({ ...previous, name: event.target.value }));
+                }}
+                placeholder="openclaw-primary"
+                maxLength={100}
+                disabled={isSaving}
+                required
+              />
+              <p className="text-xs text-muted-foreground">
+                Use letters, numbers, and hyphens only.
+              </p>
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="agent-provider-type">Provider Type</Label>
+              <Select
+                value={form.provider}
+                onValueChange={(value) => {
+                  if (value === "openclaw") {
+                    setForm((previous) => ({ ...previous, provider: value }));
+                  }
+                }}
+                disabled={isSaving}
+              >
+                <SelectTrigger id="agent-provider-type">
+                  <SelectValue placeholder="Select provider type" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="openclaw">openclaw</SelectItem>
+                </SelectContent>
+              </Select>
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="agent-provider-gateway-url">Gateway URL</Label>
+              <Input
+                id="agent-provider-gateway-url"
+                value={form.gatewayUrl}
+                onChange={(event: ChangeEvent<HTMLInputElement>) => {
+                  setForm((previous) => ({ ...previous, gatewayUrl: event.target.value }));
+                }}
+                placeholder="https://my-openclaw.example.com"
+                disabled={isSaving}
+                required
+              />
+            </div>
+
+            <div className="space-y-2">
+              <Label htmlFor="agent-provider-api-token">API Token</Label>
+              <Input
+                id="agent-provider-api-token"
+                type="password"
+                value={form.apiToken}
+                onChange={(event: ChangeEvent<HTMLInputElement>) => {
+                  setForm((previous) => ({ ...previous, apiToken: event.target.value }));
+                }}
+                placeholder={
+                  editingProvider ? "Leave blank to keep existing token" : "Enter API token"
+                }
+                autoComplete="new-password"
+                disabled={isSaving}
+              />
+              <p className="text-xs text-muted-foreground">
+                {editingProvider
+                  ? "Leave blank to keep the currently stored token."
+                  : "Required when creating a provider."}
+              </p>
+            </div>
+
+            <div className="flex items-center justify-between rounded-md border px-3 py-2">
+              <div>
+                <Label htmlFor="agent-provider-active">Provider Status</Label>
+                <p className="text-xs text-muted-foreground">
+                  Inactive providers remain saved but are excluded from routing.
+                </p>
+              </div>
+              <Switch
+                id="agent-provider-active"
+                checked={form.isActive}
+                onCheckedChange={(checked) => {
+                  setForm((previous) => ({ ...previous, isActive: checked }));
+                }}
+                disabled={isSaving}
+              />
+            </div>
+
+            {formError ? (
+              <p className="text-sm text-destructive" role="alert">
+                {formError}
+              </p>
+            ) : null}
+
+            <DialogFooter>
+              <Button type="button" variant="outline" onClick={closeDialog} disabled={isSaving}>
+                Cancel
+              </Button>
+              <Button type="submit" disabled={isSaving}>
+                {isSaving ? "Saving..." : editingProvider ? "Save Changes" : "Create Provider"}
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+
+      <AlertDialog
+        open={deleteTarget !== null}
+        onOpenChange={(open) => {
+          if (!open && !isDeleting) {
+            setDeleteTarget(null);
+          }
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete Agent Provider</AlertDialogTitle>
+            <AlertDialogDescription>
+              Delete provider "{deleteTarget?.name}"? This permanently removes its gateway and token
+              configuration.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel disabled={isDeleting}>Cancel</AlertDialogCancel>
+            <AlertDialogAction onClick={handleDeleteProvider} disabled={isDeleting}>
+              {isDeleting ? "Deleting..." : "Delete Provider"}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </div>
+  );
+}

apps/web/src/app/(authenticated)/settings/page.tsx

@@ -227,6 +227,33 @@ const categories: CategoryConfig[] = [
       </svg>
     ),
   },
+  {
+    title: "Agent Providers",
+    description:
+      "Register OpenClaw gateway URLs and API tokens for external agent provider routing.",
+    href: "/settings/agent-providers",
+    accent: "var(--ms-blue-400)",
+    iconBg: "rgba(47, 128, 255, 0.12)",
+    icon: (
+      <svg
+        width="20"
+        height="20"
+        viewBox="0 0 20 20"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        aria-hidden="true"
+      >
+        <path d="M4 6.5h12" />
+        <path d="M6.5 10h7" />
+        <path d="M4 13.5h12" />
+        <circle cx="5.5" cy="10" r="1.5" />
+        <circle cx="14.5" cy="10" r="1.5" />
+      </svg>
+    ),
+  },
   {
     title: "Agent Config",
     description: "Choose primary and fallback models, plus optional personality/SOUL instructions.",

apps/web/src/components/mission-control/__tests__/GlobalAgentRoster.test.tsx

@@ -1,133 +0,0 @@
-import type { ReactElement } from "react";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { render, screen, waitFor } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-import { GlobalAgentRoster } from "../GlobalAgentRoster";
-
-const { mockApiGet, mockApiPost } = vi.hoisted(() => ({
-  mockApiGet: vi.fn(),
-  mockApiPost: vi.fn(),
-}));
-
-vi.mock("@/lib/api/client", () => ({
-  apiGet: mockApiGet,
-  apiPost: mockApiPost,
-}));
-
-function renderWithQueryClient(ui: ReactElement): void {
-  const queryClient = new QueryClient({
-    defaultOptions: {
-      queries: { retry: false, gcTime: 0 },
-      mutations: { retry: false },
-    },
-  });
-
-  render(<QueryClientProvider client={queryClient}>{ui}</QueryClientProvider>);
-}
-
-describe("GlobalAgentRoster (__tests__)", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    vi.stubGlobal("fetch", vi.fn());
-    mockApiGet.mockReset();
-    mockApiPost.mockReset();
-  });
-
-  afterEach(() => {
-    vi.unstubAllGlobals();
-  });
-
-  it("renders empty state when no sessions", async () => {
-    mockApiGet.mockResolvedValueOnce([]);
-
-    renderWithQueryClient(<GlobalAgentRoster />);
-
-    expect(await screen.findByText("No active agents")).toBeInTheDocument();
-  });
-
-  it("renders session rows grouped by provider", async () => {
-    mockApiGet.mockResolvedValueOnce([
-      {
-        id: "sess-int-123456",
-        providerId: "internal",
-        providerType: "internal",
-        status: "active",
-        createdAt: "2026-03-07T19:00:00.000Z",
-        updatedAt: "2026-03-07T19:00:00.000Z",
-      },
-      {
-        id: "sess-rem-654321",
-        providerId: "remote-a",
-        providerType: "remote",
-        status: "paused",
-        createdAt: "2026-03-07T19:00:00.000Z",
-        updatedAt: "2026-03-07T19:00:00.000Z",
-      },
-    ]);
-
-    renderWithQueryClient(<GlobalAgentRoster />);
-
-    expect(await screen.findByText("internal")).toBeInTheDocument();
-    expect(screen.getByText("remote-a (remote)")).toBeInTheDocument();
-    expect(screen.getByText("sess-int")).toBeInTheDocument();
-    expect(screen.getByText("sess-rem")).toBeInTheDocument();
-  });
-
-  it("kill button per row calls the API", async () => {
-    const user = userEvent.setup();
-
-    mockApiGet.mockResolvedValueOnce([
-      {
-        id: "killme123456",
-        providerId: "internal",
-        providerType: "internal",
-        status: "active",
-        createdAt: "2026-03-07T19:00:00.000Z",
-        updatedAt: "2026-03-07T19:00:00.000Z",
-      },
-    ]);
-
-    mockApiPost.mockResolvedValue({ message: "ok" });
-
-    renderWithQueryClient(<GlobalAgentRoster />);
-
-    const killButton = await screen.findByRole("button", { name: "Kill session killme12" });
-    await user.click(killButton);
-
-    await waitFor(() => {
-      expect(mockApiPost).toHaveBeenCalledWith("/api/mission-control/sessions/killme123456/kill", {
-        force: false,
-      });
-    });
-  });
-
-  it("onSelectSession callback fires on row click", async () => {
-    const user = userEvent.setup();
-    const onSelectSession = vi.fn();
-
-    mockApiGet.mockResolvedValueOnce([
-      {
-        id: "selectme123456",
-        providerId: "internal",
-        providerType: "internal",
-        status: "active",
-        createdAt: "2026-03-07T19:00:00.000Z",
-        updatedAt: "2026-03-07T19:00:00.000Z",
-      },
-    ]);
-
-    renderWithQueryClient(<GlobalAgentRoster onSelectSession={onSelectSession} />);
-
-    const sessionLabel = await screen.findByText("selectme");
-    const row = sessionLabel.closest('[role="button"]');
-
-    if (!row) {
-      throw new Error("Expected session row for selectme123456");
-    }
-
-    await user.click(row);
-
-    expect(onSelectSession).toHaveBeenCalledWith("selectme123456");
-  });
-});

apps/web/src/components/mission-control/__tests__/KillAllDialog.test.tsx

@@ -1,96 +0,0 @@
-import { render, screen, waitFor } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { beforeEach, describe, expect, it, vi } from "vitest";
-import type { AgentSession } from "@mosaic/shared";
-import { KillAllDialog } from "../KillAllDialog";
-import * as apiClient from "@/lib/api/client";
-
-vi.mock("@/lib/api/client", () => ({
-  apiPost: vi.fn(),
-}));
-
-const mockApiPost = vi.mocked(apiClient.apiPost);
-const baseDate = new Date("2026-03-07T14:00:00.000Z");
-
-const sessions: AgentSession[] = [
-  {
-    id: "session-internal-1",
-    providerId: "provider-internal-1",
-    providerType: "internal",
-    status: "active",
-    createdAt: baseDate,
-    updatedAt: baseDate,
-  },
-  {
-    id: "session-internal-2",
-    providerId: "provider-internal-2",
-    providerType: "internal",
-    status: "paused",
-    createdAt: baseDate,
-    updatedAt: baseDate,
-  },
-  {
-    id: "session-external-1",
-    providerId: "provider-openclaw-1",
-    providerType: "openclaw",
-    status: "active",
-    createdAt: baseDate,
-    updatedAt: baseDate,
-  },
-];
-
-describe("KillAllDialog (__tests__)", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    vi.stubGlobal("fetch", vi.fn());
-    mockApiPost.mockResolvedValue({ message: "killed" } as never);
-  });
-
-  it('Confirm button disabled until "KILL ALL" typed exactly', async () => {
-    const user = userEvent.setup();
-
-    render(<KillAllDialog sessions={sessions} />);
-
-    await user.click(screen.getByRole("button", { name: "Kill All" }));
-
-    const input = screen.getByLabelText("Type KILL ALL to confirm");
-    const confirmButton = screen.getByRole("button", { name: "Kill All Agents" });
-
-    expect(confirmButton).toBeDisabled();
-
-    await user.type(input, "kill all");
-    expect(confirmButton).toBeDisabled();
-
-    await user.clear(input);
-    await user.type(input, "KILL ALL");
-    expect(confirmButton).toBeEnabled();
-  });
-
-  it("fires kill API for each session on confirm", async () => {
-    const user = userEvent.setup();
-
-    render(<KillAllDialog sessions={sessions} />);
-
-    await user.click(screen.getByRole("button", { name: "Kill All" }));
-    await user.click(screen.getByLabelText("All providers (3)"));
-    await user.type(screen.getByLabelText("Type KILL ALL to confirm"), "KILL ALL");
-    await user.click(screen.getByRole("button", { name: "Kill All Agents" }));
-
-    await waitFor(() => {
-      expect(mockApiPost).toHaveBeenCalledTimes(3);
-    });
-
-    expect(mockApiPost).toHaveBeenCalledWith(
-      "/api/mission-control/sessions/session-internal-1/kill",
-      { force: true }
-    );
-    expect(mockApiPost).toHaveBeenCalledWith(
-      "/api/mission-control/sessions/session-internal-2/kill",
-      { force: true }
-    );
-    expect(mockApiPost).toHaveBeenCalledWith(
-      "/api/mission-control/sessions/session-external-1/kill",
-      { force: true }
-    );
-  });
-});

apps/web/src/components/mission-control/__tests__/OrchestratorPanel.test.tsx

@@ -1,93 +0,0 @@
-import { render, screen } from "@testing-library/react";
-import { beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
-import { OrchestratorPanel } from "../OrchestratorPanel";
-import * as missionControlHooks from "@/hooks/useMissionControl";
-
-vi.mock("@/hooks/useMissionControl", () => ({
-  useSessionStream: vi.fn(),
-  useSessions: vi.fn(),
-}));
-
-vi.mock("@/components/mission-control/PanelControls", () => ({
-  PanelControls: (): React.JSX.Element => <div data-testid="panel-controls" />,
-}));
-
-vi.mock("@/components/mission-control/BargeInInput", () => ({
-  BargeInInput: ({ sessionId }: { sessionId: string }): React.JSX.Element => (
-    <div data-testid="barge-in-input">barge-in:{sessionId}</div>
-  ),
-}));
-
-vi.mock("date-fns", () => ({
-  formatDistanceToNow: (): string => "moments ago",
-}));
-
-const mockUseSessionStream = vi.mocked(missionControlHooks.useSessionStream);
-const mockUseSessions = vi.mocked(missionControlHooks.useSessions);
-
-beforeAll(() => {
-  Object.defineProperty(window.HTMLElement.prototype, "scrollIntoView", {
-    configurable: true,
-    value: vi.fn(),
-  });
-});
-
-describe("OrchestratorPanel (__tests__)", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-
-    mockUseSessionStream.mockReturnValue({
-      messages: [],
-      status: "connected",
-      error: null,
-    });
-
-    mockUseSessions.mockReturnValue({
-      sessions: [],
-      loading: false,
-      error: null,
-    });
-  });
-
-  it("renders empty state when no sessionId", () => {
-    render(<OrchestratorPanel />);
-
-    expect(screen.getByText("Select an agent to view its stream")).toBeInTheDocument();
-  });
-
-  it("renders connection indicator", () => {
-    const { container } = render(<OrchestratorPanel sessionId="session-1" />);
-
-    expect(screen.getByText("Connected")).toBeInTheDocument();
-    expect(container.querySelector(".bg-emerald-500")).toBeInTheDocument();
-  });
-
-  it("renders message list when messages are present", () => {
-    mockUseSessionStream.mockReturnValue({
-      messages: [
-        {
-          id: "msg-1",
-          sessionId: "session-1",
-          role: "assistant",
-          content: "Mission update one",
-          timestamp: "2026-03-07T21:00:00.000Z",
-        },
-        {
-          id: "msg-2",
-          sessionId: "session-1",
-          role: "tool",
-          content: "Mission update two",
-          timestamp: "2026-03-07T21:00:01.000Z",
-        },
-      ],
-      status: "connected",
-      error: null,
-    });
-
-    render(<OrchestratorPanel sessionId="session-1" />);
-
-    expect(screen.getByText("Mission update one")).toBeInTheDocument();
-    expect(screen.getByText("Mission update two")).toBeInTheDocument();
-    expect(screen.queryByText("Waiting for messages...")).not.toBeInTheDocument();
-  });
-});

apps/web/src/components/mission-control/__tests__/PanelControls.test.tsx

@@ -1,70 +0,0 @@
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { render, screen, waitFor } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-import { PanelControls } from "../PanelControls";
-import * as apiClient from "@/lib/api/client";
-
-vi.mock("@/lib/api/client", () => ({
-  apiPost: vi.fn(),
-}));
-
-const mockApiPost = vi.mocked(apiClient.apiPost);
-
-function renderPanelControls(status: string): void {
-  const queryClient = new QueryClient({
-    defaultOptions: {
-      queries: { retry: false },
-      mutations: { retry: false },
-    },
-  });
-
-  render(
-    <QueryClientProvider client={queryClient}>
-      <PanelControls sessionId="session-1" status={status} />
-    </QueryClientProvider>
-  );
-}
-
-describe("PanelControls (__tests__)", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    vi.stubGlobal("fetch", vi.fn());
-    mockApiPost.mockResolvedValue({ message: "ok" } as never);
-  });
-
-  afterEach(() => {
-    vi.unstubAllGlobals();
-  });
-
-  it("Pause button disabled when status=paused", () => {
-    renderPanelControls("paused");
-
-    expect(screen.getByRole("button", { name: "Pause session" })).toBeDisabled();
-  });
-
-  it("Resume button disabled when status=active", () => {
-    renderPanelControls("active");
-
-    expect(screen.getByRole("button", { name: "Resume session" })).toBeDisabled();
-  });
-
-  it("Kill buttons disabled when status=killed", () => {
-    renderPanelControls("killed");
-
-    expect(screen.getByRole("button", { name: "Gracefully kill session" })).toBeDisabled();
-    expect(screen.getByRole("button", { name: "Force kill session" })).toBeDisabled();
-  });
-
-  it("clicking pause calls the API", async () => {
-    const user = userEvent.setup();
-
-    renderPanelControls("active");
-
-    await user.click(screen.getByRole("button", { name: "Pause session" }));
-
-    await waitFor(() => {
-      expect(mockApiPost).toHaveBeenCalledWith("/api/mission-control/sessions/session-1/pause");
-    });
-  });
-});

apps/web/src/components/mission-control/__tests__/mission-control-phase2.gate.test.tsx

@@ -1,34 +0,0 @@
-import type { ReactNode } from "react";
-import { render, screen } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
-import { MissionControlLayout } from "../MissionControlLayout";
-
-vi.mock("@/components/mission-control/AuditLogDrawer", () => ({
-  AuditLogDrawer: ({ trigger }: { trigger: ReactNode }): React.JSX.Element => (
-    <div data-testid="audit-log-drawer">{trigger}</div>
-  ),
-}));
-
-vi.mock("@/components/mission-control/GlobalAgentRoster", () => ({
-  GlobalAgentRoster: (): React.JSX.Element => <div data-testid="global-agent-roster" />,
-}));
-
-vi.mock("@/components/mission-control/MissionControlPanel", () => ({
-  MissionControlPanel: (): React.JSX.Element => <div data-testid="mission-control-panel" />,
-  MIN_PANEL_COUNT: 1,
-  MAX_PANEL_COUNT: 6,
-}));
-
-describe("Mission Control Phase 2 Gate", () => {
-  it("Phase 2 gate: MissionControlLayout renders with all components present", () => {
-    const consoleErrorSpy = vi.spyOn(console, "error").mockImplementation((..._args) => undefined);
-
-    render(<MissionControlLayout />);
-
-    expect(screen.getByTestId("global-agent-roster")).toBeInTheDocument();
-    expect(screen.getByTestId("mission-control-panel")).toBeInTheDocument();
-    expect(consoleErrorSpy).not.toHaveBeenCalled();
-
-    consoleErrorSpy.mockRestore();
-  });
-});

apps/web/src/components/settings/FleetSettingsNav.tsx

@@ -11,6 +11,7 @@ interface FleetSettingsLink {
 
 const FLEET_SETTINGS_LINKS: FleetSettingsLink[] = [
   { href: "/settings/providers", label: "Providers" },
+  { href: "/settings/agent-providers", label: "Agent Providers" },
   { href: "/settings/agent-config", label: "Agent Config" },
   { href: "/settings/auth", label: "Authentication" },
 ];

apps/web/src/lib/api/agent-providers.test.ts

@@ -0,0 +1,79 @@
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import * as client from "./client";
+import {
+  createAgentProvider,
+  deleteAgentProvider,
+  fetchAgentProviders,
+  updateAgentProvider,
+} from "./agent-providers";
+
+vi.mock("./client");
+
+beforeEach((): void => {
+  vi.clearAllMocks();
+});
+
+describe("fetchAgentProviders", (): void => {
+  it("calls provider list endpoint", async (): Promise<void> => {
+    vi.mocked(client.apiGet).mockResolvedValueOnce([] as never);
+
+    await fetchAgentProviders();
+
+    expect(client.apiGet).toHaveBeenCalledWith("/api/agent-providers");
+  });
+});
+
+describe("createAgentProvider", (): void => {
+  it("posts create payload", async (): Promise<void> => {
+    vi.mocked(client.apiPost).mockResolvedValueOnce({ id: "provider-1" } as never);
+
+    await createAgentProvider({
+      name: "openclaw-primary",
+      provider: "openclaw",
+      gatewayUrl: "https://openclaw.example.com",
+      credentials: {
+        apiToken: "top-secret",
+      },
+      isActive: true,
+    });
+
+    expect(client.apiPost).toHaveBeenCalledWith("/api/agent-providers", {
+      name: "openclaw-primary",
+      provider: "openclaw",
+      gatewayUrl: "https://openclaw.example.com",
+      credentials: {
+        apiToken: "top-secret",
+      },
+      isActive: true,
+    });
+  });
+});
+
+describe("updateAgentProvider", (): void => {
+  it("sends PUT request with update payload", async (): Promise<void> => {
+    vi.mocked(client.apiRequest).mockResolvedValueOnce({ id: "provider-1" } as never);
+
+    await updateAgentProvider("provider-1", {
+      gatewayUrl: "https://new-openclaw.example.com",
+      isActive: false,
+    });
+
+    expect(client.apiRequest).toHaveBeenCalledWith("/api/agent-providers/provider-1", {
+      method: "PUT",
+      body: JSON.stringify({
+        gatewayUrl: "https://new-openclaw.example.com",
+        isActive: false,
+      }),
+    });
+  });
+});
+
+describe("deleteAgentProvider", (): void => {
+  it("calls delete endpoint", async (): Promise<void> => {
+    vi.mocked(client.apiDelete).mockResolvedValueOnce(undefined as never);
+
+    await deleteAgentProvider("provider-1");
+
+    expect(client.apiDelete).toHaveBeenCalledWith("/api/agent-providers/provider-1");
+  });
+});

apps/web/src/lib/api/agent-providers.ts

@@ -0,0 +1,61 @@
+import { apiDelete, apiGet, apiPost, apiRequest } from "./client";
+
+export type AgentProviderType = "openclaw";
+
+export interface AgentProviderCredentials {
+  apiToken?: string;
+}
+
+export interface AgentProviderConfig {
+  id: string;
+  workspaceId: string;
+  name: string;
+  provider: AgentProviderType;
+  gatewayUrl: string;
+  credentials: AgentProviderCredentials | null;
+  isActive: boolean;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface CreateAgentProviderRequest {
+  name: string;
+  provider: AgentProviderType;
+  gatewayUrl: string;
+  credentials: {
+    apiToken: string;
+  };
+  isActive: boolean;
+}
+
+export interface UpdateAgentProviderRequest {
+  name?: string;
+  provider?: AgentProviderType;
+  gatewayUrl?: string;
+  credentials?: AgentProviderCredentials;
+  isActive?: boolean;
+}
+
+export async function fetchAgentProviders(): Promise<AgentProviderConfig[]> {
+  return apiGet<AgentProviderConfig[]>("/api/agent-providers");
+}
+
+export async function createAgentProvider(
+  data: CreateAgentProviderRequest
+): Promise<AgentProviderConfig> {
+  return apiPost<AgentProviderConfig>("/api/agent-providers", data);
+}
+
+export async function updateAgentProvider(
+  providerId: string,
+  data: UpdateAgentProviderRequest
+): Promise<AgentProviderConfig> {
+  return apiRequest<AgentProviderConfig>(`/api/agent-providers/${providerId}`, {
+    method: "PUT",
+    body: JSON.stringify(data),
+  });
+}
+
+export async function deleteAgentProvider(providerId: string): Promise<void> {
+  await apiDelete<unknown>(`/api/agent-providers/${providerId}`);
+}

apps/web/src/lib/api/index.ts

@@ -18,4 +18,5 @@ export * from "./projects";
 export * from "./workspaces";
 export * from "./admin";
 export * from "./fleet-settings";
+export * from "./agent-providers";
 export * from "./activity";

pnpm-lock.yaml

@@ -319,6 +319,9 @@ importers:
       '@mosaic/shared':
         specifier: workspace:*
         version: link:../../packages/shared
+      '@nestjs/axios':
+        specifier: ^4.0.1
+        version: 4.0.1(@nestjs/common@11.1.12(class-transformer@0.5.1)(class-validator@0.14.3)(reflect-metadata@0.2.2)(rxjs@7.8.2))(axios@1.13.5)(rxjs@7.8.2)
       '@nestjs/bullmq':
         specifier: ^11.0.4
         version: 11.0.4(@nestjs/common@11.1.12(class-transformer@0.5.1)(class-validator@0.14.3)(reflect-metadata@0.2.2)(rxjs@7.8.2))(@nestjs/core@11.1.12)(bullmq@5.67.2)