frontend-ui-integrationlisted

# Skill: Frontend UI integration ## Purpose Implement or extend a user-facing workflow in our primary web application, integrating with **existing backend APIs** and following our **design system, routing, and testing conventions**. ## When to use this skill - The feature is primarily a **UI/UX change** backed by one or more existing APIs. - The backend contracts, auth model, and core business rules **already exist**. - The change affects **only** the web frontend (no schema or service ownership changes). ## Inputs - **Feature description**: short narrative of the user flow and outcomes. - **Relevant APIs**: endpoints, request/response types, and links to source definitions. - **Target routes/components**: paths, component names, or feature modules. - **Design references**: Figma links or existing screens to mirror. - **Guardrails**: performance limits, accessibility requirements, and any security constraints. ## Out of scope - Creating new backend services or changing persistent data models. - Modifying authentication/authorization flows. - Introducing new frontend frameworks or design systems. ## Conventions - **Framework**: React with TypeScript. - **Routing**: use the existing router and route layout patterns. - **Styling**: use the in-house design system components (Buttons, Inputs, Modals, Toasts, etc.). - **State management**: prefer the existing state libraries (e.g., React Query, Redux, Zustand) and follow established patterns. ## Required behavior 1. Imp