🎨 Pattern: How to safely access dynamically-shaped API responses in Ang...

Date: 2026-03-27
Time: 18:55:30 UTC
Session: gspace1-276.16
Agent: angular
Confidence: 90%
Status: ✅ Documented

📋 Decision Context

Question:

How to safely access dynamically-shaped API responses in Angular strict TypeScript without using any?

Task: Wire 10D: Cockpit component TypeScript strict mode compatibility

🎯 Decision Made

Chosen:

Cast forkJoin subscribe parameter as Record<string, unknown>, then extract each response with explicit as Record<string, unknown> | null | undefined casts per field. Use helper functions (coerceNumber, parseDomainTrustMap) to normalize values.

Options Considered:

1. Cast to any (fast, no type safety)
2. Create 11 typed response interfaces (ideal, heavy)
3. Record<string, unknown> with per-field extraction (chosen — pragmatic)

💭 Reasoning

VittoApiService returns Observable where ApiResponse is a generic wrapper. The cockpit component aggregates 11 API calls via forkJoin, and each response has a different shape. Bracket notation (res['field']) on ApiResponse triggers TS strict errors because the type doesn't declare those fields. Three options: (1) Use any broadly (fast but loses all type safety), (2) Create typed response interfaces for each endpoint (ideal but heavy for a dashboard consuming 11 endpoints), (3) Cast to Record<string, unknown> with explicit per-field extraction (chosen — balances safety with pragmatism). The linter further refined this by adding per-result casts and helper functions. Future improvement: add typed response generics to VittoApiService methods so consumers don't need casts.

📁 Files Involved

• libs/libs-ai/vitto-hub/src/lib/components/cockpit/vitto-cockpit.component.ts
• libs/libs-ai/vitto-core/src/lib/services/vitto-api.service.ts

🔗 Related

• Decision ID: dev_1774637730231_yrf47rn
• Session: 276
• Workspace: gspace1

Auto-generated by MCP Smart Consolidation