Frontend Changes:
- Fix runtime error: Remove undefined handleModify reference from ActionQueueCard in DashboardPage
- Migrate PurchaseOrderDetailsModal to use correct PurchaseOrderItem type from purchase_orders service
- Fix item display: Parse unit_price as string (Decimal) instead of number
- Use correct field names: item_notes instead of notes
- Remove deprecated PurchaseOrder types from suppliers.ts to prevent type conflicts
- Update CreatePurchaseOrderModal to use unified types
- Clean up API exports: Remove old PO hooks re-exported from suppliers
- Add comprehensive translations for PO modal (en, es, eu)
Documentation Reorganization:
- Move WhatsApp implementation docs to docs/03-features/notifications/whatsapp/
- Move forecast validation docs to docs/03-features/forecasting/
- Move specification docs to docs/03-features/specifications/
- Move deployment docs (Colima, K8s, VPS sizing) to docs/05-deployment/
- Archive completed implementation summaries to docs/archive/implementation-summaries/
- Delete obsolete FRONTEND_CHANGES_NEEDED.md
- Standardize filenames to lowercase with hyphens
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
CRITICAL BUG FIX: This was the ACTUAL root cause of infinite loading state!
The Bug:
--------
apiClient.get() already returns response.data (line 494 in apiClient.ts):
```typescript
async get<T>(url: string): Promise<T> {
const response = await this.client.get(url);
return response.data; // Returns data directly
}
```
But hooks were doing:
```typescript
queryFn: async () => {
const response = await apiClient.get('/endpoint');
return response.data; // Bug! Accessing .data on data = undefined
}
```
Flow of the Bug:
----------------
1. API call succeeds with 200 OK
2. apiClient.get() returns: {status: "green", headline: "..."}
3. Hook tries to access .data on that object
4. Returns undefined to React Query
5. Component checks: if (!healthStatus) → true (because undefined)
6. Shows skeleton loader forever
The Fix:
--------
Changed all 5 hooks to:
```typescript
queryFn: async () => {
return await apiClient.get('/endpoint'); // ✅ Returns data directly
}
```
Now:
1. API call succeeds with 200 OK
2. apiClient.get() returns: {status: "green", headline: "..."}
3. Hook returns data to React Query
4. React Query sets data
5. Component receives data → exits loading state
6. Dashboard renders! 🎉
Fixed hooks:
- useBakeryHealthStatus
- useOrchestrationSummary
- useActionQueue
- useProductionTimeline
- useInsights
Previous fixes that were needed but insufficient:
- Added enabled: !!tenantId (prevented queries when tenantId empty)
- Added useTenantInitializer (populated tenantId)
- But data was still undefined due to this .data bug!
Issue: Dashboard components remained in loading state even when APIs returned 200 OK
Root cause: React Query hooks were executing even when tenantId was empty/invalid,
causing queries to fail silently and stay in loading state indefinitely.
Fix: Added `enabled: !!tenantId` flag to all five dashboard hooks:
- useBakeryHealthStatus
- useOrchestrationSummary
- useActionQueue
- useProductionTimeline
- useInsights
This ensures queries only execute when a valid tenantId is available, preventing
the loading state from persisting when tenantId is empty.
API response confirmed working (example):
{"status":"green","headline":"Your bakery is running smoothly",...}
Frontend changes:
- Updated API endpoints to call /tenants/{id}/dashboard/*
(removed /orchestrator/ prefix to match backend router)
- Updated DashboardPage to use CSS theme variables instead of hardcoded colors
- Replaced bg-white, text-gray-*, bg-blue-* with var(--bg-primary), var(--text-primary), etc.
- Quick action buttons now use color accents with left border for visual distinction
This ensures:
1. Frontend calls the correct backend endpoints (fixes 404 errors)
2. Dashboard respects theme (light/dark mode)
3. Consistent styling with rest of application
- Updated TypeScript types to support reasoning_data field
- Integrated useReasoningTranslation hook in all dashboard components:
* ActionQueueCard: Translates PO reasoning_data and UI text
* ProductionTimelineCard: Translates batch reasoning_data and UI text
* OrchestrationSummaryCard: Translates all hardcoded English text
* HealthStatusCard: Translates all hardcoded English text
- Added missing translation keys to all language files (EN, ES, EU):
* health_status: never, critical_issues, actions_needed
* action_queue: total, critical, important
* orchestration_summary: ready_to_plan, run_info, took, show_more/less
* production_timeline: Complete rebuild with new keys
- Components now support fallback for deprecated text fields
- Full multilingual support: English, Spanish, Basque
Dashboard is now fully translatable and will display reasoning in user's language.
Implements comprehensive dashboard redesign based on Jobs To Be Done methodology
focused on answering: "What requires my attention right now?"
## Backend Implementation
### Dashboard Service (NEW)
- Health status calculation (green/yellow/red traffic light)
- Action queue prioritization (critical/important/normal)
- Orchestration summary with narrative format
- Production timeline transformation
- Insights calculation and consequence prediction
### API Endpoints (NEW)
- GET /dashboard/health-status - Overall bakery health indicator
- GET /dashboard/orchestration-summary - What system did automatically
- GET /dashboard/action-queue - Prioritized tasks requiring attention
- GET /dashboard/production-timeline - Today's production schedule
- GET /dashboard/insights - Key metrics (savings, inventory, waste, deliveries)
### Enhanced Models
- PurchaseOrder: Added reasoning, consequence, reasoning_data fields
- ProductionBatch: Added reasoning, reasoning_data fields
- Enables transparency into automation decisions
## Frontend Implementation
### API Hooks (NEW)
- useBakeryHealthStatus() - Real-time health monitoring
- useOrchestrationSummary() - System transparency
- useActionQueue() - Prioritized action management
- useProductionTimeline() - Production tracking
- useInsights() - Glanceable metrics
### Dashboard Components (NEW)
- HealthStatusCard: Traffic light indicator with checklist
- ActionQueueCard: Prioritized actions with reasoning/consequences
- OrchestrationSummaryCard: Narrative of what system did
- ProductionTimelineCard: Chronological production view
- InsightsGrid: 2x2 grid of key metrics
### Main Dashboard Page (REPLACED)
- Complete rewrite with mobile-first design
- All sections integrated with error handling
- Real-time refresh and quick action links
- Old dashboard backed up as DashboardPage.legacy.tsx
## Key Features
### Automation-First
- Shows what orchestrator did overnight
- Builds trust through transparency
- Explains reasoning for all automated decisions
### Action-Oriented
- Prioritizes tasks over information display
- Clear consequences for each action
- Large touch-friendly buttons
### Progressive Disclosure
- Shows 20% of info that matters 80% of time
- Expandable details when needed
- No overwhelming metrics
### Mobile-First
- One-handed operation
- Large touch targets (min 44px)
- Responsive grid layouts
### Trust-Building
- Narrative format ("I planned your day")
- Reasoning inputs transparency
- Clear status indicators
## User Segments Supported
1. Solo Bakery Owner (Primary)
- Simple health indicator
- Action checklist (max 3-5 items)
- Mobile-optimized
2. Multi-Location Owner
- Multi-tenant support (existing)
- Comparison capabilities
- Delegation ready
3. Enterprise/Central Bakery (Future)
- Network topology support
- Advanced analytics ready
## JTBD Analysis Delivered
Main Job: "Help me quickly understand bakery status and know what needs my intervention"
Emotional Jobs Addressed:
- Feel in control despite automation
- Reduce daily anxiety
- Feel competent with technology
- Trust system as safety net
Social Jobs Addressed:
- Demonstrate professional management
- Avoid being bottleneck
- Show sustainability
## Technical Stack
Backend: Python, FastAPI, SQLAlchemy, PostgreSQL
Frontend: React, TypeScript, TanStack Query, Tailwind CSS
Architecture: Microservices with circuit breakers
## Breaking Changes
- Complete dashboard page rewrite (old version backed up)
- New API endpoints require orchestrator service deployment
- Database migrations needed for reasoning fields
## Migration Required
Run migrations to add new model fields:
- purchase_orders: reasoning, consequence, reasoning_data
- production_batches: reasoning, reasoning_data
## Documentation
See DASHBOARD_REDESIGN_SUMMARY.md for complete implementation details,
JTBD analysis, success metrics, and deployment guide.
BREAKING CHANGE: Dashboard page completely redesigned with new data structures
Fixed multiple TypeScript type errors that were preventing the build from working properly:
1. Fixed infinite query type issue in forecasting.ts by excluding 'select' from options
2. Fixed Card variant type errors by changing contentPadding="default" to contentPadding="md"
3. Fixed router export issues by removing non-existent exports (ROUTE_CONFIGS, getRoutesForRole, etc.)
4. Fixed router readonly array type issues by updating RouteConfig interface
5. Fixed ProtectedRoute requiredRoles prop issue by removing invalid prop usage
6. Fixed auth store User type compatibility by allowing null for tenant_id
7. Fixed missing useToasts export from ui.store by removing from exports
8. Fixed permissions utility boolean type issues by wrapping expressions in Boolean()
The frontend build now completes successfully.
This commit addresses all identified bugs and issues in the training code path:
## Critical Fixes:
- Add get_start_time() method to TrainingLogRepository and fix non-existent method call
- Remove duplicate training.started event from API endpoint (trainer publishes the accurate one)
- Add missing progress events for 80-100% range (85%, 92%, 94%) to eliminate progress "dead zone"
## High Priority Fixes:
- Fix division by zero risk in time estimation with double-check and max() safety
- Remove unreachable exception handler in training_operations.py
- Simplify WebSocket token refresh logic to only reconnect on actual user session changes
## Medium Priority Fixes:
- Fix auto-start training effect with useRef to prevent duplicate starts
- Add HTTP polling debounce delay (5s) to prevent race conditions with WebSocket
- Extract all magic numbers to centralized constants files:
- Backend: services/training/app/core/training_constants.py
- Frontend: frontend/src/constants/training.ts
- Standardize error logging with exc_info=True on critical errors
## Code Quality Improvements:
- All progress percentages now use named constants
- All timeouts and intervals now use named constants
- Improved code maintainability and readability
- Better separation of concerns
## Files Changed:
- Backend: training_service.py, trainer.py, training_events.py, progress_tracker.py
- Backend: training_operations.py, training_log_repository.py, training_constants.py (new)
- Frontend: training.ts (hooks), MLTrainingStep.tsx, training.ts (constants, new)
All training progress events now properly flow from 0% to 100% with no gaps.
