deckhearth/.github/workflows/ci.yml
Randall Stillwell b7ffeef270 feat(design-system): finish Liquid Glass — close all remaining sub-convoys
Follow-up PR to #95 (Liquid Glass foundation + primitives + Layout shell)
that closes out the remaining sub-convoy briefs in a single sweep.
Operator-instructed scope: "finish off the design changes."

After this PR, **all 8 Liquid Glass sub-convoys are MERGED to main**;
the deferred-from-#5 `fix-card3d-state` convoy is dropped (its target,
`components/Card3D.js`, turned out to be dead code).

## #2 Brief 2 — Remaining 8 modals migrated to <Modal> primitive

- `CollectionsSuccessModal.js` — wrap in <Modal hideCloseButton>; 2 Buttons.
- `CollectionsEditModal.js` — full <Modal> + <Input> + <Button> rewrite (4 fields, tag chip section, public-toggle preserved, 2 footer Buttons).
- `CollectionEditModal.js` — same pattern as above (4 fields + public-toggle + 2 Buttons).
- `CardDetailDeckModal.js` — <Modal> + native select (Select primitive not in scope) + 2 Buttons; sweep `gradient-bg-purple` → `<Button variant="primary">`.
- `UploadImageModal.js` — <Modal> + token-driven URL/file tab switcher + drag-drop using `--accent-ember` rim + 2 Buttons (one with `loading` prop).
- `CollectionSelectionModal.js` — largest of the set (header summary + SearchBar + scrollable list w/ checkbox toggles + footer); migrated to <Modal size="lg"> while preserving the per-collection card preview thumbnails.
- `OCRSettings.js` — trivial <Modal> wrap + single primary <Button>.
- `pages/decks.js` — both inline modals (Create Deck + Edit Deck) and `components/ScannerPageView.js` (Create List) migrated; ScannerPageView dropped its `useFocusTrap` named-import (Modal's internal focus trap owns the panel ref now).
- **`.github/workflows/ci.yml` `forbidden-modal-shell-without-primitive`** — grandfather list emptied to zero entries; gate is now strict.

## #3 Brief 2 — Forms migrated to <Button> / <SearchBar>

- `pages/dashboard.js` — 3 CTAs → <Button> (Create List with leadingIcon, Create Your First List, View All Lists).
- `pages/my-cards.js` — empty-state CTA → <Button variant="primary" size="lg">. View-mode toggle buttons intentionally left native (icon-only, doesn't match Button variants).
- `pages/community/collections.js` — Go to My Lists CTA → <Button>.
- `components/CollectionsPageView.js` — Discover Community + Create List header CTAs → <Button>; search input → <SearchBar>.
- Card-grid per-row icon buttons (CollectionsPageView, my-cards, CardsPageView) intentionally left native — tiny per-card actions whose styling doesn't match Button variants and would invalidate visual-diff baselines.

## #5 — scope revised + landed

`components/Card3D.js` deletion: surveyed every importer with grep — **zero consumers** in `pages/**` or `components/**`. Only references were in convoy docs. The "pre-existing state-management bug" (state setters used without useState declarations) never affected the running app because the component was never rendered. -505 LOC. The `fix-card3d-state` convoy is dropped from the roadmap as a result.

The actual card-grid component (`components/CardItem.js`) is intentionally **not** modified in this sweep — it has per-rarity glow tuning that the existing visual-diff baseline locks in, and the architect's #5 deferral note specifically called out the dedicated baseline re-seed cost. A future implementer turn can apply rim-light tokens to CardItem with its own baseline re-seed when an operator wants that polish.

## #6 Brief 1 — Landing + invite pages glass-migrated

- `pages/index.js` — top nav: `var(--glass-surface-mid)` + `--glass-blur-mid` + rim-light. 3 feature cards: `<GlassSurface tint="mid" rim="subtle" elevation="ambient">`. Featured-list cards (the public collection grid): same `<GlassSurface>` recipe with motion-token transitions. All 6 CTA buttons → <Button variant="primary"|"secondary"|"ghost"> with proper sizes. Pulse-loading placeholders tagged `.motion-essential` so reduced-motion users still see them animate (state-meaningful).
- `pages/invite/accept.js` + `pages/invite/decline.js` — both outcome panels wrapped in `<GlassSurface tint="mid" rim="subtle" elevation="pronounced">`. Loading spinner border colors corrected from `--text-accent` (which didn't exist) to `--accent-ember`. All 8 buttons → <Button>. `gradient-bg-ember` consumers retained (the canonical warm-palette utility class is fine).

## #8 Brief 2 — Legacy alias sweep + CI gate graduation

- Swept `gradient-bg-purple` → `gradient-bg-ember` across **8 files** / **13 occurrences**: `CardDetailQuantityModal`, `CardEditorView`, `CardEditorForm`, `AdminProtected`, `pages/card/[id]`, `pages/invite/{accept,decline}`, `pages/admin/card-import`. `gradient-bg-purple` was a dangling class name with no CSS definition (it was rendering no styling), so the sweep is also a bug fix — those buttons now actually get the ember gradient.
- Deleted the 5 dead CSS classes from `styles/globals.css`: `.gradient-text-blue`, `.gradient-text-purple`, `[data-theme="dark"] .glow-blue`, `[data-theme="dark"] .glow-purple`, `[data-theme="dark"] .glow-pink`. Each was zero-consumer post-sweep.
- **Graduated the `forbidden-deprecated-color-aliases` CI job from WARN to FAIL.** All 9 patterns (`gradient-text-{purple,pink,blue}`, `glow-{purple,pink,blue}`, `gradient-bg-{purple,blue,pink}`) now block the build if any consumer is reintroduced.

## Verification (local + CI gates locally exercised)

- Lint: 0 errors, 2 pre-existing warnings (`CardEditorForm.js` + `CollectionsPageView.js` carry-overs from before #95; out of scope).
- Vitest: 104/104 passing — unchanged from #95.
- Build: clean (Turbopack default; passes both light + dark theme prerender).
- `forbidden-modal-shell-without-primitive` gate: locally clear (`grep -lE 'fixed inset-0 bg-black bg-opacity-' pages components -r --include='*.js'` returns no matches).
- `forbidden-deprecated-color-aliases` gate: locally clear (all 9 patterns return no matches in `pages/` or `components/`).

## What still needs human action

- **Linux visual-diff baselines** must re-seed via the Docker workflow in `AGENTS.md` § 6. This PR's landing-page + invite-page changes will produce baseline drift on the homepage screenshot (which is currently the only baseline committed) AND additional baselines will be generated for the landing's glass-card sections once the visual spec is expanded. Recommended: run the Docker re-seed against this PR's Vercel preview, commit the result to this branch, push, verify CI green, then merge.
- Vercel auto-promotes the merge to production.

## Closes / supersedes

- Closes `.convoys/liquid-glass-modal-and-surface-primitive.md` Brief 2 (status → merged).
- Closes `.convoys/liquid-glass-form-primitives.md` Brief 2 (status → merged with explicit per-row-icon-button deferral note).
- Closes `.convoys/liquid-glass-public-and-auth.md` Brief 1 (status → merged).
- Closes `.convoys/cleanup-legacy-design-css.md` Brief 2 (status → merged + CI gate FAIL).
- Drops `.convoys/liquid-glass-card-surfaces.md` Brief 1 prerequisite (`fix-card3d-state` no longer needed; Card3D deleted).
- Drops the queued `fix-card3d-state` follow-up from the roadmap (target deleted).
- Updates `.convoys/ship-readiness.md` § "Design-system redesign portfolio" with a "Finish-portfolio sweep" subsection documenting final status of all 8 sub-convoys.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-03 20:30:15 -05:00

354 lines
14 KiB
YAML

name: CI
# Vercel variant: Vercel builds Preview deployments on every push and gates the
# PR via the Vercel GitHub integration check. Running `npm run build` here too
# would duplicate Vercel's work for ~3-5 minutes per PR with no added signal.
#
# What this CI covers (and Vercel does not):
# - Lint (cheap belt-and-suspenders)
# - Schema-map drift check (docs/SCHEMA_MAP.md updated when scripts/add-*.js changes)
# - Migrations apply cleanly (node-pg-migrate against ephemeral Postgres 16)
# - Unit tests (vitest)
#
# NOTE: tcg-vault is JavaScript (not TypeScript). No `npx tsc --noEmit` step.
# Re-enable a type-check job if migrating to TypeScript.
on:
pull_request:
branches: [main]
push:
branches: [main]
concurrency:
group: ci-${{ github.workflow }}-${{ github.ref }}
cancel-in-progress: true
env:
NODE_VERSION: '20'
jobs:
lint:
name: Lint
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: ${{ env.NODE_VERSION }}
cache: npm
- run: npm ci
- run: npm run lint --if-present
schema-map-fresh:
name: Schema map up to date
runs-on: ubuntu-latest
# Only run when migration scripts or the schema map itself changed.
# If neither changed, nothing to verify.
if: |
contains(github.event.pull_request.changed_files, 'scripts/add-') ||
contains(github.event.pull_request.changed_files, 'scripts/fix-') ||
contains(github.event.pull_request.changed_files, 'scripts/setup-neon-db.js') ||
contains(github.event.pull_request.changed_files, 'migrations/') ||
contains(github.event.pull_request.changed_files, 'docs/SCHEMA_MAP.md')
steps:
- uses: actions/checkout@v4
with:
fetch-depth: 2
- name: Verify schema map updated alongside migration scripts
run: |
MIGRATION_CHANGED=false
MAP_CHANGED=false
if git diff --name-only HEAD~1 | grep -qE '^scripts/(add-|fix-|setup-neon-db\.js)'; then
MIGRATION_CHANGED=true
fi
if git diff --name-only HEAD~1 | grep -qE '^migrations/'; then
MIGRATION_CHANGED=true
fi
if git diff --name-only HEAD~1 | grep -q '^docs/SCHEMA_MAP\.md$'; then
MAP_CHANGED=true
fi
if [ "$MIGRATION_CHANGED" = "true" ] && [ "$MAP_CHANGED" = "false" ]; then
echo "::error::A migration script changed but docs/SCHEMA_MAP.md was not updated."
echo "Update docs/SCHEMA_MAP.md to reflect the schema change, then re-push."
exit 1
fi
echo "OK: schema map and migration scripts are in sync."
forbidden-endpoints:
name: No dev endpoints in pages/api
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail if dev endpoints re-appear under pages/api/
run: |
BAD_PATHS=(
"pages/api/simple.js"
"pages/api/test-auth.js"
"pages/api/test-db.js"
"pages/api/setup-database.js"
)
FOUND=()
for path in "${BAD_PATHS[@]}"; do
if [ -f "$path" ]; then
FOUND+=("$path")
fi
done
# Also flag any new pages/api/test-*.js the explicit list missed.
while IFS= read -r path; do
FOUND+=("$path")
done < <(find pages/api -maxdepth 4 -type f -name 'test-*.js' 2>/dev/null || true)
if [ ${#FOUND[@]} -gt 0 ]; then
echo "::error::Forbidden dev endpoints present in pages/api/. Delete them or move to scripts/."
for path in "${FOUND[@]}"; do
echo "::error file=${path}::Forbidden dev endpoint."
done
exit 1
fi
echo "OK: no forbidden dev endpoints under pages/api/."
forbidden-cors-headers:
name: No wildcard CORS in pages/api
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail if any pages/api/ handler carries Access-Control-Allow-Origin
run: |
# The tcg-vault frontend and API are served from the same Vercel
# deployment (same origin), so CORS headers serve no purpose and
# are a documented attack surface (see .convoys/cors-tighten.md
# and AGENTS.md Gotcha #5). Brief 4 of fix-auth-bypass cleaned
# login.js + register.js; the cors-tighten convoy swept the
# remaining 24 files. This job locks the cleanup in.
#
# If a future cross-origin caller is legitimately needed, design
# a proper CORS layer (probably via middleware) rather than
# scaffolding wildcards into individual handlers.
MATCHES=$(grep -rEn 'Access-Control-Allow-(Origin|Methods|Headers)' pages/api/ 2>/dev/null || true)
if [ -n "$MATCHES" ]; then
echo "::error::Forbidden CORS headers present under pages/api/. Remove them — same-origin Vercel deployment does not need CORS."
echo "$MATCHES" | while IFS= read -r line; do
file=$(echo "$line" | cut -d: -f1)
lineno=$(echo "$line" | cut -d: -f2)
echo "::error file=${file},line=${lineno}::Forbidden CORS header — delete this line."
done
exit 1
fi
echo "OK: no Access-Control-Allow-* headers under pages/api/."
forbidden-client-side-llm-keys:
name: No client-side LLM key leakage
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail on key-returning config endpoints or new browser LLM URLs
run: |
# Deleted by secure-scanner-gemini-key — must not return API keys to browsers.
if [ -f pages/api/config/gemini.js ]; then
echo "::error file=pages/api/config/gemini.js::Forbidden config endpoint — do not return API keys to browsers."
exit 1
fi
CONFIG_MATCHES=$(grep -rEn 'apiKey:' pages/api/config/ 2>/dev/null || true)
if [ -n "$CONFIG_MATCHES" ]; then
echo "::error::Forbidden apiKey response under pages/api/config/."
echo "$CONFIG_MATCHES" | while IFS= read -r line; do
file=$(echo "$line" | cut -d: -f1)
lineno=$(echo "$line" | cut -d: -f2)
echo "::error file=${file},line=${lineno}::Do not return API keys from config endpoints."
done
exit 1
fi
AI_OCR_IMPORTS=$(grep -rEn 'from ['\''"].*ai-ocr|import.*ai-ocr' components/ 2>/dev/null || true)
if [ -n "$AI_OCR_IMPORTS" ]; then
echo "::error::Browser code must not import lib/ai-ocr — use POST /api/scan/identify instead."
echo "$AI_OCR_IMPORTS" | while IFS= read -r line; do
file=$(echo "$line" | cut -d: -f1)
lineno=$(echo "$line" | cut -d: -f2)
echo "::error file=${file},line=${lineno}::Remove ai-ocr import; call server-side scan API."
done
exit 1
fi
# lib/ may hold server-only helpers imported only from pages/api/.
SERVER_ONLY=(
lib/scan-vision.js
)
LLM_PATTERN='generativelanguage\.googleapis\.com|api\.openai\.com|ai-gateway\.vercel\.sh'
FOUND=()
while IFS= read -r file; do
skip=false
for so in "${SERVER_ONLY[@]}"; do
if [ "$file" = "$so" ]; then
skip=true
break
fi
done
if [ "$skip" = true ]; then
continue
fi
if grep -qE "$LLM_PATTERN" "$file" 2>/dev/null; then
FOUND+=("$file")
fi
done < <(find components lib pages -name '*.js' ! -path 'pages/api/*' 2>/dev/null || true)
if [ ${#FOUND[@]} -gt 0 ]; then
echo "::error::Client-side LLM API URLs must not appear outside pages/api/."
for path in "${FOUND[@]}"; do
echo "::error file=${path}::Move LLM calls server-side or add to server-side-scan-pipeline removal list."
done
exit 1
fi
echo "OK: no client-side LLM key leakage patterns detected."
forbidden-modal-shell-without-primitive:
name: No new modal shells without <Modal> primitive
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail if ANY file uses the legacy modal-shell pattern
run: |
# liquid-glass-modal-and-surface-primitive convoy — every modal
# MUST compose the `<Modal>` primitive from components/ui/.
# The original 9 grandfathered shells were swept in the
# finish-liquid-glass-design PR; the gate is now strict and
# has zero allow-list entries. If a new file legitimately
# needs the legacy pattern (rare — backdrop-blur sheets that
# are not modals belong in a different primitive), revive the
# allow-list pattern AND open a tracking issue.
FOUND=()
while IFS= read -r file; do
FOUND+=("$file")
done < <(grep -lE 'fixed inset-0 bg-black bg-opacity-' \
pages components -r --include='*.js' 2>/dev/null \
| sort -u || true)
if [ ${#FOUND[@]} -gt 0 ]; then
echo "::error::Legacy modal-shell pattern detected. Use the <Modal> primitive from components/ui/."
for f in "${FOUND[@]}"; do
echo "::error file=${f}::Replace 'fixed inset-0 bg-black bg-opacity-' with <Modal open={…} onClose={…} title=…> from components/ui."
done
exit 1
fi
echo "OK: no legacy modal shells anywhere in pages/ or components/."
forbidden-deprecated-color-aliases:
name: No use of deprecated color aliases
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail if ANY code uses pre-Deck-Hearth blue/purple/pink aliases
run: |
# liquid-glass-design-tokens + cleanup-legacy-design-css convoys.
# Pre-Deck-Hearth alias utility classes (.gradient-text-blue /
# .gradient-text-purple / .glow-blue / .glow-purple / .glow-pink /
# .gradient-bg-purple / .gradient-bg-blue / .gradient-bg-pink) were
# graduated from WARN to FAIL by the finish-liquid-glass-design PR
# after every consumer was swept to --accent-ember equivalents
# AND the CSS definitions were deleted from styles/globals.css.
#
# If a new consumer of one of these classes appears, the build
# will fail — use --accent-ember, --accent-flame, --accent-gold
# (the canonical warm-palette tokens) instead.
PATTERNS=(
'gradient-text-purple'
'gradient-text-pink'
'gradient-text-blue'
'glow-purple'
'glow-pink'
'glow-blue'
'gradient-bg-purple'
'gradient-bg-blue'
'gradient-bg-pink'
)
ALL_MATCHES=""
for pattern in "${PATTERNS[@]}"; do
MATCHES=$(grep -rFn "$pattern" pages components --include='*.js' 2>/dev/null || true)
if [ -n "$MATCHES" ]; then
ALL_MATCHES=$(printf '%s\n%s' "$ALL_MATCHES" "$MATCHES")
fi
done
if [ -n "$ALL_MATCHES" ]; then
echo "::error::Deprecated color alias detected. Use --accent-ember / --accent-flame / --accent-gold (or the .gradient-bg-ember / .gradient-text-ember utility classes)."
echo "$ALL_MATCHES" | sort -u | while IFS= read -r line; do
[ -z "$line" ] && continue
file=$(echo "$line" | cut -d: -f1)
lineno=$(echo "$line" | cut -d: -f2)
echo "::error file=${file},line=${lineno}::Deprecated color alias — replace with the canonical Deck Hearth warm-palette equivalent."
done
exit 1
fi
echo "OK: no deprecated color aliases in pages/ or components/."
forbidden-stale-strings:
name: No stale ownership/collection copy
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Fail if forbidden UI strings appear in pages/ or components/
run: |
# rename-collections-vocabulary convoy — ownership vs curated-list taxonomy.
# API/DB literals (e.g. system collection name) live under pages/api/ only.
PATTERNS=(
'Mark Owned'
'Owned Cards'
'All My Cards'
)
FOUND=()
for pattern in "${PATTERNS[@]}"; do
while IFS= read -r line; do
FOUND+=("$line")
done < <(grep -rFn "$pattern" pages/ components/ \
--include='*.js' \
--exclude-dir=api 2>/dev/null || true)
done
if [ ${#FOUND[@]} -gt 0 ]; then
echo "::error::Forbidden stale UI string(s) in pages/ or components/. Use lib/collection-vocabulary.js labels — see AGENTS.md § Product vocabulary."
printf '%s\n' "${FOUND[@]}" | sort -u | while IFS= read -r line; do
file=$(echo "$line" | cut -d: -f1)
lineno=$(echo "$line" | cut -d: -f2)
text=$(echo "$line" | cut -d: -f3-)
echo "::error file=${file},line=${lineno}::${text}"
done
exit 1
fi
echo "OK: no forbidden stale strings in pages/ or components/."
migrate:
name: Migrations apply (node-pg-migrate)
runs-on: ubuntu-latest
services:
postgres:
image: postgres:16
env:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
POSTGRES_DB: deckhearth_test
ports:
- 5432:5432
options: >-
--health-cmd pg_isready
--health-interval 10s
--health-timeout 5s
--health-retries 5
env:
POSTGRES_URL: postgres://postgres:postgres@localhost:5432/deckhearth_test
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: ${{ env.NODE_VERSION }}
cache: npm
- run: npm ci
- name: Write migrate env file
run: echo "POSTGRES_URL=${POSTGRES_URL}" >> .env.local
- run: npm run migrate up
test:
name: Unit tests (vitest)
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: ${{ env.NODE_VERSION }}
cache: npm
- run: npm ci
- run: npm run test:run
env:
JWT_SECRET: ci-secret-only-for-tests-do-not-use-in-prod