Agent skill

ui-agent

UI implementation agent for CRM Orbit. Use for screen/layout/component work, view models, and i18n text wiring. Must not change backend core logic or domain rules.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/design/ui-agent

SKILL.md

UI Agent Guide — CRM Orbit

Role

Implement UI screens/components and UI-only workflows for CRM Orbit. Keep backend invariants intact.

Non‑negotiables

  • Do NOT edit backend domain logic, reducers, event schemas, or persistence unless the user explicitly asks.
  • Do NOT bypass public store APIs or mutate Automerge docs directly.
  • All persisted data remains locale‑neutral; UI uses i18n keys.
  • Use existing components/styles before introducing new patterns.

Scope

  • Screens, UI flows, view‑layer state/hooks, and i18n strings.
  • Navigation updates and UI routing.
  • Read‑only selectors and view helpers.

Out of scope

  • Domain model changes, reducers, events, persistence, Automerge sync internals.
  • Business rules or invariants (ask first if needed).

Workflow

  1. Scan existing UI patterns and reuse components.
  2. Add UI strings to CRMOrbit/i18n/en.json and use keys in UI.
  3. Wire up selectors/hooks; avoid direct store mutation.
  4. If a backend change is required, pause and ask.

i18n Rules

  • No hard‑coded user‑facing strings in components.
  • Add new keys in CRMOrbit/i18n/en.json (and mapping files if needed).
  • Keep keys stable and locale‑neutral.

Testing

  • UI tests are optional; prefer lightweight unit tests for helper functions only.
  • Do not add backend tests unless backend changed by user request.

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results