跳到正文
cccskills
免费在 GitHub 公开

schema-review

Render a crouton collection schema (the field-definition JSON) into a human-readable field table + relationships sketch (HTML + PNG + a terse Markdown table), so a human can sign off on the DATA MODEL before any code is generated. Use when an agent drafts or changes a collection schema (before `crouton config` / `generate_collection`), or when asked to "review a schema", "show the data model", "check these fields".

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(3)

  • SKILL.md6.9 KB
  • example.schema.json815 B
  • render-schema.mjs13.1 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Schema Review — check the data model before you generate it

Turns a raw collection schema (field-definition JSON) into a reviewable artifact: a skimmable field table (name · type · required · translatable · default · references) plus a small relationships sketch — so the data model can be approved before crouton config generates the Form / List / API / migration from it.

This is the schema analog of the ui-proposal skill, and the foundation of the schema sign-off loop (epic #314): produce the review → it gets posted on the PR → iterate on feedback → only then generate the collection. The schema is the foundation; a wrong field type or missing relationship means regenerating the whole collection, so approving it first is cheap and fixing it after is not.

Why a PNG? GitHub comments can't render raw HTML/CSS. The committed .html is the editable source; the .png is what gets posted (plus the inline Markdown table).

When to use

  • An agent has drafted/changed a collection schema (the fieldsFile JSON, or MCP design_schema output) and is about to run crouton config / generate_collection.
  • The user asks to "review the schema", "show the data model", "check these fields".
  • Skip for non-schema work (no collection / field defs involved).

Review the crouton.config.js alongside the fields. The schema is the data model; crouton.config.js is the generation plan — collections, target layer, features, locales, dialect — and it decides the generated forms / lists / API surface. So the config is part of the same sign-off, presented next to the field tables, not a separate step.

It sits after the machine validate_schema step (which checks the JSON is well-formed) — this is the human gate on top of it.

What it produces

ArtifactPathCommitted?
Review source (HTML)writeups/schema-reviews/<collection>.html✅ yes (editable source of truth)
Markdown tablewriteups/schema-reviews/<collection>.md✅ yes (inline-postable)
Rendered imagescreenshots/schema-review-<collection>.png❌ no — screenshots/ is gitignored; it's posted to the PR, not committed

Step 1 — Get the schema JSON

Obtain the field-definition JSON for the collection (the fieldsFile, or the MCP design_schema output). Save it to a file, e.g. /tmp/<collection>.schema.json. The renderer accepts any of these shapes:

  • { "collection": "products", "fields": { ... } }
  • { "fields": { ... } }
  • a flat map { "name": { "type": "string" }, ... } (pass --collection <name>).

Each field follows the crouton schema (see the crouton skill): type, optional meta (required, unique, primaryKey, default, precision/scale, options + displayAs, optionsCollection…), translatable, and refTarget/refScope for relations.

Step 2 — Render the review

node .claude/skills/schema-review/render-schema.mjs /tmp/<collection>.schema.json
# → writes writeups/schema-reviews/<collection>.html + .md, and prints the Markdown table
# options: --collection <name>   --out-dir <dir>

Step 3 — Render to PNG (shared renderer from #308)

node .claude/skills/ui-proposal/render.mjs \
  writeups/schema-reviews/<collection>.html \
  screenshots/schema-review-<collection>.png

Uses the repo's Playwright headless Chromium — offline, no network.

Step 4 — Hand off (review happens on the DIFF)

The committed Markdown is the actionable review surface — not the image. A PNG can't be commented on; the reviewer would have to copy text and describe which field they mean. The .md lands in the PR's "Files changed", one field per row, so the reviewer can click the + on any line and leave an inline comment pinned to that exact field ("make this decimal", "add a slug field here") — no copying, no describing.

  • Commit writeups/schema-reviews/<collection>.md and .html (via /commit, scope docs) so the .md appears in the PR diff. This is where feedback goes.
  • The PNG is the optional at-a-glance visual — post it in the PR description/comment, but steer feedback to the diff.
  • The gate + revision loop that hold crouton config until approval are wired in #316 (reusing the generic approval loop from #310): it reads the inline review comments on the committed .md, revises the schema field-by-field, re-renders, and replies to/resolves each thread. When running this skill by hand, point the reviewer at the committed .md in the diff.

Unresolved relations — the thing this gate exists to catch

A field typed relation with no refTarget is the highest-value thing on the page: it is the one detail that makes the relation buildable, and it is the easiest to approve without noticing. The renderer marks it ⚠ not set in the References column and replaces the relationships sketch with a warning naming each offender. It never reports "No relationships" for a collection that has relation fields.

Do not approve a schema carrying one. Name the collection each points at, and check that collection is actually being generated — a target that doesn't exist produces an import to a missing file and fails the build, minutes later, with an error that names none of this.

If people are the intended target, say so explicitly: in crouton they come from the auth/team side, not a generated collection, so it likely needs a different field type rather than a relation.

Pass --strict to make it a hard gate (exit 1) — use that for a pre-generate check or CI. It is off by default because the decompose apply step calls this inside a best-effort guard, where a non-zero exit would drop the schema artifact from the sign-off comment entirely and hide the problem instead of showing it.

Minted by the #1825 chores POC: assignee and lastDoneBy were approved as untargeted relations, the summary read "No relationships.", the build instruction then invented "references household members/users", the worker turned that into refTarget: "users", and the generated code imported a users collection nobody ever created.

Conventions

  • One review per collection; re-render after every schema edit so the artifact never drifts.
  • The field table is the source of truth for review — keep it honest (mirror the actual JSON, including primary keys 🔑, unique, defaults, and every relationship).
  • Keep it focused on the one collection under discussion.

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

a11y

免费

Accessibility review for Vue surfaces — the code-cleaning analog of /code-review and /simplify, pointed at WCAG/ARIA. Reviews just your diff (or a package/file), rates findings by severity, and either comments inline on the PR (--comment) or applies the safe fixes for you (--fix). Steers the depth-aware `a11y` subagent. Use when asked to "check accessibility", "a11y this", "audit ARIA/keyboard", or run /a11y.

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

ask-human

免费

Emit a blocking question the owner can read in ~10 seconds and answer in one reply — the scannable, recommendation-first handoff every agent posts when it hits a fork it can't own. Leads with the one decision + a recommendation, carries the 🤖 provenance header, doubles as the

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

audit

免费

Audit packages for documentation completeness, detect drift between code and docs, and maintain documentation quality across the monorepo. Use when checking package docs, running audits, or reviewing documentation health.

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

Author a placeable layout block that looks right at ANY pane size. The one hard rule — size to the PANE with container queries (@container), never the viewport — plus list/form playbooks and the sizing contract (minWidth etc.) the viability metric reads. Use when adding/converting a croutonLayoutBlocks block, or when a block overflows/breaks in a narrow pane.

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

When a bug or regression is reported, the FIRST step — before fixing — is to research how and when it was introduced (git archaeology), then record that finding on the tracking issue/PR. Use the moment a bug, error, broken build, or "this used to work" is reported, before writing a fix. Produces a first-bad-commit (or "not a code regression") note you paste onto the issue.

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

commit

免费

Smart, granular git commits following monorepo conventions. Analyzes changes, filters to session-relevant files, groups by intent, and uses conventional commit format. Use when committing code changes.

中文简介正在准备中。当前显示原文说明。

FriendlyInternet/nuxt-crouton102026年10月21日 更新

查看 FriendlyInternet 的全部技能

报告此技能的问题