ebm-skills 1.0.0

package/README.md

@@ -0,0 +1,44 @@
+# ebm-skills
+
+Claude Code skills for EBM Next.js projects.
+
+## Install
+
+```bash
+npx ebm-skills
+```
+
+Install specific skills only:
+
+```bash
+npx ebm-skills --only init,auth,table
+```
+
+Restart Claude Code after installing.
+
+## Skills
+
+| Command | What it does |
+|---------|-------------|
+| `/ebm-init` | New project wizard (create-next-app + Tailwind + UI lib + DB) |
+| `/ebm-auth` | Full auth system — JWT, RBAC, signin/forgot-password/user management pages |
+| `/ebm-table` | Server-side data table with pagination, search, and sort |
+| `/ebm-form` | Create/edit or search/filter form with React Hook Form + Zod |
+| `/ebm-upload` | Drag & drop file upload (local disk or S3-compatible) |
+| `/ebm-thai` | Scan & fix informal Thai UI text using formal Thai glossary |
+
+## Requirements
+
+- [Claude Code](https://claude.ai/download) installed
+- Node.js 18+
+
+## Typical workflow
+
+```
+/ebm-init     → scaffold new project
+/ebm-auth     → add auth system
+/ebm-table    → add data tables per feature
+/ebm-form     → add create/edit forms per feature
+/ebm-upload   → add file upload if needed
+/ebm-thai     → fix Thai language formality before review
+```

package/bin/cli.js

@@ -0,0 +1,150 @@
+#!/usr/bin/env node
+import { cp, mkdir, readFile, writeFile, access } from 'fs/promises'
+import { join, dirname } from 'path'
+import { homedir } from 'os'
+import { fileURLToPath } from 'url'
+
+const __dirname = dirname(fileURLToPath(import.meta.url))
+const ALL_SKILLS = ['ebm-init', 'ebm-auth', 'ebm-table', 'ebm-form', 'ebm-upload', 'ebm-thai']
+const packageSkillsDir = join(__dirname, '..', 'skills')
+
+const onlyIndex = process.argv.indexOf('--only')
+const selectedNames = onlyIndex !== -1
+  ? process.argv[onlyIndex + 1].split(',').map(s => s.trim().replace(/^ebm-/, ''))
+  : null
+const skills = selectedNames
+  ? selectedNames.map(s => `ebm-${s}`).filter(s => ALL_SKILLS.includes(s))
+  : ALL_SKILLS
+
+async function pathExists(p) {
+  try { await access(p); return true } catch { return false }
+}
+
+async function convertToCursorMdc(skillDir) {
+  const skillMd = await readFile(join(skillDir, 'SKILL.md'), 'utf8')
+  const m = skillMd.match(/^---\n([\s\S]*?)\n---\n([\s\S]*)$/m)
+  if (!m) return skillMd
+  const descMatch = m[1].match(/description:\s*(.+)/)
+  const description = descMatch ? descMatch[1].trim() : ''
+  return `---\ndescription: ${description}\nalwaysApply: false\n---\n${m[2]}`
+}
+
+// Read all stdin lines upfront (supports both interactive TTY and piped input)
+async function readStdinLines() {
+  if (process.stdin.isTTY) return null // interactive — use per-question readline
+  return new Promise(resolve => {
+    const chunks = []
+    process.stdin.on('data', d => chunks.push(d))
+    process.stdin.on('end', () => resolve(Buffer.concat(chunks).toString().split(/\r?\n/).map(l => l.trim())))
+  })
+}
+
+async function makeAsker(lines) {
+  if (lines) {
+    // piped mode — pop lines from queue
+    let i = 0
+    return (q) => {
+      const ans = lines[i++] ?? ''
+      process.stdout.write(q + ans + '\n')
+      return Promise.resolve(ans)
+    }
+  }
+  // interactive mode — readline
+  const { createInterface } = await import('readline')
+  const rl = createInterface({ input: process.stdin, output: process.stdout })
+  const ask = (q) => new Promise(resolve => rl.question(q, ans => resolve(ans.trim())))
+  ask.close = () => rl.close()
+  return ask
+}
+
+async function main() {
+  const lines = await readStdinLines()
+  const ask = await makeAsker(lines)
+
+  console.log('\nebm-skills installer\n')
+  console.log('Which platforms? (enter numbers separated by comma)\n')
+  console.log('  1) Claude Code   (~/.claude/skills/)')
+  console.log('  2) Antigravity   (~/.gemini/antigravity/skills/)')
+  console.log('  3) Cursor        (.cursor/rules/ or ~/.cursor/rules/)')
+  console.log()
+
+  const platformInput = await ask('Platforms [1,2,3]: ')
+  const selected = platformInput.split(',').map(s => s.trim()).filter(s => ['1','2','3'].includes(s))
+
+  if (selected.length === 0) {
+    ask.close?.()
+    console.error('No platform selected. Exiting.')
+    process.exit(1)
+  }
+
+  const targets = []
+
+  if (selected.includes('1')) {
+    const claudeDir = join(homedir(), '.claude')
+    if (!(await pathExists(claudeDir))) {
+      console.warn('⚠  ~/.claude not found — skipping Claude Code')
+    } else {
+      targets.push({ name: 'Claude Code', dest: join(claudeDir, 'skills'), type: 'claude' })
+    }
+  }
+
+  if (selected.includes('2')) {
+    targets.push({
+      name: 'Antigravity',
+      dest: join(homedir(), '.gemini', 'antigravity', 'skills'),
+      type: 'antigravity'
+    })
+  }
+
+  if (selected.includes('3')) {
+    const scope = await ask('Cursor scope — (g)lobal ~/.cursor/rules/ or (w)orkspace .cursor/rules/? [g/w]: ')
+    const isWorkspace = scope.toLowerCase().startsWith('w')
+    const dest = isWorkspace
+      ? join(process.cwd(), '.cursor', 'rules')
+      : join(homedir(), '.cursor', 'rules')
+    targets.push({ name: `Cursor (${isWorkspace ? 'workspace' : 'global'})`, dest, type: 'cursor' })
+  }
+
+  ask.close?.()
+
+  if (targets.length === 0) {
+    console.error('No valid targets. Exiting.')
+    process.exit(1)
+  }
+
+  console.log()
+
+  for (const target of targets) {
+    console.log(`Installing to ${target.name}...`)
+    const installed = []
+    const failed = []
+
+    for (const skill of skills) {
+      const src = join(packageSkillsDir, skill)
+      try {
+        if (target.type === 'cursor') {
+          await mkdir(target.dest, { recursive: true })
+          const mdc = await convertToCursorMdc(src)
+          await writeFile(join(target.dest, `${skill}.mdc`), mdc, 'utf8')
+        } else {
+          const dest = join(target.dest, skill)
+          await mkdir(dest, { recursive: true })
+          await cp(src, dest, { recursive: true })
+        }
+        console.log(`  ✓ /${skill}`)
+        installed.push(skill)
+      } catch (err) {
+        console.error(`  ✗ ${skill}: ${err.message}`)
+        failed.push(skill)
+      }
+    }
+
+    console.log(`  → ${installed.length} skill(s) installed to ${target.dest}\n`)
+    if (failed.length > 0) console.error(`  Failed: ${failed.join(', ')}\n`)
+  }
+
+  console.log('Done! Restart your editor to activate the skills.')
+  console.log(`\nAvailable commands: ${skills.map(s => `/${s}`).join('  ')}`)
+}
+
+main().catch(err => { console.error(err); process.exit(1) })

package/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "ebm-skills",
+  "version": "1.0.0",
+  "description": "Claude Code skills for EBM Next.js projects — scaffold auth, tables, forms, uploads, and more",
+  "type": "module",
+  "bin": {
+    "ebm-skills": "bin/cli.js"
+  },
+  "files": [
+    "bin",
+    "skills"
+  ],
+  "keywords": [
+    "claude-code",
+    "antigravity",
+    "cursor",
+    "nextjs",
+    "scaffold",
+    "ebm"
+  ],
+  "license": "MIT"
+}

package/skills/ebm-auth/REFERENCE.md

@@ -0,0 +1,299 @@
+# ebm-auth Reference
+
+## Config detection
+
+Read `ebm.config.json` before generating anything:
+```json
+{
+  "projectType": "landing | backoffice | both",
+  "colorMode": "dark | light | system",
+  "primaryColor": "#3b82f6",
+  "uiLib": "shadcn | antd | mui | none"
+}
+```
+If file missing → ask questions → save to `ebm.config.json`.
+
+UI generation rules:
+- **shadcn/ui**: use `<Button>`, `<Input>`, `<Card>` components
+- **Ant Design**: use `<Form>`, `<Input>`, `<Button>`, `<Table>` components
+- **MUI**: use `<TextField>`, `<Button>`, `<DataGrid>` components
+- **none / fallback**: generate raw Tailwind (dark slate theme)
+
+---
+
+## Mode A — Next.js App Router (Fullstack)
+
+### Auth logic files
+
+| File | Purpose |
+|------|---------|
+| `src/app/api/auth/[...nextauth]/route.ts` | NextAuth handler |
+| `src/app/api/auth/[...nextauth]/auth-options.ts` | JWT config, providers, callbacks |
+| `src/middleware.ts` | Route protection, first-login redirect |
+| `src/lib/auth.ts` | hashPassword, comparePasswords, findUserByEmail |
+| `src/lib/authorisation.ts` | CASL buildAbilityFor |
+| `src/lib/permission.ts` | getDataPermission (DB query) |
+| `src/lib/prisma.ts` | Prisma client singleton |
+| `src/services/AuthProvider.tsx` | SessionProvider client wrapper |
+| `src/services/AbilityProvider.tsx` | CASL ability context, syncs on session change |
+| `src/store/useAbilityStore.ts` | Zustand store for abilities |
+| `types/next-auth.d.ts` | Extended Session/JWT types |
+
+### auth-options.ts key config
+```typescript
+// JWT strategy, 30-day session
+// Credentials provider: email + password
+// Brute force: 5 attempts → 1-minute block (in-memory Map)
+// Session callback: embed id, email, name, phone_number,
+//   department_id, operation_hash[], reset_password, ad flags
+```
+
+### types/next-auth.d.ts
+```typescript
+declare module 'next-auth' {
+  interface Session {
+    user: {
+      id: number; email: string; name: string
+      phone_number: string; department_id: number
+      operation_hash: string[]; reset_password: boolean; ad: boolean
+    }
+  }
+}
+```
+
+### middleware.ts
+```typescript
+// withAuth — public routes: /signin, /forgot-password, /reset-password
+// reset_password === false → redirect to /change-password-first
+// no token → redirect to /signin
+```
+
+---
+
+## UI Pages
+
+### Route mapping by project type
+
+| Page | backoffice route | landing route |
+|------|-----------------|---------------|
+| Sign in | `/signin` | `/signin` |
+| Forgot password | `/forgot-password` | `/forgot-password` |
+| Reset password | `/reset-password` | `/reset-password` |
+| First login | `/change-password-first` | `/change-password-first` |
+| User management | `/dashboard/users` | `/users` |
+| User profile (own) | `/dashboard/profile` | `/profile` |
+| User detail (admin) | `/dashboard/users/[id]` | `/users/[id]` |
+
+### Sign-in page
+- Email + password form
+- Error states: invalid credentials, TOO_MANY_ATTEMPTS
+- Link to forgot password
+- Calls `signIn('credentials', { email, password, redirect: false })`
+
+### Forgot password page
+- Email input form
+- Calls `POST /api/auth/resetpassword/request`
+- Show success message after submit
+
+### Reset password page  
+- New password + confirm password fields
+- Reads `token` from URL query params
+- Calls `POST /api/auth/resetpassword/confirm`
+
+### First login page (`/change-password-first`)
+- New password + confirm password
+- Calls `PUT /api/change-password-first`
+- Updates session `reset_password: true` on success
+- Redirects to `/dashboard` or `/` based on project type
+
+### User management (`/dashboard/users` or `/users`)
+
+**List page:**
+- Table: name, email, role, department, status
+- Search/filter by name or email
+- Actions: edit, delete, reset password
+- "Add user" button → create modal/page
+
+**Create/Edit page (`/users/new`, `/users/[id]/edit`):**
+- Fields: name, email, password (create only), phone_number
+- Role selector (dropdown from DB)
+- Department selector (dropdown from DB)
+- reset_password toggle
+
+```typescript
+// API routes needed
+// GET    /api/users              → list users with role + department
+// POST   /api/users              → create user
+// GET    /api/users/[id]         → get single user
+// PUT    /api/users/[id]         → update user
+// DELETE /api/users/[id]         → delete user
+// PUT    /api/users/[id]/reset-password → force password reset
+```
+
+### User profile — own (`/dashboard/profile` or `/profile`)
+- Display: name, email, phone_number, role, department
+- Edit: name, phone_number
+- Change password section: current → new → confirm
+- Calls `PUT /api/auth/passwordsetting`
+
+### User detail — admin (`/dashboard/users/[id]` or `/users/[id]`)
+- Display all user fields: name, email, phone, role, department
+- Permissions list: all operation_hash entries as badges
+- Edit button → goes to edit page
+- Reset password button → calls reset-password API
+
+---
+
+## Seed file (always generate)
+
+`prisma/seed.ts` with `tsx` runner:
+```typescript
+// Operations: USER/ROLE/DATA/REPORT/SETTING/DEPARTMENT/FILE × VIEW/ADD/EDIT/DELETE/DOWNLOAD/UPLOAD/OPERATE/RESET_PASSWORD
+// Role: primaryAdmin → all operations
+// Department: Administration
+// User: admin@example.com / Admin@1234, reset_password: true
+```
+
+Add to `package.json`:
+```json
+{
+  "scripts": { "seed": "tsx prisma/seed.ts" },
+  "prisma": { "seed": "tsx prisma/seed.ts" }
+}
+```
+devDependencies: `tsx` (NOT ts-node — breaks on Windows)
+
+---
+
+## Optional: Azure AD
+
+```typescript
+import AzureADProvider from 'next-auth/providers/azure-ad'
+// First AD login: create user in DB with default role/department
+// Set ad: true flag in session
+```
+Env vars: `AZURE_AD_CLIENT_ID`, `AZURE_AD_CLIENT_SECRET`, `AZURE_AD_TENANT_ID`
+
+---
+
+## Optional: Email Password Reset
+
+Files:
+- `src/app/api/auth/resetpassword/request/route.ts` — 32-byte token, 15min expiry, send email
+- `src/app/api/auth/resetpassword/confirm/route.ts` — validate token, hash password, delete token
+
+Env vars: `SMTP_HOST`, `SMTP_PORT`, `SMTP_USER`, `SMTP_PASS`
+
+---
+
+## Mode B — Next.js (FE) + FastAPI (BE)
+
+### FastAPI files
+
+| File | Purpose |
+|------|---------|
+| `auth/router.py` | `/auth/login`, `/auth/logout`, `/auth/refresh` |
+| `auth/dependencies.py` | `get_current_user` dependency |
+| `auth/utils.py` | hash_password, verify_password, create_access_token |
+| `auth/models.py` | User, Role, Permission, Department models |
+| `auth/permissions.py` | casbin enforcer, buildAbilityFor |
+| `auth/schemas.py` | LoginRequest, TokenResponse, UserOut |
+
+### Next.js files (Mode B)
+
+| File | Purpose |
+|------|---------|
+| `src/app/signin/page.tsx` + `sign-in-form.tsx` | Sign-in UI |
+| `src/lib/auth-client.ts` | API calls to FastAPI, httpOnly cookie storage |
+| `src/middleware.ts` | Redirect to /signin if no token |
+
+UI pages for Mode B follow the same route mapping above but call FastAPI endpoints instead of NextAuth.
+
+### auth/utils.py
+```python
+from passlib.context import CryptContext
+from jose import jwt
+from datetime import datetime, timedelta
+
+pwd_context = CryptContext(schemes=["bcrypt"], deprecated="auto")
+
+def hash_password(password: str) -> str:
+    return pwd_context.hash(password)
+
+def verify_password(plain: str, hashed: str) -> bool:
+    return pwd_context.verify(plain, hashed)
+
+def create_access_token(data: dict, expires_delta=None) -> str:
+    to_encode = data.copy()
+    expire = datetime.utcnow() + (expires_delta or timedelta(minutes=30))
+    to_encode.update({"exp": expire})
+    return jwt.encode(to_encode, SECRET_KEY, algorithm="HS256")
+```
+
+---
+
+## RBAC Reference
+
+### Permission format: `SUBJECT__ACTION`
+Subjects: `USER ROLE DATA REPORT SETTING DEPARTMENT FILE`
+Actions: `VIEW ADD EDIT DELETE DOWNLOAD UPLOAD OPERATE RESET_PASSWORD`
+
+### DB Schema
+```sql
+users        (id, email, password_hash, name, phone_number, department_id, role_id, reset_password, ad, created_at)
+roles        (id, name)
+operations   (id, name)  -- e.g. "DATA__VIEW"
+role_operations      (role_id, operation_id)
+departments          (id, name)
+department_operations (department_id, operation_id)
+```
+
+---
+
+## .env.example additions
+
+### Mode A
+```env
+NEXTAUTH_SECRET=your-secret-here
+NEXTAUTH_URL=http://localhost:3000
+DATABASE_URL=postgresql://user:password@localhost:5432/dbname
+# Azure AD (optional)
+AZURE_AD_CLIENT_ID=
+AZURE_AD_CLIENT_SECRET=
+AZURE_AD_TENANT_ID=
+# Email Reset (optional)
+SMTP_HOST=
+SMTP_PORT=587
+SMTP_USER=
+SMTP_PASS=
+```
+
+### Mode B
+```env
+DATABASE_URL=postgresql://user:password@localhost:5432/dbname
+SECRET_KEY=your-secret-here
+ACCESS_TOKEN_EXPIRE_MINUTES=43200
+NEXT_PUBLIC_API_URL=http://localhost:8000
+```
+
+---
+
+## Post-generation summary template
+```
+✓ Generated [N] auth logic files
+✓ Generated [N] UI pages
+⚠ [N] conflicts → written as *.auth.* (merge manually)
+📋 Env vars appended to .env.example
+
+Default credentials:
+  Email:    admin@example.com
+  Password: Admin@1234
+
+Next steps:
+1. npm install next-auth bcryptjs @casl/ability zustand
+2. npm install -D @types/bcryptjs tsx
+3. Copy .env.example → .env.local and fill in values
+4. npx prisma migrate dev --name init
+5. npx prisma db seed
+6. npm run dev
+```

package/skills/ebm-auth/SKILL.md

@@ -0,0 +1,38 @@
+---
+name: ebm-auth
+description: Generate a full authentication system for a Next.js project — JWT sessions, RBAC with CASL, brute-force protection, and complete UI pages (signin, forgot-password, reset-password, first-login, user management, user profile). Reads project config from ebm.config.json. Supports Next.js fullstack (NextAuth) and Next.js + FastAPI. Use when user invokes /ebm-auth or asks to add authentication to an existing project.
+---
+
+# /ebm-auth
+
+### Step 1 — Read config
+```
+ebm.config.json exists? → use projectType, uiLib, primaryColor
+else → ask questions → save to ebm.config.json
+```
+
+### Step 2 — Detect stack
+```
+Has next-auth → Mode A (Next.js fullstack)
+Has FastAPI indicators → Mode B (Next.js + FastAPI)
+Unclear → ask
+ORM: @prisma/client → Prisma | drizzle-orm → Drizzle | sqlalchemy → SQLAlchemy | else ask
+```
+
+### Step 3 — Ask optional modules
+- Azure AD SSO?
+- Email-based password reset?
+
+### Step 4 — Generate auth logic + UI pages
+See [REFERENCE.md](REFERENCE.md) for all files, templates, routes.
+
+### Step 5 — Post-generation rules
+- Append to `.env.example` (create if missing)
+- `tsconfig.json`: ensure `"@/*": ["./src/*"]` paths exist
+- Conflict: file exists → write `filename.auth.ext` + merge comment
+- Seed: always `tsx prisma/seed.ts` (Windows-safe, never ts-node)
+- Print summary + next steps
+
+## Shared rules
+- Path alias: `@/*` → `./src/*` always
+- Thai UI text: use formal Thai — see `/ebm-thai` glossary