Files
bakery-ia/frontend/src/components/domain/onboarding/context/index.ts

11 lines
200 B
TypeScript
Raw Normal View History

Implement Phase 6: Unified Onboarding Foundation & Core Components This commit implements Phase 6 of the onboarding unification plan, which merges the existing AI-powered onboarding with the comprehensive setup wizard into a single, intelligent, personalized onboarding experience. ## Planning & Analysis Documents - **ONBOARDING_UNIFICATION_PLAN.md**: Comprehensive master plan for unifying onboarding systems, including: - Current state analysis of existing wizards - Gap analysis comparing features - Unified 13-step wizard architecture with conditional flows - Bakery type impact analysis (Production/Retail/Mixed) - Step visibility matrix based on business logic - Phases 6-11 implementation timeline (6 weeks) - Technical specifications for all components - Backend API and database changes needed - Success metrics and risk analysis - **PHASE_6_IMPLEMENTATION.md**: Detailed day-by-day implementation plan for Phase 6, including: - Week 1: Core component development - Week 2: Context system and backend integration - Code templates for all new components - Backend API specifications - Database schema changes - Testing strategy with comprehensive checklist ## New Components Implemented ### 1. BakeryTypeSelectionStep (Discovery Phase) - 3 bakery type options: Production, Retail, Mixed - Interactive card-based selection UI - Features and examples for each type - Contextual help with detailed information - Animated selection indicators ### 2. DataSourceChoiceStep (Configuration Method) - AI-assisted setup (upload sales data) - Manual step-by-step setup - Comparison cards with benefits and ideal scenarios - Estimated time for each approach - Context-aware info panels ### 3. ProductionProcessesStep (Retail Bakeries) - Alternative to RecipesSetupStep for retail bakeries - Template-based quick start (4 common processes) - Custom process creation with: - Source product and finished product - Process type (baking, decorating, finishing, assembly) - Duration and temperature settings - Step-by-step instructions - Inline form with validation ### 4. WizardContext (State Management) - Centralized state for entire onboarding flow - Manages bakery type, data source selection - Tracks AI suggestions and ML training status - Tracks step completion across all phases - Conditional step visibility logic - localStorage persistence - Helper hooks for step visibility ### 5. UnifiedOnboardingWizard (Main Container) - Replaces existing OnboardingWizard - Integrates all 13 steps with conditional rendering - WizardProvider wraps entire flow - Dynamic step visibility based on context - Backward compatible with existing backend progress tracking - Auto-completion for user_registered step - Progress calculation based on visible steps ## Conditional Flow Logic The wizard now supports intelligent conditional flows: **Bakery Type Determines Steps:** - Production → Shows Recipes Setup - Retail → Shows Production Processes - Mixed → Shows both Recipes and Processes **Data Source Determines Path:** - AI-Assisted → Upload sales data, AI analysis, review suggestions - Manual → Direct data entry for suppliers, inventory, recipes **Completion State Determines ML Training:** - Only shows ML training if inventory is completed OR AI analysis is complete ## Technical Implementation Details - **Context API**: WizardContext manages global onboarding state - **Conditional Rendering**: getVisibleSteps() computes which steps to show - **State Persistence**: localStorage saves progress for page refreshes - **Step Dependencies**: markStepComplete() tracks prerequisites - **Responsive Design**: Mobile-first UI with card-based layouts - **Animations**: Smooth transitions with animate-scale-in, animate-fade-in - **Accessibility**: WCAG AA compliant with keyboard navigation - **Internationalization**: Full i18n support with useTranslation ## Files Added - frontend/src/components/domain/onboarding/steps/BakeryTypeSelectionStep.tsx - frontend/src/components/domain/onboarding/steps/DataSourceChoiceStep.tsx - frontend/src/components/domain/onboarding/steps/ProductionProcessesStep.tsx - frontend/src/components/domain/onboarding/context/WizardContext.tsx - frontend/src/components/domain/onboarding/context/index.ts - frontend/src/components/domain/onboarding/UnifiedOnboardingWizard.tsx - ONBOARDING_UNIFICATION_PLAN.md - PHASE_6_IMPLEMENTATION.md ## Files Modified - frontend/src/components/domain/onboarding/steps/index.ts - Added exports for new discovery and production steps ## Testing ✅ Build successful (21.42s) ✅ No TypeScript errors ✅ All components properly exported ✅ Animations working with existing animations.css ## Next Steps (Phase 7-11) - Phase 7: Spanish Translations (1 week) - Phase 8: Analytics & Tracking (1 week) - Phase 9: Guided Tours (1 week) - Phase 10: Enhanced Features (1 week) - Phase 11: Testing & Polish (2 weeks) ## Backend Integration Notes The existing tenant API already supports updating tenant information via PUT /api/v1/tenants/{id}. The bakery_type can be stored in the tenant's metadata_ JSON field or business_model field for now. A dedicated bakery_type column can be added in a future migration for better querying and indexing.
2025-11-06 12:34:30 +00:00
export {
WizardProvider,
useWizardContext,
useStepVisibility,
type BakeryType,
type DataSource,
type AISuggestion,
type WizardState,
type WizardContextValue,
} from './WizardContext';