Frontend Architecture
xTrakt frontend applications use Angular standalone components, scoped SCSS, service-based state, and shared product theme tokens.
Conventions
| Area | Convention |
|---|---|
| Components | Standalone components, no NgModules |
| State | BehaviorSubject in providedIn: 'root' services |
| Forms | Reactive Forms with FormBuilder |
| i18n | Transloco files in src/assets/i18n/{en,pt-BR}.json |
| Styling | Component-scoped SCSS with global tokens in styles.scss |
| API parsing | Services parse text responses manually with safeJsonParse<T>() |
Theme Tokens
Canonical tokens include --color-primary, --surface-page, --surface-card, --text-muted, --radius-md, and --shadow-card. Legacy aliases should remain compatibility-only.