NEXT.JS AND REACT
Frontend Standards
Build stable, accessible, Provider-aware user interfaces with predictable data and form behavior.
Production stability and security notice
Development changes must preserve working functionality, Provider isolation, role-based access, HIPAA auditability, released Mobile compatibility, and integration stability. Never deploy AI-generated or unreviewed code directly to production.
Component Standards
| Topic | Standard |
|---|---|
| Page component | Own route-level loading, authorization state, and composition. |
| Feature component | Own a focused business workflow or section. |
| Shared component | Provide reusable presentation without embedding unrelated domain logic. |
| Form state | Use explicit defaults, validation, dirty state, loading state, and error feedback. |
| Tables | Support left-aligned headers, responsive overflow, stable keys, and empty states. |
| Images | Use responsive sizing so documentation and application images do not overflow the content area. |
Data Handling
- Do not trust Provider IDs from URL parameters alone.
- Handle loading, empty, error, unauthorized, and stale states explicitly.
- Keep dates in the approved display format MM/DD/YYYY.
- Avoid silent timezone conversion in scheduling and EVV screens.
- Mask sensitive fields unless the user is authorized to reveal them.
Regression Protection
When updating a large production component, preserve existing controls, filters, exports, and Mobile/API contracts. Prefer a targeted change over a broad redesign.