singapore-demo

Turn a mock-data React+Relay feature into properly componentized code backed by colocated GraphQL fragments and a clean schema contract for the backend team. Use when the user wants to convert a mocked UI into a backend contract, walk the component hierarchy of a feature, replace mock/hardcoded data with fragments, componentize a page for Relay, fragmentize a feature, spec a feature for the backend team, or build a schema contract from the UI. Triggers on "mock to contract", "turn this mock into a contract", "walk the component hierarchy", "componentize this page", "fragmentize", "spec this feature for the backend", or "schema-ify this feature".

Take a user's plain-English feature description and stand up a working UI prototype with realistic mock data — no GraphQL, no backend, just React + Tailwind + local state — that slots into the existing app design system and is hand-off-ready for the `mock-to-contract` skill later. Use when the user wants to mock up a new feature, prototype a page, wireframe a section, build a UI for something without backend yet, sketch out a new view, or explicitly says "do not write any GraphQL yet" / "let's just build the UI" / "no backend yet". Triggers on "prototype X", "mock up X", "build a UI for X", "wireframe X", "sketch out X", "add a new section for X", "let's just build the UI", "no graphql yet".

Best practices for writing idiomatic Relay code. ALWAYS use this skill when writing or modifying React components that use Relay for data fetching. Covers fragments, queries, mutations, pagination, and common anti-patterns. Use when you see `useFragment`, `useLazyLoadQuery`, `usePreloadedQuery`, `useMutation`, `usePaginationFragment`, `graphql` template literals, `react-relay` imports, or `__generated__/*.graphql` files. Also use when asked to explain Relay concepts, debug Relay issues, or review Relay code.

Turn a mock-data React+Relay feature into properly componentized code backed by colocated GraphQL fragments and a clean schema-extension contract for the backend team. Use when the user wants to convert a mocked UI into a backend contract, walk the component hierarchy of a feature, replace mock/hardcoded data with fragments, componentize a page for Relay, fragmentize a feature, spec a feature for the backend team, or build a schema contract from the UI. Triggers on "mock to contract", "turn this mock into a contract", "walk the component hierarchy", "componentize this page", "fragmentize", "spec this feature for the backend", or "schema-ify this feature".

Author Mocha mediator command handlers in the application layer, wire them through HotChocolate mutations using mutation conventions, and write the matching command tests. Fire whenever the user says "add a command", "Mocha command", "ICommand", "command handler", "mutation handler", "write a mutation", "add a mutation", or asks to add a write/create/update/delete operation to an entity. Fire automatically when editing any file under `*/Application/**/Commands/*` or any file named `*Mutations.cs`. Bias toward firing — under-firing this skill yields hand-rolled input types, missing existence-leak guards, and tests that skip the mandatory authorization cases.

Author Green Donut DataLoaders using the source generator ([DataLoader] attribute, partial methods). Fire whenever the user mentions "DataLoader", "[DataLoader]", "batched loading", "Green Donut", "GraphQL batching", "Dictionary<TKey, TValue> DataLoader", "ToBatchPageAsync", "ILookup<", "DataLoaderGroup", or "BatchingContext", whenever a new GraphQL field needs to resolve a related entity, and whenever editing or creating any file matching `*DataLoaders.cs`. Bias toward firing — this is the only correct shape for batched reads.

HotChocolate v15/v16 best practices for a GraphQL backend — queries, mutations, types, node resolvers, error unions, mutation conventions, Mocha mediator integration. Fire whenever the user mentions HotChocolate, "[QueryType]", "[MutationType]", "[ObjectType<T>]", "[NodeResolver]", "[ID<", "[Error<", "[Lookup]", "[UsePaging]", "GraphQL backend", "GraphQL API", "Relay node", "mutation conventions", or "Banana Cake Pop", and whenever editing any file under `**/GraphQL/<Entity>/Types/*.cs`, `**/GraphQL/<Entity>/Operations/*.cs`, `**/GraphQL/<Entity>/Extensions/*.cs`, or any file matching `*Type.cs`, `*Queries.cs`, `*Mutations.cs` in a HotChocolate project. Bias toward firing on any GraphQL-layer edit.

GraphQL schema design and review. Use when designing new GraphQL schema changes (types, mutations, queries, connections, enums, errors), reviewing schema diffs, planning schema evolution, or auditing nullability and naming. Triggers on 'graphql schema design', 'design a mutation', 'design a query', 'design a type', 'new type', 'new mutation', 'review schema', 'review schema diff', 'schema review', 'schema evolution', 'audit the schema', '/graphql-schema-design'.

Produce an implementation plan that explicitly honors the project's ARCHITECTURE and DOMAIN documents, then auto-review it for doc compliance. Use when the user asks to plan a feature, design an implementation, architect a change, or says "plan with docs", "/plan-with-docs", "how should we implement X", "design approach for X" in a repository that has ARCHITECTURE.md or DOMAIN.md (or equivalents under docs/, .cursor/rules/, .claude/rules/). Prefer this over generic planning skills whenever the project ships architecture or domain docs, because skipping them tends to produce plans that cross layer boundaries or invent entities that already exist.

Author application-layer queries in the Mocha mediator CQRS style — a Mocha mediator IQuery record + IQueryHandler that loads through DataLoaders, authorizes through IAuthorizationService, and returns null on failure. Fire when the user asks to "add a query", "add a get-by-id", "load <Entity> by <Key>", asks for an "application query" or "read operation", mentions `IQuery`, `IQueryHandler`, `QueryAsync`, `HandleAsync`, when editing any file under `*/Application/<Entity>/Queries/*`, when a `[QueryType]` GraphQL resolver needs a backing query handler, or when reviewing read-paths that touch `IAuthorizationService` + DataLoaders. Use this skill — do not improvise — because Mocha's mediator routes queries through `ISender.QueryAsync` (a distinct method from `SendAsync`), and the auth/null-return rules are easy to get wrong.

Authoring guide and conventions for ChilliCream agent skills. Use whenever the user wants to create a new skill, edit an existing one, improve a skill's description, or asks how to structure a SKILL.md file. Triggers on phrases like "write a skill", "new skill", "author a skill", "improve this skill", "skill description", "SKILL.md", or when editing any file under skills/*/SKILL.md or .claude/skills/*/SKILL.md.

Write Snapshooter-based snapshot tests for HotChocolate GraphQL operations executed through a Strawberry Shake client. Fire whenever the user says "snapshot test", "Strawberry Shake test", "MatchSnapshot", "test this GraphQL operation", "test this mutation", "test this query", "GraphQL integration test", "add a test for this resolver/mutation/subscription", or "/snapshot-test"; or whenever the user is editing/creating a file under a `*.Tests/` project that exercises a HotChocolate query, mutation, or subscription via `IRequestExecutor` or a generated Strawberry Shake client. Prefer this over generic test scaffolding for anything that talks to the GraphQL layer — handwritten field-by-field assertions on GraphQL responses are wrong by default.

Guide new or existing repositories through architecture setup with repo inspection, a recommendation-backed questionnaire, optional reference-project scaffolding, and agent-ready ARCHITECTURE.md / DOMAIN.md docs. Use when the user says "initialize stack", "setup skill", "set up architecture", "/stack-init", "new repo", "bootstrap architecture", "scaffold architecture", "Clean Architecture", "Vertical Slice", "GraphQL-first", "Hexagonal", "DDD", "missing ARCHITECTURE.md", "missing DOMAIN.md", or when starting a .NET / HotChocolate service.