Skip to content
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
84 changes: 56 additions & 28 deletions .claude/rules/skill-guidance.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,44 +5,72 @@ globs: '*'

# Available Skills

This project has guided skills for common workflows. **Proactively suggest the relevant skill** when a user's request matches one of these:
This project has two sets of skills — one for `apps/lfx` (new app, primary focus) and one for `apps/lfx-one` (existing app, maintenance only). **Proactively suggest the relevant skill** based on which app the user is working in.

| Skill | When to Suggest |
| ------------ | ----------------------------------------------------------------------------------------------------------------------------- |
| `/setup` | Getting started, first-time setup, broken environments, install failures, missing env vars, 1Password, how to run the app |
| `/develop` | Add a feature, fix a bug, modify code, create components/services/endpoints/types, refactor, build, implement any code change |
| `/preflight` | Before submitting a PR, check if code is ready, validate changes, verify a branch, finished development, review readiness |
---

## Trigger Phrases
## Skills for `apps/lfx` (new app — primary focus)

**`/setup`** — match any of these intents:
| Skill | When to Suggest |
| ------------------ | --------------------------------------------------------------------------------------- |
| `/lfx-setup` | Getting started with `apps/lfx`, first-time setup, broken environment, install failures |
| `/lfx-coordinator` | Add a feature, fix a bug, modify code, implement anything in `apps/lfx` |
| `/lfx-design` | Create a new base UI component, add a variant, work with Tailwind v4 design tokens |
| `/lfx-research` | Validate an upstream API, explore what endpoints exist before building |
| `/lfx-preflight` | Before submitting a PR for `apps/lfx` — lint, build, license headers |

- "How do I set up?", "Getting started", "First time here"
- "yarn install fails", "corepack error", "node version"
- "env vars", "1Password", "app won't start"
- "broken environment", "fresh install", "missing dependencies"
### Trigger Phrases (apps/lfx)

**`/develop`** — match any of these intents:
**`/lfx-coordinator`** — any code change in `apps/lfx`:

- "Add a feature", "Create a component", "Build an endpoint"
- "Fix this bug", "Modify the service", "Update the page"
- "Refactor", "Implement", "Change the behavior"
- "New interface", "Add a filter", "Create a form"
- Describes any code change, feature request, or bug fix
- Any feature request, bug fix, or code change in the new app

**`/preflight`** — match any of these intents:
**`/lfx-design`** — new base UI components:

- "Ready for PR", "Check my code", "Validate changes"
- "Before I submit", "Is my branch ready?", "Review my work"
- "Run checks", "Lint and build", "Pre-PR validation"
- Any indication that development work is finished
- "Create a button/input/card/modal/badge"
- "Add a variant to the component"
- "Build a design system component"
- "Tailwind v4 component"

## For Cowork Sessions
**`/lfx-research`** — upstream API exploration before building:

- "Does the upstream API support X?"
- "What endpoints does the committee service have?"
- "What fields are in the meeting response?"

**`/lfx-preflight`** — after work in `apps/lfx`:

- "Ready for PR", "Check my code", "Validate changes", "Lint and build"

---

## Skills for `apps/lfx-one` (existing app — maintenance only)

Non-developer contributors use these skills as guided workflows. Follow these rules:
| Skill | When to Suggest |
| ------------ | ------------------------------------------------------- |
| `/setup` | Getting started with `apps/lfx-one`, broken environment |
| `/develop` | Feature or bug fix work in `apps/lfx-one` |
| `/preflight` | Before submitting a PR for `apps/lfx-one` |

---

## Skill Relationships (apps/lfx)

```text
/lfx-coordinator ──delegates──▶ /lfx-research
/lfx-backend-builder
/lfx-ui-builder
/lfx-design
```
Comment thread
coderabbitai[bot] marked this conversation as resolved.
Outdated

The coordinator is the entry point for all feature work in `apps/lfx`. For anything spanning more than one layer, always use `/lfx-coordinator`.

## For Cowork Sessions

- If the user describes a feature they want to build, suggest `/develop` — it walks them through the full process step-by-step
- If the user asks about setup or getting started, suggest `/setup`
- After any development work is complete, remind them to run `/preflight` before creating a PR
- If you are unsure which skill applies, ask the user what they're trying to accomplish
- When a skill references architecture docs in `docs/`, read those docs before generating code — they are the source of truth
- Contributor describes a feature for `apps/lfx` → suggest `/lfx-coordinator`
- Setup questions for the new app → suggest `/lfx-setup`
- After development work in `apps/lfx` → remind to run `/lfx-preflight`
- If unsure which app → ask "Are you working in the new `lfx` app or the existing `lfx-one`?"
- When a skill references architecture docs in `docs/`, read those docs before generating code
196 changes: 196 additions & 0 deletions .claude/skills/lfx-backend-builder/SKILL.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,196 @@
---
name: lfx-backend-builder
description: >
Generate Express proxy code for apps/lfx — services, controllers, routes, and
shared TypeScript types. Encodes the controller-service-route pattern, logger
service usage, MicroserviceProxyService conventions, and shared package structure.
allowed-tools: Bash, Read, Write, Edit, Glob, Grep, AskUserQuestion
---

<!-- Copyright The Linux Foundation and each contributor to LFX. -->
<!-- SPDX-License-Identifier: MIT -->

# LFX Backend Code Generation

You generate Express proxy code and shared TypeScript types for `apps/lfx`. This skill handles the backend layer — the thin proxy between the Angular frontend and the upstream Go microservices.

**Prerequisites:** The upstream API contract must be validated before generating proxy code. No mock data, no placeholder responses.

## Input Validation

| Required | If Missing |
| ---------------------------------------------------- | ---------------------------------------- |
| Specific task (what to build/modify) | Stop and ask |
| Absolute repo path | Stop and ask |
| Upstream API endpoint (path, method, response shape) | Stop — cannot build a proxy without this |

**If invoked with a `FIX:` prefix**, read the error, find the file, apply the fix, re-validate.

## Read Before Generating — MANDATORY

1. **Read the target file** (if modifying)
2. **Read an existing example** in the same domain
3. **Read the relevant interface file** in `packages/shared/src/interfaces/`

```bash
ls apps/lfx/src/server/services/
ls apps/lfx/src/server/controllers/
ls packages/shared/src/interfaces/
```

## Build Order

**Strict order — do not skip ahead:**

```text
Shared Types → Service → Controller → Route
```

---

### 1. Shared Types (`packages/shared/src/interfaces/<name>.interface.ts`)

```typescript
// Copyright The Linux Foundation and each contributor to LFX.
// SPDX-License-Identifier: MIT

export interface MyItem {
uid: string;
name: string;
description?: string;
created_at: string;
}
```

- License header required
- `interface` for object shapes, `type` for literal unions
- `as const` for constant objects
- Export from barrel `index.ts` in the same directory
- File suffixes: `.interface.ts`, `.enum.ts`, `.constants.ts`

---

### 2. Service (`apps/lfx/src/server/services/<name>.service.ts`)

```typescript
// Copyright The Linux Foundation and each contributor to LFX.
// SPDX-License-Identifier: MIT

import { QueryServiceResponse } from '@lfx-one/shared/interfaces';
import { Request } from 'express';

import { logger } from './logger.service';
import { MicroserviceProxyService } from './microservice-proxy.service';

class MyService {
private microserviceProxy = new MicroserviceProxyService();

public async getItems(req: Request): Promise<MyItem[]> {
logger.debug(req, 'get_items', 'Fetching items from upstream', {});

const { resources } = await this.microserviceProxy.proxyRequest<QueryServiceResponse<MyItem>>(req, 'LFX_V2_SERVICE', '/query/resources', 'GET', {
resource_type: 'my_items',
});

logger.debug(req, 'get_items', 'Fetched items', { count: resources.length });
return resources.map((r: any) => r.data);
}
}

export const myService = new MyService();
```

Service rules:

- `MicroserviceProxyService` for ALL external API calls — never raw `fetch` or `axios`
- Default to user bearer token (`req.bearerToken`) — M2M tokens only for `/public/api/` endpoints
- `logger.debug()` for step-by-step tracing
Comment thread
asithade marked this conversation as resolved.
- `logger.info()` for significant operations (transformations, enrichments)
- `logger.warning()` for recoverable errors (returning null/empty)
- Never use `serverLogger` directly — always `logger` from `./logger.service`

---

### 3. Controller (`apps/lfx/src/server/controllers/<name>.controller.ts`)

```typescript
// Copyright The Linux Foundation and each contributor to LFX.
// SPDX-License-Identifier: MIT

import { NextFunction, Request, Response } from 'express';

import { logger } from '../services/logger.service';
import { myService } from '../services/my.service';

export const getItems = async (req: Request, res: Response, next: NextFunction) => {
const startTime = logger.startOperation(req, 'get_items', {});

try {
const items = await myService.getItems(req);
logger.success(req, 'get_items', startTime, { count: items.length });
return res.json(items);
} catch (error) {
logger.error(req, 'get_items', startTime, error, {});
return next(error);
}
};
```

Controller rules:

- `logger.startOperation()` → `try/catch` → `logger.success()` or `next(error)`
- Never `res.status(500).json()` — always `next(error)`
- Operation names in `snake_case`
- One `startOperation` per HTTP endpoint

---

### 4. Route (`apps/lfx/src/server/routes/<name>.route.ts`)

```typescript
// Copyright The Linux Foundation and each contributor to LFX.
// SPDX-License-Identifier: MIT

import { Router } from 'express';

import { getItems, createItem } from '../controllers/my.controller';

const router = Router();

router.get('/items', getItems);
router.post('/items', createItem);

export default router;
```

---

### 5. Route Registration

`server.ts` is a **protected file**. Always tell the contributor:

> "The route file is created. It needs to be registered in `apps/lfx/src/server/server.ts` — a protected infrastructure file. Include this change in your PR for code owner review."

## Checklist

- [ ] Shared types created/updated in `packages/shared/src/interfaces/`
- [ ] Shared types exported from barrel `index.ts`
- [ ] Service uses `MicroserviceProxyService` (not raw fetch/axios)
- [ ] Service uses `logger` (not `serverLogger`)
- [ ] Controller uses `logger.startOperation()` / `logger.success()` / `logger.error()`
- [ ] Controller passes errors to `next(error)` (never `res.status(500)`)
- [ ] License headers on all files
- [ ] Contributor informed about `server.ts` registration

## Scope Boundaries

**This skill DOES:**

- Generate Express proxy services, controllers, and routes for `apps/lfx`
- Create/update shared TypeScript types in `packages/shared`

**This skill does NOT:**

- Generate Angular frontend code — use `/lfx-ui-builder` or `/lfx-design`
- Modify `apps/lfx-one` — use the existing `/develop` skill for that
- Modify `server.ts` directly — flag for code owner
Loading
Loading