Compare commits

..

17 Commits

Author SHA1 Message Date
511d091a94 fix: logs page wired to activity_logs, interceptor optional workspaceId, autoRefresh on
Some checks failed
ci/woodpecker/push/ci Pipeline failed
- Rewrites Logs page to query activity_logs via GET /api/activity instead of runner_jobs
- New activity API client (apps/web/src/lib/api/activity.ts) with filters + types
- ActivityLoggingInterceptor: workspaceId now optional, events logged even without it
- Fixes TS2352 in interceptor via proper type assertion
- autoRefresh defaults to true
- Action/entity type filters replace status filter
2026-03-01 16:10:11 -06:00
78ff8f8e70 fix: GET workspace members endpoint (#635)
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 21:53:51 +00:00
2463b7b8ba test(glm47): workspace stats endpoint (#633)
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 21:46:48 +00:00
5b235a668f fix(web): CI lint failures from PR #632 (#634)
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 21:41:29 +00:00
c5ab179071 fix: tag creation in File Manager (#632)
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 21:29:33 +00:00
b4f4de6f7a fix(api): remove noisy CSRF guard debug log (#631)
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 21:13:00 +00:00
2b6bed2480 fix(api): value imports for DTO classes in controllers (#630)
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:55:07 +00:00
eba33fc93d fix: add SYSTEM_ADMIN_IDS env var (#629)
Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
2026-03-01 20:28:40 +00: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
37 changed files with 2023 additions and 485 deletions

View File

@@ -1,7 +1,7 @@
import { Controller, Get, Query, Param, UseGuards } from "@nestjs/common"; import { Controller, Get, Query, Param, UseGuards } from "@nestjs/common";
import { ActivityService } from "./activity.service"; import { ActivityService } from "./activity.service";
import { EntityType } from "@prisma/client"; import { EntityType } from "@prisma/client";
import type { QueryActivityLogDto } from "./dto"; import { QueryActivityLogDto } from "./dto";
import { AuthGuard } from "../auth/guards/auth.guard"; import { AuthGuard } from "../auth/guards/auth.guard";
import { WorkspaceGuard, PermissionGuard } from "../common/guards"; import { WorkspaceGuard, PermissionGuard } from "../common/guards";
import { Workspace, Permission, RequirePermission } from "../common/decorators"; import { Workspace, Permission, RequirePermission } from "../common/decorators";

View File

@@ -117,12 +117,13 @@ export class ActivityService {
/** /**
* Get a single activity log by ID * Get a single activity log by ID
*/ */
async findOne(id: string, workspaceId: string): Promise<ActivityLogResult | null> { async findOne(id: string, workspaceId?: string): Promise<ActivityLogResult | null> {
const where: Prisma.ActivityLogWhereUniqueInput = { id };
if (workspaceId) {
where.workspaceId = workspaceId;
}
return await this.prisma.activityLog.findUnique({ return await this.prisma.activityLog.findUnique({
where: { where,
id,
workspaceId,
},
include: { include: {
user: { user: {
select: { select: {

View File

@@ -4,6 +4,7 @@ import { tap } from "rxjs/operators";
import { ActivityService } from "../activity.service"; import { ActivityService } from "../activity.service";
import { ActivityAction, EntityType } from "@prisma/client"; import { ActivityAction, EntityType } from "@prisma/client";
import type { Prisma } from "@prisma/client"; import type { Prisma } from "@prisma/client";
import type { CreateActivityLogInput } from "../interfaces/activity.interface";
import type { AuthenticatedRequest } from "../../common/types/user.types"; import type { AuthenticatedRequest } from "../../common/types/user.types";
/** /**
@@ -61,10 +62,13 @@ export class ActivityLoggingInterceptor implements NestInterceptor {
// Extract entity information // Extract entity information
const resultObj = result as Record<string, unknown> | undefined; const resultObj = result as Record<string, unknown> | undefined;
const entityId = params.id ?? (resultObj?.id as string | undefined); const entityId = params.id ?? (resultObj?.id as string | undefined);
// workspaceId is now optional - log events even when missing
const workspaceId = user.workspaceId ?? (body.workspaceId as string | undefined); const workspaceId = user.workspaceId ?? (body.workspaceId as string | undefined);
if (!entityId || !workspaceId) { // Log with warning if entityId is missing, but still proceed with logging if workspaceId exists
this.logger.warn("Cannot log activity: missing entityId or workspaceId"); if (!entityId) {
this.logger.warn("Cannot log activity: missing entityId");
return; return;
} }
@@ -92,9 +96,8 @@ export class ActivityLoggingInterceptor implements NestInterceptor {
const userAgent = const userAgent =
typeof userAgentHeader === "string" ? userAgentHeader : userAgentHeader?.[0]; typeof userAgentHeader === "string" ? userAgentHeader : userAgentHeader?.[0];
// Log the activity // Log the activity — workspaceId is optional
await this.activityService.logActivity({ const activityInput: CreateActivityLogInput = {
workspaceId,
userId: user.id, userId: user.id,
action, action,
entityType, entityType,
@@ -102,7 +105,11 @@ export class ActivityLoggingInterceptor implements NestInterceptor {
details, details,
ipAddress: ip ?? undefined, ipAddress: ip ?? undefined,
userAgent: userAgent ?? undefined, userAgent: userAgent ?? undefined,
}); };
if (workspaceId) {
activityInput.workspaceId = workspaceId;
}
await this.activityService.logActivity(activityInput);
} catch (error) { } catch (error) {
// Don't fail the request if activity logging fails // Don't fail the request if activity logging fails
this.logger.error( this.logger.error(

View File

@@ -2,9 +2,10 @@ import type { ActivityAction, EntityType, Prisma } from "@prisma/client";
/** /**
* Interface for creating a new activity log entry * Interface for creating a new activity log entry
* workspaceId is optional - allows logging events without workspace context
*/ */
export interface CreateActivityLogInput { export interface CreateActivityLogInput {
workspaceId: string; workspaceId?: string | null;
userId: string; userId: string;
action: ActivityAction; action: ActivityAction;
entityType: EntityType; entityType: EntityType;

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

@@ -58,6 +58,7 @@ import { ContainerReaperModule } from "./container-reaper/container-reaper.modul
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 { ChatProxyModule } from "./chat-proxy/chat-proxy.module";
import { OrchestratorModule } from "./orchestrator/orchestrator.module";
@Module({ @Module({
imports: [ imports: [
@@ -137,6 +138,7 @@ import { ChatProxyModule } from "./chat-proxy/chat-proxy.module";
FleetSettingsModule, FleetSettingsModule,
OnboardingModule, OnboardingModule,
ChatProxyModule, ChatProxyModule,
OrchestratorModule,
], ],
controllers: [AppController, CsrfController], controllers: [AppController, CsrfController],
providers: [ providers: [

View File

@@ -1,4 +1,14 @@
import { Body, Controller, Post, Req, Res, UnauthorizedException, UseGuards } from "@nestjs/common"; import {
Body,
Controller,
HttpException,
Logger,
Post,
Req,
Res,
UnauthorizedException,
UseGuards,
} from "@nestjs/common";
import type { Response } from "express"; import type { Response } from "express";
import { AuthGuard } from "../auth/guards/auth.guard"; import { AuthGuard } from "../auth/guards/auth.guard";
import type { MaybeAuthenticatedRequest } from "../auth/types/better-auth-request.interface"; import type { MaybeAuthenticatedRequest } from "../auth/types/better-auth-request.interface";
@@ -8,6 +18,8 @@ import { ChatProxyService } from "./chat-proxy.service";
@Controller("chat") @Controller("chat")
@UseGuards(AuthGuard) @UseGuards(AuthGuard)
export class ChatProxyController { export class ChatProxyController {
private readonly logger = new Logger(ChatProxyController.name);
constructor(private readonly chatProxyService: ChatProxyService) {} constructor(private readonly chatProxyService: ChatProxyService) {}
// POST /api/chat/stream // POST /api/chat/stream
@@ -58,10 +70,11 @@ export class ChatProxyController {
res.write(Buffer.from(chunk)); res.write(Buffer.from(chunk));
} }
} catch (error: unknown) { } catch (error: unknown) {
this.logStreamError(error);
if (!res.writableEnded && !res.destroyed) { if (!res.writableEnded && !res.destroyed) {
const message = error instanceof Error ? error.message : String(error);
res.write("event: error\n"); res.write("event: error\n");
res.write(`data: ${JSON.stringify({ error: message })}\n\n`); res.write(`data: ${JSON.stringify({ error: this.toSafeClientMessage(error) })}\n\n`);
} }
} finally { } finally {
if (!res.writableEnded && !res.destroyed) { if (!res.writableEnded && !res.destroyed) {
@@ -69,4 +82,21 @@ export class ChatProxyController {
} }
} }
} }
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

@@ -1,4 +1,5 @@
import { Module } from "@nestjs/common"; import { Module } from "@nestjs/common";
import { AuthModule } from "../auth/auth.module";
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 { PrismaModule } from "../prisma/prisma.module"; import { PrismaModule } from "../prisma/prisma.module";
@@ -6,7 +7,7 @@ import { ChatProxyController } from "./chat-proxy.controller";
import { ChatProxyService } from "./chat-proxy.service"; import { ChatProxyService } from "./chat-proxy.service";
@Module({ @Module({
imports: [PrismaModule, ContainerLifecycleModule, AgentConfigModule], imports: [AuthModule, PrismaModule, ContainerLifecycleModule, AgentConfigModule],
controllers: [ChatProxyController], controllers: [ChatProxyController],
providers: [ChatProxyService], providers: [ChatProxyService],
exports: [ChatProxyService], exports: [ChatProxyService],

View File

@@ -64,6 +64,7 @@ describe("ChatProxyService", () => {
expect.objectContaining({ expect.objectContaining({
method: "POST", method: "POST",
headers: { headers: {
Authorization: "Bearer gateway-token",
"Content-Type": "application/json", "Content-Type": "application/json",
}, },
}) })

View File

@@ -1,12 +1,24 @@
import { BadGatewayException, Injectable, ServiceUnavailableException } from "@nestjs/common"; import {
BadGatewayException,
Injectable,
Logger,
ServiceUnavailableException,
} from "@nestjs/common";
import { ContainerLifecycleService } from "../container-lifecycle/container-lifecycle.service"; import { ContainerLifecycleService } from "../container-lifecycle/container-lifecycle.service";
import { PrismaService } from "../prisma/prisma.service"; import { PrismaService } from "../prisma/prisma.service";
import type { ChatMessage } from "./chat-proxy.dto"; import type { ChatMessage } from "./chat-proxy.dto";
const DEFAULT_OPENCLAW_MODEL = "openclaw:default"; const DEFAULT_OPENCLAW_MODEL = "openclaw:default";
interface ContainerConnection {
url: string;
token: string;
}
@Injectable() @Injectable()
export class ChatProxyService { export class ChatProxyService {
private readonly logger = new Logger(ChatProxyService.name);
constructor( constructor(
private readonly prisma: PrismaService, private readonly prisma: PrismaService,
private readonly containerLifecycle: ContainerLifecycleService private readonly containerLifecycle: ContainerLifecycleService
@@ -14,8 +26,7 @@ export class ChatProxyService {
// Get the user's OpenClaw container URL and mark it active. // Get the user's OpenClaw container URL and mark it active.
async getContainerUrl(userId: string): Promise<string> { async getContainerUrl(userId: string): Promise<string> {
const { url } = await this.containerLifecycle.ensureRunning(userId); const { url } = await this.getContainerConnection(userId);
await this.containerLifecycle.touch(userId);
return url; return url;
} }
@@ -25,11 +36,14 @@ export class ChatProxyService {
messages: ChatMessage[], messages: ChatMessage[],
signal?: AbortSignal signal?: AbortSignal
): Promise<Response> { ): Promise<Response> {
const containerUrl = await this.getContainerUrl(userId); const { url: containerUrl, token: gatewayToken } = await this.getContainerConnection(userId);
const model = await this.getPreferredModel(userId); const model = await this.getPreferredModel(userId);
const requestInit: RequestInit = { const requestInit: RequestInit = {
method: "POST", method: "POST",
headers: { "Content-Type": "application/json" }, headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${gatewayToken}`,
},
body: JSON.stringify({ body: JSON.stringify({
messages, messages,
model, model,
@@ -47,10 +61,10 @@ export class ChatProxyService {
if (!response.ok) { if (!response.ok) {
const detail = await this.readResponseText(response); const detail = await this.readResponseText(response);
const status = `${String(response.status)} ${response.statusText}`.trim(); const status = `${String(response.status)} ${response.statusText}`.trim();
const message = detail this.logger.warn(
? `OpenClaw returned ${status}: ${detail}` detail ? `OpenClaw returned ${status}: ${detail}` : `OpenClaw returned ${status}`
: `OpenClaw returned ${status}`; );
throw new BadGatewayException(message); throw new BadGatewayException(`OpenClaw returned ${status}`);
} }
return response; return response;
@@ -60,10 +74,17 @@ export class ChatProxyService {
} }
const message = error instanceof Error ? error.message : String(error); const message = error instanceof Error ? error.message : String(error);
throw new ServiceUnavailableException(`Failed to proxy chat to OpenClaw: ${message}`); 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> { private async getPreferredModel(userId: string): Promise<string> {
const config = await this.prisma.userAgentConfig.findUnique({ const config = await this.prisma.userAgentConfig.findUnique({
where: { userId }, where: { userId },

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"];
@@ -106,14 +111,9 @@ export class CsrfGuard implements CanActivate {
throw new ForbiddenException("CSRF token not bound to session"); throw new ForbiddenException("CSRF token not bound to session");
} }
} else {
this.logger.debug({
event: "CSRF_SKIP_SESSION_BINDING",
method: request.method,
path: request.path,
reason: "User context not yet available (global guard runs before AuthGuard)",
});
} }
// Note: when userId is absent, the double-submit cookie check above is
// sufficient CSRF protection. AuthGuard populates request.user afterward.
return true; return true;
} }

View File

@@ -3,7 +3,7 @@ import { DashboardService } from "./dashboard.service";
import { AuthGuard } from "../auth/guards/auth.guard"; import { AuthGuard } from "../auth/guards/auth.guard";
import { WorkspaceGuard, PermissionGuard } from "../common/guards"; import { WorkspaceGuard, PermissionGuard } from "../common/guards";
import { Workspace, Permission, RequirePermission } from "../common/decorators"; import { Workspace, Permission, RequirePermission } from "../common/decorators";
import type { DashboardSummaryDto } from "./dto"; import { DashboardSummaryDto } from "./dto";
/** /**
* Controller for dashboard endpoints. * Controller for dashboard endpoints.

View File

@@ -15,7 +15,7 @@ import type { AuthUser } from "@mosaic/shared";
import { CurrentUser } from "../auth/decorators/current-user.decorator"; import { CurrentUser } from "../auth/decorators/current-user.decorator";
import { AdminGuard } from "../auth/guards/admin.guard"; import { AdminGuard } from "../auth/guards/admin.guard";
import { AuthGuard } from "../auth/guards/auth.guard"; import { AuthGuard } from "../auth/guards/auth.guard";
import type { import {
CreateProviderDto, CreateProviderDto,
ResetPasswordDto, ResetPasswordDto,
UpdateAgentConfigDto, UpdateAgentConfigDto,

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

@@ -1,7 +1,7 @@
import { Controller, Get, Param, Query } from "@nestjs/common"; import { Controller, Get, Param, Query } from "@nestjs/common";
import type { LlmUsageLog } from "@prisma/client"; import type { LlmUsageLog } from "@prisma/client";
import { LlmUsageService } from "./llm-usage.service"; import { LlmUsageService } from "./llm-usage.service";
import type { UsageAnalyticsQueryDto, UsageAnalyticsResponseDto } from "./dto"; import { UsageAnalyticsQueryDto, UsageAnalyticsResponseDto } from "./dto";
/** /**
* LLM Usage Controller * LLM Usage Controller

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,9 +1,10 @@
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";
import { WorkspaceGuard } from "../common/guards/workspace.guard"; import { WorkspaceGuard } from "../common/guards/workspace.guard";
import type { StatCardQueryDto, ChartQueryDto, ListQueryDto, CalendarPreviewQueryDto } from "./dto"; import { StatCardQueryDto, ChartQueryDto, ListQueryDto, CalendarPreviewQueryDto } from "./dto";
import type { RequestWithWorkspace } from "../common/types/user.types"; import type { RequestWithWorkspace } from "../common/types/user.types";
/** /**
@@ -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

@@ -6,7 +6,7 @@ import { WorkspaceGuard, PermissionGuard } from "../common/guards";
import { Permission, RequirePermission } from "../common/decorators"; import { Permission, RequirePermission } from "../common/decorators";
import type { WorkspaceMember } from "@prisma/client"; import type { WorkspaceMember } from "@prisma/client";
import type { AuthenticatedUser } from "../common/types/user.types"; import type { AuthenticatedUser } from "../common/types/user.types";
import type { AddMemberDto, UpdateMemberRoleDto, WorkspaceResponseDto } from "./dto"; import { AddMemberDto, UpdateMemberRoleDto, WorkspaceResponseDto } from "./dto";
/** /**
* User-scoped workspace operations. * User-scoped workspace operations.
@@ -29,6 +29,25 @@ export class WorkspacesController {
return this.workspacesService.getUserWorkspaces(user.id); return this.workspacesService.getUserWorkspaces(user.id);
} }
/**
* GET /api/workspaces/:workspaceId/stats
* Returns member, project, and domain counts for a workspace.
*/
@Get(":workspaceId/stats")
async getStats(@Param("workspaceId") workspaceId: string) {
return this.workspacesService.getStats(workspaceId);
}
/**
* GET /api/workspaces/:workspaceId/members
* Returns the list of members for a workspace.
*/
@Get(":workspaceId/members")
@UseGuards(WorkspaceGuard)
async getMembers(@Param("workspaceId") workspaceId: string) {
return this.workspacesService.getMembers(workspaceId);
}
/** /**
* POST /api/workspaces/:workspaceId/members * POST /api/workspaces/:workspaceId/members
* Add a member to a workspace with the specified role. * Add a member to a workspace with the specified role.

View File

@@ -321,6 +321,18 @@ export class WorkspacesService {
}); });
} }
/**
* Get members of a workspace.
*/
async getMembers(workspaceId: string) {
return this.prisma.workspaceMember.findMany({
where: { workspaceId },
include: {
user: { select: { id: true, name: true, email: true, createdAt: true } },
},
orderBy: { joinedAt: "asc" },
});
}
private assertCanAssignRole( private assertCanAssignRole(
actorRole: WorkspaceMemberRole, actorRole: WorkspaceMemberRole,
requestedRole: WorkspaceMemberRole requestedRole: WorkspaceMemberRole
@@ -342,4 +354,15 @@ export class WorkspacesService {
private isUniqueConstraintError(error: unknown): error is Prisma.PrismaClientKnownRequestError { private isUniqueConstraintError(error: unknown): error is Prisma.PrismaClientKnownRequestError {
return error instanceof Prisma.PrismaClientKnownRequestError && error.code === "P2002"; return error instanceof Prisma.PrismaClientKnownRequestError && error.code === "P2002";
} }
async getStats(
workspaceId: string
): Promise<{ memberCount: number; projectCount: number; domainCount: number }> {
const [memberCount, projectCount, domainCount] = await Promise.all([
this.prisma.workspaceMember.count({ where: { workspaceId } }),
this.prisma.project.count({ where: { workspaceId } }),
this.prisma.domain.count({ where: { workspaceId } }),
]);
return { memberCount, projectCount, domainCount };
}
} }

View File

@@ -13,7 +13,7 @@ import {
ChevronUp, ChevronUp,
ChevronDown, ChevronDown,
} from "lucide-react"; } from "lucide-react";
import type { KnowledgeEntryWithTags } from "@mosaic/shared"; import type { KnowledgeEntryWithTags, KnowledgeTag } from "@mosaic/shared";
import { EntryStatus, Visibility } from "@mosaic/shared"; import { EntryStatus, Visibility } from "@mosaic/shared";
import { MosaicSpinner } from "@/components/ui/MosaicSpinner"; import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
@@ -25,7 +25,7 @@ import {
DialogDescription, DialogDescription,
DialogFooter, DialogFooter,
} from "@/components/ui/dialog"; } from "@/components/ui/dialog";
import { fetchEntries, createEntry, deleteEntry } from "@/lib/api/knowledge"; import { fetchEntries, createEntry, deleteEntry, fetchTags } from "@/lib/api/knowledge";
import type { EntriesResponse, CreateEntryData, EntryFilters } from "@/lib/api/knowledge"; import type { EntriesResponse, CreateEntryData, EntryFilters } from "@/lib/api/knowledge";
/* --------------------------------------------------------------------------- /* ---------------------------------------------------------------------------
@@ -421,6 +421,26 @@ function CreateEntryDialog({
const [visibility, setVisibility] = useState<Visibility>(Visibility.PRIVATE); const [visibility, setVisibility] = useState<Visibility>(Visibility.PRIVATE);
const [formError, setFormError] = useState<string | null>(null); const [formError, setFormError] = useState<string | null>(null);
// Tag state
const [selectedTags, setSelectedTags] = useState<string[]>([]);
const [tagInput, setTagInput] = useState("");
const [availableTags, setAvailableTags] = useState<KnowledgeTag[]>([]);
const [showSuggestions, setShowSuggestions] = useState(false);
const tagInputRef = useRef<HTMLInputElement>(null);
// Load available tags when dialog opens
useEffect(() => {
if (open) {
fetchTags()
.then((tags) => {
setAvailableTags(tags);
})
.catch((err: unknown) => {
console.error("Failed to load tags:", err);
});
}
}, [open]);
function resetForm(): void { function resetForm(): void {
setTitle(""); setTitle("");
setContent(""); setContent("");
@@ -428,6 +448,9 @@ function CreateEntryDialog({
setStatus(EntryStatus.DRAFT); setStatus(EntryStatus.DRAFT);
setVisibility(Visibility.PRIVATE); setVisibility(Visibility.PRIVATE);
setFormError(null); setFormError(null);
setSelectedTags([]);
setTagInput("");
setShowSuggestions(false);
} }
async function handleSubmit(e: SyntheticEvent): Promise<void> { async function handleSubmit(e: SyntheticEvent): Promise<void> {
@@ -452,6 +475,7 @@ function CreateEntryDialog({
content: trimmedContent, content: trimmedContent,
status, status,
visibility, visibility,
tags: selectedTags,
}; };
const trimmedSummary = summary.trim(); const trimmedSummary = summary.trim();
if (trimmedSummary) { if (trimmedSummary) {
@@ -610,6 +634,212 @@ function CreateEntryDialog({
/> />
</div> </div>
{/* Tags */}
<div style={{ marginBottom: 16 }}>
<label
htmlFor="entry-tags"
style={{
display: "block",
marginBottom: 6,
fontSize: "0.85rem",
fontWeight: 500,
color: "var(--text-2)",
}}
>
Tags
</label>
<div
style={{
width: "100%",
minHeight: 38,
padding: "6px 8px",
background: "var(--bg)",
border: "1px solid var(--border)",
borderRadius: "var(--r)",
boxSizing: "border-box",
display: "flex",
flexWrap: "wrap",
gap: 4,
alignItems: "center",
position: "relative",
}}
>
{/* Selected tag chips */}
{selectedTags.map((tag) => (
<span
key={tag}
style={{
display: "inline-flex",
alignItems: "center",
gap: 4,
padding: "2px 8px",
background: "var(--surface-2)",
border: "1px solid var(--border)",
borderRadius: "var(--r-sm)",
fontSize: "0.75rem",
color: "var(--text)",
}}
>
{tag}
<button
type="button"
onClick={() => {
setSelectedTags((prev) => prev.filter((t) => t !== tag));
}}
style={{
background: "transparent",
border: "none",
padding: 0,
cursor: "pointer",
color: "var(--muted)",
display: "flex",
alignItems: "center",
lineHeight: 1,
}}
>
×
</button>
</span>
))}
{/* Tag text input */}
<input
ref={tagInputRef}
id="entry-tags"
type="text"
value={tagInput}
onChange={(e) => {
setTagInput(e.target.value);
setShowSuggestions(e.target.value.length > 0);
}}
onKeyDown={(e) => {
if (e.key === "Enter" || e.key === ",") {
e.preventDefault();
const trimmed = tagInput.trim();
if (trimmed && !selectedTags.includes(trimmed)) {
setSelectedTags((prev) => [...prev, trimmed]);
setTagInput("");
}
}
if (e.key === "Backspace" && tagInput === "" && selectedTags.length > 0) {
setSelectedTags((prev) => prev.slice(0, -1));
}
}}
onBlur={() => {
// Delay to allow click on suggestion
setTimeout(() => {
setShowSuggestions(false);
}, 150);
}}
onFocus={() => {
if (tagInput.length > 0) setShowSuggestions(true);
}}
placeholder={selectedTags.length === 0 ? "Add tags..." : ""}
style={{
flex: 1,
minWidth: 80,
border: "none",
background: "transparent",
color: "var(--text)",
fontSize: "0.85rem",
outline: "none",
padding: "2px 0",
}}
/>
{/* Autocomplete suggestions */}
{showSuggestions && (
<div
style={{
position: "absolute",
top: "100%",
left: 0,
right: 0,
marginTop: 4,
background: "var(--surface)",
border: "1px solid var(--border)",
borderRadius: "var(--r)",
boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
maxHeight: 150,
overflowY: "auto",
zIndex: 10,
}}
>
{availableTags
.filter(
(t) =>
t.name.toLowerCase().includes(tagInput.toLowerCase()) &&
!selectedTags.includes(t.name)
)
.slice(0, 5)
.map((tag) => (
<button
key={tag.id}
type="button"
onClick={() => {
if (!selectedTags.includes(tag.name)) {
setSelectedTags((prev) => [...prev, tag.name]);
}
setTagInput("");
setShowSuggestions(false);
tagInputRef.current?.focus();
}}
style={{
width: "100%",
padding: "8px 12px",
background: "transparent",
border: "none",
textAlign: "left",
cursor: "pointer",
color: "var(--text)",
fontSize: "0.85rem",
}}
onMouseEnter={(e) => {
e.currentTarget.style.background = "var(--surface-2)";
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = "transparent";
}}
>
{tag.name}
</button>
))}
{availableTags.filter(
(t) =>
t.name.toLowerCase().includes(tagInput.toLowerCase()) &&
!selectedTags.includes(t.name)
).length === 0 &&
tagInput.trim() &&
!selectedTags.includes(tagInput.trim()) && (
<button
type="button"
onClick={() => {
const trimmed = tagInput.trim();
if (trimmed && !selectedTags.includes(trimmed)) {
setSelectedTags((prev) => [...prev, trimmed]);
}
setTagInput("");
setShowSuggestions(false);
tagInputRef.current?.focus();
}}
style={{
width: "100%",
padding: "8px 12px",
background: "transparent",
border: "none",
textAlign: "left",
cursor: "pointer",
color: "var(--muted)",
fontSize: "0.85rem",
fontStyle: "italic",
}}
>
Create "{tagInput.trim()}"
</button>
)}
</div>
)}
</div>
</div>
{/* Status + Visibility row */} {/* Status + Visibility row */}
<div style={{ display: "flex", gap: 16, marginBottom: 16 }}> <div style={{ display: "flex", gap: 16, marginBottom: 16 }}>
<div style={{ flex: 1 }}> <div style={{ flex: 1 }}>

View File

@@ -0,0 +1,188 @@
import { describe, it, expect, vi, beforeEach } from "vitest";
import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import type { Task } from "@mosaic/shared";
import { TaskPriority, TaskStatus } from "@mosaic/shared";
import KanbanPage from "./page";
const mockReplace = vi.fn();
let mockSearchParams = new URLSearchParams();
vi.mock("next/navigation", () => ({
useRouter: (): { replace: typeof mockReplace } => ({ replace: mockReplace }),
useSearchParams: (): URLSearchParams => mockSearchParams,
}));
vi.mock("@hello-pangea/dnd", () => ({
DragDropContext: ({ children }: { children: React.ReactNode }): React.JSX.Element => (
<div data-testid="mock-dnd-context">{children}</div>
),
Droppable: ({
children,
droppableId,
}: {
children: (provided: {
innerRef: (el: HTMLElement | null) => void;
droppableProps: Record<string, never>;
placeholder: React.ReactNode;
}) => React.ReactNode;
droppableId: string;
}): React.JSX.Element => (
<div data-testid={`mock-droppable-${droppableId}`}>
{children({
innerRef: () => {
/* noop */
},
droppableProps: {},
placeholder: null,
})}
</div>
),
Draggable: ({
children,
draggableId,
}: {
children: (
provided: {
innerRef: (el: HTMLElement | null) => void;
draggableProps: { style: Record<string, string> };
dragHandleProps: Record<string, string>;
},
snapshot: { isDragging: boolean }
) => React.ReactNode;
draggableId: string;
index: number;
}): React.JSX.Element => (
<div data-testid={`mock-draggable-${draggableId}`}>
{children(
{
innerRef: () => {
/* noop */
},
draggableProps: { style: {} },
dragHandleProps: {},
},
{ isDragging: false }
)}
</div>
),
}));
vi.mock("@/components/ui/MosaicSpinner", () => ({
MosaicSpinner: ({ label }: { label?: string }): React.JSX.Element => (
<div data-testid="mosaic-spinner">{label ?? "Loading..."}</div>
),
}));
const mockUseWorkspaceId = vi.fn<() => string | null>();
vi.mock("@/lib/hooks", () => ({
useWorkspaceId: (): string | null => mockUseWorkspaceId(),
}));
const mockFetchTasks = vi.fn<() => Promise<Task[]>>();
const mockUpdateTask = vi.fn<() => Promise<unknown>>();
const mockCreateTask = vi.fn<() => Promise<Task>>();
vi.mock("@/lib/api/tasks", () => ({
fetchTasks: (...args: unknown[]): Promise<Task[]> => mockFetchTasks(...(args as [])),
updateTask: (...args: unknown[]): Promise<unknown> => mockUpdateTask(...(args as [])),
createTask: (...args: unknown[]): Promise<Task> => mockCreateTask(...(args as [])),
}));
const mockFetchProjects = vi.fn<() => Promise<unknown[]>>();
vi.mock("@/lib/api/projects", () => ({
fetchProjects: (...args: unknown[]): Promise<unknown[]> => mockFetchProjects(...(args as [])),
}));
const createdTask: Task = {
id: "task-new-1",
title: "Ship Kanban add task flow",
description: null,
status: TaskStatus.NOT_STARTED,
priority: TaskPriority.MEDIUM,
dueDate: null,
creatorId: "user-1",
assigneeId: null,
workspaceId: "ws-1",
projectId: "project-42",
parentId: null,
sortOrder: 0,
metadata: {},
completedAt: null,
createdAt: new Date("2026-03-01"),
updatedAt: new Date("2026-03-01"),
};
describe("KanbanPage add task flow", (): void => {
beforeEach((): void => {
vi.clearAllMocks();
mockSearchParams = new URLSearchParams("project=project-42");
mockUseWorkspaceId.mockReturnValue("ws-1");
mockFetchTasks.mockResolvedValue([]);
mockFetchProjects.mockResolvedValue([]);
mockCreateTask.mockResolvedValue(createdTask);
});
it("opens add-task form in a column and creates a task via API", async (): Promise<void> => {
const user = userEvent.setup();
render(<KanbanPage />);
await waitFor((): void => {
expect(screen.getByText("Kanban Board")).toBeInTheDocument();
});
// Click the "+ Add task" button in the To Do column
const addTaskButtons = screen.getAllByRole("button", { name: /\+ Add task/i });
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
await user.click(addTaskButtons[0]!); // First column is "To Do"
// Type in the title input
const titleInput = screen.getByPlaceholderText("Task title...");
await user.type(titleInput, createdTask.title);
// Click the Add button
await user.click(screen.getByRole("button", { name: /✓ Add/i }));
await waitFor((): void => {
expect(mockCreateTask).toHaveBeenCalledWith(
expect.objectContaining({
title: createdTask.title,
status: TaskStatus.NOT_STARTED,
projectId: "project-42",
}),
"ws-1"
);
});
});
it("cancels add-task form when pressing Escape", async (): Promise<void> => {
const user = userEvent.setup();
render(<KanbanPage />);
await waitFor((): void => {
expect(screen.getByText("Kanban Board")).toBeInTheDocument();
});
// Click the "+ Add task" button
const addTaskButtons = screen.getAllByRole("button", { name: /\+ Add task/i });
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
await user.click(addTaskButtons[0]!);
// Type in the title input
const titleInput = screen.getByPlaceholderText("Task title...");
await user.type(titleInput, "Test task");
// Press Escape to cancel
await user.keyboard("{Escape}");
// Form should be closed, back to "+ Add task" button
await waitFor((): void => {
const buttons = screen.getAllByRole("button", { name: /\+ Add task/i });
expect(buttons.length).toBe(5); // One per column
});
// Should not have called createTask
expect(mockCreateTask).not.toHaveBeenCalled();
});
});

View File

@@ -4,21 +4,39 @@ import { useState, useEffect, useCallback, useRef } from "react";
import type { ReactElement } from "react"; import type { ReactElement } from "react";
import { MosaicSpinner } from "@/components/ui/MosaicSpinner"; import { MosaicSpinner } from "@/components/ui/MosaicSpinner";
import { fetchRunnerJobs, fetchJobSteps, RunnerJobStatus } from "@/lib/api/runner-jobs"; import {
import type { RunnerJob, JobStep } from "@/lib/api/runner-jobs"; fetchActivityLogs,
ActivityAction,
EntityType,
type ActivityLog,
type ActivityLogFilters,
} from "@/lib/api/activity";
import { useWorkspaceId } from "@/lib/hooks"; import { useWorkspaceId } from "@/lib/hooks";
// ─── Constants ──────────────────────────────────────────────────────── // ─── Constants ────────────────────────────────────────────────────────
type StatusFilter = "all" | "running" | "completed" | "failed" | "queued"; type ActionFilter = "all" | ActivityAction;
type EntityFilter = "all" | EntityType;
type DateRange = "24h" | "7d" | "30d" | "all"; type DateRange = "24h" | "7d" | "30d" | "all";
const STATUS_OPTIONS: { value: StatusFilter; label: string }[] = [ const ACTION_OPTIONS: { value: ActionFilter; label: string }[] = [
{ value: "all", label: "All statuses" }, { value: "all", label: "All actions" },
{ value: "running", label: "Running" }, { value: ActivityAction.CREATED, label: "Created" },
{ value: "completed", label: "Completed" }, { value: ActivityAction.UPDATED, label: "Updated" },
{ value: "failed", label: "Failed" }, { value: ActivityAction.DELETED, label: "Deleted" },
{ value: "queued", label: "Queued" }, { value: ActivityAction.COMPLETED, label: "Completed" },
{ value: ActivityAction.ASSIGNED, label: "Assigned" },
];
const ENTITY_OPTIONS: { value: EntityFilter; label: string }[] = [
{ value: "all", label: "All entities" },
{ value: EntityType.TASK, label: "Tasks" },
{ value: EntityType.EVENT, label: "Events" },
{ value: EntityType.PROJECT, label: "Projects" },
{ value: EntityType.WORKSPACE, label: "Workspaces" },
{ value: EntityType.USER, label: "Users" },
{ value: EntityType.DOMAIN, label: "Domains" },
{ value: EntityType.IDEA, label: "Ideas" },
]; ];
const DATE_RANGES: { value: DateRange; label: string }[] = [ const DATE_RANGES: { value: DateRange; label: string }[] = [
@@ -28,37 +46,37 @@ const DATE_RANGES: { value: DateRange; label: string }[] = [
{ value: "all", label: "All" }, { value: "all", label: "All" },
]; ];
const STATUS_FILTER_TO_ENUM: Record<StatusFilter, RunnerJobStatus[] | undefined> = {
all: undefined,
running: [RunnerJobStatus.RUNNING],
completed: [RunnerJobStatus.COMPLETED],
failed: [RunnerJobStatus.FAILED],
queued: [RunnerJobStatus.QUEUED, RunnerJobStatus.PENDING],
};
const POLL_INTERVAL_MS = 5_000; const POLL_INTERVAL_MS = 5_000;
// ─── Helpers ────────────────────────────────────────────────────────── // ─── Helpers ──────────────────────────────────────────────────────────
function getStatusColor(status: string): string { const ACTION_COLORS: Record<string, string> = {
switch (status) { [ActivityAction.CREATED]: "var(--ms-teal-400)",
case "RUNNING": [ActivityAction.UPDATED]: "var(--ms-blue-400)",
return "var(--ms-amber-400)"; [ActivityAction.DELETED]: "var(--danger)",
case "COMPLETED": [ActivityAction.COMPLETED]: "var(--ms-emerald-400)",
return "var(--ms-teal-400)"; [ActivityAction.ASSIGNED]: "var(--ms-amber-400)",
case "FAILED": };
case "CANCELLED":
return "var(--danger)"; function getActionColor(action: string): string {
case "QUEUED": return ACTION_COLORS[action] ?? "var(--muted)";
case "PENDING":
return "var(--ms-blue-400)";
default:
return "var(--muted)";
}
} }
function formatRelativeTime(dateStr: string | null): string { const ENTITY_LABELS: Record<string, string> = {
if (!dateStr) return "\u2014"; [EntityType.TASK]: "Task",
[EntityType.EVENT]: "Event",
[EntityType.PROJECT]: "Project",
[EntityType.WORKSPACE]: "Workspace",
[EntityType.USER]: "User",
[EntityType.DOMAIN]: "Domain",
[EntityType.IDEA]: "Idea",
};
function getEntityTypeLabel(entityType: string): string {
return ENTITY_LABELS[entityType] ?? entityType;
}
function formatRelativeTime(dateStr: string): string {
const date = new Date(dateStr); const date = new Date(dateStr);
const now = Date.now(); const now = Date.now();
const diffMs = now - date.getTime(); const diffMs = now - date.getTime();
@@ -74,29 +92,6 @@ function formatRelativeTime(dateStr: string | null): string {
return date.toLocaleDateString(); return date.toLocaleDateString();
} }
function formatDuration(startedAt: string | null, completedAt: string | null): string {
if (!startedAt) return "\u2014";
const start = new Date(startedAt).getTime();
const end = completedAt ? new Date(completedAt).getTime() : Date.now();
const ms = end - start;
if (ms < 1_000) return `${String(ms)}ms`;
const sec = Math.floor(ms / 1_000);
if (sec < 60) return `${String(sec)}s`;
const min = Math.floor(sec / 60);
const remainSec = sec % 60;
return `${String(min)}m ${String(remainSec)}s`;
}
function formatStepDuration(durationMs: number | null): string {
if (durationMs === null) return "\u2014";
if (durationMs < 1_000) return `${String(durationMs)}ms`;
const sec = Math.floor(durationMs / 1_000);
if (sec < 60) return `${String(sec)}s`;
const min = Math.floor(sec / 60);
const remainSec = sec % 60;
return `${String(min)}m ${String(remainSec)}s`;
}
function isWithinDateRange(dateStr: string, range: DateRange): boolean { function isWithinDateRange(dateStr: string, range: DateRange): boolean {
if (range === "all") return true; if (range === "all") return true;
const date = new Date(dateStr); const date = new Date(dateStr);
@@ -105,18 +100,16 @@ function isWithinDateRange(dateStr: string, range: DateRange): boolean {
return now - date.getTime() < hours * 60 * 60 * 1_000; return now - date.getTime() < hours * 60 * 60 * 1_000;
} }
// ─── Status Badge ───────────────────────────────────────────────────── // ─── Action Badge ─────────────────────────────────────────────────────
function StatusBadge({ status }: { status: string }): ReactElement { function ActionBadge({ action }: { action: string }): ReactElement {
const color = getStatusColor(status); const color = getActionColor(action);
const isRunning = status === "RUNNING";
return ( return (
<span <span
style={{ style={{
display: "inline-flex", display: "inline-flex",
alignItems: "center", alignItems: "center",
gap: 6,
padding: "2px 10px", padding: "2px 10px",
borderRadius: 9999, borderRadius: 9999,
fontSize: "0.75rem", fontSize: "0.75rem",
@@ -127,18 +120,7 @@ function StatusBadge({ status }: { status: string }): ReactElement {
textTransform: "capitalize", textTransform: "capitalize",
}} }}
> >
{isRunning && ( {action.toLowerCase()}
<span
style={{
width: 6,
height: 6,
borderRadius: "50%",
background: color,
animation: "pulse 1.5s ease-in-out infinite",
}}
/>
)}
{status.toLowerCase()}
</span> </span>
); );
} }
@@ -149,59 +131,55 @@ export default function LogsPage(): ReactElement {
const workspaceId = useWorkspaceId(); const workspaceId = useWorkspaceId();
// Data state // Data state
const [jobs, setJobs] = useState<RunnerJob[]>([]); const [activities, setActivities] = useState<ActivityLog[]>([]);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
// Expanded job and steps
const [expandedJobId, setExpandedJobId] = useState<string | null>(null);
const [jobStepsMap, setJobStepsMap] = useState<Record<string, JobStep[]>>({});
const [stepsLoading, setStepsLoading] = useState<Set<string>>(new Set());
// Filters // Filters
const [statusFilter, setStatusFilter] = useState<StatusFilter>("all"); const [actionFilter, setActionFilter] = useState<ActionFilter>("all");
const [entityFilter, setEntityFilter] = useState<EntityFilter>("all");
const [dateRange, setDateRange] = useState<DateRange>("7d"); const [dateRange, setDateRange] = useState<DateRange>("7d");
const [searchQuery, setSearchQuery] = useState(""); const [searchQuery, setSearchQuery] = useState("");
// Auto-refresh // Auto-refresh
const [autoRefresh, setAutoRefresh] = useState(false); const [autoRefresh, setAutoRefresh] = useState(true);
const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null); const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
// Hover state
const [hoveredRowId, setHoveredRowId] = useState<string | null>(null);
// ─── Data Loading ───────────────────────────────────────────────── // ─── Data Loading ─────────────────────────────────────────────────
const loadJobs = useCallback(async (): Promise<void> => { const loadActivities = useCallback(async (): Promise<void> => {
try { try {
const statusEnums = STATUS_FILTER_TO_ENUM[statusFilter]; const filters: ActivityLogFilters = {};
const filters: Parameters<typeof fetchRunnerJobs>[0] = {};
if (workspaceId) { if (workspaceId) {
filters.workspaceId = workspaceId; filters.workspaceId = workspaceId;
} }
if (statusEnums) { if (actionFilter !== "all") {
filters.status = statusEnums; filters.action = actionFilter;
}
if (entityFilter !== "all") {
filters.entityType = entityFilter;
} }
const data = await fetchRunnerJobs(filters); const response: Awaited<ReturnType<typeof fetchActivityLogs>> =
setJobs(data); await fetchActivityLogs(filters);
setActivities(response);
setError(null); setError(null);
} catch (err: unknown) { } catch (err: unknown) {
console.error("[Logs] Failed to fetch runner jobs:", err); console.error("[Logs] Failed to fetch activity logs:", err);
setError( setError(
err instanceof Error err instanceof Error
? err.message ? err.message
: "We had trouble loading jobs. Please try again when you're ready." : "We had trouble loading activity logs. Please try again when you're ready."
); );
} }
}, [workspaceId, statusFilter]); }, [workspaceId, actionFilter, entityFilter]);
// Initial load // Initial load
useEffect(() => { useEffect(() => {
let cancelled = false; let cancelled = false;
setIsLoading(true); setIsLoading(true);
loadJobs() loadActivities()
.then(() => { .then(() => {
if (!cancelled) { if (!cancelled) {
setIsLoading(false); setIsLoading(false);
@@ -216,13 +194,13 @@ export default function LogsPage(): ReactElement {
return (): void => { return (): void => {
cancelled = true; cancelled = true;
}; };
}, [loadJobs]); }, [loadActivities]);
// Auto-refresh polling // Auto-refresh polling
useEffect(() => { useEffect(() => {
if (autoRefresh) { if (autoRefresh) {
intervalRef.current = setInterval(() => { intervalRef.current = setInterval(() => {
void loadJobs(); void loadActivities();
}, POLL_INTERVAL_MS); }, POLL_INTERVAL_MS);
} else if (intervalRef.current) { } else if (intervalRef.current) {
clearInterval(intervalRef.current); clearInterval(intervalRef.current);
@@ -235,55 +213,22 @@ export default function LogsPage(): ReactElement {
intervalRef.current = null; intervalRef.current = null;
} }
}; };
}, [autoRefresh, loadJobs]); }, [autoRefresh, loadActivities]);
// ─── Steps Loading ────────────────────────────────────────────────
const toggleExpand = useCallback(
(jobId: string) => {
if (expandedJobId === jobId) {
setExpandedJobId(null);
return;
}
setExpandedJobId(jobId);
// Load steps if not already loaded
if (!jobStepsMap[jobId] && !stepsLoading.has(jobId)) {
setStepsLoading((prev) => new Set(prev).add(jobId));
fetchJobSteps(jobId, workspaceId ?? undefined)
.then((steps) => {
setJobStepsMap((prev) => ({ ...prev, [jobId]: steps }));
})
.catch((err: unknown) => {
console.error("[Logs] Failed to fetch steps for job:", jobId, err);
setJobStepsMap((prev) => ({ ...prev, [jobId]: [] }));
})
.finally(() => {
setStepsLoading((prev) => {
const next = new Set(prev);
next.delete(jobId);
return next;
});
});
}
},
[expandedJobId, jobStepsMap, stepsLoading, workspaceId]
);
// ─── Filtering ──────────────────────────────────────────────────── // ─── Filtering ────────────────────────────────────────────────────
const filteredJobs = jobs.filter((job) => { const filteredActivities = activities.filter((activity) => {
// Date range filter // Date range filter
if (!isWithinDateRange(job.createdAt, dateRange)) return false; if (!isWithinDateRange(activity.createdAt, dateRange)) return false;
// Search filter // Search filter
if (searchQuery.trim()) { if (searchQuery.trim()) {
const q = searchQuery.toLowerCase(); const q = searchQuery.toLowerCase();
const matchesType = job.type.toLowerCase().includes(q); const matchesEntity = getEntityTypeLabel(activity.entityType).toLowerCase().includes(q);
const matchesId = job.id.toLowerCase().includes(q); const matchesId = activity.entityId.toLowerCase().includes(q);
if (!matchesType && !matchesId) return false; const matchesUser = activity.user?.name?.toLowerCase().includes(q);
const matchesEmail = activity.user?.email.toLowerCase().includes(q);
if (!matchesEntity && !matchesId && !matchesUser && !matchesEmail) return false;
} }
return true; return true;
@@ -293,7 +238,7 @@ export default function LogsPage(): ReactElement {
const handleManualRefresh = (): void => { const handleManualRefresh = (): void => {
setIsLoading(true); setIsLoading(true);
void loadJobs().finally(() => { void loadActivities().finally(() => {
setIsLoading(false); setIsLoading(false);
}); });
}; };
@@ -307,16 +252,12 @@ export default function LogsPage(): ReactElement {
return ( return (
<main className="container mx-auto px-4 py-8"> <main className="container mx-auto px-4 py-8">
{/* Pulse animation for running status */} {/* Pulse animation for auto-refresh */}
<style>{` <style>{`
@keyframes pulse { @keyframes pulse {
0%, 100% { opacity: 1; } 0%, 100% { opacity: 1; }
50% { opacity: 0.4; } 50% { opacity: 0.4; }
} }
@keyframes auto-refresh-spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
`}</style> `}</style>
{/* ─── Header ─────────────────────────────────────────────── */} {/* ─── Header ─────────────────────────────────────────────── */}
@@ -332,10 +273,10 @@ export default function LogsPage(): ReactElement {
> >
<div> <div>
<h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}> <h1 className="text-3xl font-bold" style={{ color: "var(--text)" }}>
Logs &amp; Telemetry Activity Logs
</h1> </h1>
<p className="mt-1" style={{ color: "var(--text-muted)" }}> <p className="mt-1" style={{ color: "var(--text-muted)" }}>
Runner job history and step-level detail Audit trail and activity history
</p> </p>
</div> </div>
@@ -408,11 +349,11 @@ export default function LogsPage(): ReactElement {
marginBottom: 24, marginBottom: 24,
}} }}
> >
{/* Status filter */} {/* Action filter */}
<select <select
value={statusFilter} value={actionFilter}
onChange={(e) => { onChange={(e) => {
setStatusFilter(e.target.value as StatusFilter); setActionFilter(e.target.value as ActionFilter);
}} }}
style={{ style={{
padding: "8px 12px", padding: "8px 12px",
@@ -425,7 +366,31 @@ export default function LogsPage(): ReactElement {
minWidth: 140, minWidth: 140,
}} }}
> >
{STATUS_OPTIONS.map((opt) => ( {ACTION_OPTIONS.map((opt) => (
<option key={opt.value} value={opt.value}>
{opt.label}
</option>
))}
</select>
{/* Entity filter */}
<select
value={entityFilter}
onChange={(e) => {
setEntityFilter(e.target.value as EntityFilter);
}}
style={{
padding: "8px 12px",
borderRadius: 8,
fontSize: "0.82rem",
border: "1px solid var(--border)",
background: "var(--surface)",
color: "var(--text)",
cursor: "pointer",
minWidth: 140,
}}
>
{ENTITY_OPTIONS.map((opt) => (
<option key={opt.value} value={opt.value}> <option key={opt.value} value={opt.value}>
{opt.label} {opt.label}
</option> </option>
@@ -467,7 +432,7 @@ export default function LogsPage(): ReactElement {
{/* Search input */} {/* Search input */}
<input <input
type="text" type="text"
placeholder="Search by job type..." placeholder="Search by entity or user..."
value={searchQuery} value={searchQuery}
onChange={(e) => { onChange={(e) => {
setSearchQuery(e.target.value); setSearchQuery(e.target.value);
@@ -487,9 +452,9 @@ export default function LogsPage(): ReactElement {
</div> </div>
{/* ─── Content ────────────────────────────────────────────── */} {/* ─── Content ────────────────────────────────────────────── */}
{isLoading && jobs.length === 0 ? ( {isLoading && activities.length === 0 ? (
<div className="flex justify-center py-16"> <div className="flex justify-center py-16">
<MosaicSpinner label="Loading jobs..." /> <MosaicSpinner label="Loading activity logs..." />
</div> </div>
) : error !== null ? ( ) : error !== null ? (
<div <div
@@ -508,7 +473,7 @@ export default function LogsPage(): ReactElement {
Try again Try again
</button> </button>
</div> </div>
) : filteredJobs.length === 0 ? ( ) : filteredActivities.length === 0 ? (
<div <div
className="rounded-lg p-8 text-center" className="rounded-lg p-8 text-center"
style={{ style={{
@@ -516,10 +481,10 @@ export default function LogsPage(): ReactElement {
border: "1px solid var(--border)", border: "1px solid var(--border)",
}} }}
> >
<p style={{ color: "var(--text-muted)" }}>No jobs found</p> <p style={{ color: "var(--text-muted)" }}>No activity logs found</p>
</div> </div>
) : ( ) : (
/* ─── Job Table ──────────────────────────────────────────── */ /* ─── Activity Table ──────────────────────────────────────── */
<div <div
style={{ style={{
borderRadius: 12, borderRadius: 12,
@@ -535,7 +500,7 @@ export default function LogsPage(): ReactElement {
background: "var(--bg-mid)", background: "var(--bg-mid)",
}} }}
> >
{["Job Type", "Status", "Started", "Duration", "Steps"].map((header) => ( {["Action", "Entity", "User", "Details", "Time"].map((header) => (
<th <th
key={header} key={header}
style={{ style={{
@@ -556,32 +521,9 @@ export default function LogsPage(): ReactElement {
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{filteredJobs.map((job) => { {filteredActivities.map((activity) => (
const isExpanded = expandedJobId === job.id; <ActivityRow key={activity.id} activity={activity} />
const isHovered = hoveredRowId === job.id; ))}
const steps = jobStepsMap[job.id];
const isStepsLoading = stepsLoading.has(job.id);
return (
<JobRow
key={job.id}
job={job}
isExpanded={isExpanded}
isHovered={isHovered}
steps={steps}
isStepsLoading={isStepsLoading}
onToggle={() => {
toggleExpand(job.id);
}}
onMouseEnter={() => {
setHoveredRowId(job.id);
}}
onMouseLeave={() => {
setHoveredRowId(null);
}}
/>
);
})}
</tbody> </tbody>
</table> </table>
</div> </div>
@@ -591,260 +533,91 @@ export default function LogsPage(): ReactElement {
); );
} }
// ─── Job Row Component ──────────────────────────────────────────────── // ─── Activity Row Component ───────────────────────────────────────────
function JobRow({
job,
isExpanded,
isHovered,
steps,
isStepsLoading,
onToggle,
onMouseEnter,
onMouseLeave,
}: {
job: RunnerJob;
isExpanded: boolean;
isHovered: boolean;
steps: JobStep[] | undefined;
isStepsLoading: boolean;
onToggle: () => void;
onMouseEnter: () => void;
onMouseLeave: () => void;
}): ReactElement {
return (
<>
<tr
onClick={onToggle}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
style={{
background: isExpanded
? "var(--surface-2)"
: isHovered
? "var(--surface-2)"
: "var(--surface)",
cursor: "pointer",
borderBottom: isExpanded ? "none" : "1px solid var(--border)",
transition: "background 100ms ease",
}}
>
<td
style={{
padding: "12px 16px",
fontSize: "0.85rem",
fontWeight: 500,
color: "var(--text)",
whiteSpace: "nowrap",
}}
>
<span style={{ display: "inline-flex", alignItems: "center", gap: 8 }}>
<span
style={{
display: "inline-block",
width: 16,
textAlign: "center",
fontSize: "0.7rem",
color: "var(--muted)",
transition: "transform 150ms ease",
transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
}}
>
&#9654;
</span>
{job.type}
</span>
</td>
<td style={{ padding: "12px 16px" }}>
<StatusBadge status={job.status} />
</td>
<td
style={{
padding: "12px 16px",
fontSize: "0.82rem",
fontFamily: "var(--mono)",
color: "var(--text-muted)",
whiteSpace: "nowrap",
}}
>
{formatRelativeTime(job.startedAt ?? job.createdAt)}
</td>
<td
style={{
padding: "12px 16px",
fontSize: "0.82rem",
fontFamily: "var(--mono)",
color: "var(--text-muted)",
whiteSpace: "nowrap",
}}
>
{formatDuration(job.startedAt, job.completedAt)}
</td>
<td
style={{
padding: "12px 16px",
fontSize: "0.82rem",
fontFamily: "var(--mono)",
color: "var(--text-muted)",
}}
>
{steps ? String(steps.length) : "\u2014"}
</td>
</tr>
{/* Expanded Steps Section */}
{isExpanded && (
<tr>
<td
colSpan={5}
style={{
padding: 0,
borderBottom: "1px solid var(--border)",
}}
>
<div
style={{
background: "var(--bg-mid)",
padding: "12px 16px 12px 48px",
}}
>
{isStepsLoading ? (
<div style={{ display: "flex", justifyContent: "center", padding: 16 }}>
<MosaicSpinner size={24} label="Loading steps..." />
</div>
) : !steps || steps.length === 0 ? (
<p
style={{
fontSize: "0.82rem",
color: "var(--text-muted)",
padding: "8px 0",
}}
>
No steps recorded for this job
</p>
) : (
<table style={{ width: "100%", borderCollapse: "collapse" }}>
<thead>
<tr>
{["#", "Name", "Phase", "Status", "Duration"].map((header) => (
<th
key={header}
style={{
padding: "6px 12px",
textAlign: "left",
fontSize: "0.7rem",
fontWeight: 600,
textTransform: "uppercase",
letterSpacing: "0.05em",
color: "var(--muted)",
fontFamily: "var(--mono)",
borderBottom: "1px solid var(--border)",
whiteSpace: "nowrap",
}}
>
{header}
</th>
))}
</tr>
</thead>
<tbody>
{steps
.sort((a, b) => a.ordinal - b.ordinal)
.map((step) => (
<StepRow key={step.id} step={step} />
))}
</tbody>
</table>
)}
{/* Job error message if failed */}
{job.error && (
<div
style={{
marginTop: 12,
padding: "8px 12px",
borderRadius: 6,
fontSize: "0.78rem",
fontFamily: "var(--mono)",
color: "var(--danger)",
background: "color-mix(in srgb, var(--danger) 8%, transparent)",
border: "1px solid color-mix(in srgb, var(--danger) 20%, transparent)",
wordBreak: "break-all",
}}
>
{job.error}
</div>
)}
</div>
</td>
</tr>
)}
</>
);
}
// ─── Step Row Component ───────────────────────────────────────────────
function StepRow({ step }: { step: JobStep }): ReactElement {
const [hovered, setHovered] = useState(false);
function ActivityRow({ activity }: { activity: ActivityLog }): ReactElement {
return ( return (
<tr <tr
onMouseEnter={() => {
setHovered(true);
}}
onMouseLeave={() => {
setHovered(false);
}}
style={{ style={{
background: hovered ? "color-mix(in srgb, var(--surface) 50%, transparent)" : "transparent", background: "var(--surface)",
borderBottom: "1px solid color-mix(in srgb, var(--border) 50%, transparent)", borderBottom: "1px solid var(--border)",
transition: "background 100ms ease", transition: "background 100ms ease",
}} }}
> >
<td <td style={{ padding: "12px 16px" }}>
style={{ <ActionBadge action={activity.action} />
padding: "6px 12px",
fontSize: "0.78rem",
fontFamily: "var(--mono)",
color: "var(--muted)",
}}
>
{String(step.ordinal)}
</td> </td>
<td <td
style={{ style={{
padding: "6px 12px", padding: "12px 16px",
fontSize: "0.8rem", fontSize: "0.85rem",
fontWeight: 500,
color: "var(--text)", color: "var(--text)",
}} }}
> >
{step.name} <div style={{ display: "flex", flexDirection: "column", gap: 2 }}>
<span>{getEntityTypeLabel(activity.entityType)}</span>
<span
style={{
fontSize: "0.75rem",
color: "var(--muted)",
fontFamily: "var(--mono)",
}}
>
{activity.entityId}
</span>
</div>
</td> </td>
<td <td
style={{ style={{
padding: "6px 12px", padding: "12px 16px",
fontSize: "0.75rem", fontSize: "0.82rem",
fontFamily: "var(--mono)", color: "var(--text)",
color: "var(--text-muted)",
textTransform: "lowercase",
}} }}
> >
{step.phase} {activity.user ? (
</td> <div style={{ display: "flex", flexDirection: "column", gap: 2 }}>
<td style={{ padding: "6px 12px" }}> <span>{activity.user.name ?? activity.user.email}</span>
<StatusBadge status={step.status} /> {activity.user.name && (
<span
style={{
fontSize: "0.75rem",
color: "var(--muted)",
}}
>
{activity.user.email}
</span>
)}
</div>
) : (
<span style={{ color: "var(--muted)" }}></span>
)}
</td> </td>
<td <td
style={{ style={{
padding: "6px 12px", padding: "12px 16px",
fontSize: "0.78rem", fontSize: "0.78rem",
color: "var(--text-muted)",
fontFamily: "var(--mono)",
maxWidth: 300,
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
}}
title={activity.details ? JSON.stringify(activity.details) : undefined}
>
{activity.details ? JSON.stringify(activity.details) : "—"}
</td>
<td
style={{
padding: "12px 16px",
fontSize: "0.82rem",
fontFamily: "var(--mono)", fontFamily: "var(--mono)",
color: "var(--text-muted)", color: "var(--text-muted)",
whiteSpace: "nowrap", whiteSpace: "nowrap",
}} }}
> >
{formatStepDuration(step.durationMs)} {formatRelativeTime(activity.createdAt)}
</td> </td>
</tr> </tr>
); );

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

@@ -85,14 +85,6 @@ const INITIAL_FORM: ProviderFormState = {
isActive: true, isActive: true,
}; };
function getErrorMessage(error: unknown, fallback: string): string {
if (error instanceof Error && error.message.trim().length > 0) {
return error.message;
}
return fallback;
}
function buildProviderName(displayName: string, type: string): string { function buildProviderName(displayName: string, type: string): string {
const slug = displayName const slug = displayName
.trim() .trim()
@@ -105,6 +97,14 @@ function buildProviderName(displayName: string, type: string): string {
return candidate.slice(0, 100); 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[] { function normalizeProviderModels(models: unknown): FleetProviderModel[] {
if (!Array.isArray(models)) { if (!Array.isArray(models)) {
return []; return [];
@@ -153,11 +153,11 @@ function modelsToEditorText(models: unknown): string {
.join("\n"); .join("\n");
} }
function parseModelsText(value: string): FleetProviderModel[] { function parseModelsText(value: string): string[] {
const seen = new Set<string>(); const seen = new Set<string>();
return value return value
.split(/\n|,/g) .split(/\r?\n/g)
.map((segment) => segment.trim()) .map((segment) => segment.trim())
.filter((segment) => segment.length > 0) .filter((segment) => segment.length > 0)
.filter((segment) => { .filter((segment) => {
@@ -166,8 +166,7 @@ function parseModelsText(value: string): FleetProviderModel[] {
} }
seen.add(segment); seen.add(segment);
return true; return true;
}) });
.map((id) => ({ id, name: id }));
} }
function maskApiKey(value: string): string { function maskApiKey(value: string): string {
@@ -279,6 +278,7 @@ export default function ProvidersSettingsPage(): ReactElement {
} }
const models = parseModelsText(form.modelsText); const models = parseModelsText(form.modelsText);
const providerModels = models.map((id) => ({ id, name: id }));
const baseUrl = form.baseUrl.trim(); const baseUrl = form.baseUrl.trim();
const apiKey = form.apiKey.trim(); const apiKey = form.apiKey.trim();
@@ -289,7 +289,7 @@ export default function ProvidersSettingsPage(): ReactElement {
const updatePayload: UpdateFleetProviderRequest = { const updatePayload: UpdateFleetProviderRequest = {
displayName, displayName,
isActive: form.isActive, isActive: form.isActive,
models, models: providerModels,
}; };
if (baseUrl.length > 0) { if (baseUrl.length > 0) {
@@ -307,7 +307,6 @@ export default function ProvidersSettingsPage(): ReactElement {
name: buildProviderName(displayName, form.type), name: buildProviderName(displayName, form.type),
displayName, displayName,
type: form.type, type: form.type,
models,
}; };
if (baseUrl.length > 0) { if (baseUrl.length > 0) {
@@ -318,6 +317,10 @@ export default function ProvidersSettingsPage(): ReactElement {
createPayload.apiKey = apiKey; createPayload.apiKey = apiKey;
} }
if (providerModels.length > 0) {
createPayload.models = providerModels;
}
await createFleetProvider(createPayload); await createFleetProvider(createPayload);
setSuccessMessage(`Added provider "${displayName}".`); setSuccessMessage(`Added provider "${displayName}".`);
} }

View File

@@ -0,0 +1,139 @@
/**
* Activity API Client
* Handles activity-log-related API requests
*/
import { apiGet, type ApiResponse } from "./client";
/**
* Activity action enum (matches backend ActivityAction)
*/
export enum ActivityAction {
CREATED = "CREATED",
UPDATED = "UPDATED",
DELETED = "DELETED",
COMPLETED = "COMPLETED",
ASSIGNED = "ASSIGNED",
}
/**
* Entity type enum (matches backend EntityType)
*/
export enum EntityType {
TASK = "TASK",
EVENT = "EVENT",
PROJECT = "PROJECT",
WORKSPACE = "WORKSPACE",
USER = "USER",
DOMAIN = "DOMAIN",
IDEA = "IDEA",
}
/**
* Activity log response interface (matches Prisma ActivityLog model)
*/
export interface ActivityLog {
id: string;
workspaceId: string;
userId: string;
action: ActivityAction;
entityType: EntityType;
entityId: string;
details: Record<string, unknown> | null;
ipAddress: string | null;
userAgent: string | null;
createdAt: string;
user?: {
id: string;
name: string | null;
email: string;
};
}
/**
* Filters for querying activity logs
*/
export interface ActivityLogFilters {
workspaceId?: string;
userId?: string;
action?: ActivityAction;
entityType?: EntityType;
entityId?: string;
startDate?: string;
endDate?: string;
page?: number;
limit?: number;
}
/**
* Paginated activity logs response
*/
export interface PaginatedActivityLogs {
data: ActivityLog[];
meta: {
total: number;
page: number;
limit: number;
totalPages: number;
};
}
/**
* Fetch activity logs with optional filters
*/
export async function fetchActivityLogs(filters?: ActivityLogFilters): Promise<ActivityLog[]> {
const params = new URLSearchParams();
if (filters?.userId) {
params.append("userId", filters.userId);
}
if (filters?.action) {
params.append("action", filters.action);
}
if (filters?.entityType) {
params.append("entityType", filters.entityType);
}
if (filters?.entityId) {
params.append("entityId", filters.entityId);
}
if (filters?.startDate) {
params.append("startDate", filters.startDate);
}
if (filters?.endDate) {
params.append("endDate", filters.endDate);
}
if (filters?.page !== undefined) {
params.append("page", String(filters.page));
}
if (filters?.limit !== undefined) {
params.append("limit", String(filters.limit));
}
const queryString = params.toString();
const endpoint = queryString ? `/api/activity?${queryString}` : "/api/activity";
const response = await apiGet<PaginatedActivityLogs>(endpoint, filters?.workspaceId);
return response.data;
}
/**
* Fetch a single activity log by ID
*/
export async function fetchActivityLog(id: string, workspaceId?: string): Promise<ActivityLog> {
return apiGet<ActivityLog>(`/api/activity/${id}`, workspaceId);
}
/**
* Fetch audit trail for a specific entity
*/
export async function fetchAuditTrail(
entityType: EntityType,
entityId: string,
workspaceId?: string
): Promise<ActivityLog[]> {
const response = await apiGet<ApiResponse<ActivityLog[]>>(
`/api/activity/audit/${entityType}/${entityId}`,
workspaceId
);
return response.data;
}

View File

@@ -37,14 +37,24 @@ describe("createFleetProvider", (): void => {
name: "openai-main", name: "openai-main",
displayName: "OpenAI Main", displayName: "OpenAI Main",
type: "openai", type: "openai",
baseUrl: "https://api.openai.com/v1",
apiKey: "sk-test", 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", { expect(client.apiPost).toHaveBeenCalledWith("/api/fleet-settings/providers", {
name: "openai-main", name: "openai-main",
displayName: "OpenAI Main", displayName: "OpenAI Main",
type: "openai", type: "openai",
baseUrl: "https://api.openai.com/v1",
apiKey: "sk-test", apiKey: "sk-test",
models: [
{ id: "gpt-4.1-mini", name: "gpt-4.1-mini" },
{ id: "gpt-4o-mini", name: "gpt-4o-mini" },
],
}); });
}); });
}); });

View File

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

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

@@ -128,6 +128,8 @@ services:
# 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:-}

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.)