Compare commits

...

17 Commits

Author SHA1 Message Date
75d46d4e82 fix: add SYSTEM_ADMIN_IDS env var to compose file 2026-03-01 14:28:30 -06:00
c23c33b0c5 fix(api): use TRUSTED_ORIGINS for socket.io gateway CORS (#628)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 20:13:13 +00:00
c5253e9d62 feat(web): add project detail page (#627)
Some checks failed
ci/woodpecker/push/ci Pipeline failed
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 20:09:52 +00:00
e898551814 fix(web): correct Add Provider form to match fleet-settings DTO (#626)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 20:00:50 +00:00
3607554902 fix(api): MS22 Phase 1 post-coding audit (#625)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 19:53:49 +00:00
a25a77a43c fix(api): widget throttling and orchestrator endpoints (#624)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 19:22:20 +00:00
861eff4686 fix(web): correct Add Provider form DTO field mapping (#623)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 19:19:04 +00:00
99a4567e32 fix(api): skip CSRF for Bearer-authenticated API clients (#622)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 19:06:14 +00:00
559c6b3831 fix(api): add AuthModule to FleetSettingsModule and ChatProxyModule (#621)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 18:06:49 +00:00
631e5010b5 fix(api): add ConfigModule to ContainerLifecycleModule imports (#620)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 17:52:10 +00:00
09e377ecd7 fix(deploy): add MOSAIC_SECRET_KEY + docker socket to api service (MS22) (#619)
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 17:42:29 +00:00
deafcdc84b chore(orchestrator): MS22 Phase 1 complete — all 11 tasks done (#618)
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 16:33:05 +00:00
66d401461c feat(web): fleet settings UI (MS22-P1h) (#617)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 16:22:22 +00:00
01ae164b61 feat(web): onboarding wizard (MS22-P1f) (#616)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 16:07:22 +00:00
029c190c05 feat(api): chat proxy (MS22-P1i) (#615)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 15:59:00 +00:00
477d0c8fdf feat(api): idle container reaper (MS22-P1k) (#614)
All checks were successful
ci/woodpecker/push/ci Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 15:50:34 +00:00
03af39def9 feat(docker): core compose + entrypoint (MS22-P1j) (#613)
All checks were successful
ci/woodpecker/push/infra Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 15:50:33 +00:00
47 changed files with 4667 additions and 33 deletions

View File

@@ -36,6 +36,7 @@
"@nestjs/mapped-types": "^2.1.0", "@nestjs/mapped-types": "^2.1.0",
"@nestjs/platform-express": "^11.1.12", "@nestjs/platform-express": "^11.1.12",
"@nestjs/platform-socket.io": "^11.1.12", "@nestjs/platform-socket.io": "^11.1.12",
"@nestjs/schedule": "^6.1.1",
"@nestjs/throttler": "^6.5.0", "@nestjs/throttler": "^6.5.0",
"@nestjs/websockets": "^11.1.12", "@nestjs/websockets": "^11.1.12",
"@opentelemetry/api": "^1.9.0", "@opentelemetry/api": "^1.9.0",

View File

@@ -1,6 +1,6 @@
import { Injectable, NotFoundException } from "@nestjs/common"; import { Injectable, NotFoundException } from "@nestjs/common";
import type { LlmProvider } from "@prisma/client"; import type { LlmProvider } from "@prisma/client";
import { timingSafeEqual } from "node:crypto"; import { createHash, timingSafeEqual } from "node:crypto";
import { PrismaService } from "../prisma/prisma.service"; import { PrismaService } from "../prisma/prisma.service";
import { CryptoService } from "../crypto/crypto.service"; import { CryptoService } from "../crypto/crypto.service";
@@ -143,21 +143,23 @@ export class AgentConfigService {
}), }),
]); ]);
let match: ContainerTokenValidation | null = null;
for (const container of userContainers) { for (const container of userContainers) {
const storedToken = this.decryptContainerToken(container.gatewayToken); const storedToken = this.decryptContainerToken(container.gatewayToken);
if (storedToken && this.tokensEqual(storedToken, token)) { if (!match && storedToken && this.tokensEqual(storedToken, token)) {
return { type: "user", id: container.id }; match = { type: "user", id: container.id };
} }
} }
for (const container of systemContainers) { for (const container of systemContainers) {
const storedToken = this.decryptContainerToken(container.gatewayToken); const storedToken = this.decryptContainerToken(container.gatewayToken);
if (storedToken && this.tokensEqual(storedToken, token)) { if (!match && storedToken && this.tokensEqual(storedToken, token)) {
return { type: "system", id: container.id }; match = { type: "system", id: container.id };
} }
} }
return null; return match;
} }
private buildOpenClawConfig( private buildOpenClawConfig(
@@ -268,14 +270,9 @@ export class AgentConfigService {
} }
private tokensEqual(left: string, right: string): boolean { private tokensEqual(left: string, right: string): boolean {
const leftBuffer = Buffer.from(left, "utf8"); const leftDigest = createHash("sha256").update(left, "utf8").digest();
const rightBuffer = Buffer.from(right, "utf8"); const rightDigest = createHash("sha256").update(right, "utf8").digest();
return timingSafeEqual(leftDigest, rightDigest);
if (leftBuffer.length !== rightBuffer.length) {
return false;
}
return timingSafeEqual(leftBuffer, rightBuffer);
} }
private hasModelId(modelEntry: unknown): modelEntry is { id: string } { private hasModelId(modelEntry: unknown): modelEntry is { id: string } {

View File

@@ -2,6 +2,7 @@ import { Module } from "@nestjs/common";
import { APP_INTERCEPTOR, APP_GUARD } from "@nestjs/core"; import { APP_INTERCEPTOR, APP_GUARD } from "@nestjs/core";
import { ThrottlerModule } from "@nestjs/throttler"; import { ThrottlerModule } from "@nestjs/throttler";
import { BullModule } from "@nestjs/bullmq"; import { BullModule } from "@nestjs/bullmq";
import { ScheduleModule } from "@nestjs/schedule";
import { ThrottlerValkeyStorageService, ThrottlerApiKeyGuard } from "./common/throttler"; import { ThrottlerValkeyStorageService, ThrottlerApiKeyGuard } from "./common/throttler";
import { CsrfGuard } from "./common/guards/csrf.guard"; import { CsrfGuard } from "./common/guards/csrf.guard";
import { CsrfService } from "./common/services/csrf.service"; import { CsrfService } from "./common/services/csrf.service";
@@ -53,8 +54,11 @@ import { ConversationArchiveModule } from "./conversation-archive/conversation-a
import { RlsContextInterceptor } from "./common/interceptors/rls-context.interceptor"; import { RlsContextInterceptor } from "./common/interceptors/rls-context.interceptor";
import { AgentConfigModule } from "./agent-config/agent-config.module"; import { AgentConfigModule } from "./agent-config/agent-config.module";
import { ContainerLifecycleModule } from "./container-lifecycle/container-lifecycle.module"; import { ContainerLifecycleModule } from "./container-lifecycle/container-lifecycle.module";
import { ContainerReaperModule } from "./container-reaper/container-reaper.module";
import { FleetSettingsModule } from "./fleet-settings/fleet-settings.module"; import { FleetSettingsModule } from "./fleet-settings/fleet-settings.module";
import { OnboardingModule } from "./onboarding/onboarding.module"; import { OnboardingModule } from "./onboarding/onboarding.module";
import { ChatProxyModule } from "./chat-proxy/chat-proxy.module";
import { OrchestratorModule } from "./orchestrator/orchestrator.module";
@Module({ @Module({
imports: [ imports: [
@@ -85,6 +89,7 @@ import { OnboardingModule } from "./onboarding/onboarding.module";
}; };
})(), })(),
}), }),
ScheduleModule.forRoot(),
TelemetryModule, TelemetryModule,
PrismaModule, PrismaModule,
DatabaseModule, DatabaseModule,
@@ -129,8 +134,11 @@ import { OnboardingModule } from "./onboarding/onboarding.module";
ConversationArchiveModule, ConversationArchiveModule,
AgentConfigModule, AgentConfigModule,
ContainerLifecycleModule, ContainerLifecycleModule,
ContainerReaperModule,
FleetSettingsModule, FleetSettingsModule,
OnboardingModule, OnboardingModule,
ChatProxyModule,
OrchestratorModule,
], ],
controllers: [AppController, CsrfController], controllers: [AppController, CsrfController],
providers: [ providers: [

View File

@@ -0,0 +1,102 @@
import {
Body,
Controller,
HttpException,
Logger,
Post,
Req,
Res,
UnauthorizedException,
UseGuards,
} from "@nestjs/common";
import type { Response } from "express";
import { AuthGuard } from "../auth/guards/auth.guard";
import type { MaybeAuthenticatedRequest } from "../auth/types/better-auth-request.interface";
import { ChatStreamDto } from "./chat-proxy.dto";
import { ChatProxyService } from "./chat-proxy.service";
@Controller("chat")
@UseGuards(AuthGuard)
export class ChatProxyController {
private readonly logger = new Logger(ChatProxyController.name);
constructor(private readonly chatProxyService: ChatProxyService) {}
// POST /api/chat/stream
// Request: { messages: Array<{role, content}> }
// Response: SSE stream of chat completion events
@Post("stream")
async streamChat(
@Body() body: ChatStreamDto,
@Req() req: MaybeAuthenticatedRequest,
@Res() res: Response
): Promise<void> {
const userId = req.user?.id;
if (!userId) {
throw new UnauthorizedException("No authenticated user found on request");
}
const abortController = new AbortController();
req.once("close", () => {
abortController.abort();
});
res.setHeader("Content-Type", "text/event-stream");
res.setHeader("Cache-Control", "no-cache");
res.setHeader("Connection", "keep-alive");
res.setHeader("X-Accel-Buffering", "no");
try {
const upstreamResponse = await this.chatProxyService.proxyChat(
userId,
body.messages,
abortController.signal
);
const upstreamContentType = upstreamResponse.headers.get("content-type");
if (upstreamContentType) {
res.setHeader("Content-Type", upstreamContentType);
}
if (!upstreamResponse.body) {
throw new Error("OpenClaw response did not include a stream body");
}
for await (const chunk of upstreamResponse.body as unknown as AsyncIterable<Uint8Array>) {
if (res.writableEnded || res.destroyed) {
break;
}
res.write(Buffer.from(chunk));
}
} catch (error: unknown) {
this.logStreamError(error);
if (!res.writableEnded && !res.destroyed) {
res.write("event: error\n");
res.write(`data: ${JSON.stringify({ error: this.toSafeClientMessage(error) })}\n\n`);
}
} finally {
if (!res.writableEnded && !res.destroyed) {
res.end();
}
}
}
private toSafeClientMessage(error: unknown): string {
if (error instanceof HttpException && error.getStatus() < 500) {
return "Chat request was rejected";
}
return "Chat stream failed";
}
private logStreamError(error: unknown): void {
if (error instanceof Error) {
this.logger.warn(`Chat stream failed: ${error.message}`);
return;
}
this.logger.warn(`Chat stream failed: ${String(error)}`);
}
}

View File

@@ -0,0 +1,25 @@
import { Type } from "class-transformer";
import { ArrayMinSize, IsArray, IsNotEmpty, IsString, ValidateNested } from "class-validator";
export interface ChatMessage {
role: string;
content: string;
}
export class ChatMessageDto implements ChatMessage {
@IsString({ message: "role must be a string" })
@IsNotEmpty({ message: "role is required" })
role!: string;
@IsString({ message: "content must be a string" })
@IsNotEmpty({ message: "content is required" })
content!: string;
}
export class ChatStreamDto {
@IsArray({ message: "messages must be an array" })
@ArrayMinSize(1, { message: "messages must contain at least one message" })
@ValidateNested({ each: true })
@Type(() => ChatMessageDto)
messages!: ChatMessageDto[];
}

View File

@@ -0,0 +1,15 @@
import { Module } from "@nestjs/common";
import { AuthModule } from "../auth/auth.module";
import { AgentConfigModule } from "../agent-config/agent-config.module";
import { ContainerLifecycleModule } from "../container-lifecycle/container-lifecycle.module";
import { PrismaModule } from "../prisma/prisma.module";
import { ChatProxyController } from "./chat-proxy.controller";
import { ChatProxyService } from "./chat-proxy.service";
@Module({
imports: [AuthModule, PrismaModule, ContainerLifecycleModule, AgentConfigModule],
controllers: [ChatProxyController],
providers: [ChatProxyService],
exports: [ChatProxyService],
})
export class ChatProxyModule {}

View File

@@ -0,0 +1,108 @@
import { ServiceUnavailableException } from "@nestjs/common";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import { ChatProxyService } from "./chat-proxy.service";
describe("ChatProxyService", () => {
const userId = "user-123";
const prisma = {
userAgentConfig: {
findUnique: vi.fn(),
},
};
const containerLifecycle = {
ensureRunning: vi.fn(),
touch: vi.fn(),
};
let service: ChatProxyService;
let fetchMock: ReturnType<typeof vi.fn>;
beforeEach(() => {
fetchMock = vi.fn();
vi.stubGlobal("fetch", fetchMock);
service = new ChatProxyService(prisma as never, containerLifecycle as never);
});
afterEach(() => {
vi.unstubAllGlobals();
vi.clearAllMocks();
});
describe("getContainerUrl", () => {
it("calls ensureRunning and touch for the user", async () => {
containerLifecycle.ensureRunning.mockResolvedValue({
url: "http://mosaic-user-user-123:19000",
token: "gateway-token",
});
containerLifecycle.touch.mockResolvedValue(undefined);
const url = await service.getContainerUrl(userId);
expect(url).toBe("http://mosaic-user-user-123:19000");
expect(containerLifecycle.ensureRunning).toHaveBeenCalledWith(userId);
expect(containerLifecycle.touch).toHaveBeenCalledWith(userId);
});
});
describe("proxyChat", () => {
it("forwards the request to the user's OpenClaw container", async () => {
containerLifecycle.ensureRunning.mockResolvedValue({
url: "http://mosaic-user-user-123:19000",
token: "gateway-token",
});
containerLifecycle.touch.mockResolvedValue(undefined);
fetchMock.mockResolvedValue(new Response("event: token\ndata: hello\n\n"));
const messages = [{ role: "user", content: "Hello from Mosaic" }];
const response = await service.proxyChat(userId, messages);
expect(response).toBeInstanceOf(Response);
expect(fetchMock).toHaveBeenCalledWith(
"http://mosaic-user-user-123:19000/v1/chat/completions",
expect.objectContaining({
method: "POST",
headers: {
Authorization: "Bearer gateway-token",
"Content-Type": "application/json",
},
})
);
const [, request] = fetchMock.mock.calls[0] as [string, RequestInit];
const parsedBody = JSON.parse(String(request.body));
expect(parsedBody).toEqual({
messages,
model: "openclaw:default",
stream: true,
});
});
it("throws ServiceUnavailableException on connection refused errors", async () => {
containerLifecycle.ensureRunning.mockResolvedValue({
url: "http://mosaic-user-user-123:19000",
token: "gateway-token",
});
containerLifecycle.touch.mockResolvedValue(undefined);
fetchMock.mockRejectedValue(new Error("connect ECONNREFUSED 127.0.0.1:19000"));
await expect(service.proxyChat(userId, [])).rejects.toBeInstanceOf(
ServiceUnavailableException
);
});
it("throws ServiceUnavailableException on timeout errors", async () => {
containerLifecycle.ensureRunning.mockResolvedValue({
url: "http://mosaic-user-user-123:19000",
token: "gateway-token",
});
containerLifecycle.touch.mockResolvedValue(undefined);
fetchMock.mockRejectedValue(new Error("The operation was aborted due to timeout"));
await expect(service.proxyChat(userId, [])).rejects.toBeInstanceOf(
ServiceUnavailableException
);
});
});
});

View File

@@ -0,0 +1,110 @@
import {
BadGatewayException,
Injectable,
Logger,
ServiceUnavailableException,
} from "@nestjs/common";
import { ContainerLifecycleService } from "../container-lifecycle/container-lifecycle.service";
import { PrismaService } from "../prisma/prisma.service";
import type { ChatMessage } from "./chat-proxy.dto";
const DEFAULT_OPENCLAW_MODEL = "openclaw:default";
interface ContainerConnection {
url: string;
token: string;
}
@Injectable()
export class ChatProxyService {
private readonly logger = new Logger(ChatProxyService.name);
constructor(
private readonly prisma: PrismaService,
private readonly containerLifecycle: ContainerLifecycleService
) {}
// Get the user's OpenClaw container URL and mark it active.
async getContainerUrl(userId: string): Promise<string> {
const { url } = await this.getContainerConnection(userId);
return url;
}
// Proxy chat request to OpenClaw.
async proxyChat(
userId: string,
messages: ChatMessage[],
signal?: AbortSignal
): Promise<Response> {
const { url: containerUrl, token: gatewayToken } = await this.getContainerConnection(userId);
const model = await this.getPreferredModel(userId);
const requestInit: RequestInit = {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${gatewayToken}`,
},
body: JSON.stringify({
messages,
model,
stream: true,
}),
};
if (signal) {
requestInit.signal = signal;
}
try {
const response = await fetch(`${containerUrl}/v1/chat/completions`, requestInit);
if (!response.ok) {
const detail = await this.readResponseText(response);
const status = `${String(response.status)} ${response.statusText}`.trim();
this.logger.warn(
detail ? `OpenClaw returned ${status}: ${detail}` : `OpenClaw returned ${status}`
);
throw new BadGatewayException(`OpenClaw returned ${status}`);
}
return response;
} catch (error: unknown) {
if (error instanceof BadGatewayException) {
throw error;
}
const message = error instanceof Error ? error.message : String(error);
this.logger.warn(`Failed to proxy chat request: ${message}`);
throw new ServiceUnavailableException("Failed to proxy chat to OpenClaw");
}
}
private async getContainerConnection(userId: string): Promise<ContainerConnection> {
const connection = await this.containerLifecycle.ensureRunning(userId);
await this.containerLifecycle.touch(userId);
return connection;
}
private async getPreferredModel(userId: string): Promise<string> {
const config = await this.prisma.userAgentConfig.findUnique({
where: { userId },
select: { primaryModel: true },
});
const primaryModel = config?.primaryModel?.trim();
if (!primaryModel) {
return DEFAULT_OPENCLAW_MODEL;
}
return primaryModel;
}
private async readResponseText(response: Response): Promise<string | null> {
try {
const text = (await response.text()).trim();
return text.length > 0 ? text : null;
} catch {
return null;
}
}
}

View File

@@ -87,6 +87,17 @@ describe("CsrfGuard", () => {
}); });
describe("State-changing methods requiring CSRF", () => { describe("State-changing methods requiring CSRF", () => {
it("should allow POST with Bearer auth without CSRF token", () => {
const context = createContext(
"POST",
{},
{ authorization: "Bearer api-token" },
false,
"user-123"
);
expect(guard.canActivate(context)).toBe(true);
});
it("should reject POST without CSRF token", () => { it("should reject POST without CSRF token", () => {
const context = createContext("POST", {}, {}, false, "user-123"); const context = createContext("POST", {}, {}, false, "user-123");
expect(() => guard.canActivate(context)).toThrow(ForbiddenException); expect(() => guard.canActivate(context)).toThrow(ForbiddenException);

View File

@@ -57,6 +57,11 @@ export class CsrfGuard implements CanActivate {
return true; return true;
} }
const authHeader = request.headers.authorization;
if (typeof authHeader === "string" && authHeader.startsWith("Bearer ")) {
return true;
}
// Get CSRF token from cookie and header // Get CSRF token from cookie and header
const cookies = request.cookies as Record<string, string> | undefined; const cookies = request.cookies as Record<string, string> | undefined;
const cookieToken = cookies?.["csrf-token"]; const cookieToken = cookies?.["csrf-token"];

View File

@@ -1,10 +1,11 @@
import { Module } from "@nestjs/common"; import { Module } from "@nestjs/common";
import { ConfigModule } from "@nestjs/config";
import { PrismaModule } from "../prisma/prisma.module"; import { PrismaModule } from "../prisma/prisma.module";
import { CryptoModule } from "../crypto/crypto.module"; import { CryptoModule } from "../crypto/crypto.module";
import { ContainerLifecycleService } from "./container-lifecycle.service"; import { ContainerLifecycleService } from "./container-lifecycle.service";
@Module({ @Module({
imports: [PrismaModule, CryptoModule], imports: [ConfigModule, PrismaModule, CryptoModule],
providers: [ContainerLifecycleService], providers: [ContainerLifecycleService],
exports: [ContainerLifecycleService], exports: [ContainerLifecycleService],
}) })

View File

@@ -0,0 +1,10 @@
import { Module } from "@nestjs/common";
import { ScheduleModule } from "@nestjs/schedule";
import { ContainerLifecycleModule } from "../container-lifecycle/container-lifecycle.module";
import { ContainerReaperService } from "./container-reaper.service";
@Module({
imports: [ScheduleModule, ContainerLifecycleModule],
providers: [ContainerReaperService],
})
export class ContainerReaperModule {}

View File

@@ -0,0 +1,45 @@
import { beforeEach, describe, expect, it, vi } from "vitest";
import type { ContainerLifecycleService } from "../container-lifecycle/container-lifecycle.service";
import { ContainerReaperService } from "./container-reaper.service";
describe("ContainerReaperService", () => {
let service: ContainerReaperService;
let containerLifecycle: Pick<ContainerLifecycleService, "reapIdle">;
beforeEach(() => {
containerLifecycle = {
reapIdle: vi.fn(),
};
service = new ContainerReaperService(containerLifecycle as ContainerLifecycleService);
});
it("reapIdleContainers calls containerLifecycle.reapIdle()", async () => {
vi.mocked(containerLifecycle.reapIdle).mockResolvedValue({ stopped: [] });
await service.reapIdleContainers();
expect(containerLifecycle.reapIdle).toHaveBeenCalledTimes(1);
});
it("reapIdleContainers handles errors gracefully", async () => {
const error = new Error("reap failure");
vi.mocked(containerLifecycle.reapIdle).mockRejectedValue(error);
const loggerError = vi.spyOn(service["logger"], "error").mockImplementation(() => {});
await expect(service.reapIdleContainers()).resolves.toBeUndefined();
expect(loggerError).toHaveBeenCalledWith(
"Failed to reap idle containers",
expect.stringContaining("reap failure")
);
});
it("reapIdleContainers logs stopped container count", async () => {
vi.mocked(containerLifecycle.reapIdle).mockResolvedValue({ stopped: ["user-1", "user-2"] });
const loggerLog = vi.spyOn(service["logger"], "log").mockImplementation(() => {});
await service.reapIdleContainers();
expect(loggerLog).toHaveBeenCalledWith("Stopped 2 idle containers: user-1, user-2");
});
});

View File

@@ -0,0 +1,30 @@
import { Injectable, Logger } from "@nestjs/common";
import { Cron, CronExpression } from "@nestjs/schedule";
import { ContainerLifecycleService } from "../container-lifecycle/container-lifecycle.service";
@Injectable()
export class ContainerReaperService {
private readonly logger = new Logger(ContainerReaperService.name);
constructor(private readonly containerLifecycle: ContainerLifecycleService) {}
@Cron(CronExpression.EVERY_5_MINUTES)
async reapIdleContainers(): Promise<void> {
this.logger.log("Running idle container reap cycle...");
try {
const result = await this.containerLifecycle.reapIdle();
if (result.stopped.length > 0) {
this.logger.log(
`Stopped ${String(result.stopped.length)} idle containers: ${result.stopped.join(", ")}`
);
} else {
this.logger.debug("No idle containers to stop");
}
} catch (error) {
this.logger.error(
"Failed to reap idle containers",
error instanceof Error ? error.stack : String(error)
);
}
}
}

View File

@@ -1,11 +1,12 @@
import { Module } from "@nestjs/common"; import { Module } from "@nestjs/common";
import { AuthModule } from "../auth/auth.module";
import { PrismaModule } from "../prisma/prisma.module"; import { PrismaModule } from "../prisma/prisma.module";
import { CryptoModule } from "../crypto/crypto.module"; import { CryptoModule } from "../crypto/crypto.module";
import { FleetSettingsController } from "./fleet-settings.controller"; import { FleetSettingsController } from "./fleet-settings.controller";
import { FleetSettingsService } from "./fleet-settings.service"; import { FleetSettingsService } from "./fleet-settings.service";
@Module({ @Module({
imports: [PrismaModule, CryptoModule], imports: [AuthModule, PrismaModule, CryptoModule],
controllers: [FleetSettingsController], controllers: [FleetSettingsController],
providers: [FleetSettingsService], providers: [FleetSettingsService],
exports: [FleetSettingsService], exports: [FleetSettingsService],

View File

@@ -0,0 +1,194 @@
import { beforeEach, describe, expect, it, vi, afterEach } from "vitest";
import type { Response } from "express";
import { AgentStatus } from "@prisma/client";
import { OrchestratorController } from "./orchestrator.controller";
import { PrismaService } from "../prisma/prisma.service";
import { AuthGuard } from "../auth/guards/auth.guard";
describe("OrchestratorController", () => {
const mockPrismaService = {
agent: {
findMany: vi.fn(),
},
};
let controller: OrchestratorController;
beforeEach(() => {
vi.clearAllMocks();
controller = new OrchestratorController(mockPrismaService as unknown as PrismaService);
});
afterEach(() => {
vi.useRealTimers();
});
describe("getAgents", () => {
it("returns active agents with API widget shape", async () => {
mockPrismaService.agent.findMany.mockResolvedValue([
{
id: "agent-1",
name: "Planner",
status: AgentStatus.WORKING,
role: "planner",
createdAt: new Date("2026-02-28T10:00:00.000Z"),
},
]);
const result = await controller.getAgents();
expect(result).toEqual([
{
id: "agent-1",
name: "Planner",
status: AgentStatus.WORKING,
type: "planner",
createdAt: new Date("2026-02-28T10:00:00.000Z"),
},
]);
expect(mockPrismaService.agent.findMany).toHaveBeenCalledWith({
where: {
status: {
not: AgentStatus.TERMINATED,
},
},
orderBy: {
createdAt: "desc",
},
select: {
id: true,
name: true,
status: true,
role: true,
createdAt: true,
},
});
});
it("falls back to type=agent when role is missing", async () => {
mockPrismaService.agent.findMany.mockResolvedValue([
{
id: "agent-2",
name: null,
status: AgentStatus.IDLE,
role: null,
createdAt: new Date("2026-02-28T11:00:00.000Z"),
},
]);
const result = await controller.getAgents();
expect(result[0]).toMatchObject({
id: "agent-2",
type: "agent",
});
});
});
describe("streamEvents", () => {
it("sets SSE headers and writes initial data payload", async () => {
const onHandlers: Record<string, (() => void) | undefined> = {};
const mockRes = {
setHeader: vi.fn(),
write: vi.fn(),
end: vi.fn(),
on: vi.fn((event: string, handler: () => void) => {
onHandlers[event] = handler;
return mockRes;
}),
} as unknown as Response;
mockPrismaService.agent.findMany.mockResolvedValue([
{
id: "agent-1",
name: "Worker",
status: AgentStatus.WORKING,
role: "worker",
createdAt: new Date("2026-02-28T12:00:00.000Z"),
},
]);
await controller.streamEvents(mockRes);
expect(mockRes.setHeader).toHaveBeenCalledWith("Content-Type", "text/event-stream");
expect(mockRes.setHeader).toHaveBeenCalledWith("Cache-Control", "no-cache");
expect(mockRes.setHeader).toHaveBeenCalledWith("Connection", "keep-alive");
expect(mockRes.setHeader).toHaveBeenCalledWith("X-Accel-Buffering", "no");
expect(mockRes.write).toHaveBeenCalledWith(
expect.stringContaining('"type":"agents:updated"')
);
expect(typeof onHandlers.close).toBe("function");
});
it("polls every 5 seconds and only emits when payload changes", async () => {
vi.useFakeTimers();
const onHandlers: Record<string, (() => void) | undefined> = {};
const mockRes = {
setHeader: vi.fn(),
write: vi.fn(),
end: vi.fn(),
on: vi.fn((event: string, handler: () => void) => {
onHandlers[event] = handler;
return mockRes;
}),
} as unknown as Response;
const firstPayload = [
{
id: "agent-1",
name: "Worker",
status: AgentStatus.WORKING,
role: "worker",
createdAt: new Date("2026-02-28T12:00:00.000Z"),
},
];
const secondPayload = [
{
id: "agent-1",
name: "Worker",
status: AgentStatus.WAITING,
role: "worker",
createdAt: new Date("2026-02-28T12:00:00.000Z"),
},
];
mockPrismaService.agent.findMany
.mockResolvedValueOnce(firstPayload)
.mockResolvedValueOnce(firstPayload)
.mockResolvedValueOnce(secondPayload);
await controller.streamEvents(mockRes);
// 1 initial data event
const getDataEventCalls = () =>
mockRes.write.mock.calls.filter(
(call) => typeof call[0] === "string" && call[0].startsWith("data: ")
);
expect(getDataEventCalls()).toHaveLength(1);
// No change after first poll => no new data event
await vi.advanceTimersByTimeAsync(5000);
expect(getDataEventCalls()).toHaveLength(1);
// Status changed on second poll => emits new data event
await vi.advanceTimersByTimeAsync(5000);
expect(getDataEventCalls()).toHaveLength(2);
onHandlers.close?.();
expect(mockRes.end).toHaveBeenCalledTimes(1);
});
});
describe("security", () => {
it("uses AuthGuard at the controller level", () => {
const guards = Reflect.getMetadata("__guards__", OrchestratorController) as unknown[];
const guardClasses = guards.map((guard) => guard);
expect(guardClasses).toContain(AuthGuard);
});
});
});

View File

@@ -0,0 +1,115 @@
import { Controller, Get, Res, UseGuards } from "@nestjs/common";
import { AgentStatus } from "@prisma/client";
import type { Response } from "express";
import { AuthGuard } from "../auth/guards/auth.guard";
import { PrismaService } from "../prisma/prisma.service";
const AGENT_POLL_INTERVAL_MS = 5_000;
const SSE_HEARTBEAT_MS = 15_000;
interface OrchestratorAgentDto {
id: string;
name: string | null;
status: AgentStatus;
type: string;
createdAt: Date;
}
@Controller("orchestrator")
@UseGuards(AuthGuard)
export class OrchestratorController {
constructor(private readonly prisma: PrismaService) {}
@Get("agents")
async getAgents(): Promise<OrchestratorAgentDto[]> {
return this.fetchActiveAgents();
}
@Get("events")
async streamEvents(@Res() res: Response): Promise<void> {
res.setHeader("Content-Type", "text/event-stream");
res.setHeader("Cache-Control", "no-cache");
res.setHeader("Connection", "keep-alive");
res.setHeader("X-Accel-Buffering", "no");
if (typeof res.flushHeaders === "function") {
res.flushHeaders();
}
let isClosed = false;
let previousSnapshot = "";
const emitSnapshotIfChanged = async (): Promise<void> => {
if (isClosed) {
return;
}
try {
const agents = await this.fetchActiveAgents();
const snapshot = JSON.stringify(agents);
if (snapshot !== previousSnapshot) {
previousSnapshot = snapshot;
res.write(
`data: ${JSON.stringify({
type: "agents:updated",
agents,
timestamp: new Date().toISOString(),
})}\n\n`
);
}
} catch (error: unknown) {
const message = error instanceof Error ? error.message : String(error);
res.write(`event: error\n`);
res.write(`data: ${JSON.stringify({ error: message })}\n\n`);
}
};
await emitSnapshotIfChanged();
const pollInterval = setInterval(() => {
void emitSnapshotIfChanged();
}, AGENT_POLL_INTERVAL_MS);
const heartbeatInterval = setInterval(() => {
if (!isClosed) {
res.write(": keepalive\n\n");
}
}, SSE_HEARTBEAT_MS);
res.on("close", () => {
isClosed = true;
clearInterval(pollInterval);
clearInterval(heartbeatInterval);
res.end();
});
}
private async fetchActiveAgents(): Promise<OrchestratorAgentDto[]> {
const agents = await this.prisma.agent.findMany({
where: {
status: {
not: AgentStatus.TERMINATED,
},
},
orderBy: {
createdAt: "desc",
},
select: {
id: true,
name: true,
status: true,
role: true,
createdAt: true,
},
});
return agents.map((agent) => ({
id: agent.id,
name: agent.name,
status: agent.status,
type: agent.role ?? "agent",
createdAt: agent.createdAt,
}));
}
}

View File

@@ -0,0 +1,10 @@
import { Module } from "@nestjs/common";
import { AuthModule } from "../auth/auth.module";
import { PrismaModule } from "../prisma/prisma.module";
import { OrchestratorController } from "./orchestrator.controller";
@Module({
imports: [AuthModule, PrismaModule],
controllers: [OrchestratorController],
})
export class OrchestratorModule {}

View File

@@ -66,7 +66,9 @@ interface StartTranscriptionPayload {
@WSGateway({ @WSGateway({
namespace: "/speech", namespace: "/speech",
cors: { cors: {
origin: process.env.WEB_URL ?? "http://localhost:3000", origin: (process.env.TRUSTED_ORIGINS ?? process.env.WEB_URL ?? "http://localhost:3000")
.split(",")
.map((s) => s.trim()),
credentials: true, credentials: true,
}, },
}) })

View File

@@ -63,7 +63,9 @@ interface AuthenticatedSocket extends Socket {
@WSGateway({ @WSGateway({
namespace: "/terminal", namespace: "/terminal",
cors: { cors: {
origin: process.env.WEB_URL ?? "http://localhost:3000", origin: (process.env.TRUSTED_ORIGINS ?? process.env.WEB_URL ?? "http://localhost:3000")
.split(",")
.map((s) => s.trim()),
credentials: true, credentials: true,
}, },
}) })

View File

@@ -0,0 +1,31 @@
import { describe, expect, it } from "vitest";
import { WidgetsController } from "./widgets.controller";
const THROTTLER_SKIP_DEFAULT_KEY = "THROTTLER:SKIPdefault";
describe("WidgetsController throttler metadata", () => {
it("marks widget data polling endpoints to skip throttling", () => {
const pollingHandlers = [
WidgetsController.prototype.getStatCardData,
WidgetsController.prototype.getChartData,
WidgetsController.prototype.getListData,
WidgetsController.prototype.getCalendarPreviewData,
WidgetsController.prototype.getActiveProjectsData,
WidgetsController.prototype.getAgentChainsData,
];
for (const handler of pollingHandlers) {
expect(Reflect.getMetadata(THROTTLER_SKIP_DEFAULT_KEY, handler)).toBe(true);
}
});
it("does not skip throttling for non-polling widget routes", () => {
expect(
Reflect.getMetadata(THROTTLER_SKIP_DEFAULT_KEY, WidgetsController.prototype.findAll)
).toBe(undefined);
expect(
Reflect.getMetadata(THROTTLER_SKIP_DEFAULT_KEY, WidgetsController.prototype.findByName)
).toBe(undefined);
});
});

View File

@@ -1,4 +1,5 @@
import { Controller, Get, Post, Body, Param, UseGuards, Request } from "@nestjs/common"; import { Controller, Get, Post, Body, Param, UseGuards, Request } from "@nestjs/common";
import { SkipThrottle as SkipThrottler } from "@nestjs/throttler";
import { WidgetsService } from "./widgets.service"; import { WidgetsService } from "./widgets.service";
import { WidgetDataService } from "./widget-data.service"; import { WidgetDataService } from "./widget-data.service";
import { AuthGuard } from "../auth/guards/auth.guard"; import { AuthGuard } from "../auth/guards/auth.guard";
@@ -43,6 +44,7 @@ export class WidgetsController {
* Get stat card widget data * Get stat card widget data
*/ */
@Post("data/stat-card") @Post("data/stat-card")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getStatCardData(@Request() req: RequestWithWorkspace, @Body() query: StatCardQueryDto) { async getStatCardData(@Request() req: RequestWithWorkspace, @Body() query: StatCardQueryDto) {
return this.widgetDataService.getStatCardData(req.workspace.id, query); return this.widgetDataService.getStatCardData(req.workspace.id, query);
@@ -53,6 +55,7 @@ export class WidgetsController {
* Get chart widget data * Get chart widget data
*/ */
@Post("data/chart") @Post("data/chart")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getChartData(@Request() req: RequestWithWorkspace, @Body() query: ChartQueryDto) { async getChartData(@Request() req: RequestWithWorkspace, @Body() query: ChartQueryDto) {
return this.widgetDataService.getChartData(req.workspace.id, query); return this.widgetDataService.getChartData(req.workspace.id, query);
@@ -63,6 +66,7 @@ export class WidgetsController {
* Get list widget data * Get list widget data
*/ */
@Post("data/list") @Post("data/list")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getListData(@Request() req: RequestWithWorkspace, @Body() query: ListQueryDto) { async getListData(@Request() req: RequestWithWorkspace, @Body() query: ListQueryDto) {
return this.widgetDataService.getListData(req.workspace.id, query); return this.widgetDataService.getListData(req.workspace.id, query);
@@ -73,6 +77,7 @@ export class WidgetsController {
* Get calendar preview widget data * Get calendar preview widget data
*/ */
@Post("data/calendar-preview") @Post("data/calendar-preview")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getCalendarPreviewData( async getCalendarPreviewData(
@Request() req: RequestWithWorkspace, @Request() req: RequestWithWorkspace,
@@ -86,6 +91,7 @@ export class WidgetsController {
* Get active projects widget data * Get active projects widget data
*/ */
@Post("data/active-projects") @Post("data/active-projects")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getActiveProjectsData(@Request() req: RequestWithWorkspace) { async getActiveProjectsData(@Request() req: RequestWithWorkspace) {
return this.widgetDataService.getActiveProjectsData(req.workspace.id); return this.widgetDataService.getActiveProjectsData(req.workspace.id);
@@ -96,6 +102,7 @@ export class WidgetsController {
* Get agent chains widget data (active agent sessions) * Get agent chains widget data (active agent sessions)
*/ */
@Post("data/agent-chains") @Post("data/agent-chains")
@SkipThrottler()
@UseGuards(WorkspaceGuard) @UseGuards(WorkspaceGuard)
async getAgentChainsData(@Request() req: RequestWithWorkspace) { async getAgentChainsData(@Request() req: RequestWithWorkspace) {
return this.widgetDataService.getAgentChainsData(req.workspace.id); return this.widgetDataService.getAgentChainsData(req.workspace.id);

View File

@@ -0,0 +1,491 @@
"use client";
import { useState, useEffect, useCallback } from "react";
import type { ReactElement } from "react";
import { useParams, useRouter } from "next/navigation";
import { ArrowLeft } from "lucide-react";
import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
import { fetchProject, type ProjectDetail } from "@/lib/api/projects";
import { useWorkspaceId } from "@/lib/hooks";
interface BadgeStyle {
label: string;
bg: string;
color: string;
}
interface StatusBadgeProps {
style: BadgeStyle;
}
interface MetaItemProps {
label: string;
value: string;
}
function getProjectStatusStyle(status: string): BadgeStyle {
switch (status) {
case "PLANNING":
return { label: "Planning", bg: "rgba(47,128,255,0.15)", color: "var(--primary)" };
case "ACTIVE":
return { label: "Active", bg: "rgba(20,184,166,0.15)", color: "var(--success)" };
case "PAUSED":
return { label: "Paused", bg: "rgba(245,158,11,0.15)", color: "var(--warn)" };
case "COMPLETED":
return { label: "Completed", bg: "rgba(139,92,246,0.15)", color: "var(--purple)" };
case "ARCHIVED":
return { label: "Archived", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
default:
return { label: status, bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
}
}
function getPriorityStyle(priority: string | null | undefined): BadgeStyle {
switch (priority) {
case "HIGH":
return { label: "High", bg: "rgba(229,72,77,0.15)", color: "var(--danger)" };
case "MEDIUM":
return { label: "Medium", bg: "rgba(245,158,11,0.15)", color: "var(--warn)" };
case "LOW":
return { label: "Low", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
default:
return { label: "Unspecified", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
}
}
function getTaskStatusStyle(status: string): BadgeStyle {
switch (status) {
case "NOT_STARTED":
return { label: "Not Started", bg: "rgba(47,128,255,0.15)", color: "var(--primary)" };
case "IN_PROGRESS":
return { label: "In Progress", bg: "rgba(245,158,11,0.15)", color: "var(--warn)" };
case "PAUSED":
return { label: "Paused", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
case "COMPLETED":
return { label: "Completed", bg: "rgba(20,184,166,0.15)", color: "var(--success)" };
case "ARCHIVED":
return { label: "Archived", bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
default:
return { label: status, bg: "rgba(143,157,183,0.15)", color: "var(--muted)" };
}
}
function formatDate(iso: string | null | undefined): string {
if (!iso) return "Not set";
try {
return new Date(iso).toLocaleDateString("en-US", {
month: "short",
day: "numeric",
year: "numeric",
});
} catch {
return iso;
}
}
function formatDateTime(iso: string | null | undefined): string {
if (!iso) return "Not set";
try {
return new Date(iso).toLocaleString("en-US", {
month: "short",
day: "numeric",
year: "numeric",
hour: "numeric",
minute: "2-digit",
});
} catch {
return iso;
}
}
function toFriendlyErrorMessage(error: unknown): string {
const fallback = "We had trouble loading this project. Please try again when you're ready.";
if (!(error instanceof Error)) {
return fallback;
}
const message = error.message.trim();
if (message.toLowerCase().includes("not found")) {
return "Project not found. It may have been deleted or you may not have access to it.";
}
return message || fallback;
}
function StatusBadge({ style: statusStyle }: StatusBadgeProps): ReactElement {
return (
<span
style={{
display: "inline-flex",
alignItems: "center",
padding: "2px 10px",
borderRadius: "var(--r)",
background: statusStyle.bg,
color: statusStyle.color,
fontSize: "0.75rem",
fontWeight: 500,
}}
>
{statusStyle.label}
</span>
);
}
function MetaItem({ label, value }: MetaItemProps): ReactElement {
return (
<div
style={{
background: "var(--bg)",
border: "1px solid var(--border)",
borderRadius: "var(--r)",
padding: "10px 12px",
}}
>
<p style={{ margin: "0 0 4px", fontSize: "0.75rem", color: "var(--muted)" }}>{label}</p>
<p style={{ margin: 0, fontSize: "0.85rem", color: "var(--text)" }}>{value}</p>
</div>
);
}
export default function ProjectDetailPage(): ReactElement {
const router = useRouter();
const params = useParams<{ id: string | string[] }>();
const workspaceId = useWorkspaceId();
const rawProjectId = params.id;
const projectId = Array.isArray(rawProjectId) ? (rawProjectId[0] ?? null) : rawProjectId;
const [project, setProject] = useState<ProjectDetail | null>(null);
const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const loadProject = useCallback(async (id: string, wsId: string): Promise<void> => {
try {
setIsLoading(true);
setError(null);
const data = await fetchProject(id, wsId);
setProject(data);
} catch (err: unknown) {
console.error("[ProjectDetail] Failed to fetch project:", err);
setProject(null);
setError(toFriendlyErrorMessage(err));
} finally {
setIsLoading(false);
}
}, []);
useEffect(() => {
if (!projectId) {
setProject(null);
setError("The project link is invalid. Please return to the projects page.");
setIsLoading(false);
return;
}
if (!workspaceId) {
setProject(null);
setError("Select a workspace to view this project.");
setIsLoading(false);
return;
}
const id = projectId;
const wsId = workspaceId;
let cancelled = false;
async function load(): Promise<void> {
try {
setIsLoading(true);
setError(null);
const data = await fetchProject(id, wsId);
if (!cancelled) {
setProject(data);
}
} catch (err: unknown) {
console.error("[ProjectDetail] Failed to fetch project:", err);
if (!cancelled) {
setProject(null);
setError(toFriendlyErrorMessage(err));
}
} finally {
if (!cancelled) {
setIsLoading(false);
}
}
}
void load();
return (): void => {
cancelled = true;
};
}, [projectId, workspaceId]);
function handleRetry(): void {
if (!projectId || !workspaceId) return;
void loadProject(projectId, workspaceId);
}
function handleBack(): void {
router.push("/projects");
}
const projectStatus = project ? getProjectStatusStyle(project.status) : null;
const projectPriority = project ? getPriorityStyle(project.priority) : null;
const dueDate = project?.dueDate ?? project?.endDate;
const creator =
project?.creator.name && project.creator.name.trim().length > 0
? `${project.creator.name} (${project.creator.email})`
: (project?.creator.email ?? "Unknown");
return (
<main className="container mx-auto px-4 py-8" style={{ maxWidth: 960 }}>
<button
onClick={handleBack}
style={{
display: "inline-flex",
alignItems: "center",
gap: 8,
marginBottom: 20,
padding: "8px 12px",
borderRadius: "var(--r)",
border: "1px solid var(--border)",
background: "var(--surface)",
color: "var(--text-2)",
fontSize: "0.85rem",
fontWeight: 500,
cursor: "pointer",
}}
>
<ArrowLeft size={16} />
Back to projects
</button>
{isLoading ? (
<div className="flex justify-center py-16">
<MosaicSpinner label="Loading project..." />
</div>
) : error !== null ? (
<div
style={{
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r-lg)",
padding: 32,
textAlign: "center",
}}
>
<p style={{ color: "var(--danger)", margin: "0 0 20px" }}>{error}</p>
<div style={{ display: "flex", gap: 12, justifyContent: "center", flexWrap: "wrap" }}>
<button
onClick={handleBack}
style={{
padding: "8px 16px",
background: "transparent",
border: "1px solid var(--border)",
borderRadius: "var(--r)",
color: "var(--text-2)",
fontSize: "0.85rem",
cursor: "pointer",
}}
>
Back to projects
</button>
<button
onClick={handleRetry}
style={{
padding: "8px 16px",
background: "var(--danger)",
border: "none",
borderRadius: "var(--r)",
color: "#fff",
fontSize: "0.85rem",
fontWeight: 500,
cursor: "pointer",
}}
>
Try again
</button>
</div>
</div>
) : project === null ? (
<div
style={{
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r-lg)",
padding: 32,
textAlign: "center",
}}
>
<p style={{ color: "var(--muted)", margin: 0 }}>Project details are not available.</p>
</div>
) : (
<div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
<section
style={{
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r-lg)",
padding: 24,
}}
>
<div
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "flex-start",
gap: 12,
flexWrap: "wrap",
}}
>
<div style={{ minWidth: 0 }}>
<h1
style={{ margin: 0, fontSize: "1.875rem", fontWeight: 700, color: "var(--text)" }}
>
{project.name}
</h1>
</div>
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
{projectStatus && <StatusBadge style={projectStatus} />}
{projectPriority && <StatusBadge style={projectPriority} />}
</div>
</div>
{project.description ? (
<p
style={{
margin: "14px 0 0",
color: "var(--muted)",
fontSize: "0.9rem",
lineHeight: 1.6,
}}
>
{project.description}
</p>
) : (
<p
style={{
margin: "14px 0 0",
color: "var(--muted)",
fontSize: "0.9rem",
lineHeight: 1.6,
fontStyle: "italic",
}}
>
No description provided.
</p>
)}
<div className="grid grid-cols-1 md:grid-cols-2 gap-3" style={{ marginTop: 18 }}>
<MetaItem label="Start date" value={formatDate(project.startDate)} />
<MetaItem label="Due date" value={formatDate(dueDate)} />
<MetaItem label="Created" value={formatDateTime(project.createdAt)} />
<MetaItem label="Updated" value={formatDateTime(project.updatedAt)} />
<MetaItem label="Creator" value={creator} />
<MetaItem
label="Work items"
value={`${String(project._count.tasks)} tasks · ${String(project._count.events)} events`}
/>
</div>
</section>
<section
style={{
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r-lg)",
padding: 24,
}}
>
<h2 style={{ margin: "0 0 12px", fontSize: "1.1rem", color: "var(--text)" }}>
Tasks ({String(project._count.tasks)})
</h2>
{project.tasks.length === 0 ? (
<p style={{ margin: 0, color: "var(--muted)", fontSize: "0.9rem" }}>
No tasks yet for this project.
</p>
) : (
<div>
{project.tasks.map((task, index) => (
<div
key={task.id}
style={{
padding: "12px 0",
borderTop: index === 0 ? "none" : "1px solid var(--border)",
}}
>
<div
style={{
display: "flex",
alignItems: "flex-start",
justifyContent: "space-between",
gap: 12,
flexWrap: "wrap",
}}
>
<div style={{ minWidth: 0 }}>
<p style={{ margin: 0, color: "var(--text)", fontWeight: 500 }}>
{task.title}
</p>
<p style={{ margin: "4px 0 0", color: "var(--muted)", fontSize: "0.8rem" }}>
Due: {formatDate(task.dueDate)}
</p>
</div>
<div style={{ display: "flex", gap: 8, flexWrap: "wrap" }}>
<StatusBadge style={getTaskStatusStyle(task.status)} />
<StatusBadge style={getPriorityStyle(task.priority)} />
</div>
</div>
</div>
))}
</div>
)}
</section>
<section
style={{
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r-lg)",
padding: 24,
}}
>
<h2 style={{ margin: "0 0 12px", fontSize: "1.1rem", color: "var(--text)" }}>
Events ({String(project._count.events)})
</h2>
{project.events.length === 0 ? (
<p style={{ margin: 0, color: "var(--muted)", fontSize: "0.9rem" }}>
No events scheduled for this project.
</p>
) : (
<div>
{project.events.map((event, index) => (
<div
key={event.id}
style={{
padding: "12px 0",
borderTop: index === 0 ? "none" : "1px solid var(--border)",
}}
>
<p style={{ margin: 0, color: "var(--text)", fontWeight: 500 }}>
{event.title}
</p>
<p style={{ margin: "4px 0 0", color: "var(--muted)", fontSize: "0.8rem" }}>
{formatDateTime(event.startTime)} - {formatDateTime(event.endTime)}
</p>
</div>
))}
</div>
)}
</section>
</div>
)}
</main>
);
}

View File

@@ -0,0 +1,356 @@
"use client";
import {
useCallback,
useEffect,
useMemo,
useState,
type ChangeEvent,
type ReactElement,
type SyntheticEvent,
} from "react";
import { FleetSettingsNav } from "@/components/settings/FleetSettingsNav";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Label } from "@/components/ui/label";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import {
fetchFleetAgentConfig,
fetchFleetProviders,
updateFleetAgentConfig,
type FleetProvider,
type FleetProviderModel,
type UpdateFleetAgentConfigRequest,
} from "@/lib/api/fleet-settings";
function getErrorMessage(error: unknown, fallback: string): string {
if (error instanceof Error && error.message.trim().length > 0) {
return error.message;
}
return fallback;
}
function normalizeProviderModels(models: unknown): FleetProviderModel[] {
if (!Array.isArray(models)) {
return [];
}
const parsed: FleetProviderModel[] = [];
models.forEach((entry) => {
if (typeof entry === "string" && entry.trim().length > 0) {
parsed.push({ id: entry.trim(), name: entry.trim() });
return;
}
if (entry && typeof entry === "object") {
const record = entry as Record<string, unknown>;
const id =
typeof record.id === "string"
? record.id.trim()
: typeof record.name === "string"
? record.name.trim()
: "";
if (id.length > 0) {
parsed.push({ id, name: id });
}
}
});
const seen = new Set<string>();
return parsed.filter((model) => {
if (seen.has(model.id)) {
return false;
}
seen.add(model.id);
return true;
});
}
function parseModelList(value: string): string[] {
const seen = new Set<string>();
return value
.split(/\n|,/g)
.map((segment) => segment.trim())
.filter((segment) => segment.length > 0)
.filter((segment) => {
if (seen.has(segment)) {
return false;
}
seen.add(segment);
return true;
});
}
function deriveAvailableModels(providers: FleetProvider[]): string[] {
const seen = new Set<string>();
const models: string[] = [];
providers.forEach((provider) => {
normalizeProviderModels(provider.models).forEach((model) => {
if (seen.has(model.id)) {
return;
}
seen.add(model.id);
models.push(model.id);
});
});
return models.sort((left, right) => left.localeCompare(right));
}
export default function AgentConfigSettingsPage(): ReactElement {
const [providers, setProviders] = useState<FleetProvider[]>([]);
const [primaryModel, setPrimaryModel] = useState<string>("");
const [fallbackModelsText, setFallbackModelsText] = useState<string>("");
const [personality, setPersonality] = useState<string>("");
const [isLoading, setIsLoading] = useState<boolean>(true);
const [isSaving, setIsSaving] = useState<boolean>(false);
const [error, setError] = useState<string | null>(null);
const [successMessage, setSuccessMessage] = useState<string | null>(null);
const availableModels = useMemo(() => deriveAvailableModels(providers), [providers]);
const fallbackModels = useMemo(() => parseModelList(fallbackModelsText), [fallbackModelsText]);
const modelSelectOptions = useMemo(() => {
if (primaryModel.length > 0 && !availableModels.includes(primaryModel)) {
return [primaryModel, ...availableModels];
}
return availableModels;
}, [availableModels, primaryModel]);
const loadSettings = useCallback(async (): Promise<void> => {
setIsLoading(true);
try {
const [providerData, agentConfig] = await Promise.all([
fetchFleetProviders(),
fetchFleetAgentConfig(),
]);
setProviders(providerData);
setPrimaryModel(agentConfig.primaryModel ?? "");
setFallbackModelsText(agentConfig.fallbackModels.join("\n"));
setPersonality(agentConfig.personality ?? "");
setError(null);
} catch (loadError: unknown) {
setError(getErrorMessage(loadError, "Failed to load agent configuration."));
} finally {
setIsLoading(false);
}
}, []);
useEffect(() => {
void loadSettings();
}, [loadSettings]);
function appendFallbackModel(model: string): void {
const current = parseModelList(fallbackModelsText);
if (current.includes(model)) {
return;
}
const next = [...current, model];
setFallbackModelsText(next.join("\n"));
}
async function handleSave(event: SyntheticEvent): Promise<void> {
event.preventDefault();
setError(null);
setSuccessMessage(null);
const updatePayload: UpdateFleetAgentConfigRequest = {
personality: personality.trim(),
};
if (primaryModel.trim().length > 0) {
updatePayload.primaryModel = primaryModel.trim();
}
const parsedFallbacks = parseModelList(fallbackModelsText).filter(
(model) => model !== primaryModel.trim()
);
if (parsedFallbacks.length > 0) {
updatePayload.fallbackModels = parsedFallbacks;
}
try {
setIsSaving(true);
await updateFleetAgentConfig(updatePayload);
setSuccessMessage("Agent configuration saved.");
await loadSettings();
} catch (saveError: unknown) {
setError(getErrorMessage(saveError, "Failed to save agent configuration."));
} finally {
setIsSaving(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 Configuration</h1>
<p className="text-muted-foreground mt-1">
Assign primary and fallback models for your agent runtime behavior.
</p>
</div>
<FleetSettingsNav />
</div>
<Card>
<CardHeader>
<CardTitle>Current Assignment</CardTitle>
<CardDescription>
Snapshot of your currently saved model routing configuration.
</CardDescription>
</CardHeader>
<CardContent className="space-y-4">
{isLoading ? (
<p className="text-sm text-muted-foreground">Loading configuration...</p>
) : (
<>
<div>
<p className="text-sm font-medium">Primary Model</p>
<p className="text-sm text-muted-foreground">
{primaryModel.length > 0 ? primaryModel : "No primary model configured"}
</p>
</div>
<div>
<p className="text-sm font-medium">Fallback Models</p>
{fallbackModels.length === 0 ? (
<p className="text-sm text-muted-foreground">No fallback models configured</p>
) : (
<div className="flex flex-wrap gap-2 mt-2">
{fallbackModels.map((model) => (
<Badge key={`current-${model}`} variant="outline">
{model}
</Badge>
))}
</div>
)}
</div>
</>
)}
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>Update Agent Config</CardTitle>
<CardDescription>
Select a primary model and define fallback ordering. Models come from your provider
settings.
</CardDescription>
</CardHeader>
<CardContent>
<form onSubmit={(event) => void handleSave(event)} className="space-y-5">
<div className="space-y-2">
<Label htmlFor="primary-model">Primary Model</Label>
<Select
value={primaryModel.length > 0 ? primaryModel : "__none__"}
onValueChange={(value) => {
setPrimaryModel(value === "__none__" ? "" : value);
}}
disabled={isLoading || isSaving}
>
<SelectTrigger id="primary-model">
<SelectValue placeholder="Select a primary model" />
</SelectTrigger>
<SelectContent>
<SelectItem value="__none__">No primary model selected</SelectItem>
{modelSelectOptions.map((model) => (
<SelectItem key={model} value={model}>
{model}
</SelectItem>
))}
</SelectContent>
</Select>
{availableModels.length === 0 ? (
<p className="text-xs text-muted-foreground">
No models available yet. Add provider models first in Providers settings.
</p>
) : null}
</div>
<div className="space-y-2">
<Label htmlFor="fallback-models">Fallback Models</Label>
<Textarea
id="fallback-models"
value={fallbackModelsText}
onChange={(event: ChangeEvent<HTMLTextAreaElement>) => {
setFallbackModelsText(event.target.value);
}}
rows={4}
placeholder={"One model per line\nExample: gpt-4.1-mini"}
disabled={isLoading || isSaving}
/>
{availableModels.length > 0 ? (
<div className="flex flex-wrap gap-2">
{availableModels
.filter((model) => model !== primaryModel)
.map((model) => (
<Button
key={`suggest-${model}`}
type="button"
variant="outline"
size="sm"
onClick={() => {
appendFallbackModel(model);
}}
disabled={fallbackModels.includes(model) || isSaving}
>
{fallbackModels.includes(model) ? `Added: ${model}` : `Add ${model}`}
</Button>
))}
</div>
) : null}
</div>
<div className="space-y-2">
<Label htmlFor="agent-personality">Personality / SOUL</Label>
<Textarea
id="agent-personality"
value={personality}
onChange={(event: ChangeEvent<HTMLTextAreaElement>) => {
setPersonality(event.target.value);
}}
rows={8}
placeholder="Optional system personality instructions..."
disabled={isLoading || isSaving}
/>
</div>
{error ? (
<p className="text-sm text-destructive" role="alert">
{error}
</p>
) : null}
{successMessage ? <p className="text-sm text-emerald-600">{successMessage}</p> : null}
<Button type="submit" disabled={isLoading || isSaving}>
{isSaving ? "Saving..." : "Save Agent Config"}
</Button>
</form>
</CardContent>
</Card>
</div>
);
}

View File

@@ -0,0 +1,492 @@
"use client";
import {
useCallback,
useEffect,
useState,
type ChangeEvent,
type ReactElement,
type SyntheticEvent,
} from "react";
import { FleetSettingsNav } from "@/components/settings/FleetSettingsNav";
import { SettingsAccessDenied } from "@/components/settings/SettingsAccessDenied";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from "@/components/ui/alert-dialog";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import {
deleteFleetOidcConfig,
fetchFleetOidcConfig,
resetBreakglassAdminPassword,
updateFleetOidcConfig,
type FleetOidcConfig,
} from "@/lib/api/fleet-settings";
import { fetchOnboardingStatus } from "@/lib/api/onboarding";
interface OidcFormState {
issuerUrl: string;
clientId: string;
clientSecret: string;
}
interface BreakglassFormState {
username: string;
currentPassword: string;
newPassword: string;
confirmPassword: string;
}
const INITIAL_OIDC_FORM: OidcFormState = {
issuerUrl: "",
clientId: "",
clientSecret: "",
};
const INITIAL_BREAKGLASS_FORM: BreakglassFormState = {
username: "",
currentPassword: "",
newPassword: "",
confirmPassword: "",
};
function getErrorMessage(error: unknown, fallback: string): string {
if (error instanceof Error && error.message.trim().length > 0) {
return error.message;
}
return fallback;
}
function isAdminGuardError(error: unknown): boolean {
if (!(error instanceof Error)) {
return false;
}
const normalized = error.message.toLowerCase();
return (
normalized.includes("requires system administrator") ||
normalized.includes("forbidden") ||
normalized.includes("403")
);
}
export default function AuthSettingsPage(): ReactElement {
const [oidcConfig, setOidcConfig] = useState<FleetOidcConfig | null>(null);
const [oidcForm, setOidcForm] = useState<OidcFormState>(INITIAL_OIDC_FORM);
const [isLoading, setIsLoading] = useState<boolean>(true);
const [isSavingOidc, setIsSavingOidc] = useState<boolean>(false);
const [isDeletingOidc, setIsDeletingOidc] = useState<boolean>(false);
const [oidcError, setOidcError] = useState<string | null>(null);
const [oidcSuccessMessage, setOidcSuccessMessage] = useState<string | null>(null);
const [showRemoveOidcDialog, setShowRemoveOidcDialog] = useState<boolean>(false);
const [breakglassForm, setBreakglassForm] =
useState<BreakglassFormState>(INITIAL_BREAKGLASS_FORM);
const [breakglassStatus, setBreakglassStatus] = useState<"active" | "inactive">("inactive");
const [isResettingPassword, setIsResettingPassword] = useState<boolean>(false);
const [breakglassError, setBreakglassError] = useState<string | null>(null);
const [breakglassSuccessMessage, setBreakglassSuccessMessage] = useState<string | null>(null);
const [isAccessDenied, setIsAccessDenied] = useState<boolean>(false);
const loadAuthSettings = useCallback(async (): Promise<void> => {
setIsLoading(true);
try {
const [oidcResponse, onboardingStatus] = await Promise.all([
fetchFleetOidcConfig(),
fetchOnboardingStatus().catch(() => ({ completed: false })),
]);
setOidcConfig(oidcResponse);
setOidcForm({
issuerUrl: oidcResponse.issuerUrl ?? "",
clientId: oidcResponse.clientId ?? "",
clientSecret: "",
});
setBreakglassStatus(onboardingStatus.completed ? "active" : "inactive");
setIsAccessDenied(false);
setOidcError(null);
} catch (loadError: unknown) {
if (isAdminGuardError(loadError)) {
setIsAccessDenied(true);
return;
}
setOidcError(getErrorMessage(loadError, "Failed to load authentication settings."));
} finally {
setIsLoading(false);
}
}, []);
useEffect(() => {
void loadAuthSettings();
}, [loadAuthSettings]);
async function handleSaveOidc(event: SyntheticEvent): Promise<void> {
event.preventDefault();
setOidcError(null);
setOidcSuccessMessage(null);
const issuerUrl = oidcForm.issuerUrl.trim();
const clientId = oidcForm.clientId.trim();
const clientSecret = oidcForm.clientSecret.trim();
if (issuerUrl.length === 0 || clientId.length === 0 || clientSecret.length === 0) {
setOidcError("Issuer URL, client ID, and client secret are required.");
return;
}
try {
setIsSavingOidc(true);
await updateFleetOidcConfig({
issuerUrl,
clientId,
clientSecret,
});
setOidcSuccessMessage("OIDC configuration updated.");
await loadAuthSettings();
} catch (saveError: unknown) {
setOidcError(getErrorMessage(saveError, "Failed to update OIDC configuration."));
} finally {
setIsSavingOidc(false);
}
}
async function handleRemoveOidc(): Promise<void> {
try {
setIsDeletingOidc(true);
await deleteFleetOidcConfig();
setOidcSuccessMessage("OIDC configuration removed.");
setShowRemoveOidcDialog(false);
await loadAuthSettings();
} catch (deleteError: unknown) {
setOidcError(getErrorMessage(deleteError, "Failed to remove OIDC configuration."));
} finally {
setIsDeletingOidc(false);
}
}
async function handleResetBreakglassPassword(event: SyntheticEvent): Promise<void> {
event.preventDefault();
setBreakglassError(null);
setBreakglassSuccessMessage(null);
const username = breakglassForm.username.trim();
const newPassword = breakglassForm.newPassword;
const confirmPassword = breakglassForm.confirmPassword;
if (username.length === 0) {
setBreakglassError("Username is required.");
return;
}
if (newPassword.length < 8) {
setBreakglassError("New password must be at least 8 characters.");
return;
}
if (newPassword !== confirmPassword) {
setBreakglassError("Password confirmation does not match.");
return;
}
try {
setIsResettingPassword(true);
await resetBreakglassAdminPassword({
username,
newPassword,
});
setBreakglassSuccessMessage(`Password reset for "${username}".`);
setBreakglassStatus("active");
setBreakglassForm((previous) => ({
...previous,
currentPassword: "",
newPassword: "",
confirmPassword: "",
}));
} catch (resetError: unknown) {
setBreakglassError(getErrorMessage(resetError, "Failed to reset breakglass password."));
} finally {
setIsResettingPassword(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">Authentication Settings</h1>
<p className="text-muted-foreground mt-1">
Configure OIDC and breakglass admin recovery credentials.
</p>
</div>
<FleetSettingsNav />
</div>
{isLoading ? (
<Card>
<CardContent className="py-8 text-sm text-muted-foreground">
Loading authentication settings...
</CardContent>
</Card>
) : null}
{!isLoading && isAccessDenied ? (
<SettingsAccessDenied message="Authentication settings require system administrator privileges." />
) : null}
{!isLoading && !isAccessDenied ? (
<>
<Card>
<CardHeader>
<CardTitle>OIDC Provider</CardTitle>
<CardDescription>
Manage your OpenID Connect issuer and OAuth client credentials.
</CardDescription>
</CardHeader>
<CardContent className="space-y-5">
<div className="rounded-lg border p-4 space-y-2">
<div className="flex items-center gap-2">
<p className="font-medium">Configured</p>
<Badge variant={oidcConfig?.configured ? "default" : "secondary"}>
{oidcConfig?.configured ? "Yes" : "No"}
</Badge>
</div>
<p className="text-sm text-muted-foreground">
Issuer URL: {oidcConfig?.issuerUrl ?? "Not configured"}
</p>
<p className="text-sm text-muted-foreground">
Client ID: {oidcConfig?.clientId ?? "Not configured"}
</p>
<p className="text-sm text-muted-foreground">Client secret: hidden</p>
</div>
<form onSubmit={(event) => void handleSaveOidc(event)} className="space-y-4">
<div className="space-y-2">
<Label htmlFor="oidc-issuer-url">Issuer URL</Label>
<Input
id="oidc-issuer-url"
value={oidcForm.issuerUrl}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setOidcForm((previous) => ({ ...previous, issuerUrl: event.target.value }));
}}
placeholder="https://issuer.example.com"
disabled={isSavingOidc}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="oidc-client-id">Client ID</Label>
<Input
id="oidc-client-id"
value={oidcForm.clientId}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setOidcForm((previous) => ({ ...previous, clientId: event.target.value }));
}}
placeholder="mosaic-web"
disabled={isSavingOidc}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="oidc-client-secret">Client Secret</Label>
<Input
id="oidc-client-secret"
type="password"
value={oidcForm.clientSecret}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setOidcForm((previous) => ({
...previous,
clientSecret: event.target.value,
}));
}}
placeholder="Enter new secret"
autoComplete="new-password"
disabled={isSavingOidc}
required
/>
<p className="text-xs text-muted-foreground">
The secret is encrypted on save and never returned to the UI.
</p>
</div>
{oidcError ? (
<p className="text-sm text-destructive" role="alert">
{oidcError}
</p>
) : null}
{oidcSuccessMessage ? (
<p className="text-sm text-emerald-600">{oidcSuccessMessage}</p>
) : null}
<div className="flex items-center gap-2">
<Button type="submit" disabled={isSavingOidc}>
{isSavingOidc ? "Saving..." : "Save OIDC"}
</Button>
<Button
type="button"
variant="destructive"
onClick={() => {
setShowRemoveOidcDialog(true);
}}
disabled={isDeletingOidc || !oidcConfig?.configured}
>
Remove OIDC
</Button>
</div>
</form>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>Breakglass Admin</CardTitle>
<CardDescription>
Reset breakglass credentials for emergency local access.
</CardDescription>
</CardHeader>
<CardContent className="space-y-5">
<div className="flex items-center gap-2">
<p className="font-medium">Status</p>
<Badge variant={breakglassStatus === "active" ? "default" : "secondary"}>
{breakglassStatus}
</Badge>
</div>
<form
onSubmit={(event) => void handleResetBreakglassPassword(event)}
className="space-y-4"
>
<div className="space-y-2">
<Label htmlFor="breakglass-username">Username</Label>
<Input
id="breakglass-username"
value={breakglassForm.username}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setBreakglassForm((previous) => ({
...previous,
username: event.target.value,
}));
}}
placeholder="admin"
disabled={isResettingPassword}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="breakglass-current-password">Current Password (optional)</Label>
<Input
id="breakglass-current-password"
type="password"
value={breakglassForm.currentPassword}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setBreakglassForm((previous) => ({
...previous,
currentPassword: event.target.value,
}));
}}
placeholder="Optional operator confirmation"
autoComplete="current-password"
disabled={isResettingPassword}
/>
</div>
<div className="space-y-2">
<Label htmlFor="breakglass-new-password">New Password</Label>
<Input
id="breakglass-new-password"
type="password"
value={breakglassForm.newPassword}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setBreakglassForm((previous) => ({
...previous,
newPassword: event.target.value,
}));
}}
placeholder="At least 8 characters"
autoComplete="new-password"
disabled={isResettingPassword}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="breakglass-confirm-password">Confirm Password</Label>
<Input
id="breakglass-confirm-password"
type="password"
value={breakglassForm.confirmPassword}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setBreakglassForm((previous) => ({
...previous,
confirmPassword: event.target.value,
}));
}}
placeholder="Re-enter password"
autoComplete="new-password"
disabled={isResettingPassword}
required
/>
</div>
{breakglassError ? (
<p className="text-sm text-destructive" role="alert">
{breakglassError}
</p>
) : null}
{breakglassSuccessMessage ? (
<p className="text-sm text-emerald-600">{breakglassSuccessMessage}</p>
) : null}
<Button type="submit" disabled={isResettingPassword}>
{isResettingPassword ? "Resetting..." : "Reset Password"}
</Button>
</form>
</CardContent>
</Card>
</>
) : null}
<AlertDialog
open={showRemoveOidcDialog}
onOpenChange={(open) => {
if (!open && !isDeletingOidc) {
setShowRemoveOidcDialog(false);
}
}}
>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Remove OIDC Configuration</AlertDialogTitle>
<AlertDialogDescription>
This will remove issuer URL, client ID, and client secret from system configuration.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel disabled={isDeletingOidc}>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleRemoveOidc} disabled={isDeletingOidc}>
{isDeletingOidc ? "Removing..." : "Remove OIDC"}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
);
}

View File

@@ -200,6 +200,82 @@ const categories: CategoryConfig[] = [
</svg> </svg>
), ),
}, },
{
title: "LLM Providers",
description:
"Add and manage LLM providers, encrypted API keys, base URLs, and model inventories.",
href: "/settings/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"
>
<rect x="2.5" y="4" width="15" height="12" rx="2" />
<path d="M2.5 8h15" />
<circle cx="6" cy="12" r="1" />
<circle cx="10" cy="12" r="1" />
<circle cx="14" cy="12" r="1" />
</svg>
),
},
{
title: "Agent Config",
description: "Choose primary and fallback models, plus optional personality/SOUL instructions.",
href: "/settings/agent-config",
accent: "var(--ms-teal-400)",
iconBg: "rgba(20, 184, 166, 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 5h12" />
<path d="M4 10h12" />
<path d="M4 15h7" />
<circle cx="14.5" cy="15" r="1.5" />
</svg>
),
},
{
title: "Authentication",
description: "Manage OIDC provider settings and breakglass admin password recovery.",
href: "/settings/auth",
accent: "var(--ms-amber-400)",
iconBg: "rgba(245, 158, 11, 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"
>
<rect x="5" y="8" width="10" height="8" rx="1.5" />
<path d="M7 8V6a3 3 0 0 1 6 0v2" />
<circle cx="10" cy="12" r="1" />
</svg>
),
},
{ {
title: "Users", title: "Users",
description: "Invite, manage roles, and deactivate users across your workspaces.", description: "Invite, manage roles, and deactivate users across your workspaces.",

View File

@@ -0,0 +1,634 @@
"use client";
import {
useCallback,
useEffect,
useMemo,
useState,
type ChangeEvent,
type ReactElement,
type SyntheticEvent,
} from "react";
import { Settings, Trash2 } from "lucide-react";
import { FleetSettingsNav } from "@/components/settings/FleetSettingsNav";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from "@/components/ui/alert-dialog";
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";
import { Textarea } from "@/components/ui/textarea";
import {
createFleetProvider,
deleteFleetProvider,
fetchFleetProviders,
updateFleetProvider,
type CreateFleetProviderRequest,
type FleetProvider,
type FleetProviderModel,
type UpdateFleetProviderRequest,
} from "@/lib/api/fleet-settings";
interface ProviderTypeOption {
value: string;
label: string;
}
interface ProviderFormState {
type: string;
displayName: string;
apiKey: string;
baseUrl: string;
modelsText: string;
isActive: boolean;
}
const PROVIDER_TYPE_OPTIONS: ProviderTypeOption[] = [
{ value: "openai", label: "OpenAI Compatible" },
{ value: "claude", label: "Claude / Anthropic" },
{ value: "ollama", label: "Ollama" },
{ value: "zai", label: "Z.ai" },
{ value: "custom", label: "Custom" },
];
const INITIAL_FORM: ProviderFormState = {
type: "openai",
displayName: "",
apiKey: "",
baseUrl: "",
modelsText: "",
isActive: true,
};
function buildProviderName(displayName: string, type: string): string {
const slug = displayName
.trim()
.toLowerCase()
.replace(/[^a-z0-9]+/g, "-")
.replace(/^-+/, "")
.replace(/-+$/, "");
const candidate = `${type}-${slug.length > 0 ? slug : "provider"}`;
return candidate.slice(0, 100);
}
function getErrorMessage(error: unknown, fallback: string): string {
if (error instanceof Error && error.message.trim().length > 0) {
return error.message;
}
return fallback;
}
function normalizeProviderModels(models: unknown): FleetProviderModel[] {
if (!Array.isArray(models)) {
return [];
}
const normalized: FleetProviderModel[] = [];
models.forEach((entry) => {
if (typeof entry === "string" && entry.trim().length > 0) {
normalized.push({ id: entry.trim(), name: entry.trim() });
return;
}
if (entry && typeof entry === "object") {
const record = entry as Record<string, unknown>;
const id =
typeof record.id === "string"
? record.id.trim()
: typeof record.name === "string"
? record.name.trim()
: "";
if (id.length > 0) {
const name =
typeof record.name === "string" && record.name.trim().length > 0
? record.name.trim()
: id;
normalized.push({ id, name });
}
}
});
const seen = new Set<string>();
return normalized.filter((model) => {
if (seen.has(model.id)) {
return false;
}
seen.add(model.id);
return true;
});
}
function modelsToEditorText(models: unknown): string {
return normalizeProviderModels(models)
.map((model) => model.id)
.join("\n");
}
function parseModelsText(value: string): string[] {
const seen = new Set<string>();
return value
.split(/\r?\n/g)
.map((segment) => segment.trim())
.filter((segment) => segment.length > 0)
.filter((segment) => {
if (seen.has(segment)) {
return false;
}
seen.add(segment);
return true;
});
}
function maskApiKey(value: string): string {
if (value.length === 0) {
return "Not set";
}
if (value.length <= 7) {
return "*".repeat(Math.max(4, value.length));
}
return `${value.slice(0, 3)}****...${value.slice(-4)}`;
}
export default function ProvidersSettingsPage(): ReactElement {
const [providers, setProviders] = useState<FleetProvider[]>([]);
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<FleetProvider | null>(null);
const [form, setForm] = useState<ProviderFormState>(INITIAL_FORM);
const [formError, setFormError] = useState<string | null>(null);
const [isSaving, setIsSaving] = useState<boolean>(false);
const [deleteTarget, setDeleteTarget] = useState<FleetProvider | 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 fetchFleetProviders();
setProviders(data);
setError(null);
} catch (loadError: unknown) {
setError(getErrorMessage(loadError, "Failed to load providers."));
} finally {
setIsLoading(false);
setIsRefreshing(false);
}
}, []);
useEffect(() => {
void loadProviders(true);
}, [loadProviders]);
const apiKeyHint = useMemo(() => {
const enteredKey = form.apiKey.trim();
if (enteredKey.length > 0) {
return `Masked preview: ${maskApiKey(enteredKey)}`;
}
if (editingProvider) {
return "Stored API key remains encrypted and hidden. Enter a new key only when rotating.";
}
return "API keys are never shown decrypted. Only masked previews are displayed while typing.";
}, [editingProvider, form.apiKey]);
function openCreateDialog(): void {
setEditingProvider(null);
setForm(INITIAL_FORM);
setFormError(null);
setIsDialogOpen(true);
}
function openEditDialog(provider: FleetProvider): void {
setEditingProvider(provider);
setForm({
type: provider.type,
displayName: provider.displayName,
apiKey: "",
baseUrl: provider.baseUrl ?? "",
modelsText: modelsToEditorText(provider.models),
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 displayName = form.displayName.trim();
if (displayName.length === 0) {
setFormError("Display name is required.");
return;
}
const models = parseModelsText(form.modelsText);
const providerModels = models.map((id) => ({ id, name: id }));
const baseUrl = form.baseUrl.trim();
const apiKey = form.apiKey.trim();
try {
setIsSaving(true);
if (editingProvider) {
const updatePayload: UpdateFleetProviderRequest = {
displayName,
isActive: form.isActive,
models: providerModels,
};
if (baseUrl.length > 0) {
updatePayload.baseUrl = baseUrl;
}
if (apiKey.length > 0) {
updatePayload.apiKey = apiKey;
}
await updateFleetProvider(editingProvider.id, updatePayload);
setSuccessMessage(`Updated provider "${displayName}".`);
} else {
const createPayload: CreateFleetProviderRequest = {
name: buildProviderName(displayName, form.type),
displayName,
type: form.type,
};
if (baseUrl.length > 0) {
createPayload.baseUrl = baseUrl;
}
if (apiKey.length > 0) {
createPayload.apiKey = apiKey;
}
if (providerModels.length > 0) {
createPayload.models = providerModels;
}
await createFleetProvider(createPayload);
setSuccessMessage(`Added provider "${displayName}".`);
}
setIsDialogOpen(false);
setEditingProvider(null);
setForm(INITIAL_FORM);
await loadProviders(false);
} catch (saveError: unknown) {
setFormError(getErrorMessage(saveError, "Unable to save provider."));
} finally {
setIsSaving(false);
}
}
async function handleDeleteProvider(): Promise<void> {
if (!deleteTarget) {
return;
}
try {
setIsDeleting(true);
await deleteFleetProvider(deleteTarget.id);
setSuccessMessage(`Deleted provider "${deleteTarget.displayName}".`);
setDeleteTarget(null);
await loadProviders(false);
} catch (deleteError: unknown) {
setError(getErrorMessage(deleteError, "Failed to delete 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">LLM Providers</h1>
<p className="text-muted-foreground mt-1">
Manage provider endpoints, model inventories, and encrypted API credentials.
</p>
</div>
<FleetSettingsNav />
</div>
<Card>
<CardHeader className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
<div>
<CardTitle>Provider Directory</CardTitle>
<CardDescription>
API keys are always encrypted in storage and never displayed in plaintext.
</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 providers...</p>
) : providers.length === 0 ? (
<p className="text-sm text-muted-foreground">
No providers configured yet. Add one to make models available for agent assignment.
</p>
) : (
providers.map((provider) => {
const providerModels = normalizeProviderModels(provider.models);
return (
<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.displayName}</p>
<Badge variant={provider.isActive ? "default" : "secondary"}>
{provider.isActive ? "Active" : "Inactive"}
</Badge>
<Badge variant="outline">{provider.type}</Badge>
</div>
<p className="text-sm text-muted-foreground">Name: {provider.name}</p>
<p className="text-sm text-muted-foreground">
Base URL: {provider.baseUrl ?? "Provider default"}
</p>
<p className="text-sm text-muted-foreground">
API Key: encrypted and hidden (never returned decrypted)
</p>
<div className="flex flex-wrap gap-2">
{providerModels.length === 0 ? (
<Badge variant="secondary">No models configured</Badge>
) : (
providerModels.map((model) => (
<Badge key={`${provider.id}-${model.id}`} variant="outline">
{model.id}
</Badge>
))
)}
</div>
</div>
<div className="flex items-center gap-2">
<Button
variant="outline"
size="sm"
onClick={() => {
openEditDialog(provider);
}}
>
<Settings 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 Provider" : "Add Provider"}</DialogTitle>
<DialogDescription>
Configure connection details and model IDs. API keys are masked in the UI.
</DialogDescription>
</DialogHeader>
<form onSubmit={(event) => void handleSubmit(event)} className="space-y-4">
<div className="space-y-2">
<Label htmlFor="provider-type">Type</Label>
<Select
value={form.type}
onValueChange={(value) => {
setForm((previous) => ({ ...previous, type: value }));
}}
disabled={Boolean(editingProvider)}
>
<SelectTrigger id="provider-type">
<SelectValue placeholder="Select provider type" />
</SelectTrigger>
<SelectContent>
{PROVIDER_TYPE_OPTIONS.map((option) => (
<SelectItem key={option.value} value={option.value}>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label htmlFor="provider-display-name">Display Name</Label>
<Input
id="provider-display-name"
value={form.displayName}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setForm((previous) => ({ ...previous, displayName: event.target.value }));
}}
placeholder="OpenAI Primary"
maxLength={255}
disabled={isSaving}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="provider-api-key">API Key</Label>
<Input
id="provider-api-key"
type="password"
value={form.apiKey}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setForm((previous) => ({ ...previous, apiKey: event.target.value }));
}}
placeholder={editingProvider ? "Enter new key to rotate" : "sk-..."}
autoComplete="new-password"
disabled={isSaving}
/>
<p className="text-xs text-muted-foreground">{apiKeyHint}</p>
</div>
<div className="space-y-2">
<Label htmlFor="provider-base-url">Base URL</Label>
<Input
id="provider-base-url"
value={form.baseUrl}
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setForm((previous) => ({ ...previous, baseUrl: event.target.value }));
}}
placeholder="https://api.provider.com/v1"
disabled={isSaving}
/>
</div>
<div className="space-y-2">
<Label htmlFor="provider-models">Models</Label>
<Textarea
id="provider-models"
value={form.modelsText}
onChange={(event: ChangeEvent<HTMLTextAreaElement>) => {
setForm((previous) => ({ ...previous, modelsText: event.target.value }));
}}
placeholder={"One model ID per line\nExample: gpt-4.1-mini"}
rows={5}
disabled={isSaving}
/>
</div>
{editingProvider ? (
<div className="flex items-center justify-between rounded-md border px-3 py-2">
<div>
<Label htmlFor="provider-active">Provider Status</Label>
<p className="text-xs text-muted-foreground">
Disable to keep configuration without using this provider.
</p>
</div>
<Switch
id="provider-active"
checked={form.isActive}
onCheckedChange={(checked) => {
setForm((previous) => ({ ...previous, isActive: checked }));
}}
disabled={isSaving}
/>
</div>
) : null}
{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 Provider</AlertDialogTitle>
<AlertDialogDescription>
Delete provider "{deleteTarget?.displayName}"? This removes its configuration and
model mappings.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel disabled={isDeleting}>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleDeleteProvider} disabled={isDeleting}>
{isDeleting ? "Deleting..." : "Delete Provider"}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
);
}

View File

@@ -0,0 +1,9 @@
import type { ReactNode } from "react";
export default function OnboardingLayout({ children }: { children: ReactNode }): React.JSX.Element {
return (
<main className="flex min-h-screen items-center justify-center bg-gradient-to-b from-slate-50 to-white p-4 sm:p-6">
<div className="w-full max-w-3xl">{children}</div>
</main>
);
}

View File

@@ -0,0 +1,36 @@
import { redirect } from "next/navigation";
import { OnboardingWizard } from "@/components/onboarding/OnboardingWizard";
import { API_BASE_URL } from "@/lib/config";
export const dynamic = "force-dynamic";
interface OnboardingStatusResponse {
completed: boolean;
}
async function getOnboardingStatus(): Promise<OnboardingStatusResponse> {
try {
const response = await fetch(`${API_BASE_URL}/api/onboarding/status`, {
method: "GET",
cache: "no-store",
});
if (!response.ok) {
return { completed: false };
}
return (await response.json()) as OnboardingStatusResponse;
} catch {
return { completed: false };
}
}
export default async function OnboardingPage(): Promise<React.JSX.Element> {
const status = await getOnboardingStatus();
if (status.completed) {
redirect("/");
}
return <OnboardingWizard />;
}

View File

@@ -0,0 +1,106 @@
import { beforeEach, describe, expect, it, vi } from "vitest";
import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { OnboardingWizard } from "./OnboardingWizard";
const mockPush = vi.fn();
const mockGetStatus = vi.fn();
const mockCreateBreakglass = vi.fn();
const mockConfigureOidc = vi.fn();
const mockTestProvider = vi.fn();
const mockAddProvider = vi.fn();
const mockCompleteOnboarding = vi.fn();
vi.mock("next/navigation", () => ({
useRouter: (): { push: typeof mockPush } => ({
push: mockPush,
}),
}));
vi.mock("@/lib/api/onboarding", () => ({
fetchOnboardingStatus: (): ReturnType<typeof mockGetStatus> => mockGetStatus(),
createBreakglassAdmin: (...args: unknown[]): ReturnType<typeof mockCreateBreakglass> =>
mockCreateBreakglass(...args),
configureOidcProvider: (...args: unknown[]): ReturnType<typeof mockConfigureOidc> =>
mockConfigureOidc(...args),
testOnboardingProvider: (...args: unknown[]): ReturnType<typeof mockTestProvider> =>
mockTestProvider(...args),
addOnboardingProvider: (...args: unknown[]): ReturnType<typeof mockAddProvider> =>
mockAddProvider(...args),
completeOnboarding: (): ReturnType<typeof mockCompleteOnboarding> => mockCompleteOnboarding(),
}));
describe("OnboardingWizard", () => {
beforeEach(() => {
mockPush.mockReset();
mockGetStatus.mockReset();
mockCreateBreakglass.mockReset();
mockConfigureOidc.mockReset();
mockTestProvider.mockReset();
mockAddProvider.mockReset();
mockCompleteOnboarding.mockReset();
mockGetStatus.mockResolvedValue({ completed: false });
mockCreateBreakglass.mockResolvedValue({ id: "bg-1", username: "admin" });
mockConfigureOidc.mockResolvedValue(undefined);
mockTestProvider.mockResolvedValue({ success: true });
mockAddProvider.mockResolvedValue({ id: "provider-1" });
mockCompleteOnboarding.mockResolvedValue(undefined);
});
it("renders the first step with admin setup fields", async () => {
render(<OnboardingWizard />);
expect(
await screen.findByText("Welcome to Mosaic Stack. Let's get you set up.")
).toBeInTheDocument();
expect(screen.getByLabelText("Username")).toBeInTheDocument();
expect(screen.getByLabelText("Password")).toBeInTheDocument();
expect(screen.getByLabelText("Confirm Password")).toBeInTheDocument();
expect(screen.getByText("1. Admin")).toBeInTheDocument();
});
it("validates admin form fields before submit", async () => {
const user = userEvent.setup();
render(<OnboardingWizard />);
await screen.findByText("Welcome to Mosaic Stack. Let's get you set up.");
await user.click(screen.getByRole("button", { name: "Create Admin" }));
expect(screen.getByText("Username must be at least 3 characters.")).toBeInTheDocument();
expect(mockCreateBreakglass).not.toHaveBeenCalled();
});
it("supports happy path with OIDC skipped", async () => {
const user = userEvent.setup();
render(<OnboardingWizard />);
await screen.findByText("Welcome to Mosaic Stack. Let's get you set up.");
await user.type(screen.getByLabelText("Username"), "admin");
await user.type(screen.getByLabelText("Password"), "verysecurepassword");
await user.type(screen.getByLabelText("Confirm Password"), "verysecurepassword");
await user.click(screen.getByRole("button", { name: "Create Admin" }));
await screen.findByText("Configure OIDC Provider (Optional)");
await user.click(screen.getByRole("button", { name: "Skip" }));
await screen.findByText("Add Your First LLM Provider");
await user.type(screen.getByLabelText("Display Name"), "My OpenAI");
await user.type(screen.getByLabelText("API Key"), "sk-test-key");
await user.click(screen.getByRole("button", { name: "Test Connection" }));
await screen.findByText("Connection successful.");
const addProviderButton = screen.getByRole("button", { name: "Add Provider" });
expect(addProviderButton).toBeEnabled();
await user.click(addProviderButton);
await screen.findByText("You're all set");
await user.click(screen.getByRole("button", { name: "Launch Mosaic Stack" }));
await waitFor(() => {
expect(mockPush).toHaveBeenCalledWith("/");
});
});
});

View File

@@ -0,0 +1,791 @@
"use client";
import { useEffect, useMemo, useState } from "react";
import { Check, Loader2 } from "lucide-react";
import { useRouter } from "next/navigation";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import {
addOnboardingProvider,
completeOnboarding,
configureOidcProvider,
createBreakglassAdmin,
fetchOnboardingStatus,
testOnboardingProvider,
} from "@/lib/api/onboarding";
type WizardStep = 1 | 2 | 3 | 4;
type ProviderType = "openai" | "anthropic" | "zai" | "ollama" | "custom";
interface StepDefinition {
id: WizardStep;
label: string;
}
interface ProviderOption {
value: ProviderType;
label: string;
}
const STEPS: StepDefinition[] = [
{ id: 1, label: "1. Admin" },
{ id: 2, label: "2. Auth" },
{ id: 3, label: "3. Provider" },
{ id: 4, label: "4. Launch" },
];
const PROVIDER_OPTIONS: ProviderOption[] = [
{ value: "openai", label: "OpenAI" },
{ value: "anthropic", label: "Anthropic" },
{ value: "zai", label: "Z.ai" },
{ value: "ollama", label: "Ollama" },
{ value: "custom", label: "Custom" },
];
const CLOUD_PROVIDER_TYPES = new Set<ProviderType>(["openai", "anthropic", "zai"]);
const BASE_URL_PROVIDER_TYPES = new Set<ProviderType>(["ollama", "custom"]);
function getErrorMessage(error: unknown, fallback: string): string {
if (error instanceof Error && error.message.trim().length > 0) {
return error.message;
}
return fallback;
}
function isValidHttpUrl(value: string): boolean {
try {
const parsed = new URL(value);
return parsed.protocol === "http:" || parsed.protocol === "https:";
} catch {
return false;
}
}
function mapProviderTypeToApi(type: ProviderType): string {
switch (type) {
case "anthropic":
return "claude";
case "zai":
return "openai";
case "custom":
return "openai";
default:
return type;
}
}
function getProviderDefaultBaseUrl(type: ProviderType): string | undefined {
switch (type) {
case "ollama":
return "http://localhost:11434";
case "anthropic":
return "https://api.anthropic.com/v1";
case "zai":
return "https://api.z.ai/v1";
default:
return undefined;
}
}
function buildProviderName(displayName: string, type: ProviderType): string {
const slug = displayName
.trim()
.toLowerCase()
.replace(/[^a-z0-9]+/g, "-")
.replace(/^-+/, "")
.replace(/-+$/, "");
if (slug.length > 0) {
return slug;
}
return `${type}-provider`;
}
function constantTimeEquals(left: string, right: string): boolean {
if (left.length !== right.length) {
return false;
}
let mismatch = 0;
for (let index = 0; index < left.length; index += 1) {
mismatch |= left.charCodeAt(index) ^ right.charCodeAt(index);
}
return mismatch === 0;
}
export function OnboardingWizard(): React.JSX.Element {
const router = useRouter();
const [currentStep, setCurrentStep] = useState<WizardStep>(1);
const [isCheckingStatus, setIsCheckingStatus] = useState(true);
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState("");
const [isCreatingAdmin, setIsCreatingAdmin] = useState(false);
const [configuredUsername, setConfiguredUsername] = useState<string | null>(null);
const [issuerUrl, setIssuerUrl] = useState("");
const [clientId, setClientId] = useState("");
const [clientSecret, setClientSecret] = useState("");
const [isConfiguringOidc, setIsConfiguringOidc] = useState(false);
const [oidcConfigured, setOidcConfigured] = useState(false);
const [providerType, setProviderType] = useState<ProviderType>("openai");
const [displayName, setDisplayName] = useState("");
const [providerApiKey, setProviderApiKey] = useState("");
const [providerBaseUrl, setProviderBaseUrl] = useState("");
const [isTestingProvider, setIsTestingProvider] = useState(false);
const [isAddingProvider, setIsAddingProvider] = useState(false);
const [providerConfigured, setProviderConfigured] = useState<{
displayName: string;
type: ProviderType;
} | null>(null);
const [providerTestMessage, setProviderTestMessage] = useState<string | null>(null);
const [providerTestSucceeded, setProviderTestSucceeded] = useState(false);
const [testedProviderSignature, setTestedProviderSignature] = useState<string | null>(null);
const [isCompleting, setIsCompleting] = useState(false);
const [errorMessage, setErrorMessage] = useState<string | null>(null);
const requiresApiKey = CLOUD_PROVIDER_TYPES.has(providerType);
const requiresBaseUrl = BASE_URL_PROVIDER_TYPES.has(providerType);
const apiProviderType = mapProviderTypeToApi(providerType);
const resolvedProviderBaseUrl =
requiresBaseUrl && providerBaseUrl.trim().length > 0
? providerBaseUrl.trim()
: getProviderDefaultBaseUrl(providerType);
const providerTestPayload = useMemo(() => {
const payload: { type: string; baseUrl?: string; apiKey?: string } = {
type: apiProviderType,
};
if (resolvedProviderBaseUrl !== undefined && resolvedProviderBaseUrl.length > 0) {
payload.baseUrl = resolvedProviderBaseUrl;
}
const trimmedApiKey = providerApiKey.trim();
if (requiresApiKey && trimmedApiKey.length > 0) {
payload.apiKey = trimmedApiKey;
}
return payload;
}, [apiProviderType, providerApiKey, requiresApiKey, resolvedProviderBaseUrl]);
const providerPayloadSignature = useMemo(
() => JSON.stringify(providerTestPayload),
[providerTestPayload]
);
const canAddProvider =
providerTestSucceeded &&
testedProviderSignature === providerPayloadSignature &&
!isTestingProvider &&
!isAddingProvider;
useEffect(() => {
let cancelled = false;
async function loadStatus(): Promise<void> {
try {
const status = await fetchOnboardingStatus();
if (!cancelled && status.completed) {
router.push("/");
return;
}
} catch {
// Status check failure should not block setup UI.
} finally {
if (!cancelled) {
setIsCheckingStatus(false);
}
}
}
void loadStatus();
return (): void => {
cancelled = true;
};
}, [router]);
const resetProviderVerification = (): void => {
setProviderTestSucceeded(false);
setTestedProviderSignature(null);
setProviderTestMessage(null);
};
const validateAdminStep = (): boolean => {
if (username.trim().length < 3) {
setErrorMessage("Username must be at least 3 characters.");
return false;
}
if (password.length < 8) {
setErrorMessage("Password must be at least 8 characters.");
return false;
}
if (!constantTimeEquals(password, confirmPassword)) {
setErrorMessage("Passwords do not match.");
return false;
}
return true;
};
const validateOidcStep = (): boolean => {
if (issuerUrl.trim().length === 0 || !isValidHttpUrl(issuerUrl.trim())) {
setErrorMessage("Issuer URL must be a valid URL.");
return false;
}
if (clientId.trim().length === 0) {
setErrorMessage("Client ID is required.");
return false;
}
if (clientSecret.trim().length === 0) {
setErrorMessage("Client secret is required.");
return false;
}
return true;
};
const validateProviderStep = (): boolean => {
if (displayName.trim().length === 0) {
setErrorMessage("Display name is required.");
return false;
}
if (requiresApiKey && providerApiKey.trim().length === 0) {
setErrorMessage("API key is required for this provider.");
return false;
}
if (requiresBaseUrl && providerBaseUrl.trim().length === 0) {
setErrorMessage("Base URL is required for this provider.");
return false;
}
if (requiresBaseUrl && !isValidHttpUrl(providerBaseUrl.trim())) {
setErrorMessage("Base URL must be a valid URL.");
return false;
}
return true;
};
const handleCreateAdmin = async (event: React.SyntheticEvent<HTMLFormElement>): Promise<void> => {
event.preventDefault();
setErrorMessage(null);
if (!validateAdminStep()) {
return;
}
setIsCreatingAdmin(true);
try {
const result = await createBreakglassAdmin({
username: username.trim(),
password,
});
setConfiguredUsername(result.username);
setCurrentStep(2);
} catch (error) {
setErrorMessage(getErrorMessage(error, "Failed to create admin account."));
} finally {
setIsCreatingAdmin(false);
}
};
const handleConfigureOidc = async (
event: React.SyntheticEvent<HTMLFormElement>
): Promise<void> => {
event.preventDefault();
setErrorMessage(null);
if (!validateOidcStep()) {
return;
}
setIsConfiguringOidc(true);
try {
await configureOidcProvider({
issuerUrl: issuerUrl.trim(),
clientId: clientId.trim(),
clientSecret: clientSecret.trim(),
});
setOidcConfigured(true);
setCurrentStep(3);
} catch (error) {
setErrorMessage(getErrorMessage(error, "Failed to configure OIDC provider."));
} finally {
setIsConfiguringOidc(false);
}
};
const handleSkipOidc = (): void => {
setErrorMessage(null);
setOidcConfigured(false);
setCurrentStep(3);
};
const handleTestProvider = async (): Promise<void> => {
setErrorMessage(null);
setProviderTestMessage(null);
if (!validateProviderStep()) {
return;
}
setIsTestingProvider(true);
try {
const response = await testOnboardingProvider(providerTestPayload);
if (!response.success) {
setProviderTestSucceeded(false);
setTestedProviderSignature(null);
setErrorMessage(response.error ?? "Connection test failed.");
return;
}
setProviderTestSucceeded(true);
setTestedProviderSignature(providerPayloadSignature);
setProviderTestMessage("Connection successful.");
} catch (error) {
setProviderTestSucceeded(false);
setTestedProviderSignature(null);
setErrorMessage(getErrorMessage(error, "Connection test failed."));
} finally {
setIsTestingProvider(false);
}
};
const handleAddProvider = async (): Promise<void> => {
setErrorMessage(null);
if (!validateProviderStep()) {
return;
}
if (!canAddProvider) {
setErrorMessage("Test connection successfully before adding the provider.");
return;
}
setIsAddingProvider(true);
try {
const trimmedDisplayName = displayName.trim();
const payload: {
name: string;
displayName: string;
type: string;
baseUrl?: string;
apiKey?: string;
} = {
name: buildProviderName(trimmedDisplayName, providerType),
displayName: trimmedDisplayName,
type: apiProviderType,
};
if (resolvedProviderBaseUrl !== undefined && resolvedProviderBaseUrl.length > 0) {
payload.baseUrl = resolvedProviderBaseUrl;
}
const trimmedApiKey = providerApiKey.trim();
if (requiresApiKey && trimmedApiKey.length > 0) {
payload.apiKey = trimmedApiKey;
}
await addOnboardingProvider(payload);
setProviderConfigured({ displayName: trimmedDisplayName, type: providerType });
setCurrentStep(4);
} catch (error) {
setErrorMessage(getErrorMessage(error, "Failed to add provider."));
} finally {
setIsAddingProvider(false);
}
};
const handleCompleteOnboarding = async (): Promise<void> => {
setErrorMessage(null);
setIsCompleting(true);
try {
await completeOnboarding();
router.push("/");
} catch (error) {
setErrorMessage(getErrorMessage(error, "Failed to complete onboarding."));
} finally {
setIsCompleting(false);
}
};
const providerLabel =
PROVIDER_OPTIONS.find((option) => option.value === providerConfigured?.type)?.label ??
providerConfigured?.type ??
"Unknown";
return (
<Card className="mx-auto w-full max-w-2xl shadow-sm">
<CardHeader>
<CardTitle>First-boot onboarding</CardTitle>
<CardDescription>Set up your admin access, auth, and first provider.</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="grid grid-cols-2 gap-2 sm:grid-cols-4">
{STEPS.map((step) => {
const isActive = currentStep === step.id;
const isComplete = currentStep > step.id;
const badgeClass = isComplete
? "bg-emerald-100 text-emerald-700 border-emerald-200"
: isActive
? "bg-blue-100 text-blue-700 border-blue-200"
: "bg-gray-100 text-gray-500 border-gray-200";
return (
<div
key={step.id}
className={`rounded-md border px-3 py-2 text-sm ${badgeClass}`}
aria-current={isActive ? "step" : undefined}
>
<div className="flex items-center gap-2 font-medium">
<span className="inline-flex h-5 w-5 items-center justify-center rounded-full border border-current text-xs">
{isComplete ? <Check className="h-3.5 w-3.5" aria-hidden="true" /> : step.id}
</span>
<span>{step.label}</span>
</div>
</div>
);
})}
</div>
{isCheckingStatus ? (
<div className="flex items-center gap-2 text-sm text-gray-600">
<Loader2 className="h-4 w-4 animate-spin" aria-hidden="true" />
<span>Checking onboarding status...</span>
</div>
) : (
<>
{currentStep === 1 && (
<form onSubmit={handleCreateAdmin} className="space-y-4" noValidate>
<div className="space-y-1">
<h2 className="text-xl font-semibold">
Welcome to Mosaic Stack. Let's get you set up.
</h2>
<p className="text-sm text-gray-600">
Create a breakglass admin account for emergency access.
</p>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-username">Username</Label>
<Input
id="onboarding-username"
value={username}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setUsername(event.target.value);
}}
disabled={isCreatingAdmin}
autoComplete="username"
/>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-password">Password</Label>
<Input
id="onboarding-password"
type="password"
value={password}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setPassword(event.target.value);
}}
disabled={isCreatingAdmin}
autoComplete="new-password"
/>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-confirm-password">Confirm Password</Label>
<Input
id="onboarding-confirm-password"
type="password"
value={confirmPassword}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setConfirmPassword(event.target.value);
}}
disabled={isCreatingAdmin}
autoComplete="new-password"
/>
</div>
<Button type="submit" disabled={isCreatingAdmin}>
{isCreatingAdmin && (
<Loader2 className="mr-2 h-4 w-4 animate-spin" aria-hidden="true" />
)}
<span>Create Admin</span>
</Button>
</form>
)}
{currentStep === 2 && (
<form onSubmit={handleConfigureOidc} className="space-y-4" noValidate>
<div className="space-y-1">
<h2 className="text-xl font-semibold">Configure OIDC Provider (Optional)</h2>
<p className="text-sm text-gray-600">
You can skip this for now and continue with breakglass-only authentication.
</p>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-issuer-url">OIDC Issuer URL</Label>
<Input
id="onboarding-issuer-url"
value={issuerUrl}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setIssuerUrl(event.target.value);
}}
disabled={isConfiguringOidc}
placeholder="https://auth.example.com/application/o/mosaic/"
autoComplete="url"
/>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-client-id">Client ID</Label>
<Input
id="onboarding-client-id"
value={clientId}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setClientId(event.target.value);
}}
disabled={isConfiguringOidc}
/>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-client-secret">Client Secret</Label>
<Input
id="onboarding-client-secret"
type="password"
value={clientSecret}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setClientSecret(event.target.value);
}}
disabled={isConfiguringOidc}
autoComplete="off"
/>
</div>
<div className="flex flex-wrap gap-2">
<Button type="submit" disabled={isConfiguringOidc}>
{isConfiguringOidc && (
<Loader2 className="mr-2 h-4 w-4 animate-spin" aria-hidden="true" />
)}
<span>Configure OIDC</span>
</Button>
<Button
type="button"
variant="outline"
onClick={handleSkipOidc}
disabled={isConfiguringOidc}
>
Skip
</Button>
</div>
</form>
)}
{currentStep === 3 && (
<div className="space-y-4">
<div className="space-y-1">
<h2 className="text-xl font-semibold">Add Your First LLM Provider</h2>
<p className="text-sm text-gray-600">
Test the connection before adding your provider.
</p>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-provider-type">Provider Type</Label>
<Select
value={providerType}
onValueChange={(value) => {
const nextType = value as ProviderType;
setProviderType(nextType);
setProviderApiKey("");
setProviderBaseUrl(
BASE_URL_PROVIDER_TYPES.has(nextType)
? (getProviderDefaultBaseUrl(nextType) ?? "")
: ""
);
resetProviderVerification();
setErrorMessage(null);
}}
disabled={isTestingProvider || isAddingProvider}
>
<SelectTrigger id="onboarding-provider-type">
<SelectValue placeholder="Select provider type" />
</SelectTrigger>
<SelectContent>
{PROVIDER_OPTIONS.map((option) => (
<SelectItem key={option.value} value={option.value}>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div className="grid gap-2">
<Label htmlFor="onboarding-provider-display-name">Display Name</Label>
<Input
id="onboarding-provider-display-name"
value={displayName}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setDisplayName(event.target.value);
resetProviderVerification();
setErrorMessage(null);
}}
disabled={isTestingProvider || isAddingProvider}
placeholder="My OpenAI Provider"
/>
</div>
{requiresApiKey && (
<div className="grid gap-2">
<Label htmlFor="onboarding-provider-api-key">API Key</Label>
<Input
id="onboarding-provider-api-key"
type="password"
value={providerApiKey}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setProviderApiKey(event.target.value);
resetProviderVerification();
setErrorMessage(null);
}}
disabled={isTestingProvider || isAddingProvider}
autoComplete="off"
/>
</div>
)}
{requiresBaseUrl && (
<div className="grid gap-2">
<Label htmlFor="onboarding-provider-base-url">Base URL</Label>
<Input
id="onboarding-provider-base-url"
value={providerBaseUrl}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
setProviderBaseUrl(event.target.value);
resetProviderVerification();
setErrorMessage(null);
}}
disabled={isTestingProvider || isAddingProvider}
placeholder="http://localhost:11434"
autoComplete="url"
/>
</div>
)}
{providerTestMessage && (
<p className="text-sm text-emerald-700" role="status">
{providerTestMessage}
</p>
)}
<div className="flex flex-wrap gap-2">
<Button
type="button"
variant="outline"
onClick={() => {
void handleTestProvider();
}}
disabled={isTestingProvider || isAddingProvider}
>
{isTestingProvider && (
<Loader2 className="mr-2 h-4 w-4 animate-spin" aria-hidden="true" />
)}
<span>Test Connection</span>
</Button>
<Button
type="button"
onClick={() => {
void handleAddProvider();
}}
disabled={!canAddProvider}
>
{isAddingProvider && (
<Loader2 className="mr-2 h-4 w-4 animate-spin" aria-hidden="true" />
)}
<span>Add Provider</span>
</Button>
</div>
</div>
)}
{currentStep === 4 && (
<div className="space-y-4">
<div className="space-y-1">
<h2 className="text-xl font-semibold">You're all set</h2>
<p className="text-sm text-gray-600">
Review the setup summary and launch Mosaic Stack.
</p>
</div>
<div className="rounded-md border bg-gray-50 p-4">
<ul className="space-y-2 text-sm">
<li>
<span className="font-medium">Admin:</span>{" "}
{configuredUsername ? `${configuredUsername} configured` : "Not configured"}
</li>
<li>
<span className="font-medium">OIDC:</span>{" "}
{oidcConfigured ? "Configured" : "Skipped for now"}
</li>
<li>
<span className="font-medium">LLM Provider:</span>{" "}
{providerConfigured
? `${providerConfigured.displayName} (${providerLabel})`
: "Not configured"}
</li>
</ul>
</div>
<Button
type="button"
onClick={() => void handleCompleteOnboarding()}
disabled={isCompleting}
>
{isCompleting && (
<Loader2 className="mr-2 h-4 w-4 animate-spin" aria-hidden="true" />
)}
<span>Launch Mosaic Stack</span>
</Button>
</div>
)}
</>
)}
{errorMessage && (
<p className="text-sm text-red-600" role="alert">
{errorMessage}
</p>
)}
</CardContent>
</Card>
);
}
export default OnboardingWizard;

View File

@@ -0,0 +1,51 @@
"use client";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { Card, CardContent } from "@/components/ui/card";
interface FleetSettingsLink {
href: string;
label: string;
}
const FLEET_SETTINGS_LINKS: FleetSettingsLink[] = [
{ href: "/settings/providers", label: "Providers" },
{ href: "/settings/agent-config", label: "Agent Config" },
{ href: "/settings/auth", label: "Authentication" },
];
export function FleetSettingsNav(): React.JSX.Element {
const pathname = usePathname();
return (
<Card>
<CardContent className="px-4 py-3 flex flex-wrap items-center gap-2">
<Link
href="/settings"
className="inline-flex h-9 items-center rounded-md px-3 text-sm font-medium text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
>
All Settings
</Link>
{FLEET_SETTINGS_LINKS.map((link) => {
const isActive = pathname === link.href;
return (
<Link
key={link.href}
href={link.href}
className={`inline-flex h-9 items-center rounded-md px-3 text-sm font-medium transition-colors ${
isActive
? "bg-primary text-primary-foreground"
: "text-muted-foreground hover:text-foreground hover:bg-muted"
}`}
>
{link.label}
</Link>
);
})}
</CardContent>
</Card>
);
}

View File

@@ -0,0 +1,172 @@
import { beforeEach, describe, expect, it, vi } from "vitest";
import * as client from "./client";
import {
createFleetProvider,
deleteFleetOidcConfig,
deleteFleetProvider,
fetchFleetAgentConfig,
fetchFleetOidcConfig,
fetchFleetProviders,
resetBreakglassAdminPassword,
updateFleetAgentConfig,
updateFleetOidcConfig,
updateFleetProvider,
} from "./fleet-settings";
vi.mock("./client");
beforeEach((): void => {
vi.clearAllMocks();
});
describe("fetchFleetProviders", (): void => {
it("calls providers list endpoint", async (): Promise<void> => {
vi.mocked(client.apiGet).mockResolvedValueOnce([] as never);
await fetchFleetProviders();
expect(client.apiGet).toHaveBeenCalledWith("/api/fleet-settings/providers");
});
});
describe("createFleetProvider", (): void => {
it("posts provider payload", async (): Promise<void> => {
vi.mocked(client.apiPost).mockResolvedValueOnce({ id: "provider-1" } as never);
await createFleetProvider({
name: "openai-main",
displayName: "OpenAI Main",
type: "openai",
baseUrl: "https://api.openai.com/v1",
apiKey: "sk-test",
models: [
{ id: "gpt-4.1-mini", name: "gpt-4.1-mini" },
{ id: "gpt-4o-mini", name: "gpt-4o-mini" },
],
});
expect(client.apiPost).toHaveBeenCalledWith("/api/fleet-settings/providers", {
name: "openai-main",
displayName: "OpenAI Main",
type: "openai",
baseUrl: "https://api.openai.com/v1",
apiKey: "sk-test",
models: [
{ id: "gpt-4.1-mini", name: "gpt-4.1-mini" },
{ id: "gpt-4o-mini", name: "gpt-4o-mini" },
],
});
});
});
describe("updateFleetProvider", (): void => {
it("patches provider endpoint with updates", async (): Promise<void> => {
vi.mocked(client.apiPatch).mockResolvedValueOnce(undefined as never);
await updateFleetProvider("provider-1", { displayName: "OpenAI Updated", isActive: true });
expect(client.apiPatch).toHaveBeenCalledWith("/api/fleet-settings/providers/provider-1", {
displayName: "OpenAI Updated",
isActive: true,
});
});
});
describe("deleteFleetProvider", (): void => {
it("deletes provider endpoint", async (): Promise<void> => {
vi.mocked(client.apiDelete).mockResolvedValueOnce(undefined as never);
await deleteFleetProvider("provider-1");
expect(client.apiDelete).toHaveBeenCalledWith("/api/fleet-settings/providers/provider-1");
});
});
describe("fetchFleetAgentConfig", (): void => {
it("calls agent config endpoint", async (): Promise<void> => {
vi.mocked(client.apiGet).mockResolvedValueOnce({
primaryModel: null,
fallbackModels: [],
personality: null,
} as never);
await fetchFleetAgentConfig();
expect(client.apiGet).toHaveBeenCalledWith("/api/fleet-settings/agent-config");
});
});
describe("updateFleetAgentConfig", (): void => {
it("patches agent config", async (): Promise<void> => {
vi.mocked(client.apiPatch).mockResolvedValueOnce(undefined as never);
await updateFleetAgentConfig({
primaryModel: "openai:gpt-4o-mini",
fallbackModels: ["openai:gpt-4.1-mini"],
personality: "System behavior",
});
expect(client.apiPatch).toHaveBeenCalledWith("/api/fleet-settings/agent-config", {
primaryModel: "openai:gpt-4o-mini",
fallbackModels: ["openai:gpt-4.1-mini"],
personality: "System behavior",
});
});
});
describe("fetchFleetOidcConfig", (): void => {
it("calls oidc endpoint", async (): Promise<void> => {
vi.mocked(client.apiGet).mockResolvedValueOnce({ configured: false } as never);
await fetchFleetOidcConfig();
expect(client.apiGet).toHaveBeenCalledWith("/api/fleet-settings/oidc");
});
});
describe("updateFleetOidcConfig", (): void => {
it("issues a PUT request with payload", async (): Promise<void> => {
vi.mocked(client.apiRequest).mockResolvedValueOnce(undefined as never);
await updateFleetOidcConfig({
issuerUrl: "https://issuer.example.com",
clientId: "mosaic-client",
clientSecret: "top-secret",
});
expect(client.apiRequest).toHaveBeenCalledWith("/api/fleet-settings/oidc", {
method: "PUT",
body: JSON.stringify({
issuerUrl: "https://issuer.example.com",
clientId: "mosaic-client",
clientSecret: "top-secret",
}),
});
});
});
describe("deleteFleetOidcConfig", (): void => {
it("deletes oidc endpoint", async (): Promise<void> => {
vi.mocked(client.apiDelete).mockResolvedValueOnce(undefined as never);
await deleteFleetOidcConfig();
expect(client.apiDelete).toHaveBeenCalledWith("/api/fleet-settings/oidc");
});
});
describe("resetBreakglassAdminPassword", (): void => {
it("posts breakglass reset payload", async (): Promise<void> => {
vi.mocked(client.apiPost).mockResolvedValueOnce(undefined as never);
await resetBreakglassAdminPassword({
username: "admin",
newPassword: "new-password-123",
});
expect(client.apiPost).toHaveBeenCalledWith("/api/fleet-settings/breakglass/reset-password", {
username: "admin",
newPassword: "new-password-123",
});
});
});

View File

@@ -0,0 +1,129 @@
import { apiDelete, apiGet, apiPatch, apiPost, apiRequest } from "./client";
export interface FleetProviderModel {
id: string;
name?: string;
}
export interface FleetProvider {
id: string;
name: string;
displayName: string;
type: string;
baseUrl: string | null;
isActive: boolean;
models: unknown;
}
export interface CreateFleetProviderRequest {
name: string;
displayName: string;
type: string;
baseUrl?: string;
apiKey?: string;
apiType?: string;
models?: FleetProviderModel[];
}
export interface UpdateFleetProviderRequest {
displayName?: string;
baseUrl?: string;
apiKey?: string;
isActive?: boolean;
models?: FleetProviderModel[];
}
export interface FleetAgentConfig {
primaryModel: string | null;
fallbackModels: string[];
personality: string | null;
}
interface FleetAgentConfigResponse {
primaryModel: string | null;
fallbackModels: unknown[];
personality: string | null;
}
export interface UpdateFleetAgentConfigRequest {
primaryModel?: string;
fallbackModels?: string[];
personality?: string;
}
export interface FleetOidcConfig {
issuerUrl?: string;
clientId?: string;
configured: boolean;
}
export interface UpdateFleetOidcConfigRequest {
issuerUrl: string;
clientId: string;
clientSecret: string;
}
export interface ResetBreakglassAdminPasswordRequest {
username: string;
newPassword: string;
}
function normalizeStringArray(value: unknown[]): string[] {
return value.filter((item): item is string => typeof item === "string");
}
export async function fetchFleetProviders(): Promise<FleetProvider[]> {
return apiGet<FleetProvider[]>("/api/fleet-settings/providers");
}
export async function createFleetProvider(
data: CreateFleetProviderRequest
): Promise<{ id: string }> {
return apiPost<{ id: string }>("/api/fleet-settings/providers", data);
}
export async function updateFleetProvider(
providerId: string,
data: UpdateFleetProviderRequest
): Promise<void> {
await apiPatch<unknown>(`/api/fleet-settings/providers/${providerId}`, data);
}
export async function deleteFleetProvider(providerId: string): Promise<void> {
await apiDelete<unknown>(`/api/fleet-settings/providers/${providerId}`);
}
export async function fetchFleetAgentConfig(): Promise<FleetAgentConfig> {
const response = await apiGet<FleetAgentConfigResponse>("/api/fleet-settings/agent-config");
return {
primaryModel: response.primaryModel,
fallbackModels: normalizeStringArray(response.fallbackModels),
personality: response.personality,
};
}
export async function updateFleetAgentConfig(data: UpdateFleetAgentConfigRequest): Promise<void> {
await apiPatch<unknown>("/api/fleet-settings/agent-config", data);
}
export async function fetchFleetOidcConfig(): Promise<FleetOidcConfig> {
return apiGet<FleetOidcConfig>("/api/fleet-settings/oidc");
}
export async function updateFleetOidcConfig(data: UpdateFleetOidcConfigRequest): Promise<void> {
await apiRequest<unknown>("/api/fleet-settings/oidc", {
method: "PUT",
body: JSON.stringify(data),
});
}
export async function deleteFleetOidcConfig(): Promise<void> {
await apiDelete<unknown>("/api/fleet-settings/oidc");
}
export async function resetBreakglassAdminPassword(
data: ResetBreakglassAdminPasswordRequest
): Promise<void> {
await apiPost<unknown>("/api/fleet-settings/breakglass/reset-password", data);
}

View File

@@ -17,3 +17,4 @@ export * from "./dashboard";
export * from "./projects"; export * from "./projects";
export * from "./workspaces"; export * from "./workspaces";
export * from "./admin"; export * from "./admin";
export * from "./fleet-settings";

View File

@@ -0,0 +1,80 @@
import { apiGet, apiPost } from "./client";
export interface OnboardingStatus {
completed: boolean;
}
export interface BreakglassAdminRequest {
username: string;
password: string;
}
export interface BreakglassAdminResponse {
id: string;
username: string;
}
export interface ConfigureOidcRequest {
issuerUrl: string;
clientId: string;
clientSecret: string;
}
export interface ProviderModel {
id: string;
name?: string;
}
export interface AddOnboardingProviderRequest {
name: string;
displayName: string;
type: string;
baseUrl?: string;
apiKey?: string;
models?: ProviderModel[];
}
export interface AddOnboardingProviderResponse {
id: string;
}
export interface TestOnboardingProviderRequest {
type: string;
baseUrl?: string;
apiKey?: string;
}
export interface TestOnboardingProviderResponse {
success: boolean;
error?: string;
}
export async function fetchOnboardingStatus(): Promise<OnboardingStatus> {
return apiGet<OnboardingStatus>("/api/onboarding/status");
}
export async function createBreakglassAdmin(
request: BreakglassAdminRequest
): Promise<BreakglassAdminResponse> {
return apiPost<BreakglassAdminResponse>("/api/onboarding/breakglass", request);
}
export async function configureOidcProvider(request: ConfigureOidcRequest): Promise<void> {
await apiPost<unknown>("/api/onboarding/oidc", request);
}
export async function addOnboardingProvider(
request: AddOnboardingProviderRequest
): Promise<AddOnboardingProviderResponse> {
return apiPost<AddOnboardingProviderResponse>("/api/onboarding/provider", request);
}
export async function testOnboardingProvider(
request: TestOnboardingProviderRequest
): Promise<TestOnboardingProviderResponse> {
return apiPost<TestOnboardingProviderResponse>("/api/onboarding/provider/test", request);
}
export async function completeOnboarding(): Promise<void> {
await apiPost<unknown>("/api/onboarding/complete");
}

View File

@@ -25,7 +25,9 @@ export interface Project {
name: string; name: string;
description: string | null; description: string | null;
status: ProjectStatus; status: ProjectStatus;
priority?: string | null;
startDate: string | null; startDate: string | null;
dueDate?: string | null;
endDate: string | null; endDate: string | null;
creatorId: string; creatorId: string;
domainId: string | null; domainId: string | null;
@@ -35,6 +37,54 @@ export interface Project {
updatedAt: string; updatedAt: string;
} }
/**
* Minimal creator details included on project detail response
*/
export interface ProjectCreator {
id: string;
name: string | null;
email: string;
}
/**
* Task row included on project detail response
*/
export interface ProjectTaskSummary {
id: string;
title: string;
status: string;
priority: string;
dueDate: string | null;
}
/**
* Event row included on project detail response
*/
export interface ProjectEventSummary {
id: string;
title: string;
startTime: string;
endTime: string | null;
}
/**
* Counts included on project detail response
*/
export interface ProjectDetailCounts {
tasks: number;
events: number;
}
/**
* Single-project response with related details
*/
export interface ProjectDetail extends Project {
creator: ProjectCreator;
tasks: ProjectTaskSummary[];
events: ProjectEventSummary[];
_count: ProjectDetailCounts;
}
/** /**
* DTO for creating a new project * DTO for creating a new project
*/ */
@@ -72,8 +122,8 @@ export async function fetchProjects(workspaceId?: string): Promise<Project[]> {
/** /**
* Fetch a single project by ID * Fetch a single project by ID
*/ */
export async function fetchProject(id: string, workspaceId?: string): Promise<Project> { export async function fetchProject(id: string, workspaceId?: string): Promise<ProjectDetail> {
return apiGet<Project>(`/api/projects/${id}`, workspaceId); return apiGet<ProjectDetail>(`/api/projects/${id}`, workspaceId);
} }
/** /**

View File

@@ -46,3 +46,21 @@ export async function updateTask(
const res = await apiPatch<ApiResponse<Task>>(`/api/tasks/${id}`, data, workspaceId); const res = await apiPatch<ApiResponse<Task>>(`/api/tasks/${id}`, data, workspaceId);
return res.data; return res.data;
} }
export interface CreateTaskInput {
title: string;
description?: string;
status?: TaskStatus;
priority?: TaskPriority;
dueDate?: string;
projectId?: string;
}
/**
* Create a new task
*/
export async function createTask(data: CreateTaskInput, workspaceId?: string): Promise<Task> {
const { apiPost } = await import("./client");
const res = await apiPost<ApiResponse<Task>>("/api/tasks", data, workspaceId);
return res.data;
}

View File

@@ -121,9 +121,15 @@ services:
OLLAMA_ENDPOINT: ${OLLAMA_ENDPOINT} OLLAMA_ENDPOINT: ${OLLAMA_ENDPOINT}
OPENBAO_ADDR: ${OPENBAO_ADDR} OPENBAO_ADDR: ${OPENBAO_ADDR}
ENCRYPTION_KEY: ${ENCRYPTION_KEY} ENCRYPTION_KEY: ${ENCRYPTION_KEY}
# MS22: fleet encryption key (AES-256-GCM for provider API keys, agent tokens)
MOSAIC_SECRET_KEY: ${MOSAIC_SECRET_KEY}
# MS22: Docker socket for per-user container lifecycle (optional: set DOCKER_HOST for TCP)
DOCKER_HOST: ${DOCKER_HOST:-}
# Matrix bridge (optional — configure after Synapse is running) # Matrix bridge (optional — configure after Synapse is running)
MATRIX_HOMESERVER_URL: ${MATRIX_HOMESERVER_URL:-http://synapse:8008} MATRIX_HOMESERVER_URL: ${MATRIX_HOMESERVER_URL:-http://synapse:8008}
MATRIX_ACCESS_TOKEN: ${MATRIX_ACCESS_TOKEN:-} MATRIX_ACCESS_TOKEN: ${MATRIX_ACCESS_TOKEN:-}
# System admin IDs (comma-separated user UUIDs) for auth settings access
SYSTEM_ADMIN_IDS: ${SYSTEM_ADMIN_IDS:-}
MATRIX_BOT_USER_ID: ${MATRIX_BOT_USER_ID:-} MATRIX_BOT_USER_ID: ${MATRIX_BOT_USER_ID:-}
MATRIX_CONTROL_ROOM_ID: ${MATRIX_CONTROL_ROOM_ID:-} MATRIX_CONTROL_ROOM_ID: ${MATRIX_CONTROL_ROOM_ID:-}
MATRIX_WORKSPACE_ID: ${MATRIX_WORKSPACE_ID:-} MATRIX_WORKSPACE_ID: ${MATRIX_WORKSPACE_ID:-}
@@ -142,6 +148,8 @@ services:
NEXT_PUBLIC_APP_URL: ${NEXT_PUBLIC_APP_URL} NEXT_PUBLIC_APP_URL: ${NEXT_PUBLIC_APP_URL}
NEXT_PUBLIC_API_URL: ${NEXT_PUBLIC_API_URL} NEXT_PUBLIC_API_URL: ${NEXT_PUBLIC_API_URL}
TRUSTED_ORIGINS: ${TRUSTED_ORIGINS:-} TRUSTED_ORIGINS: ${TRUSTED_ORIGINS:-}
volumes:
- /var/run/docker.sock:/var/run/docker.sock:ro
healthcheck: healthcheck:
test: test:
[ [

3
docker/.env.example Normal file
View File

@@ -0,0 +1,3 @@
DATABASE_URL=postgresql://mosaic:changeme@postgres:5432/mosaic
DATABASE_PASSWORD=changeme
MOSAIC_SECRET_KEY=your-secret-key-at-least-32-characters-long

40
docker/README.md Normal file
View File

@@ -0,0 +1,40 @@
# Mosaic Docker (Core Services)
This folder includes the Compose stack for **core Mosaic services only**:
- `mosaic-api`
- `mosaic-web`
- `postgres`
User OpenClaw containers are **not** defined in Compose. They are created and managed dynamically by the API's `ContainerLifecycleService` through Docker socket access.
## Start the stack
```bash
docker compose -f docker/mosaic-compose.yml up -d
```
## Required environment variables
- `DATABASE_URL`
- `MOSAIC_SECRET_KEY`
- `DATABASE_PASSWORD`
Use [`docker/.env.example`](./.env.example) as a starting point.
## Architecture overview
See the design doc: [`docs/design/MS22-DB-CENTRIC-ARCHITECTURE.md`](../docs/design/MS22-DB-CENTRIC-ARCHITECTURE.md)
`mosaic-agents` is an internal-only bridge network reserved for dynamically created user containers.
## OpenClaw entrypoint behavior
`docker/openclaw-entrypoint.sh` is intended for dynamically created user OpenClaw containers:
1. Validates required env vars (`MOSAIC_API_URL`, `AGENT_TOKEN`, `AGENT_ID`).
2. Fetches agent-specific OpenClaw config from Mosaic API internal endpoint.
3. Writes the config to `/tmp/openclaw.json`.
4. Starts OpenClaw gateway with `OPENCLAW_CONFIG_PATH=/tmp/openclaw.json`.
`docker/openclaw-healthcheck.sh` probes `http://localhost:18789/health` for container health.

53
docker/mosaic-compose.yml Normal file
View File

@@ -0,0 +1,53 @@
services:
mosaic-api:
image: mosaic/api:latest
environment:
DATABASE_URL: ${DATABASE_URL}
MOSAIC_SECRET_KEY: ${MOSAIC_SECRET_KEY}
volumes:
- /var/run/docker.sock:/var/run/docker.sock
networks:
- internal
healthcheck:
test: ["CMD", "curl", "-f", "http://localhost:4000/api/health"]
interval: 30s
timeout: 10s
retries: 3
mosaic-web:
image: mosaic/web:latest
environment:
NEXT_PUBLIC_API_URL: http://mosaic-api:4000
ports:
- "3000:3000"
networks:
- internal
depends_on:
mosaic-api:
condition: service_healthy
postgres:
image: postgres:17-alpine
environment:
POSTGRES_DB: mosaic
POSTGRES_USER: mosaic
POSTGRES_PASSWORD: ${DATABASE_PASSWORD}
volumes:
- postgres-data:/var/lib/postgresql/data
networks:
- internal
healthcheck:
test: ["CMD-SHELL", "pg_isready -U mosaic"]
interval: 10s
timeout: 5s
retries: 5
networks:
internal:
driver: bridge
mosaic-agents:
driver: bridge
internal: true
volumes:
postgres-data:

20
docker/openclaw-entrypoint.sh Executable file
View File

@@ -0,0 +1,20 @@
#!/bin/sh
set -e
: "${MOSAIC_API_URL:?MOSAIC_API_URL is required}"
: "${AGENT_TOKEN:?AGENT_TOKEN is required}"
: "${AGENT_ID:?AGENT_ID is required}"
echo "[entrypoint] Fetching config for agent ${AGENT_ID}..."
HTTP_CODE=$(curl -sf -w "%{http_code}" \
"${MOSAIC_API_URL}/api/internal/agent-config/${AGENT_ID}" \
-H "Authorization: Bearer ${AGENT_TOKEN}" \
-o /tmp/openclaw.json)
if [ "$HTTP_CODE" != "200" ]; then
echo "[entrypoint] ERROR: Config fetch failed with HTTP ${HTTP_CODE}"
exit 1
fi
echo "[entrypoint] Config loaded. Starting OpenClaw gateway..."
export OPENCLAW_CONFIG_PATH=/tmp/openclaw.json
exec openclaw gateway run --bind lan --auth token

2
docker/openclaw-healthcheck.sh Executable file
View File

@@ -0,0 +1,2 @@
#!/bin/sh
curl -sf http://localhost:18789/health || exit 1

View File

@@ -77,15 +77,15 @@ Remaining estimate: ~143K tokens (Codex budget).
Design doc: `docs/design/MS22-DB-CENTRIC-ARCHITECTURE.md` Design doc: `docs/design/MS22-DB-CENTRIC-ARCHITECTURE.md`
| Task ID | Status | Phase | Description | Issue | Scope | Branch | Depends On | Blocks | Assigned Worker | Started | Completed | Est Tokens | Act Tokens | Notes | | Task ID | Status | Phase | Description | Issue | Scope | Branch | Depends On | Blocks | Assigned Worker | Started | Completed | Est Tokens | Act Tokens | Notes |
| -------- | ----------- | -------- | --------------------------------------------------------------------------------------------------------------------- | ----- | ------- | ---------------------------- | ---------- | --------------- | --------------- | ------- | --------- | ---------- | ---------- | ----- | | -------- | ------ | -------- | --------------------------------------------------------------------------------------------------------------------- | ----- | ------- | ---------------------------- | ---------- | --------------- | --------------- | ------- | --------- | ---------- | ---------- | ----- |
| MS22-P1a | done | phase-1a | Prisma schema: SystemConfig, BreakglassUser, LlmProvider, UserContainer, SystemContainer, UserAgentConfig + migration | — | api | feat/ms22-p1a-schema | — | P1b,P1c,P1d,P1e | — | — | — | 20K | — | | | MS22-P1a | done | phase-1a | Prisma schema: SystemConfig, BreakglassUser, LlmProvider, UserContainer, SystemContainer, UserAgentConfig + migration | — | api | feat/ms22-p1a-schema | — | P1b,P1c,P1d,P1e | — | — | — | 20K | — | |
| MS22-P1b | done | phase-1b | Encryption service (AES-256-GCM) for API keys and tokens | — | api | feat/ms22-p1b-crypto | — | P1c,P1e,P1g | — | — | — | 15K | — | | | MS22-P1b | done | phase-1b | Encryption service (AES-256-GCM) for API keys and tokens | — | api | feat/ms22-p1b-crypto | — | P1c,P1e,P1g | — | — | — | 15K | — | |
| MS22-P1c | not-started | phase-1c | Internal config endpoint: assemble openclaw.json from DB | — | api | feat/ms22-p1c-config-api | P1a,P1b | P1i,P1j | — | — | — | 20K | — | | | MS22-P1c | done | phase-1c | Internal config endpoint: assemble openclaw.json from DB | — | api | feat/ms22-p1c-config-api | P1a,P1b | P1i,P1j | — | — | — | 20K | — | |
| MS22-P1d | not-started | phase-1d | ContainerLifecycleService: Docker API (dockerode) start/stop/health/reap | — | api | feat/ms22-p1d-container-mgr | P1a | P1i,P1k | — | — | — | 25K | — | | | MS22-P1d | done | phase-1d | ContainerLifecycleService: Docker API (dockerode) start/stop/health/reap | — | api | feat/ms22-p1d-container-mgr | P1a | P1i,P1k | — | — | — | 25K | — | |
| MS22-P1e | not-started | phase-1e | Onboarding API: breakglass, OIDC, provider, agents, complete | — | api | feat/ms22-p1e-onboarding-api | P1a,P1b | P1f | — | — | — | 20K | — | | | MS22-P1e | done | phase-1e | Onboarding API: breakglass, OIDC, provider, agents, complete | — | api | feat/ms22-p1e-onboarding-api | P1a,P1b | P1f | — | — | — | 20K | — | |
| MS22-P1f | not-started | phase-1f | Onboarding wizard WebUI (multi-step form) | — | web | feat/ms22-p1f-onboarding-ui | P1e | — | — | — | — | 25K | — | | | MS22-P1f | done | phase-1f | Onboarding wizard WebUI (multi-step form) | — | web | feat/ms22-p1f-onboarding-ui | P1e | — | — | — | — | 25K | — | |
| MS22-P1g | not-started | phase-1g | Settings API: CRUD providers, agent config, OIDC, breakglass | — | api | feat/ms22-p1g-settings-api | P1a,P1b | P1h | — | — | — | 20K | — | | | MS22-P1g | done | phase-1g | Settings API: CRUD providers, agent config, OIDC, breakglass | — | api | feat/ms22-p1g-settings-api | P1a,P1b | P1h | — | — | — | 20K | — | |
| MS22-P1h | not-started | phase-1h | Settings UI: Providers, Agent Config, Auth pages | — | web | feat/ms22-p1h-settings-ui | P1g | — | — | — | — | 25K | — | | | MS22-P1h | done | phase-1h | Settings UI: Providers, Agent Config, Auth pages | — | web | feat/ms22-p1h-settings-ui | P1g | — | — | — | — | 25K | — | |
| MS22-P1i | not-started | phase-1i | Chat proxy: route WebUI chat to user's OpenClaw container (SSE) | — | api+web | feat/ms22-p1i-chat-proxy | P1c,P1d | — | — | — | — | 20K | — | | | MS22-P1i | done | phase-1i | Chat proxy: route WebUI chat to user's OpenClaw container (SSE) | — | api+web | feat/ms22-p1i-chat-proxy | P1c,P1d | — | — | — | — | 20K | — | |
| MS22-P1j | not-started | phase-1j | Docker entrypoint + health checks + core compose | — | docker | feat/ms22-p1j-docker | P1c | — | — | — | — | 10K | — | | | MS22-P1j | done | phase-1j | Docker entrypoint + health checks + core compose | — | docker | feat/ms22-p1j-docker | P1c | — | — | — | — | 10K | — | |
| MS22-P1k | not-started | phase-1k | Idle reaper cron: stop inactive user containers | — | api | feat/ms22-p1k-idle-reaper | P1d | — | — | — | — | 10K | — | | | MS22-P1k | done | phase-1k | Idle reaper cron: stop inactive user containers | — | api | feat/ms22-p1k-idle-reaper | P1d | — | — | — | — | 10K | — | |

View File

@@ -0,0 +1,157 @@
# MS22 Phase 1 Module Audit
Date: 2026-03-01
Branch: `fix/ms22-audit`
Scope:
- `apps/api/src/container-lifecycle/`
- `apps/api/src/crypto/`
- `apps/api/src/agent-config/`
- `apps/api/src/onboarding/`
- `apps/api/src/fleet-settings/`
- `apps/api/src/chat-proxy/`
## Summary
Audit completed for module wiring, security controls, input validation, and error handling.
Findings:
1. `chat-proxy`: raw internal/upstream error messages were returned to clients over SSE (fixed).
2. `chat-proxy`: proxy requests to OpenClaw did not forward the container bearer token returned by lifecycle startup (fixed).
3. `agent-config`: token validation returned early and used length-gated compare logic, creating avoidable timing side-channel behavior (hardened).
## Module Review Results
### 1) `container-lifecycle`
- NestJS module dependency audit:
- `ContainerLifecycleModule` imports `ConfigModule`, `PrismaModule`, and `CryptoModule` required by `ContainerLifecycleService`.
- Providers/exports are correct (`ContainerLifecycleService` provided and exported).
- Security review:
- Container operations are user-scoped by `userId` and do not expose cross-user selectors in this module.
- AES token generation/decryption delegated to `CryptoService`.
- Input validation:
- No controller endpoints in this module; no direct request DTO surface here.
- Error handling:
- No direct HTTP layer here; errors flow to callers/global filter.
- Finding status: **No issues found in this module**.
### 2) `crypto`
- NestJS module dependency audit:
- `CryptoModule` correctly imports `ConfigModule` for `ConfigService`.
- `CryptoService` is correctly provided/exported.
- Security review:
- AES-256-GCM is implemented correctly.
- 96-bit IV generated via `randomBytes(12)` per encryption.
- Auth tag captured and verified on decrypt (`setAuthTag` + `decipher.final()`).
- HKDF derives a fixed 32-byte key from `MOSAIC_SECRET_KEY`.
- Input validation:
- No DTO/request surface in this module.
- Error handling:
- Decrypt failures are normalized to `Failed to decrypt value`.
- Finding status: **No issues found in this module**.
### 3) `agent-config`
- NestJS module dependency audit:
- `AgentConfigModule` imports `PrismaModule` + `CryptoModule`; `AgentConfigService` and `AgentConfigGuard` are provided.
- Controller/guard/service wiring is correct.
- Security review:
- Bearer token comparisons used `timingSafeEqual`, but returned early on first match and performed length-gated comparison.
- Internal route (`/api/internal/agent-config/:id`) is access-controlled by bearer token guard and container-id match (`containerAuth.id === :id`).
- Input validation:
- Header token extraction and route param are manually handled (no DTO for `:id`, acceptable for current use but should remain constrained).
- Error handling:
- Service throws typed Nest exceptions for not-found paths.
- Finding status: **Issue found and fixed**.
### 4) `onboarding`
- NestJS module dependency audit:
- `OnboardingModule` imports required dependencies (`PrismaModule`, `CryptoModule`; `ConfigModule` currently unused but harmless).
- Providers/controllers are correctly declared.
- Security review:
- `OnboardingGuard` blocks all mutating onboarding routes once `onboarding.completed=true`.
- Onboarding cannot be re-run via guarded endpoints after completion.
- Input validation:
- DTOs use `class-validator` decorators for all request bodies.
- Error handling:
- Uses typed Nest exceptions (`ConflictException`, `BadRequestException`).
- Finding status: **No issues found in this module**.
### 5) `fleet-settings`
- NestJS module dependency audit:
- `FleetSettingsModule` imports `AuthModule`, `PrismaModule`, `CryptoModule` required by its controller/service.
- Provider/export wiring is correct for `FleetSettingsService`.
- Security review:
- Class-level `AuthGuard` protects all routes.
- Admin-only routes additionally use `AdminGuard` (`oidc` and `breakglass/reset-password`).
- Provider list/get responses do not expose `apiKey`.
- OIDC read response intentionally omits `clientSecret`.
- Input validation:
- DTOs are decorated with `class-validator`.
- Error handling:
- Ownership/not-found conditions use typed exceptions.
- Finding status: **No issues found in this module**.
### 6) `chat-proxy`
- NestJS module dependency audit:
- `ChatProxyModule` imports `AuthModule`, `PrismaModule`, `ContainerLifecycleModule` needed by controller/service.
- Provider/controller wiring is correct.
- Security review:
- User identity comes from `AuthGuard`; no user-provided container selector, so no cross-user container proxy path found.
- **Issue fixed:** gateway bearer token was not forwarded on proxied requests.
- **Issue fixed:** SSE error events exposed raw internal exception messages.
- Input validation:
- `ChatStreamDto` + nested `ChatMessageDto` use `class-validator` decorators.
- Error handling:
- **Issue fixed:** controller now emits safe client error messages and logs details server-side.
- Finding status: **Issues found and fixed**.
## Security Checklist Outcomes
- `fleet-settings`: admin-only routes are guarded; non-admin users cannot access OIDC or breakglass reset routes. Provider secrets are not returned in provider read endpoints.
- `agent-config`: token comparison hardened; route remains gated by bearer token + container id binding.
- `onboarding`: guarded mutating endpoints cannot run after completion.
- `crypto`: AES-256-GCM usage is correct (random IV, auth-tag verification, fixed 32-byte key derivation).
- `chat-proxy`: user cannot target another users container; proxy now authenticates to OpenClaw using per-container bearer token.
## Input Validation
- DTO coverage is present in onboarding, fleet-settings, and chat-proxy request bodies.
- No critical unvalidated body inputs found in scoped modules.
## Error Handling
- Global API layer has a sanitizing `GlobalExceptionFilter`.
- `chat-proxy` used manual response handling (`@Res`) and bypassed global filter; this was corrected by sending safe generic SSE errors.
- No additional critical sensitive-data leaks found in reviewed scope.
## Changes Made
1. Hardened token comparison behavior in:
- `apps/api/src/agent-config/agent-config.service.ts`
- Changes:
- Compare SHA-256 digests with `timingSafeEqual`.
- Avoid early return during scan to reduce timing signal differences.
2. Fixed OpenClaw auth forwarding and error leak risk in:
- `apps/api/src/chat-proxy/chat-proxy.service.ts`
- `apps/api/src/chat-proxy/chat-proxy.controller.ts`
- `apps/api/src/chat-proxy/chat-proxy.service.spec.ts`
- Changes:
- Forward `Authorization: Bearer <gatewayToken>` when proxying chat requests.
- Stop returning raw internal/upstream error text to clients over SSE.
- Log details server-side and return safe client-facing messages.
## Validation Commands
Required quality gate command run:
- `pnpm turbo lint typecheck --filter=@mosaic/api`
(Results captured in session logs.)

29
pnpm-lock.yaml generated
View File

@@ -102,6 +102,9 @@ importers:
'@nestjs/platform-socket.io': '@nestjs/platform-socket.io':
specifier: ^11.1.12 specifier: ^11.1.12
version: 11.1.12(@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/websockets@11.1.12)(rxjs@7.8.2) version: 11.1.12(@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/websockets@11.1.12)(rxjs@7.8.2)
'@nestjs/schedule':
specifier: ^6.1.1
version: 6.1.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))(@nestjs/core@11.1.12)
'@nestjs/throttler': '@nestjs/throttler':
specifier: ^6.5.0 specifier: ^6.5.0
version: 6.5.0(@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)(reflect-metadata@0.2.2) version: 6.5.0(@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)(reflect-metadata@0.2.2)
@@ -1741,6 +1744,12 @@ packages:
'@nestjs/websockets': ^11.0.0 '@nestjs/websockets': ^11.0.0
rxjs: ^7.1.0 rxjs: ^7.1.0
'@nestjs/schedule@6.1.1':
resolution: {integrity: sha512-kQl1RRgi02GJ0uaUGCrXHCcwISsCsJDciCKe38ykJZgnAeeoeVWs8luWtBo4AqAAXm4nS5K8RlV0smHUJ4+2FA==}
peerDependencies:
'@nestjs/common': ^10.0.0 || ^11.0.0
'@nestjs/core': ^10.0.0 || ^11.0.0
'@nestjs/schematics@11.0.9': '@nestjs/schematics@11.0.9':
resolution: {integrity: sha512-0NfPbPlEaGwIT8/TCThxLzrlz3yzDNkfRNpbL7FiplKq3w4qXpJg0JYwqgMEJnLQZm3L/L/5XjoyfJHUO3qX9g==} resolution: {integrity: sha512-0NfPbPlEaGwIT8/TCThxLzrlz3yzDNkfRNpbL7FiplKq3w4qXpJg0JYwqgMEJnLQZm3L/L/5XjoyfJHUO3qX9g==}
peerDependencies: peerDependencies:
@@ -3241,6 +3250,9 @@ packages:
'@types/linkify-it@5.0.0': '@types/linkify-it@5.0.0':
resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==} resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
'@types/luxon@3.7.1':
resolution: {integrity: sha512-H3iskjFIAn5SlJU7OuxUmTEpebK6TKB8rxZShDslBMZJ5u9S//KM1sbdAisiSrqwLQncVjnpi2OK2J51h+4lsg==}
'@types/markdown-it@13.0.9': '@types/markdown-it@13.0.9':
resolution: {integrity: sha512-1XPwR0+MgXLWfTn9gCsZ55AHOKW1WN+P9vr0PaQh5aerR9LLQXUbjfEAFhjmEmyoYFWAyuN2Mqkn40MZ4ukjBw==} resolution: {integrity: sha512-1XPwR0+MgXLWfTn9gCsZ55AHOKW1WN+P9vr0PaQh5aerR9LLQXUbjfEAFhjmEmyoYFWAyuN2Mqkn40MZ4ukjBw==}
@@ -4251,6 +4263,10 @@ packages:
resolution: {integrity: sha512-p0SaNjrHOnQeR8/VnfGbmg9te2kfyYSQ7Sc/j/6DtPL3JQvKxmjO9TSjNFpujqV3vEYYBvNNvXSxzyksBWAx1Q==} resolution: {integrity: sha512-p0SaNjrHOnQeR8/VnfGbmg9te2kfyYSQ7Sc/j/6DtPL3JQvKxmjO9TSjNFpujqV3vEYYBvNNvXSxzyksBWAx1Q==}
engines: {node: '>=12.0.0'} engines: {node: '>=12.0.0'}
cron@4.4.0:
resolution: {integrity: sha512-fkdfq+b+AHI4cKdhZlppHveI/mgz2qpiYxcm+t5E5TsxX7QrLS1VE0+7GENEk9z0EeGPcpSciGv6ez24duWhwQ==}
engines: {node: '>=18.x'}
cross-spawn@7.0.6: cross-spawn@7.0.6:
resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==} resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
engines: {node: '>= 8'} engines: {node: '>= 8'}
@@ -8863,6 +8879,12 @@ snapshots:
- supports-color - supports-color
- utf-8-validate - utf-8-validate
'@nestjs/schedule@6.1.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))(@nestjs/core@11.1.12)':
dependencies:
'@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(@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/platform-express@11.1.12)(@nestjs/websockets@11.1.12)(reflect-metadata@0.2.2)(rxjs@7.8.2)
cron: 4.4.0
'@nestjs/schematics@11.0.9(chokidar@4.0.3)(typescript@5.9.3)': '@nestjs/schematics@11.0.9(chokidar@4.0.3)(typescript@5.9.3)':
dependencies: dependencies:
'@angular-devkit/core': 19.2.17(chokidar@4.0.3) '@angular-devkit/core': 19.2.17(chokidar@4.0.3)
@@ -10593,6 +10615,8 @@ snapshots:
'@types/linkify-it@5.0.0': {} '@types/linkify-it@5.0.0': {}
'@types/luxon@3.7.1': {}
'@types/markdown-it@13.0.9': '@types/markdown-it@13.0.9':
dependencies: dependencies:
'@types/linkify-it': 3.0.5 '@types/linkify-it': 3.0.5
@@ -11787,6 +11811,11 @@ snapshots:
dependencies: dependencies:
luxon: 3.7.2 luxon: 3.7.2
cron@4.4.0:
dependencies:
'@types/luxon': 3.7.1
luxon: 3.7.2
cross-spawn@7.0.6: cross-spawn@7.0.6:
dependencies: dependencies:
path-key: 3.1.1 path-key: 3.1.1