fdc34aee2f
All checks were successful
Deploy to Staging / Build Images (pull_request) Successful in 1m49s
Deploy to Staging / Deploy to Staging (pull_request) Successful in 43s
Deploy to Staging / Verify Staging (pull_request) Successful in 4s
Deploy to Staging / Notify Staging Ready (pull_request) Successful in 3s
Deploy to Staging / Notify Staging Failure (pull_request) Has been skipped
node-postgres returns numeric/decimal columns as JavaScript strings, but the TypeScript interfaces for MaintenanceRecord and OwnershipCost declare numeric fields as number. The mappers were passing values through raw, breaking type-safe arithmetic and display (e.g. the amount column on the vehicle summary screen was empty until the recent frontend workaround in PR #240, and OwnershipCostsList silently no-ops toLocaleString on the string). Backend - mapMaintenanceRecord: coerce cost via Number() when non-null. - ownership-costs mapRow: coerce amount via Number(). Frontend (remove now-redundant workarounds) - MaintenanceRecordsList: drop Number() coercion on cost and odometerReading; use the number values directly. - VehicleDetailPage / VehicleDetailMobile: revert the PR #240 cost coercion to the simple typeof number guard now that the backend honors the type. Scope notes - Other repositories with the same pattern (stations, community-stations, fuel-logs enhanced methods) are tracked separately because they have unclear downstream consumers and warrant their own investigation. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Frontend Quickload
Overview
- Tech: React 18, Vite, TypeScript, MUI, Tailwind, React Query, Zustand.
- Auth: Auth0 via
src/core/auth/Auth0Provider.tsx. - Data: API client in
src/core/api/client.tswith React Query config.
Commands (containers)
- Build:
make rebuild - Logs:
make logs-frontend
Structure
src/App.tsx,src/main.tsx— app entry.src/features/*— feature pages/components/hooks.src/core/*— auth, api, store, hooks, query config, utils.src/core/utils/vehicleDisplay.ts— shared vehicle display helpers:getVehicleLabel()(display name with fallback chain) andgetVehicleSubtitle()(Year Make Model formatting).src/shared-minimal/*— shared UI components and theme.
Mobile + Desktop (required)
- Layouts responsive by default; validate on small/large viewports.
- Verify Suspense fallbacks and navigation flows on both form factors.
- Test key screens: Vehicles, Fuel Logs, Documents, Settings.
- Ensure touch interactions and keyboard navigation work equivalently.
Testing
- Jest config:
frontend/jest.config.ts(jsdom). - Setup:
frontend/setupTests.ts(Testing Library). - Run:
docker compose exec mvp-frontend npm test(from project root, containerized). - Watch mode:
docker compose exec mvp-frontend npm run test:watch.
Patterns
- State: co-locate feature state in
src/core/store(Zustand) and React Query for server state. - Forms:
react-hook-form+ Zod resolvers. - UI: MUI components; Tailwind for utility styling.