feat(web): add workspace management UI (M2 #12)

- Create workspace listing page at /settings/workspaces
  - List all user workspaces with role badges
  - Create new workspace functionality
  - Display member count per workspace

- Create workspace detail page at /settings/workspaces/[id]
  - Workspace settings (name, ID, created date)
  - Member management with role editing
  - Invite member functionality
  - Delete workspace (owner only)

- Add workspace components:
  - WorkspaceCard: Display workspace info with role badge
  - WorkspaceSettings: Edit workspace settings and delete
  - MemberList: Display and manage workspace members
  - InviteMember: Send invitations with role selection

- Add WorkspaceMemberWithUser type to shared package
- Follow existing app patterns for styling and structure
- Use mock data (ready for API integration)

apps/api/src/common/guards/workspace.guard.ts

@@ -0,0 +1,150 @@
+import {
+  Injectable,
+  CanActivate,
+  ExecutionContext,
+  ForbiddenException,
+  BadRequestException,
+  Logger,
+} from "@nestjs/common";
+import { PrismaService } from "../../prisma/prisma.service";
+import { setCurrentUser } from "../../lib/db-context";
+
+/**
+ * WorkspaceGuard ensures that:
+ * 1. A workspace is specified in the request (header, param, or body)
+ * 2. The authenticated user is a member of that workspace
+ * 3. The user context is set for Row-Level Security (RLS)
+ * 
+ * This guard should be used in combination with AuthGuard:
+ * 
+ * @example
+ * ```typescript
+ * @Controller('tasks')
+ * @UseGuards(AuthGuard, WorkspaceGuard)
+ * export class TasksController {
+ *   @Get()
+ *   async getTasks(@Workspace() workspaceId: string) {
+ *     // workspaceId is verified and available
+ *     // RLS context is automatically set
+ *   }
+ * }
+ * ```
+ * 
+ * The workspace ID can be provided via:
+ * - Header: `X-Workspace-Id`
+ * - URL parameter: `:workspaceId`
+ * - Request body: `workspaceId` field
+ * 
+ * Priority: Header > Param > Body
+ */
+@Injectable()
+export class WorkspaceGuard implements CanActivate {
+  private readonly logger = new Logger(WorkspaceGuard.name);
+
+  constructor(private readonly prisma: PrismaService) {}
+
+  async canActivate(context: ExecutionContext): Promise<boolean> {
+    const request = context.switchToHttp().getRequest();
+    const user = request.user;
+
+    if (!user || !user.id) {
+      throw new ForbiddenException("User not authenticated");
+    }
+
+    // Extract workspace ID from request
+    const workspaceId = this.extractWorkspaceId(request);
+
+    if (!workspaceId) {
+      throw new BadRequestException(
+        "Workspace ID is required (via header X-Workspace-Id, URL parameter, or request body)"
+      );
+    }
+
+    // Verify user is a member of the workspace
+    const isMember = await this.verifyWorkspaceMembership(
+      user.id,
+      workspaceId
+    );
+
+    if (!isMember) {
+      this.logger.warn(
+        `Access denied: User ${user.id} is not a member of workspace ${workspaceId}`
+      );
+      throw new ForbiddenException(
+        "You do not have access to this workspace"
+      );
+    }
+
+    // Set RLS context for this request
+    await setCurrentUser(user.id, this.prisma);
+
+    // Attach workspace info to request for convenience
+    request.workspace = {
+      id: workspaceId,
+    };
+
+    // Also attach workspaceId to user object for backward compatibility
+    request.user.workspaceId = workspaceId;
+
+    this.logger.debug(
+      `Workspace access granted: User ${user.id} → Workspace ${workspaceId}`
+    );
+
+    return true;
+  }
+
+  /**
+   * Extracts workspace ID from request in order of priority:
+   * 1. X-Workspace-Id header
+   * 2. :workspaceId URL parameter
+   * 3. workspaceId in request body
+   */
+  private extractWorkspaceId(request: any): string | undefined {
+    // 1. Check header
+    const headerWorkspaceId = request.headers["x-workspace-id"];
+    if (headerWorkspaceId) {
+      return headerWorkspaceId;
+    }
+
+    // 2. Check URL params
+    const paramWorkspaceId = request.params?.workspaceId;
+    if (paramWorkspaceId) {
+      return paramWorkspaceId;
+    }
+
+    // 3. Check request body
+    const bodyWorkspaceId = request.body?.workspaceId;
+    if (bodyWorkspaceId) {
+      return bodyWorkspaceId;
+    }
+
+    return undefined;
+  }
+
+  /**
+   * Verifies that a user is a member of the specified workspace
+   */
+  private async verifyWorkspaceMembership(
+    userId: string,
+    workspaceId: string
+  ): Promise<boolean> {
+    try {
+      const member = await this.prisma.workspaceMember.findUnique({
+        where: {
+          workspaceId_userId: {
+            workspaceId,
+            userId,
+          },
+        },
+      });
+
+      return member !== null;
+    } catch (error) {
+      this.logger.error(
+        `Failed to verify workspace membership: ${error instanceof Error ? error.message : 'Unknown error'}`,
+        error instanceof Error ? error.stack : undefined
+      );
+      return false;
+    }
+  }
+}