@donotdev/cli 0.0.11 → 0.0.13

package/templates/root-consumer/guides/wai-way/blueprints/4_configure.md.example

@@ -1,165 +1,237 @@
-# BLUEPRINT: 4_CONFIGURE + POLISH
+# BLUEPRINT: 4_CONFIGURE + TEST
 
-**Goal:** Finalize configuration, test, and optionally add i18n.
+**Goal:** Generate test files, configure the app, verify everything works.
 
-**Done when:** Config complete, tests pass, mobile responsive.
+**MCP:** `start_phase(4)` to begin. `complete_phase({ files: [...], lesson: "..." })` when done.
+**Done when:** Tests pass, config complete, firestore rules generated.
 
-**Prerequisite:** Phase 0-3 complete. App is functional.
+**Prerequisite:** Phase 0-3 complete. App is functional with hardcoded strings.
 
 ---
 
-## Step 1: Update Configuration
+## Step 1: Generate Test Setup
 
-### app.ts
+Create these files:
 
-**READ:** `src/config/app.ts`
+### vitest.config.ts
+```ts
+import { defineConfig } from 'vitest/config';
+import react from '@vitejs/plugin-react';
 
-- [ ] `APP_NAME` - Your app name (from spec)
-- [ ] `APP_SHORT_NAME` - Abbreviation
-- [ ] `preset` - From spec (landing/admin/moolti/docs/blog/game/plain)
-- [ ] Footer legal links
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    environment: 'jsdom',
+    setupFiles: ['./tests/setup.ts'],
+    globals: true,
+    include: ['tests/**/*.test.ts', 'tests/**/*.test.tsx'],
+  },
+});
+```
 
-### legal.ts
+### tests/setup.ts
+```ts
+import '@testing-library/jest-dom';
+```
 
-**READ:** `src/config/legal.ts`
+**READ** `get_guide("TESTING")` for full testing patterns.
 
-- [ ] Company name and registration
-- [ ] Contact emails
-- [ ] Hosting provider info
-- [ ] Jurisdiction
+---
 
-### .env
+## Step 2: Generate Entity Tests
+
+**READ:** `entities/index.ts` — get the list of all entities.
+**READ:** `guides/wai-way/spec_template.md` — get the permissions matrix and business rules.
 
-Required:
-- [ ] `VITE_FIREBASE_*` - Firebase config
-- [ ] `VITE_DONOTDEV_LICENSE_KEY` - License key
+For **each entity** in `entities/`, create `tests/entities/[EntityName].test.ts`:
 
-Optional (from spec features):
-- [ ] `VITE_STRIPE_*` - If billing enabled
-- [ ] `VITE_SENTRY_DSN` - If error tracking
+- [ ] All required fields are defined
+- [ ] Field types match spec
+- [ ] Access rules match spec (create/read/update/delete per role)
+- [ ] State transitions are valid (if entity has states)
+- [ ] Default values set correctly
 
 ---
 
-## Step 2: Firebase Setup
+## Step 3: Generate Page Tests
+
+**READ:** Every `src/pages/*Page.tsx` file.
 
-1. Go to [Firebase Console](https://console.firebase.google.com)
-2. Enable auth providers (from spec):
-   - [ ] Email/Password
-   - [ ] Google
-   - [ ] GitHub
-   - [ ] etc.
-3. Create Firestore Database
-4. Deploy rules: `firebase deploy --only firestore:rules`
+For **each page**, create `tests/pages/[PageName].test.tsx`:
+
+- [ ] Page renders without error
+- [ ] PageMeta is defined (title, auth, admin)
+- [ ] Route protection matches spec (public pages have `auth: false`, protected have `auth: true`, admin have `admin: true`)
 
 ---
 
-## Step 3: Test with Emulators
+## Step 4: Generate Access Control Tests
 
-```bash
-dndev emu start
-bun dev
-```
+**READ:** The spec's permissions section.
+
+Create `tests/access/access-rules.test.ts`:
 
-### Auth Tests
-- [ ] Can create user account
-- [ ] Can login/logout
-- [ ] Public pages work without auth
-- [ ] Protected pages redirect to login
-- [ ] Admin pages require admin role
-
-### CRUD Tests
-- [ ] Can create entities
-- [ ] Can read/list entities
-- [ ] Can update entities
-- [ ] Can delete entities
-- [ ] Data persists
-
-### Access Control Tests
-- [ ] Guest can only see guest-visible fields
-- [ ] User can only edit own data (if owner access)
-- [ ] Admin can edit all data
+- [ ] Admin-only entities require admin access
+- [ ] User-owned entities have owner access on update/delete
+- [ ] Public entities allow guest read
+- [ ] No entity allows unauthenticated write
 
 ---
 
-## Step 4: Theme Customization
+## Step 5: Generate Firestore Rules
+
+**READ:** All entities' access definitions.
 
-**READ:** `src/themes.css`
+Create `firestore.rules` from entity access rules:
 
-Key variables:
-- `--primary` - Brand color
-- `--accent` - Accent color
-- `--background` - Page background
-- `--foreground` - Text color
-- `--radius` - Border radius
+- Each entity's collection maps to a Firestore match rule
+- `create` access → `allow create` condition
+- `read` access → `allow read` condition
+- `update` access → `allow update` condition
+- `delete` access → `allow delete` condition
+- `owner` → `resource.data.userId == request.auth.uid`
+- `admin` → `request.auth.token.admin == true`
+- `authenticated` → `request.auth != null`
 
 ---
 
-## Step 5: Mobile Check
+## Step 6: Update Configuration
+
+### app.ts
+**READ:** `src/config/app.ts`
+- [ ] `APP_NAME` from spec
+- [ ] `APP_SHORT_NAME` abbreviation
+- [ ] `preset` from spec (landing/admin/moolti/docs/blog/game/plain)
+- [ ] Footer legal links
 
-1. Open DevTools (F12)
-2. Toggle device toolbar (Ctrl+Shift+M)
-3. Test at 375px width
+### legal.ts
+**READ:** `src/config/legal.ts`
+- [ ] Company name and registration
+- [ ] Contact emails
+- [ ] Hosting provider
+- [ ] Jurisdiction
 
-Check:
-- [ ] Navigation works (mobile menu)
-- [ ] Forms are usable
-- [ ] Text is readable
-- [ ] Buttons are tappable (44px min)
-- [ ] No horizontal scroll
+### .env
+- [ ] `VITE_FIREBASE_*` — Firebase config values
+- [ ] `VITE_DONOTDEV_LICENSE_KEY` — License key
+- [ ] Optional: `VITE_STRIPE_*`, `VITE_SENTRY_DSN`
 
 ---
 
-## Step 6: i18n (Optional)
+## Step 7: Generate CI/CD
+
+Create `.github/workflows/ci.yml`:
+
+```yaml
+name: CI/CD
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+env:
+  NODE_VERSION: '20'
+
+jobs:
+  quality:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install --frozen-lockfile
+      - run: bun run type-check
+      - run: bun test
+
+  deploy:
+    needs: quality
+    if: github.ref == 'refs/heads/main' && github.event_name == 'push'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install --frozen-lockfile
+      - run: bun run build
+      - uses: FirebaseExtended/action-hosting-deploy@v0
+        with:
+          repoToken: ${{ secrets.GITHUB_TOKEN }}
+          firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }}
+          channelId: live
+```
 
-**Only after Steps 1-5 are validated!**
+Adapt based on spec:
+- If **functions** enabled → add `firebase deploy --only functions` step
+- If **staging** environment → add staging job with `dndev staging`
+- If **no Firebase** (Vercel) → replace deploy job with Vercel action
+
+---
 
-### Extract Strings
+## Step 8: Run Tests
 
-Create `src/locales/[namespace]_en.json`:
-```json
-{
-  "hero": {
-    "title": "Your App Name",
-    "subtitle": "Your tagline"
-  }
-}
+```bash
+bun test
 ```
 
-### Replace Hardcoded Strings
+Fix any failures. All tests must pass.
 
-```tsx
-const { t } = useTranslation('home');
+---
 
-<HeroSection
-  title={t('hero.title')}
-  subtitle={t('hero.subtitle')}
-/>
-```
+## Step 9: Mobile Check
+
+1. Open DevTools (F12) → device toolbar (Ctrl+Shift+M) → 375px
+2. Check:
+   - [ ] Navigation works (mobile menu)
+   - [ ] Forms are usable
+   - [ ] Text is readable
+   - [ ] Buttons tappable (44px min)
+   - [ ] No horizontal scroll
+
+---
+
+## Step 10: i18n (Optional)
 
-### Add Languages
+**Only after Steps 1-9 pass!**
 
-Copy `home_en.json` → `home_fr.json`, translate values.
+Extract hardcoded strings to `src/locales/[namespace]_en.json`, replace with `useTranslation()`.
 
 ---
 
 ## Final Checklist
 
-- [ ] app.ts configured
-- [ ] legal.ts configured
-- [ ] .env configured
-- [ ] Firebase connected
-- [ ] Auth working
-- [ ] CRUD working
-- [ ] Access control working
-- [ ] Mobile responsive
+- [ ] `vitest.config.ts` created
+- [ ] Entity tests generated (one per entity)
+- [ ] Page tests generated (one per page)
+- [ ] Access control tests generated
+- [ ] `firestore.rules` generated from entities
+- [ ] `.github/workflows/ci.yml` generated
+- [ ] `app.ts` configured
+- [ ] `legal.ts` configured
+- [ ] `.env` configured
+- [ ] `bun test` passes
+- [ ] Mobile responsive at 375px
 - [ ] (Optional) i18n added
 
 ---
 
 ## Output
 
-Production-ready app with:
-- Complete configuration
-- Working auth & CRUD
-- Mobile responsive
-- (Optional) Multi-language support
+Call `complete_phase` with ALL generated test files + config files:
+
+```
+complete_phase({
+  files: [
+    "vitest.config.ts",
+    "tests/setup.ts",
+    "tests/entities/Task.test.ts",
+    "tests/entities/User.test.ts",
+    "tests/pages/DashboardPage.test.tsx",
+    "tests/access/access-rules.test.ts",
+    "firestore.rules",
+    ".github/workflows/ci.yml",
+    "src/config/app.ts",
+    "src/config/legal.ts"
+  ],
+  lesson: "..."
+})
+```

package/templates/root-consumer/guides/wai-way/context_map.json.example

@@ -49,17 +49,18 @@
       ],
       "output": "All pages functional with hardcoded content"
     },
-    "4_configure_polish": {
+    "4_configure_test": {
       "agent": "polisher",
-      "goal": "Finalize config, test, optional i18n",
-      "done_when": "Config complete, tests pass, mobile responsive",
+      "goal": "Generate tests from spec, firestore rules from entities, finalize config",
+      "done_when": "Tests pass, firestore.rules generated, config complete, mobile responsive",
       "read_files": [
+        "guides/wai-way/spec_template.md",
+        "entities/index.ts",
         "src/config/app.ts",
         "src/config/legal.ts",
-        "src/themes.css",
-        ".env"
+        "guides/dndev/SETUP_TESTING.md"
       ],
-      "output": "Working app with auth, CRUD, and config complete"
+      "output": "Test files, firestore.rules, configured app"
     }
   },
   "key_files": {
@@ -89,7 +90,7 @@
     }
   },
   "workflow": {
-    "summary": "BRAINSTORM → SPEC → SCAFFOLD → ENTITIES → COMPOSE → CONFIGURE",
+    "summary": "BRAINSTORM (→ spec) → SCAFFOLD → ENTITIES → COMPOSE → CONFIGURE + TEST",
     "critical_rule": "Spec is OUTPUT of brainstorming. User validates before coding. Validated spec = mechanical build."
   }
 }

package/templates/root-consumer/guides/wai-way/page_patterns.md.example

@@ -291,7 +291,7 @@ export default function HomePage() {
             </Section>
 
             <Section title="How It Works">
-                <Grid cols={[1, 1, 3, 3]} gap="medium">
+                <Grid cols={[1, 1, 3, 3]}>
                     <Card title="1. Sign Up" content="Create your account in seconds." />
                     <Card title="2. Configure" content="Set up your preferences." />
                     <Card title="3. Launch" content="Start using immediately." />
@@ -415,7 +415,7 @@ export default function SettingsPage() {
 
             <Section title="Notifications">
                 <Card>
-                    <Stack direction="column" gap="medium">
+                    <Stack direction="column">
                         <Stack direction="row" justify="between" align="center">
                             <Text>Email notifications</Text>
                             <Switch defaultChecked />
@@ -485,7 +485,7 @@ export default function ProfilePage() {
 
             <Section title="Account Details">
                 <Card>
-                    <Stack direction="column" gap="medium">
+                    <Stack direction="column">
                         <Stack direction="row" justify="between">
                             <Text variant="muted">Email</Text>
                             <Text>{user?.email}</Text>
@@ -559,7 +559,7 @@ export default function ProductDetailPage() {
                     </Card>
 
                     {/* Details */}
-                    <Stack direction="column" gap="medium">
+                    <Stack direction="column">
                         <Text level="h1">{product.name}</Text>
                         <Badge>{product.category}</Badge>
                         <Text level="h2">${product.price}</Text>