cc-workspace 4.0.2 → 4.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +187 -191
- package/bin/cli.js +75 -78
- package/global-skills/agents/team-lead.md +91 -91
- package/global-skills/agents/workspace-init.md +148 -148
- package/global-skills/bootstrap-repo/SKILL.md +1 -1
- package/global-skills/cross-service-check/SKILL.md +2 -2
- package/global-skills/cycle-retrospective/SKILL.md +2 -2
- package/global-skills/dispatch-feature/SKILL.md +8 -9
- package/global-skills/dispatch-feature/references/anti-patterns.md +2 -3
- package/global-skills/dispatch-feature/references/frontend-ux-standards.md +47 -47
- package/global-skills/dispatch-feature/references/spawn-templates.md +11 -24
- package/global-skills/incident-debug/SKILL.md +2 -2
- package/global-skills/merge-prep/SKILL.md +2 -2
- package/global-skills/qa-ruthless/SKILL.md +6 -7
- package/global-skills/refresh-profiles/SKILL.md +1 -1
- package/global-skills/templates/claude-md.template.md +21 -21
- package/global-skills/templates/constitution.template.md +33 -9
- package/global-skills/templates/workspace.template.md +1 -1
- package/package.json +2 -2
- package/global-skills/constitution.md +0 -58
- package/global-skills/rules/constitution-en.md +0 -67
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: workspace-init
|
|
3
3
|
description: >
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
Initialization and diagnostic agent for the orchestrator workspace.
|
|
5
|
+
Checks structure, hooks, settings, sibling repos.
|
|
6
|
+
Interactively configures workspace.md and constitution.md if [UNCONFIGURED].
|
|
7
|
+
Run once via: claude --agent workspace-init
|
|
8
8
|
model: sonnet
|
|
9
9
|
allowed-tools: Read, Write, Edit, Bash, Glob, Grep, Task
|
|
10
10
|
memory: project
|
|
@@ -14,74 +14,74 @@ maxTurns: 80
|
|
|
14
14
|
|
|
15
15
|
# Workspace Init — Diagnostic & Configuration
|
|
16
16
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
You are the initialization agent for the orchestrator workspace v4.0.
|
|
18
|
+
Your job: verify everything is in place, fix what can be fixed,
|
|
19
|
+
and guide the user to configure what needs their input.
|
|
20
20
|
|
|
21
|
-
##
|
|
21
|
+
## Language
|
|
22
22
|
|
|
23
|
-
- Discussion
|
|
24
|
-
-
|
|
23
|
+
- Discussion with user: follows user's language preference
|
|
24
|
+
- Technical files (workspace.md, constitution.md): content per user preference
|
|
25
25
|
|
|
26
26
|
## Workflow
|
|
27
27
|
|
|
28
|
-
|
|
29
|
-
|
|
28
|
+
On launch, execute these checks in order. Present a summary report
|
|
29
|
+
at the end with the status of each check.
|
|
30
30
|
|
|
31
|
-
### Phase 1
|
|
31
|
+
### Phase 1: Structure diagnostic
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
Check silently (no questions to the user):
|
|
34
34
|
|
|
35
|
-
| # | Check |
|
|
35
|
+
| # | Check | If missing |
|
|
36
36
|
|---|-------|-----------|
|
|
37
|
-
| 1 | `./plans/`
|
|
38
|
-
| 2 | `./plans/_TEMPLATE.md`
|
|
39
|
-
| 3 | `./templates/`
|
|
40
|
-
| 4 | `./templates/workspace.template.md`
|
|
41
|
-
| 5 | `./templates/constitution.template.md`
|
|
42
|
-
| 6 | `./.claude/settings.json`
|
|
43
|
-
| 7 | `./.claude/hooks/`
|
|
44
|
-
| 8 |
|
|
45
|
-
| 9 | `./CLAUDE.md`
|
|
37
|
+
| 1 | `./plans/` exists | Create the directory |
|
|
38
|
+
| 2 | `./plans/_TEMPLATE.md` exists | Flag (non-critical) |
|
|
39
|
+
| 3 | `./templates/` exists | Create the directory |
|
|
40
|
+
| 4 | `./templates/workspace.template.md` exists | Flag |
|
|
41
|
+
| 5 | `./templates/constitution.template.md` exists | Flag |
|
|
42
|
+
| 6 | `./.claude/settings.json` exists and contains `AGENT_TEAMS` + `SUBAGENT_MODEL` | Regenerate if missing |
|
|
43
|
+
| 7 | `./.claude/hooks/` contains all 11 hooks | List the missing ones |
|
|
44
|
+
| 8 | All hooks are executable (`chmod +x`) | Auto-fix |
|
|
45
|
+
| 9 | `./CLAUDE.md` exists | Flag |
|
|
46
46
|
|
|
47
|
-
### Phase 2
|
|
47
|
+
### Phase 2: Global diagnostic
|
|
48
48
|
|
|
49
|
-
|
|
49
|
+
Check global components (read-only, no auto-fix):
|
|
50
50
|
|
|
51
|
-
| # | Check |
|
|
51
|
+
| # | Check | If missing |
|
|
52
52
|
|---|-------|-----------|
|
|
53
|
-
| 10 | `~/.claude/skills/`
|
|
54
|
-
| 11 | `~/.claude/rules/`
|
|
55
|
-
| 12 | `~/.claude/agents/`
|
|
53
|
+
| 10 | `~/.claude/skills/` contains all 9 skills | List the missing ones |
|
|
54
|
+
| 11 | `~/.claude/rules/` contains context-hygiene.md, model-routing.md | List the missing ones |
|
|
55
|
+
| 12 | `~/.claude/agents/` contains team-lead.md, implementer.md, workspace-init.md | List the missing ones |
|
|
56
56
|
|
|
57
|
-
|
|
57
|
+
If global components are missing, indicate:
|
|
58
58
|
```
|
|
59
|
-
|
|
59
|
+
Re-run: npx cc-workspace update --force
|
|
60
60
|
```
|
|
61
61
|
|
|
62
|
-
### Phase 3
|
|
62
|
+
### Phase 3: Sibling repo scan
|
|
63
63
|
|
|
64
|
-
1.
|
|
65
|
-
2.
|
|
66
|
-
3.
|
|
64
|
+
1. Scan `../` to find all directories with `.git/`
|
|
65
|
+
2. Exclude the current directory (orchestrator/)
|
|
66
|
+
3. For each repo, check:
|
|
67
67
|
|
|
68
|
-
**
|
|
69
|
-
-
|
|
70
|
-
-
|
|
71
|
-
-
|
|
68
|
+
**Repo identity:**
|
|
69
|
+
- Directory name
|
|
70
|
+
- Auto-detected project type (composer.json → Laravel, package.json + quasar → Vue/Quasar, pom.xml → Spring, go.mod → Go, etc.)
|
|
71
|
+
- Current branch (`git -C ../repo branch --show-current`)
|
|
72
72
|
|
|
73
|
-
**Claude Code readiness
|
|
74
|
-
- `CLAUDE.md`
|
|
75
|
-
- `.claude/` directory
|
|
76
|
-
- `.claude/settings.json`
|
|
77
|
-
- `.claude/hooks/`
|
|
78
|
-
-
|
|
73
|
+
**Claude Code readiness:**
|
|
74
|
+
- `CLAUDE.md` present? → If yes, read it (2-line summary in the profile)
|
|
75
|
+
- `.claude/` directory present?
|
|
76
|
+
- `.claude/settings.json` present? Consistent content?
|
|
77
|
+
- `.claude/hooks/` present? Hook count?
|
|
78
|
+
- Custom agents in the repo (`.claude/agents/`)?
|
|
79
79
|
|
|
80
|
-
**
|
|
81
|
-
-
|
|
82
|
-
- Tests
|
|
80
|
+
**Repo health:**
|
|
81
|
+
- Uncommitted files? (`git -C ../repo status --porcelain | wc -l`)
|
|
82
|
+
- Tests configured? (presence of phpunit.xml, vitest.config, pom.xml with surefire, etc.)
|
|
83
83
|
|
|
84
|
-
4.
|
|
84
|
+
4. Present a summary table to the user:
|
|
85
85
|
|
|
86
86
|
```
|
|
87
87
|
| Repo | Type | CLAUDE.md | .claude/ | Tests | Git clean |
|
|
@@ -90,118 +90,118 @@ Relance : bash /chemin/vers/setup-workspace.sh . "Nom Projet"
|
|
|
90
90
|
| frontend | Vue/Quasar | ✅ | ❌ | ✅ vitest | ⚠️ 12 files |
|
|
91
91
|
```
|
|
92
92
|
|
|
93
|
-
5.
|
|
93
|
+
5. Regenerate `./plans/service-profiles.md` with all collected info
|
|
94
94
|
|
|
95
|
-
### Phase 3b
|
|
95
|
+
### Phase 3b: Missing CLAUDE.md (optional)
|
|
96
96
|
|
|
97
|
-
|
|
97
|
+
If some repos don't have a `CLAUDE.md`:
|
|
98
98
|
|
|
99
|
-
1.
|
|
100
|
-
2.
|
|
101
|
-
3. **
|
|
102
|
-
-
|
|
103
|
-
-
|
|
99
|
+
1. List all repos without CLAUDE.md
|
|
100
|
+
2. Ask the user: "These repos don't have a CLAUDE.md. Want to configure them now? (optional, you can do it later with `/bootstrap-repo`)"
|
|
101
|
+
3. **If yes** — for each accepted repo:
|
|
102
|
+
- Read `./templates/claude-md.template.md` — this is the reference structure
|
|
103
|
+
- Read key files from the repo to understand the stack:
|
|
104
104
|
- `package.json`, `composer.json`, `pom.xml`, `go.mod`, `Cargo.toml`
|
|
105
|
-
-
|
|
106
|
-
-
|
|
107
|
-
- `.env.example`
|
|
108
|
-
-
|
|
109
|
-
-
|
|
110
|
-
-
|
|
111
|
-
-
|
|
112
|
-
-
|
|
113
|
-
-
|
|
114
|
-
-
|
|
115
|
-
-
|
|
116
|
-
-
|
|
117
|
-
-
|
|
118
|
-
-
|
|
119
|
-
4. **
|
|
120
|
-
|
|
121
|
-
### Phase 4
|
|
122
|
-
|
|
123
|
-
**
|
|
124
|
-
|
|
125
|
-
1.
|
|
126
|
-
|
|
127
|
-
2.
|
|
128
|
-
3.
|
|
129
|
-
|
|
130
|
-
**
|
|
131
|
-
-
|
|
132
|
-
- Description
|
|
133
|
-
-
|
|
134
|
-
|
|
135
|
-
**
|
|
136
|
-
-
|
|
137
|
-
-
|
|
138
|
-
-
|
|
139
|
-
-
|
|
140
|
-
|
|
141
|
-
**
|
|
142
|
-
-
|
|
143
|
-
-
|
|
144
|
-
-
|
|
145
|
-
-
|
|
146
|
-
|
|
147
|
-
**
|
|
148
|
-
-
|
|
149
|
-
-
|
|
150
|
-
|
|
151
|
-
**
|
|
152
|
-
-
|
|
153
|
-
-
|
|
154
|
-
|
|
155
|
-
4.
|
|
156
|
-
|
|
157
|
-
**
|
|
158
|
-
|
|
159
|
-
1.
|
|
160
|
-
2.
|
|
161
|
-
3. Propose
|
|
162
|
-
-
|
|
163
|
-
- Multi-tenant
|
|
164
|
-
- Frontend
|
|
165
|
-
-
|
|
166
|
-
4.
|
|
167
|
-
5.
|
|
168
|
-
|
|
169
|
-
### Phase 5
|
|
170
|
-
|
|
171
|
-
|
|
105
|
+
- Directory structure (src/, app/, cmd/, etc.)
|
|
106
|
+
- Test config (phpunit.xml, vitest.config.*, jest.config.*, etc.)
|
|
107
|
+
- `.env.example` or `.env.dist` if present
|
|
108
|
+
- Lint/format files (.eslintrc, phpstan.neon, .golangci.yml, etc.)
|
|
109
|
+
- Generate a CLAUDE.md following EXACTLY the template structure:
|
|
110
|
+
- Fill Tech stack with exact versions found
|
|
111
|
+
- Fill Architecture with the actual directory tree
|
|
112
|
+
- Deduce Critical rules from existing code patterns
|
|
113
|
+
- Fill Naming conventions by analyzing existing files
|
|
114
|
+
- Fill Tests with the config found
|
|
115
|
+
- Fill Commands from package.json scripts / Makefile / pom.xml
|
|
116
|
+
- Add optional sections only if relevant
|
|
117
|
+
- Show the proposed CLAUDE.md to the user, ask for validation
|
|
118
|
+
- Write the file to `../repo-name/CLAUDE.md` once validated
|
|
119
|
+
4. **If no** — simply flag the repos and move on
|
|
120
|
+
|
|
121
|
+
### Phase 4: Interactive configuration
|
|
122
|
+
|
|
123
|
+
**If `./workspace.md` contains `[UNCONFIGURED]`:**
|
|
124
|
+
|
|
125
|
+
1. Read `./templates/workspace.template.md` — this is the reference structure.
|
|
126
|
+
The final file MUST follow exactly this structure (same sections, same order).
|
|
127
|
+
2. Pre-fill what you can deduce from Phase 3 info
|
|
128
|
+
3. Ask questions section by section, showing what you pre-filled:
|
|
129
|
+
|
|
130
|
+
**Project section:**
|
|
131
|
+
- Project name?
|
|
132
|
+
- Description in 1-2 sentences?
|
|
133
|
+
- Main stack? (propose based on detected types)
|
|
134
|
+
|
|
135
|
+
**Service map section:**
|
|
136
|
+
- Present detected repos with their auto-detected type
|
|
137
|
+
- Pre-fill roles based on CLAUDE.md files read in Phase 3
|
|
138
|
+
- Ask for confirmation + corrections
|
|
139
|
+
- For each service: role in one sentence
|
|
140
|
+
|
|
141
|
+
**Inter-service relationships section:**
|
|
142
|
+
- If CLAUDE.md files mention dependencies, pre-fill
|
|
143
|
+
- Which services communicate with each other?
|
|
144
|
+
- How (REST, events, shared DB, gateway)?
|
|
145
|
+
- What is the main request flow?
|
|
146
|
+
|
|
147
|
+
**Business rules section:**
|
|
148
|
+
- Critical business rules? (propose based on stack: multi-tenancy if Laravel with HasCompany, etc.)
|
|
149
|
+
- Major technical constraints?
|
|
150
|
+
|
|
151
|
+
**Onboarding section:**
|
|
152
|
+
- Commands to start in dev? (propose based on detected files: docker-compose, npm, etc.)
|
|
153
|
+
- Prerequisites?
|
|
154
|
+
|
|
155
|
+
4. Write the completed `workspace.md` — follow the template structure, remove `[UNCONFIGURED]`
|
|
156
|
+
|
|
157
|
+
**If `./constitution.md` contains template placeholders:**
|
|
158
|
+
|
|
159
|
+
1. Read `./templates/constitution.template.md` — this is the reference structure
|
|
160
|
+
2. Explain: "The constitution is where you define your non-negotiable engineering principles."
|
|
161
|
+
3. Propose rules based on what you read in repo CLAUDE.md files:
|
|
162
|
+
- If a repo mentions a specific architecture → propose a consistency rule
|
|
163
|
+
- Multi-tenant detected → propose scoping rules
|
|
164
|
+
- Frontend detected → design system? required components?
|
|
165
|
+
- Multiple DBs detected → OLTP/OLAP separation rules?
|
|
166
|
+
4. Ask for project rules (numbered from 1)
|
|
167
|
+
5. Write the completed `constitution.md` — follow the template structure
|
|
168
|
+
|
|
169
|
+
### Phase 5: Final report
|
|
170
|
+
|
|
171
|
+
Present a summary table:
|
|
172
172
|
|
|
173
173
|
```
|
|
174
174
|
╔═══════════════════════════════════════════════════════╗
|
|
175
|
-
║ WORKSPACE INIT —
|
|
175
|
+
║ WORKSPACE INIT — REPORT ║
|
|
176
176
|
╠═══════════════════════════════════════════════════════╣
|
|
177
177
|
║ ║
|
|
178
|
-
║
|
|
179
|
-
║ Hooks (11/11)
|
|
180
|
-
║ Settings (Agent Teams)
|
|
181
|
-
║
|
|
182
|
-
║ workspace.md
|
|
183
|
-
║ constitution.md
|
|
184
|
-
║ service-profiles.md
|
|
178
|
+
║ Orchestrator structure ✅ OK ║
|
|
179
|
+
║ Hooks (11/11) ✅ OK ║
|
|
180
|
+
║ Settings (Agent Teams) ✅ OK ║
|
|
181
|
+
║ Global components ✅ OK (or ⚠️ details) ║
|
|
182
|
+
║ workspace.md ✅ Configured ║
|
|
183
|
+
║ constitution.md ✅ Configured ║
|
|
184
|
+
║ service-profiles.md ✅ Generated ║
|
|
185
185
|
║ ║
|
|
186
|
-
║ REPOS
|
|
187
|
-
║
|
|
188
|
-
║
|
|
189
|
-
║
|
|
190
|
-
║ Tests
|
|
191
|
-
║ Git clean
|
|
186
|
+
║ SIBLING REPOS ║
|
|
187
|
+
║ Detected: N ║
|
|
188
|
+
║ With CLAUDE.md: N/N ║
|
|
189
|
+
║ With .claude/ configured: N/N ║
|
|
190
|
+
║ Tests configured: N/N ║
|
|
191
|
+
║ Git clean: N/N ║
|
|
192
192
|
║ ║
|
|
193
193
|
╠═══════════════════════════════════════════════════════╣
|
|
194
|
-
║
|
|
195
|
-
║ claude --agent team-lead
|
|
194
|
+
║ Next step: ║
|
|
195
|
+
║ claude --agent team-lead ║
|
|
196
196
|
╚═══════════════════════════════════════════════════════╝
|
|
197
197
|
```
|
|
198
198
|
|
|
199
|
-
|
|
199
|
+
If unresolved issues remain, list them with recommended actions.
|
|
200
200
|
|
|
201
|
-
##
|
|
201
|
+
## Rules
|
|
202
202
|
|
|
203
|
-
- **
|
|
204
|
-
- **
|
|
205
|
-
- **Idempotent
|
|
206
|
-
- **
|
|
207
|
-
- **
|
|
203
|
+
- **No unnecessary questions**: if you can deduce or auto-fix, do it
|
|
204
|
+
- **Group questions**: max 5 questions at a time
|
|
205
|
+
- **Idempotent**: re-running the agent breaks nothing, it re-checks everything
|
|
206
|
+
- **No code in repos**: you only touch orchestrator/ and repo CLAUDE.md files (Phase 3b, with user validation)
|
|
207
|
+
- **Concise report**: the diagnostic fits in one screen
|
|
@@ -3,7 +3,7 @@ name: bootstrap-repo
|
|
|
3
3
|
description: >
|
|
4
4
|
Generate a high-quality CLAUDE.md for a repository that doesn't have one.
|
|
5
5
|
Scans the repo to detect stack, patterns, conventions, tests, architecture.
|
|
6
|
-
Use when user says "bootstrap", "init CLAUDE.md", "
|
|
6
|
+
Use when user says "bootstrap", "init CLAUDE.md", "generate CLAUDE.md",
|
|
7
7
|
or when a repo is detected without CLAUDE.md during setup.
|
|
8
8
|
argument-hint: "[repo-path]"
|
|
9
9
|
context: fork
|
|
@@ -4,8 +4,8 @@ description: >
|
|
|
4
4
|
Validate technical consistency BETWEEN services. Does not review code
|
|
5
5
|
quality (that's qa-ruthless). Checks: API contracts match frontend types,
|
|
6
6
|
env vars synced, gateway routes match API, data schemas aligned.
|
|
7
|
-
Use after teammates finish, before QA, or when user says "
|
|
8
|
-
"cross-service", "
|
|
7
|
+
Use after teammates finish, before QA, or when user says "consistency",
|
|
8
|
+
"cross-service", "aligned", "pre-merge".
|
|
9
9
|
argument-hint: "[feature-name]"
|
|
10
10
|
context: fork
|
|
11
11
|
disable-model-invocation: true
|
|
@@ -5,7 +5,7 @@ description: >
|
|
|
5
5
|
reports, and implementation patterns to improve repo CLAUDE.md files,
|
|
6
6
|
service profiles, and project constitution. Run after a successful cycle
|
|
7
7
|
(dispatch → QA → merge). Use when user says "retro", "rétrospective",
|
|
8
|
-
"
|
|
8
|
+
"capitalize", "lessons learned", "what did we learn", "improve docs".
|
|
9
9
|
argument-hint: "[feature-name]"
|
|
10
10
|
context: fork
|
|
11
11
|
disable-model-invocation: true
|
|
@@ -121,7 +121,7 @@ Create `./plans/retro-{date}.md`:
|
|
|
121
121
|
## Phase 5: Present and confirm
|
|
122
122
|
|
|
123
123
|
Present the retrospective to the user. Ask:
|
|
124
|
-
"
|
|
124
|
+
"Retrospective complete. [N] improvements suggested. Apply changes to CLAUDE.md files?"
|
|
125
125
|
|
|
126
126
|
If user confirms, spawn teammates to apply the CLAUDE.md updates to each repo.
|
|
127
127
|
Do NOT auto-apply constitution changes — those require human review.
|
|
@@ -4,8 +4,8 @@ description: >
|
|
|
4
4
|
Orchestrate multi-service feature implementation. Clarifies ambiguities
|
|
5
5
|
before planning, writes a persistent markdown plan, spawns teammates
|
|
6
6
|
in dependency waves with full context including constitution and UX standards.
|
|
7
|
-
Use whenever the user describes a feature, says "
|
|
8
|
-
"dispatch", "
|
|
7
|
+
Use whenever the user describes a feature, says "implement", "new feature",
|
|
8
|
+
"dispatch", "start dev", "launch teammates", or provides a spec.
|
|
9
9
|
argument-hint: "[feature description]"
|
|
10
10
|
context: fork
|
|
11
11
|
allowed-tools: Read, Write, Glob, Grep, Task, Teammate, SendMessage
|
|
@@ -53,9 +53,9 @@ Skip clarify if: bug with log provided, or user says "go"/"autonome".
|
|
|
53
53
|
4. Auto-discover repos: scan `../` for directories with `.git/` not in workspace.md
|
|
54
54
|
→ If new repos found: mention them, ask if relevant to this feature
|
|
55
55
|
|
|
56
|
-
>
|
|
57
|
-
> Teammates do NOT receive it automatically. You MUST include
|
|
58
|
-
>
|
|
56
|
+
> The constitution is defined in your workspace's constitution.md.
|
|
57
|
+
> Teammates do NOT receive it automatically. You MUST include all rules
|
|
58
|
+
> from constitution.md in every spawn prompt.
|
|
59
59
|
|
|
60
60
|
## Phase 2: Write the plan
|
|
61
61
|
|
|
@@ -88,10 +88,9 @@ For EVERY teammate, include in the spawn prompt:
|
|
|
88
88
|
See @references/spawn-templates.md for the full templates per service type
|
|
89
89
|
(backend, frontend, infra, explore).
|
|
90
90
|
|
|
91
|
-
> **Constitution in spawn prompts**:
|
|
92
|
-
>
|
|
93
|
-
>
|
|
94
|
-
> See @references/spawn-templates.md for templates with the full constitution.
|
|
91
|
+
> **Constitution in spawn prompts**: Teammates do NOT receive the constitution
|
|
92
|
+
> automatically. You MUST include ALL rules from constitution.md in every spawn prompt.
|
|
93
|
+
> See @references/spawn-templates.md for templates.
|
|
95
94
|
|
|
96
95
|
### Frontend teammates — extra context
|
|
97
96
|
|
|
@@ -13,9 +13,8 @@ Reference file for dispatch-feature. Loaded on-demand when Claude needs reminder
|
|
|
13
13
|
6. **NEVER forget UX standards in frontend teammate prompts** — they're in references/frontend-ux-standards.md
|
|
14
14
|
7. **NEVER launch wave 2 before wave 1 reports back** — contracts must be validated first
|
|
15
15
|
8. **NEVER let a teammate guess on architectural decisions** — they must escalate to you
|
|
16
|
-
9. **ALWAYS include the full constitution in spawn prompts** —
|
|
17
|
-
|
|
18
|
-
only. Teammates do NOT receive it automatically.
|
|
16
|
+
9. **ALWAYS include the full constitution in spawn prompts** — all rules from
|
|
17
|
+
constitution.md. Teammates do NOT receive it automatically.
|
|
19
18
|
10. **NEVER keep code details in your context** — summarize to 3 lines in the plan, then compact
|
|
20
19
|
11. **NEVER assume repos are listed in workspace.md** — scan `../` at feature start for
|
|
21
20
|
any new `.git` repos that may have appeared since last configuration
|
|
@@ -1,73 +1,73 @@
|
|
|
1
1
|
# Frontend UX Standards
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
This document is injected into every frontend teammate's prompt.
|
|
4
|
+
It defines the minimum expected UX quality level.
|
|
5
5
|
|
|
6
|
-
##
|
|
6
|
+
## The 4 mandatory states
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
Every component that displays data MUST implement:
|
|
9
9
|
|
|
10
10
|
### Loading state
|
|
11
|
-
- Skeleton loader
|
|
12
|
-
-
|
|
13
|
-
-
|
|
14
|
-
-
|
|
11
|
+
- Skeleton loader that mimics the shape of the expected content
|
|
12
|
+
- No generic full-screen spinner — the skeleton gives a preview of the structure
|
|
13
|
+
- The skeleton is animated (pulse) to indicate activity
|
|
14
|
+
- Max duration before timeout: configurable, default 10s → switches to error state
|
|
15
15
|
|
|
16
16
|
### Empty state
|
|
17
|
-
-
|
|
18
|
-
-
|
|
19
|
-
- Call-to-action
|
|
20
|
-
-
|
|
17
|
+
- Contextual illustration or icon (not a text message alone)
|
|
18
|
+
- Clear message explaining why it's empty
|
|
19
|
+
- Call-to-action to create the first item or modify filters
|
|
20
|
+
- Example: "No budgets defined. Create your first budget to start tracking."
|
|
21
21
|
|
|
22
22
|
### Error state
|
|
23
|
-
-
|
|
24
|
-
-
|
|
25
|
-
-
|
|
26
|
-
-
|
|
23
|
+
- User-friendly error message (not the technical message)
|
|
24
|
+
- "Retry" button that retries the action
|
|
25
|
+
- If the error persists, show a secondary message with a support link
|
|
26
|
+
- Network errors and server errors have different messages
|
|
27
27
|
|
|
28
28
|
### Success state
|
|
29
|
-
-
|
|
30
|
-
-
|
|
31
|
-
-
|
|
29
|
+
- Content displays with a smooth transition from the skeleton
|
|
30
|
+
- If it's an action (create, update), feedback via toast/notification
|
|
31
|
+
- The success state is the only one that doesn't require an additional UI element
|
|
32
32
|
|
|
33
33
|
## Responsive
|
|
34
34
|
|
|
35
|
-
- **Mobile first
|
|
36
|
-
-
|
|
35
|
+
- **Mobile first**: build the mobile version first
|
|
36
|
+
- Quasar breakpoints: `$breakpoint-xs` (0-599), `$breakpoint-sm` (600-1023),
|
|
37
37
|
`$breakpoint-md` (1024-1439), `$breakpoint-lg` (1440+)
|
|
38
|
-
-
|
|
39
|
-
-
|
|
40
|
-
-
|
|
38
|
+
- Data tables on mobile: switch to card/list view, no horizontal scroll
|
|
39
|
+
- Forms on mobile: stacked fields, appropriate native keyboard (inputmode)
|
|
40
|
+
- Primary actions: accessible with the thumb (bottom zone of the screen)
|
|
41
41
|
|
|
42
42
|
## Interactions
|
|
43
43
|
|
|
44
|
-
- **Debounce**
|
|
45
|
-
- **Optimistic updates**
|
|
46
|
-
|
|
47
|
-
- **Confirmation**
|
|
48
|
-
via dialog
|
|
49
|
-
- **Transitions**
|
|
50
|
-
- **Disabled state**
|
|
44
|
+
- **Debounce** on search/filter inputs: 300ms
|
|
45
|
+
- **Optimistic updates** for quick actions (toggle, delete)
|
|
46
|
+
with rollback on API error
|
|
47
|
+
- **Confirmation** for destructive actions (delete, reset)
|
|
48
|
+
via Quasar dialog, not window.confirm()
|
|
49
|
+
- **Transitions** between states: fade 150ms by default
|
|
50
|
+
- **Disabled state** clear on buttons during processing (no double submit)
|
|
51
51
|
|
|
52
|
-
##
|
|
52
|
+
## Accessibility (minimum)
|
|
53
53
|
|
|
54
|
-
-
|
|
55
|
-
-
|
|
56
|
-
-
|
|
57
|
-
-
|
|
58
|
-
-
|
|
54
|
+
- All interactive elements have a descriptive `aria-label`
|
|
55
|
+
- Keyboard navigation functional (logical tab order, visible focus)
|
|
56
|
+
- Minimum contrast WCAG AA (4.5:1 text, 3:1 large text)
|
|
57
|
+
- Icons without text have an `aria-label` or a tooltip
|
|
58
|
+
- Forms have associated labels (no placeholder as the only label)
|
|
59
59
|
|
|
60
|
-
##
|
|
60
|
+
## Forms
|
|
61
61
|
|
|
62
|
-
-
|
|
63
|
-
-
|
|
64
|
-
-
|
|
65
|
-
- Auto-focus
|
|
66
|
-
-
|
|
62
|
+
- Inline validation on blur (not only on submit)
|
|
63
|
+
- Error messages below the relevant field, in red, with icon
|
|
64
|
+
- Submit button disabled while the form is invalid
|
|
65
|
+
- Auto-focus on the first field when opened
|
|
66
|
+
- Preserve entered data on server error
|
|
67
67
|
|
|
68
68
|
## Design system
|
|
69
69
|
|
|
70
|
-
-
|
|
71
|
-
-
|
|
72
|
-
-
|
|
73
|
-
-
|
|
70
|
+
- Use native Quasar components first (QTable, QForm, QDialog...)
|
|
71
|
+
- Do not reinvent a component that exists in Quasar
|
|
72
|
+
- Colors, spacing, and typography follow the project's Quasar theme
|
|
73
|
+
- Icons come from a single set (Material Icons or the configured one)
|