diff --git a/docker-compose.yml b/docker-compose.yml
index 79ae2ab3..8ffb7cb3 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -35,6 +35,7 @@ volumes:
model_storage:
log_storage:
nominatim_data:
+ frontend_node_modules:
# ================================================================
@@ -1063,7 +1064,7 @@ services:
ipv4_address: 172.20.0.110
volumes:
- ./frontend:/app
- - /app/node_modules # Exclude node_modules from bind mount
+ - frontend_node_modules:/app/node_modules # Use named volume for node_modules
healthcheck:
test: ["CMD", "curl", "-f", "http://localhost:3000/"]
interval: 30s
diff --git a/frontend/.env.development b/fdev-ffrontend/.env.development
similarity index 100%
rename from frontend/.env.development
rename to fdev-ffrontend/.env.development
diff --git a/frontend/.env.production b/fdev-ffrontend/.env.production
similarity index 100%
rename from frontend/.env.production
rename to fdev-ffrontend/.env.production
diff --git a/fdev-ffrontend/Dockerfile.development b/fdev-ffrontend/Dockerfile.development
new file mode 100644
index 00000000..6069bda8
--- /dev/null
+++ b/fdev-ffrontend/Dockerfile.development
@@ -0,0 +1,38 @@
+# frontend/Dockerfile.development - FIXED VERSION
+FROM node:18-alpine
+
+# Install curl for healthchecks
+RUN apk add --no-cache curl
+
+# Set working directory
+WORKDIR /app
+
+# Create non-root user for security but don't switch yet
+RUN addgroup -g 1001 -S nodejs && \
+ adduser -S reactjs -u 1001 -G nodejs
+
+# Copy package files first (better caching)
+COPY package*.json ./
+
+# Install all dependencies (including dev dependencies) as root
+RUN npm ci --verbose && \
+ npm cache clean --force
+
+# Copy source code
+COPY . .
+
+# Change ownership of all files to the non-root user
+RUN chown -R reactjs:nodejs /app
+
+# Now switch to non-root user
+USER reactjs
+
+# Expose port 3000 (Vite default)
+EXPOSE 3000
+
+# Add healthcheck
+HEALTHCHECK --interval=30s --timeout=10s --start-period=30s --retries=3 \
+ CMD curl -f http://localhost:3000/ || exit 1
+
+# Start development server with host binding
+CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]
\ No newline at end of file
diff --git a/fdev-ffrontend/Dockerfile.production b/fdev-ffrontend/Dockerfile.production
new file mode 100644
index 00000000..98ba917c
--- /dev/null
+++ b/fdev-ffrontend/Dockerfile.production
@@ -0,0 +1,41 @@
+# frontend/Dockerfile.production
+# Multi-stage build for production
+
+# Build stage
+FROM node:18-alpine as builder
+
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+
+# Install dependencies
+RUN npm ci --only=production
+
+# Copy source code
+COPY . .
+
+# Build the application
+RUN npm run build
+
+# Production stage
+FROM nginx:alpine
+
+# Install curl for healthchecks
+RUN apk add --no-cache curl
+
+# Copy built app from builder stage
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+# Copy nginx configuration
+COPY nginx.conf /etc/nginx/nginx.conf
+
+# Expose port 80
+EXPOSE 80
+
+# Add healthcheck
+HEALTHCHECK --interval=30s --timeout=3s --start-period=10s --retries=3 \
+ CMD curl -f http://localhost/ || exit 1
+
+# Start nginx
+CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
diff --git a/fdev-ffrontend/index.html b/fdev-ffrontend/index.html
new file mode 100644
index 00000000..66ef8f1b
--- /dev/null
+++ b/fdev-ffrontend/index.html
@@ -0,0 +1,170 @@
+
+
+
+
+
+
+
+ PanIA - Inteligencia Artificial para tu Panadería en Madrid
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
🥖
+
Cargando PanIA...
+
+
+
+
+ {/* Global Toast Notifications */}
+
+
+
+ );
+};
+
+const App: React.FC = () => {
+ return (
+
+
+
+ );
+};
+
+export default App;
\ No newline at end of file
diff --git a/frontend/src/api/README.md b/fdev-ffrontend/src/api/README.md
similarity index 100%
rename from frontend/src/api/README.md
rename to fdev-ffrontend/src/api/README.md
diff --git a/frontend/src/api/client/config.ts b/fdev-ffrontend/src/api/client/config.ts
similarity index 100%
rename from frontend/src/api/client/config.ts
rename to fdev-ffrontend/src/api/client/config.ts
diff --git a/frontend/src/api/client/index.ts b/fdev-ffrontend/src/api/client/index.ts
similarity index 100%
rename from frontend/src/api/client/index.ts
rename to fdev-ffrontend/src/api/client/index.ts
diff --git a/frontend/src/api/client/interceptors.ts b/fdev-ffrontend/src/api/client/interceptors.ts
similarity index 100%
rename from frontend/src/api/client/interceptors.ts
rename to fdev-ffrontend/src/api/client/interceptors.ts
diff --git a/frontend/src/api/client/types.ts b/fdev-ffrontend/src/api/client/types.ts
similarity index 100%
rename from frontend/src/api/client/types.ts
rename to fdev-ffrontend/src/api/client/types.ts
diff --git a/frontend/src/api/hooks/index.ts b/fdev-ffrontend/src/api/hooks/index.ts
similarity index 100%
rename from frontend/src/api/hooks/index.ts
rename to fdev-ffrontend/src/api/hooks/index.ts
diff --git a/frontend/src/api/hooks/useAuth.ts b/fdev-ffrontend/src/api/hooks/useAuth.ts
similarity index 100%
rename from frontend/src/api/hooks/useAuth.ts
rename to fdev-ffrontend/src/api/hooks/useAuth.ts
diff --git a/frontend/src/api/hooks/useExternal.ts b/fdev-ffrontend/src/api/hooks/useExternal.ts
similarity index 100%
rename from frontend/src/api/hooks/useExternal.ts
rename to fdev-ffrontend/src/api/hooks/useExternal.ts
diff --git a/frontend/src/api/hooks/useForecast.ts b/fdev-ffrontend/src/api/hooks/useForecast.ts
similarity index 100%
rename from frontend/src/api/hooks/useForecast.ts
rename to fdev-ffrontend/src/api/hooks/useForecast.ts
diff --git a/frontend/src/api/hooks/useInventory.ts b/fdev-ffrontend/src/api/hooks/useInventory.ts
similarity index 100%
rename from frontend/src/api/hooks/useInventory.ts
rename to fdev-ffrontend/src/api/hooks/useInventory.ts
diff --git a/frontend/src/api/hooks/useNotification.ts b/fdev-ffrontend/src/api/hooks/useNotification.ts
similarity index 100%
rename from frontend/src/api/hooks/useNotification.ts
rename to fdev-ffrontend/src/api/hooks/useNotification.ts
diff --git a/frontend/src/api/hooks/useOnboarding.ts b/fdev-ffrontend/src/api/hooks/useOnboarding.ts
similarity index 100%
rename from frontend/src/api/hooks/useOnboarding.ts
rename to fdev-ffrontend/src/api/hooks/useOnboarding.ts
diff --git a/frontend/src/api/hooks/usePOS.ts b/fdev-ffrontend/src/api/hooks/usePOS.ts
similarity index 100%
rename from frontend/src/api/hooks/usePOS.ts
rename to fdev-ffrontend/src/api/hooks/usePOS.ts
diff --git a/frontend/src/api/hooks/useProcurement.ts b/fdev-ffrontend/src/api/hooks/useProcurement.ts
similarity index 100%
rename from frontend/src/api/hooks/useProcurement.ts
rename to fdev-ffrontend/src/api/hooks/useProcurement.ts
diff --git a/frontend/src/api/hooks/useRecipes.ts b/fdev-ffrontend/src/api/hooks/useRecipes.ts
similarity index 100%
rename from frontend/src/api/hooks/useRecipes.ts
rename to fdev-ffrontend/src/api/hooks/useRecipes.ts
diff --git a/frontend/src/api/hooks/useSales.ts b/fdev-ffrontend/src/api/hooks/useSales.ts
similarity index 100%
rename from frontend/src/api/hooks/useSales.ts
rename to fdev-ffrontend/src/api/hooks/useSales.ts
diff --git a/frontend/src/api/hooks/useSuppliers.ts b/fdev-ffrontend/src/api/hooks/useSuppliers.ts
similarity index 100%
rename from frontend/src/api/hooks/useSuppliers.ts
rename to fdev-ffrontend/src/api/hooks/useSuppliers.ts
diff --git a/frontend/src/api/hooks/useTenant.ts b/fdev-ffrontend/src/api/hooks/useTenant.ts
similarity index 100%
rename from frontend/src/api/hooks/useTenant.ts
rename to fdev-ffrontend/src/api/hooks/useTenant.ts
diff --git a/frontend/src/api/hooks/useTraining.ts b/fdev-ffrontend/src/api/hooks/useTraining.ts
similarity index 100%
rename from frontend/src/api/hooks/useTraining.ts
rename to fdev-ffrontend/src/api/hooks/useTraining.ts
diff --git a/frontend/src/api/index.ts b/fdev-ffrontend/src/api/index.ts
similarity index 100%
rename from frontend/src/api/index.ts
rename to fdev-ffrontend/src/api/index.ts
diff --git a/frontend/src/api/services/auth.service.ts b/fdev-ffrontend/src/api/services/auth.service.ts
similarity index 100%
rename from frontend/src/api/services/auth.service.ts
rename to fdev-ffrontend/src/api/services/auth.service.ts
diff --git a/frontend/src/api/services/external.service.ts b/fdev-ffrontend/src/api/services/external.service.ts
similarity index 100%
rename from frontend/src/api/services/external.service.ts
rename to fdev-ffrontend/src/api/services/external.service.ts
diff --git a/frontend/src/api/services/forecasting.service.ts b/fdev-ffrontend/src/api/services/forecasting.service.ts
similarity index 100%
rename from frontend/src/api/services/forecasting.service.ts
rename to fdev-ffrontend/src/api/services/forecasting.service.ts
diff --git a/frontend/src/api/services/index.ts b/fdev-ffrontend/src/api/services/index.ts
similarity index 100%
rename from frontend/src/api/services/index.ts
rename to fdev-ffrontend/src/api/services/index.ts
diff --git a/frontend/src/api/services/inventory.service.ts b/fdev-ffrontend/src/api/services/inventory.service.ts
similarity index 100%
rename from frontend/src/api/services/inventory.service.ts
rename to fdev-ffrontend/src/api/services/inventory.service.ts
diff --git a/frontend/src/api/services/notification.service.ts b/fdev-ffrontend/src/api/services/notification.service.ts
similarity index 100%
rename from frontend/src/api/services/notification.service.ts
rename to fdev-ffrontend/src/api/services/notification.service.ts
diff --git a/frontend/src/api/services/onboarding.service.ts b/fdev-ffrontend/src/api/services/onboarding.service.ts
similarity index 100%
rename from frontend/src/api/services/onboarding.service.ts
rename to fdev-ffrontend/src/api/services/onboarding.service.ts
diff --git a/frontend/src/api/services/orders.service.ts b/fdev-ffrontend/src/api/services/orders.service.ts
similarity index 100%
rename from frontend/src/api/services/orders.service.ts
rename to fdev-ffrontend/src/api/services/orders.service.ts
diff --git a/frontend/src/api/services/pos.service.ts b/fdev-ffrontend/src/api/services/pos.service.ts
similarity index 100%
rename from frontend/src/api/services/pos.service.ts
rename to fdev-ffrontend/src/api/services/pos.service.ts
diff --git a/frontend/src/api/services/procurement.service.ts b/fdev-ffrontend/src/api/services/procurement.service.ts
similarity index 100%
rename from frontend/src/api/services/procurement.service.ts
rename to fdev-ffrontend/src/api/services/procurement.service.ts
diff --git a/frontend/src/api/services/production.service.ts b/fdev-ffrontend/src/api/services/production.service.ts
similarity index 100%
rename from frontend/src/api/services/production.service.ts
rename to fdev-ffrontend/src/api/services/production.service.ts
diff --git a/frontend/src/api/services/recipes.service.ts b/fdev-ffrontend/src/api/services/recipes.service.ts
similarity index 100%
rename from frontend/src/api/services/recipes.service.ts
rename to fdev-ffrontend/src/api/services/recipes.service.ts
diff --git a/frontend/src/api/services/sales.service.ts b/fdev-ffrontend/src/api/services/sales.service.ts
similarity index 100%
rename from frontend/src/api/services/sales.service.ts
rename to fdev-ffrontend/src/api/services/sales.service.ts
diff --git a/frontend/src/api/services/suppliers.service.ts b/fdev-ffrontend/src/api/services/suppliers.service.ts
similarity index 100%
rename from frontend/src/api/services/suppliers.service.ts
rename to fdev-ffrontend/src/api/services/suppliers.service.ts
diff --git a/frontend/src/api/services/tenant.service.ts b/fdev-ffrontend/src/api/services/tenant.service.ts
similarity index 100%
rename from frontend/src/api/services/tenant.service.ts
rename to fdev-ffrontend/src/api/services/tenant.service.ts
diff --git a/frontend/src/api/services/training.service.ts b/fdev-ffrontend/src/api/services/training.service.ts
similarity index 100%
rename from frontend/src/api/services/training.service.ts
rename to fdev-ffrontend/src/api/services/training.service.ts
diff --git a/frontend/src/api/types/auth.ts b/fdev-ffrontend/src/api/types/auth.ts
similarity index 100%
rename from frontend/src/api/types/auth.ts
rename to fdev-ffrontend/src/api/types/auth.ts
diff --git a/frontend/src/api/types/common.ts b/fdev-ffrontend/src/api/types/common.ts
similarity index 100%
rename from frontend/src/api/types/common.ts
rename to fdev-ffrontend/src/api/types/common.ts
diff --git a/frontend/src/api/types/data.ts b/fdev-ffrontend/src/api/types/data.ts
similarity index 100%
rename from frontend/src/api/types/data.ts
rename to fdev-ffrontend/src/api/types/data.ts
diff --git a/frontend/src/api/types/forecasting.ts b/fdev-ffrontend/src/api/types/forecasting.ts
similarity index 100%
rename from frontend/src/api/types/forecasting.ts
rename to fdev-ffrontend/src/api/types/forecasting.ts
diff --git a/frontend/src/api/types/index.ts b/fdev-ffrontend/src/api/types/index.ts
similarity index 100%
rename from frontend/src/api/types/index.ts
rename to fdev-ffrontend/src/api/types/index.ts
diff --git a/frontend/src/api/types/notification.ts b/fdev-ffrontend/src/api/types/notification.ts
similarity index 100%
rename from frontend/src/api/types/notification.ts
rename to fdev-ffrontend/src/api/types/notification.ts
diff --git a/frontend/src/api/types/procurement.ts b/fdev-ffrontend/src/api/types/procurement.ts
similarity index 100%
rename from frontend/src/api/types/procurement.ts
rename to fdev-ffrontend/src/api/types/procurement.ts
diff --git a/frontend/src/api/types/tenant.ts b/fdev-ffrontend/src/api/types/tenant.ts
similarity index 100%
rename from frontend/src/api/types/tenant.ts
rename to fdev-ffrontend/src/api/types/tenant.ts
diff --git a/frontend/src/api/types/training.ts b/fdev-ffrontend/src/api/types/training.ts
similarity index 100%
rename from frontend/src/api/types/training.ts
rename to fdev-ffrontend/src/api/types/training.ts
diff --git a/frontend/src/api/utils/error.ts b/fdev-ffrontend/src/api/utils/error.ts
similarity index 100%
rename from frontend/src/api/utils/error.ts
rename to fdev-ffrontend/src/api/utils/error.ts
diff --git a/frontend/src/api/utils/index.ts b/fdev-ffrontend/src/api/utils/index.ts
similarity index 100%
rename from frontend/src/api/utils/index.ts
rename to fdev-ffrontend/src/api/utils/index.ts
diff --git a/frontend/src/api/utils/response.ts b/fdev-ffrontend/src/api/utils/response.ts
similarity index 100%
rename from frontend/src/api/utils/response.ts
rename to fdev-ffrontend/src/api/utils/response.ts
diff --git a/frontend/src/api/utils/transform.ts b/fdev-ffrontend/src/api/utils/transform.ts
similarity index 100%
rename from frontend/src/api/utils/transform.ts
rename to fdev-ffrontend/src/api/utils/transform.ts
diff --git a/frontend/src/api/utils/validation.ts b/fdev-ffrontend/src/api/utils/validation.ts
similarity index 100%
rename from frontend/src/api/utils/validation.ts
rename to fdev-ffrontend/src/api/utils/validation.ts
diff --git a/frontend/src/api/websocket/hooks.ts b/fdev-ffrontend/src/api/websocket/hooks.ts
similarity index 100%
rename from frontend/src/api/websocket/hooks.ts
rename to fdev-ffrontend/src/api/websocket/hooks.ts
diff --git a/frontend/src/api/websocket/index.ts b/fdev-ffrontend/src/api/websocket/index.ts
similarity index 100%
rename from frontend/src/api/websocket/index.ts
rename to fdev-ffrontend/src/api/websocket/index.ts
diff --git a/frontend/src/api/websocket/manager.ts b/fdev-ffrontend/src/api/websocket/manager.ts
similarity index 100%
rename from frontend/src/api/websocket/manager.ts
rename to fdev-ffrontend/src/api/websocket/manager.ts
diff --git a/frontend/src/api/websocket/types.ts b/fdev-ffrontend/src/api/websocket/types.ts
similarity index 100%
rename from frontend/src/api/websocket/types.ts
rename to fdev-ffrontend/src/api/websocket/types.ts
diff --git a/frontend/src/components/EnhancedTrainingProgress.tsx b/fdev-ffrontend/src/components/EnhancedTrainingProgress.tsx
similarity index 100%
rename from frontend/src/components/EnhancedTrainingProgress.tsx
rename to fdev-ffrontend/src/components/EnhancedTrainingProgress.tsx
diff --git a/frontend/src/components/ErrorBoundary.tsx b/fdev-ffrontend/src/components/ErrorBoundary.tsx
similarity index 100%
rename from frontend/src/components/ErrorBoundary.tsx
rename to fdev-ffrontend/src/components/ErrorBoundary.tsx
diff --git a/frontend/src/components/SimplifiedTrainingProgress.tsx b/fdev-ffrontend/src/components/SimplifiedTrainingProgress.tsx
similarity index 100%
rename from frontend/src/components/SimplifiedTrainingProgress.tsx
rename to fdev-ffrontend/src/components/SimplifiedTrainingProgress.tsx
diff --git a/frontend/src/components/adaptive/AdaptiveInventoryWidget.tsx b/fdev-ffrontend/src/components/adaptive/AdaptiveInventoryWidget.tsx
similarity index 100%
rename from frontend/src/components/adaptive/AdaptiveInventoryWidget.tsx
rename to fdev-ffrontend/src/components/adaptive/AdaptiveInventoryWidget.tsx
diff --git a/frontend/src/components/adaptive/AdaptiveProductionCard.tsx b/fdev-ffrontend/src/components/adaptive/AdaptiveProductionCard.tsx
similarity index 100%
rename from frontend/src/components/adaptive/AdaptiveProductionCard.tsx
rename to fdev-ffrontend/src/components/adaptive/AdaptiveProductionCard.tsx
diff --git a/frontend/src/components/alerts/AlertCard.tsx b/fdev-ffrontend/src/components/alerts/AlertCard.tsx
similarity index 100%
rename from frontend/src/components/alerts/AlertCard.tsx
rename to fdev-ffrontend/src/components/alerts/AlertCard.tsx
diff --git a/frontend/src/components/alerts/AlertDashboard.tsx b/fdev-ffrontend/src/components/alerts/AlertDashboard.tsx
similarity index 100%
rename from frontend/src/components/alerts/AlertDashboard.tsx
rename to fdev-ffrontend/src/components/alerts/AlertDashboard.tsx
diff --git a/frontend/src/components/alerts/AlertFilters.tsx b/fdev-ffrontend/src/components/alerts/AlertFilters.tsx
similarity index 100%
rename from frontend/src/components/alerts/AlertFilters.tsx
rename to fdev-ffrontend/src/components/alerts/AlertFilters.tsx
diff --git a/frontend/src/components/alerts/AlertStats.tsx b/fdev-ffrontend/src/components/alerts/AlertStats.tsx
similarity index 100%
rename from frontend/src/components/alerts/AlertStats.tsx
rename to fdev-ffrontend/src/components/alerts/AlertStats.tsx
diff --git a/frontend/src/components/alerts/ConnectionStatus.tsx b/fdev-ffrontend/src/components/alerts/ConnectionStatus.tsx
similarity index 100%
rename from frontend/src/components/alerts/ConnectionStatus.tsx
rename to fdev-ffrontend/src/components/alerts/ConnectionStatus.tsx
diff --git a/frontend/src/components/auth/ProtectedRoute.tsx b/fdev-ffrontend/src/components/auth/ProtectedRoute.tsx
similarity index 100%
rename from frontend/src/components/auth/ProtectedRoute.tsx
rename to fdev-ffrontend/src/components/auth/ProtectedRoute.tsx
diff --git a/frontend/src/components/auth/RoleBasedAccess.tsx b/fdev-ffrontend/src/components/auth/RoleBasedAccess.tsx
similarity index 100%
rename from frontend/src/components/auth/RoleBasedAccess.tsx
rename to fdev-ffrontend/src/components/auth/RoleBasedAccess.tsx
diff --git a/frontend/src/components/auth/RoleBasedRoute.tsx b/fdev-ffrontend/src/components/auth/RoleBasedRoute.tsx
similarity index 100%
rename from frontend/src/components/auth/RoleBasedRoute.tsx
rename to fdev-ffrontend/src/components/auth/RoleBasedRoute.tsx
diff --git a/frontend/src/components/inventory/InventoryDashboardWidget.tsx b/fdev-ffrontend/src/components/inventory/InventoryDashboardWidget.tsx
similarity index 100%
rename from frontend/src/components/inventory/InventoryDashboardWidget.tsx
rename to fdev-ffrontend/src/components/inventory/InventoryDashboardWidget.tsx
diff --git a/frontend/src/components/inventory/InventoryItemCard.tsx b/fdev-ffrontend/src/components/inventory/InventoryItemCard.tsx
similarity index 100%
rename from frontend/src/components/inventory/InventoryItemCard.tsx
rename to fdev-ffrontend/src/components/inventory/InventoryItemCard.tsx
diff --git a/frontend/src/components/layout/AnalyticsLayout.tsx b/fdev-ffrontend/src/components/layout/AnalyticsLayout.tsx
similarity index 100%
rename from frontend/src/components/layout/AnalyticsLayout.tsx
rename to fdev-ffrontend/src/components/layout/AnalyticsLayout.tsx
diff --git a/frontend/src/components/layout/AuthLayout.tsx b/fdev-ffrontend/src/components/layout/AuthLayout.tsx
similarity index 100%
rename from frontend/src/components/layout/AuthLayout.tsx
rename to fdev-ffrontend/src/components/layout/AuthLayout.tsx
diff --git a/frontend/src/components/layout/Layout.tsx b/fdev-ffrontend/src/components/layout/Layout.tsx
similarity index 100%
rename from frontend/src/components/layout/Layout.tsx
rename to fdev-ffrontend/src/components/layout/Layout.tsx
diff --git a/frontend/src/components/layout/OperationsLayout.tsx b/fdev-ffrontend/src/components/layout/OperationsLayout.tsx
similarity index 100%
rename from frontend/src/components/layout/OperationsLayout.tsx
rename to fdev-ffrontend/src/components/layout/OperationsLayout.tsx
diff --git a/frontend/src/components/layout/SettingsLayout.tsx b/fdev-ffrontend/src/components/layout/SettingsLayout.tsx
similarity index 100%
rename from frontend/src/components/layout/SettingsLayout.tsx
rename to fdev-ffrontend/src/components/layout/SettingsLayout.tsx
diff --git a/frontend/src/components/navigation/Breadcrumbs.tsx b/fdev-ffrontend/src/components/navigation/Breadcrumbs.tsx
similarity index 100%
rename from frontend/src/components/navigation/Breadcrumbs.tsx
rename to fdev-ffrontend/src/components/navigation/Breadcrumbs.tsx
diff --git a/frontend/src/components/navigation/SecondaryNavigation.tsx b/fdev-ffrontend/src/components/navigation/SecondaryNavigation.tsx
similarity index 100%
rename from frontend/src/components/navigation/SecondaryNavigation.tsx
rename to fdev-ffrontend/src/components/navigation/SecondaryNavigation.tsx
diff --git a/frontend/src/components/navigation/TenantSelector.tsx b/fdev-ffrontend/src/components/navigation/TenantSelector.tsx
similarity index 100%
rename from frontend/src/components/navigation/TenantSelector.tsx
rename to fdev-ffrontend/src/components/navigation/TenantSelector.tsx
diff --git a/frontend/src/components/onboarding/SmartHistoricalDataImport.tsx b/fdev-ffrontend/src/components/onboarding/SmartHistoricalDataImport.tsx
similarity index 100%
rename from frontend/src/components/onboarding/SmartHistoricalDataImport.tsx
rename to fdev-ffrontend/src/components/onboarding/SmartHistoricalDataImport.tsx
diff --git a/frontend/src/components/pos/POSConfigurationCard.tsx b/fdev-ffrontend/src/components/pos/POSConfigurationCard.tsx
similarity index 100%
rename from frontend/src/components/pos/POSConfigurationCard.tsx
rename to fdev-ffrontend/src/components/pos/POSConfigurationCard.tsx
diff --git a/frontend/src/components/pos/POSConfigurationForm.tsx b/fdev-ffrontend/src/components/pos/POSConfigurationForm.tsx
similarity index 100%
rename from frontend/src/components/pos/POSConfigurationForm.tsx
rename to fdev-ffrontend/src/components/pos/POSConfigurationForm.tsx
diff --git a/frontend/src/components/pos/POSManagementPage.tsx b/fdev-ffrontend/src/components/pos/POSManagementPage.tsx
similarity index 100%
rename from frontend/src/components/pos/POSManagementPage.tsx
rename to fdev-ffrontend/src/components/pos/POSManagementPage.tsx
diff --git a/frontend/src/components/pos/POSSyncStatus.tsx b/fdev-ffrontend/src/components/pos/POSSyncStatus.tsx
similarity index 100%
rename from frontend/src/components/pos/POSSyncStatus.tsx
rename to fdev-ffrontend/src/components/pos/POSSyncStatus.tsx
diff --git a/frontend/src/components/pos/index.ts b/fdev-ffrontend/src/components/pos/index.ts
similarity index 100%
rename from frontend/src/components/pos/index.ts
rename to fdev-ffrontend/src/components/pos/index.ts
diff --git a/frontend/src/components/procurement/CriticalRequirements.tsx b/fdev-ffrontend/src/components/procurement/CriticalRequirements.tsx
similarity index 100%
rename from frontend/src/components/procurement/CriticalRequirements.tsx
rename to fdev-ffrontend/src/components/procurement/CriticalRequirements.tsx
diff --git a/frontend/src/components/procurement/GeneratePlanModal.tsx b/fdev-ffrontend/src/components/procurement/GeneratePlanModal.tsx
similarity index 100%
rename from frontend/src/components/procurement/GeneratePlanModal.tsx
rename to fdev-ffrontend/src/components/procurement/GeneratePlanModal.tsx
diff --git a/frontend/src/components/procurement/ProcurementDashboard.tsx b/fdev-ffrontend/src/components/procurement/ProcurementDashboard.tsx
similarity index 100%
rename from frontend/src/components/procurement/ProcurementDashboard.tsx
rename to fdev-ffrontend/src/components/procurement/ProcurementDashboard.tsx
diff --git a/frontend/src/components/procurement/ProcurementPlanCard.tsx b/fdev-ffrontend/src/components/procurement/ProcurementPlanCard.tsx
similarity index 100%
rename from frontend/src/components/procurement/ProcurementPlanCard.tsx
rename to fdev-ffrontend/src/components/procurement/ProcurementPlanCard.tsx
diff --git a/frontend/src/components/procurement/ProcurementSummary.tsx b/fdev-ffrontend/src/components/procurement/ProcurementSummary.tsx
similarity index 100%
rename from frontend/src/components/procurement/ProcurementSummary.tsx
rename to fdev-ffrontend/src/components/procurement/ProcurementSummary.tsx
diff --git a/frontend/src/components/procurement/index.ts b/fdev-ffrontend/src/components/procurement/index.ts
similarity index 100%
rename from frontend/src/components/procurement/index.ts
rename to fdev-ffrontend/src/components/procurement/index.ts
diff --git a/frontend/src/components/recipes/IngredientList.tsx b/fdev-ffrontend/src/components/recipes/IngredientList.tsx
similarity index 100%
rename from frontend/src/components/recipes/IngredientList.tsx
rename to fdev-ffrontend/src/components/recipes/IngredientList.tsx
diff --git a/frontend/src/components/recipes/ProductionBatchCard.tsx b/fdev-ffrontend/src/components/recipes/ProductionBatchCard.tsx
similarity index 100%
rename from frontend/src/components/recipes/ProductionBatchCard.tsx
rename to fdev-ffrontend/src/components/recipes/ProductionBatchCard.tsx
diff --git a/frontend/src/components/recipes/RecipeCard.tsx b/fdev-ffrontend/src/components/recipes/RecipeCard.tsx
similarity index 100%
rename from frontend/src/components/recipes/RecipeCard.tsx
rename to fdev-ffrontend/src/components/recipes/RecipeCard.tsx
diff --git a/frontend/src/components/sales/SalesAnalyticsDashboard.tsx b/fdev-ffrontend/src/components/sales/SalesAnalyticsDashboard.tsx
similarity index 100%
rename from frontend/src/components/sales/SalesAnalyticsDashboard.tsx
rename to fdev-ffrontend/src/components/sales/SalesAnalyticsDashboard.tsx
diff --git a/frontend/src/components/sales/SalesDashboardWidget.tsx b/fdev-ffrontend/src/components/sales/SalesDashboardWidget.tsx
similarity index 100%
rename from frontend/src/components/sales/SalesDashboardWidget.tsx
rename to fdev-ffrontend/src/components/sales/SalesDashboardWidget.tsx
diff --git a/frontend/src/components/sales/SalesDataCard.tsx b/fdev-ffrontend/src/components/sales/SalesDataCard.tsx
similarity index 100%
rename from frontend/src/components/sales/SalesDataCard.tsx
rename to fdev-ffrontend/src/components/sales/SalesDataCard.tsx
diff --git a/frontend/src/components/sales/SalesManagementPage.tsx b/fdev-ffrontend/src/components/sales/SalesManagementPage.tsx
similarity index 100%
rename from frontend/src/components/sales/SalesManagementPage.tsx
rename to fdev-ffrontend/src/components/sales/SalesManagementPage.tsx
diff --git a/frontend/src/components/sales/SalesPerformanceInsights.tsx b/fdev-ffrontend/src/components/sales/SalesPerformanceInsights.tsx
similarity index 100%
rename from frontend/src/components/sales/SalesPerformanceInsights.tsx
rename to fdev-ffrontend/src/components/sales/SalesPerformanceInsights.tsx
diff --git a/frontend/src/components/sales/index.ts b/fdev-ffrontend/src/components/sales/index.ts
similarity index 100%
rename from frontend/src/components/sales/index.ts
rename to fdev-ffrontend/src/components/sales/index.ts
diff --git a/frontend/src/components/simple/OrderSuggestions.tsx b/fdev-ffrontend/src/components/simple/OrderSuggestions.tsx
similarity index 100%
rename from frontend/src/components/simple/OrderSuggestions.tsx
rename to fdev-ffrontend/src/components/simple/OrderSuggestions.tsx
diff --git a/frontend/src/components/simple/QuickActions.tsx b/fdev-ffrontend/src/components/simple/QuickActions.tsx
similarity index 100%
rename from frontend/src/components/simple/QuickActions.tsx
rename to fdev-ffrontend/src/components/simple/QuickActions.tsx
diff --git a/frontend/src/components/simple/QuickOverview.tsx b/fdev-ffrontend/src/components/simple/QuickOverview.tsx
similarity index 100%
rename from frontend/src/components/simple/QuickOverview.tsx
rename to fdev-ffrontend/src/components/simple/QuickOverview.tsx
diff --git a/frontend/src/components/simple/TodayProduction.tsx b/fdev-ffrontend/src/components/simple/TodayProduction.tsx
similarity index 100%
rename from frontend/src/components/simple/TodayProduction.tsx
rename to fdev-ffrontend/src/components/simple/TodayProduction.tsx
diff --git a/frontend/src/components/simple/TodayRevenue.tsx b/fdev-ffrontend/src/components/simple/TodayRevenue.tsx
similarity index 100%
rename from frontend/src/components/simple/TodayRevenue.tsx
rename to fdev-ffrontend/src/components/simple/TodayRevenue.tsx
diff --git a/frontend/src/components/simple/WeatherContext.tsx b/fdev-ffrontend/src/components/simple/WeatherContext.tsx
similarity index 100%
rename from frontend/src/components/simple/WeatherContext.tsx
rename to fdev-ffrontend/src/components/simple/WeatherContext.tsx
diff --git a/frontend/src/components/simple/index.ts b/fdev-ffrontend/src/components/simple/index.ts
similarity index 100%
rename from frontend/src/components/simple/index.ts
rename to fdev-ffrontend/src/components/simple/index.ts
diff --git a/frontend/src/components/suppliers/DeliveryCard.tsx b/fdev-ffrontend/src/components/suppliers/DeliveryCard.tsx
similarity index 100%
rename from frontend/src/components/suppliers/DeliveryCard.tsx
rename to fdev-ffrontend/src/components/suppliers/DeliveryCard.tsx
diff --git a/frontend/src/components/suppliers/DeliveryDashboardWidget.tsx b/fdev-ffrontend/src/components/suppliers/DeliveryDashboardWidget.tsx
similarity index 100%
rename from frontend/src/components/suppliers/DeliveryDashboardWidget.tsx
rename to fdev-ffrontend/src/components/suppliers/DeliveryDashboardWidget.tsx
diff --git a/frontend/src/components/suppliers/DeliveryTrackingPage.tsx b/fdev-ffrontend/src/components/suppliers/DeliveryTrackingPage.tsx
similarity index 100%
rename from frontend/src/components/suppliers/DeliveryTrackingPage.tsx
rename to fdev-ffrontend/src/components/suppliers/DeliveryTrackingPage.tsx
diff --git a/frontend/src/components/suppliers/PurchaseOrderCard.tsx b/fdev-ffrontend/src/components/suppliers/PurchaseOrderCard.tsx
similarity index 100%
rename from frontend/src/components/suppliers/PurchaseOrderCard.tsx
rename to fdev-ffrontend/src/components/suppliers/PurchaseOrderCard.tsx
diff --git a/frontend/src/components/suppliers/PurchaseOrderForm.tsx b/fdev-ffrontend/src/components/suppliers/PurchaseOrderForm.tsx
similarity index 100%
rename from frontend/src/components/suppliers/PurchaseOrderForm.tsx
rename to fdev-ffrontend/src/components/suppliers/PurchaseOrderForm.tsx
diff --git a/frontend/src/components/suppliers/PurchaseOrderManagementPage.tsx b/fdev-ffrontend/src/components/suppliers/PurchaseOrderManagementPage.tsx
similarity index 100%
rename from frontend/src/components/suppliers/PurchaseOrderManagementPage.tsx
rename to fdev-ffrontend/src/components/suppliers/PurchaseOrderManagementPage.tsx
diff --git a/frontend/src/components/suppliers/SupplierAnalyticsDashboard.tsx b/fdev-ffrontend/src/components/suppliers/SupplierAnalyticsDashboard.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierAnalyticsDashboard.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierAnalyticsDashboard.tsx
diff --git a/frontend/src/components/suppliers/SupplierCard.tsx b/fdev-ffrontend/src/components/suppliers/SupplierCard.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierCard.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierCard.tsx
diff --git a/frontend/src/components/suppliers/SupplierCostAnalysis.tsx b/fdev-ffrontend/src/components/suppliers/SupplierCostAnalysis.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierCostAnalysis.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierCostAnalysis.tsx
diff --git a/frontend/src/components/suppliers/SupplierDashboardWidget.tsx b/fdev-ffrontend/src/components/suppliers/SupplierDashboardWidget.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierDashboardWidget.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierDashboardWidget.tsx
diff --git a/frontend/src/components/suppliers/SupplierForm.tsx b/fdev-ffrontend/src/components/suppliers/SupplierForm.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierForm.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierForm.tsx
diff --git a/frontend/src/components/suppliers/SupplierManagementPage.tsx b/fdev-ffrontend/src/components/suppliers/SupplierManagementPage.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierManagementPage.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierManagementPage.tsx
diff --git a/frontend/src/components/suppliers/SupplierPerformanceReport.tsx b/fdev-ffrontend/src/components/suppliers/SupplierPerformanceReport.tsx
similarity index 100%
rename from frontend/src/components/suppliers/SupplierPerformanceReport.tsx
rename to fdev-ffrontend/src/components/suppliers/SupplierPerformanceReport.tsx
diff --git a/frontend/src/components/suppliers/index.ts b/fdev-ffrontend/src/components/suppliers/index.ts
similarity index 100%
rename from frontend/src/components/suppliers/index.ts
rename to fdev-ffrontend/src/components/suppliers/index.ts
diff --git a/frontend/src/components/ui/AIInsightsFeed.tsx b/fdev-ffrontend/src/components/ui/AIInsightsFeed.tsx
similarity index 100%
rename from frontend/src/components/ui/AIInsightsFeed.tsx
rename to fdev-ffrontend/src/components/ui/AIInsightsFeed.tsx
diff --git a/frontend/src/components/ui/Button.tsx b/fdev-ffrontend/src/components/ui/Button.tsx
similarity index 100%
rename from frontend/src/components/ui/Button.tsx
rename to fdev-ffrontend/src/components/ui/Button.tsx
diff --git a/frontend/src/components/ui/Card.tsx b/fdev-ffrontend/src/components/ui/Card.tsx
similarity index 100%
rename from frontend/src/components/ui/Card.tsx
rename to fdev-ffrontend/src/components/ui/Card.tsx
diff --git a/frontend/src/components/ui/CompetitiveBenchmarks.tsx b/fdev-ffrontend/src/components/ui/CompetitiveBenchmarks.tsx
similarity index 100%
rename from frontend/src/components/ui/CompetitiveBenchmarks.tsx
rename to fdev-ffrontend/src/components/ui/CompetitiveBenchmarks.tsx
diff --git a/frontend/src/components/ui/DemandHeatmap.tsx b/fdev-ffrontend/src/components/ui/DemandHeatmap.tsx
similarity index 100%
rename from frontend/src/components/ui/DemandHeatmap.tsx
rename to fdev-ffrontend/src/components/ui/DemandHeatmap.tsx
diff --git a/frontend/src/components/ui/Input.tsx b/fdev-ffrontend/src/components/ui/Input.tsx
similarity index 100%
rename from frontend/src/components/ui/Input.tsx
rename to fdev-ffrontend/src/components/ui/Input.tsx
diff --git a/frontend/src/components/ui/LoadingSpinner.tsx b/fdev-ffrontend/src/components/ui/LoadingSpinner.tsx
similarity index 100%
rename from frontend/src/components/ui/LoadingSpinner.tsx
rename to fdev-ffrontend/src/components/ui/LoadingSpinner.tsx
diff --git a/frontend/src/components/ui/ProductionSchedule.tsx b/fdev-ffrontend/src/components/ui/ProductionSchedule.tsx
similarity index 100%
rename from frontend/src/components/ui/ProductionSchedule.tsx
rename to fdev-ffrontend/src/components/ui/ProductionSchedule.tsx
diff --git a/frontend/src/components/ui/QuickActionsPanel.tsx b/fdev-ffrontend/src/components/ui/QuickActionsPanel.tsx
similarity index 100%
rename from frontend/src/components/ui/QuickActionsPanel.tsx
rename to fdev-ffrontend/src/components/ui/QuickActionsPanel.tsx
diff --git a/frontend/src/components/ui/RevenueMetrics.tsx b/fdev-ffrontend/src/components/ui/RevenueMetrics.tsx
similarity index 100%
rename from frontend/src/components/ui/RevenueMetrics.tsx
rename to fdev-ffrontend/src/components/ui/RevenueMetrics.tsx
diff --git a/frontend/src/components/ui/WhatIfPlanner.tsx b/fdev-ffrontend/src/components/ui/WhatIfPlanner.tsx
similarity index 100%
rename from frontend/src/components/ui/WhatIfPlanner.tsx
rename to fdev-ffrontend/src/components/ui/WhatIfPlanner.tsx
diff --git a/frontend/src/hooks/useAlertStream.ts b/fdev-ffrontend/src/hooks/useAlertStream.ts
similarity index 100%
rename from frontend/src/hooks/useAlertStream.ts
rename to fdev-ffrontend/src/hooks/useAlertStream.ts
diff --git a/frontend/src/hooks/useAuth.ts b/fdev-ffrontend/src/hooks/useAuth.ts
similarity index 100%
rename from frontend/src/hooks/useAuth.ts
rename to fdev-ffrontend/src/hooks/useAuth.ts
diff --git a/frontend/src/hooks/useBakeryType.ts b/fdev-ffrontend/src/hooks/useBakeryType.ts
similarity index 100%
rename from frontend/src/hooks/useBakeryType.ts
rename to fdev-ffrontend/src/hooks/useBakeryType.ts
diff --git a/frontend/src/hooks/useDashboard.ts b/fdev-ffrontend/src/hooks/useDashboard.ts
similarity index 100%
rename from frontend/src/hooks/useDashboard.ts
rename to fdev-ffrontend/src/hooks/useDashboard.ts
diff --git a/frontend/src/hooks/useOrderSuggestions.ts b/fdev-ffrontend/src/hooks/useOrderSuggestions.ts
similarity index 100%
rename from frontend/src/hooks/useOrderSuggestions.ts
rename to fdev-ffrontend/src/hooks/useOrderSuggestions.ts
diff --git a/frontend/src/hooks/usePermissions.ts b/fdev-ffrontend/src/hooks/usePermissions.ts
similarity index 100%
rename from frontend/src/hooks/usePermissions.ts
rename to fdev-ffrontend/src/hooks/usePermissions.ts
diff --git a/frontend/src/hooks/useTenantId.ts b/fdev-ffrontend/src/hooks/useTenantId.ts
similarity index 100%
rename from frontend/src/hooks/useTenantId.ts
rename to fdev-ffrontend/src/hooks/useTenantId.ts
diff --git a/frontend/src/i18n/index.ts b/fdev-ffrontend/src/i18n/index.ts
similarity index 100%
rename from frontend/src/i18n/index.ts
rename to fdev-ffrontend/src/i18n/index.ts
diff --git a/frontend/src/index.css b/fdev-ffrontend/src/index.css
similarity index 100%
rename from frontend/src/index.css
rename to fdev-ffrontend/src/index.css
diff --git a/fdev-ffrontend/src/main.tsx b/fdev-ffrontend/src/main.tsx
new file mode 100644
index 00000000..cbe1cdf3
--- /dev/null
+++ b/fdev-ffrontend/src/main.tsx
@@ -0,0 +1,10 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App.tsx'
+import './index.css'
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+
+
+ ,
+)
\ No newline at end of file
diff --git a/frontend/src/pages/analytics/AIInsightsPage.tsx b/fdev-ffrontend/src/pages/analytics/AIInsightsPage.tsx
similarity index 100%
rename from frontend/src/pages/analytics/AIInsightsPage.tsx
rename to fdev-ffrontend/src/pages/analytics/AIInsightsPage.tsx
diff --git a/frontend/src/pages/analytics/FinancialReportsPage.tsx b/fdev-ffrontend/src/pages/analytics/FinancialReportsPage.tsx
similarity index 100%
rename from frontend/src/pages/analytics/FinancialReportsPage.tsx
rename to fdev-ffrontend/src/pages/analytics/FinancialReportsPage.tsx
diff --git a/frontend/src/pages/analytics/PerformanceKPIsPage.tsx b/fdev-ffrontend/src/pages/analytics/PerformanceKPIsPage.tsx
similarity index 100%
rename from frontend/src/pages/analytics/PerformanceKPIsPage.tsx
rename to fdev-ffrontend/src/pages/analytics/PerformanceKPIsPage.tsx
diff --git a/frontend/src/pages/analytics/ProductionReportsPage.tsx b/fdev-ffrontend/src/pages/analytics/ProductionReportsPage.tsx
similarity index 100%
rename from frontend/src/pages/analytics/ProductionReportsPage.tsx
rename to fdev-ffrontend/src/pages/analytics/ProductionReportsPage.tsx
diff --git a/frontend/src/pages/analytics/SalesAnalyticsPage.tsx b/fdev-ffrontend/src/pages/analytics/SalesAnalyticsPage.tsx
similarity index 100%
rename from frontend/src/pages/analytics/SalesAnalyticsPage.tsx
rename to fdev-ffrontend/src/pages/analytics/SalesAnalyticsPage.tsx
diff --git a/frontend/src/pages/auth/LoginPage.tsx b/fdev-ffrontend/src/pages/auth/LoginPage.tsx
similarity index 100%
rename from frontend/src/pages/auth/LoginPage.tsx
rename to fdev-ffrontend/src/pages/auth/LoginPage.tsx
diff --git a/frontend/src/pages/auth/RegisterPage.tsx b/fdev-ffrontend/src/pages/auth/RegisterPage.tsx
similarity index 100%
rename from frontend/src/pages/auth/RegisterPage.tsx
rename to fdev-ffrontend/src/pages/auth/RegisterPage.tsx
diff --git a/frontend/src/pages/auth/SimpleRegisterPage.tsx b/fdev-ffrontend/src/pages/auth/SimpleRegisterPage.tsx
similarity index 100%
rename from frontend/src/pages/auth/SimpleRegisterPage.tsx
rename to fdev-ffrontend/src/pages/auth/SimpleRegisterPage.tsx
diff --git a/frontend/src/pages/dashboard/DashboardPage.tsx b/fdev-ffrontend/src/pages/dashboard/DashboardPage.tsx
similarity index 100%
rename from frontend/src/pages/dashboard/DashboardPage.tsx
rename to fdev-ffrontend/src/pages/dashboard/DashboardPage.tsx
diff --git a/frontend/src/pages/forecast/ForecastPage.tsx b/fdev-ffrontend/src/pages/forecast/ForecastPage.tsx
similarity index 100%
rename from frontend/src/pages/forecast/ForecastPage.tsx
rename to fdev-ffrontend/src/pages/forecast/ForecastPage.tsx
diff --git a/frontend/src/pages/inventory/InventoryPage.tsx b/fdev-ffrontend/src/pages/inventory/InventoryPage.tsx
similarity index 100%
rename from frontend/src/pages/inventory/InventoryPage.tsx
rename to fdev-ffrontend/src/pages/inventory/InventoryPage.tsx
diff --git a/frontend/src/pages/landing/LandingPage.tsx b/fdev-ffrontend/src/pages/landing/LandingPage.tsx
similarity index 100%
rename from frontend/src/pages/landing/LandingPage.tsx
rename to fdev-ffrontend/src/pages/landing/LandingPage.tsx
diff --git a/frontend/src/pages/landing/SimpleLandingPage.tsx b/fdev-ffrontend/src/pages/landing/SimpleLandingPage.tsx
similarity index 100%
rename from frontend/src/pages/landing/SimpleLandingPage.tsx
rename to fdev-ffrontend/src/pages/landing/SimpleLandingPage.tsx
diff --git a/frontend/src/pages/onboarding/OnboardingPage.tsx b/fdev-ffrontend/src/pages/onboarding/OnboardingPage.tsx
similarity index 100%
rename from frontend/src/pages/onboarding/OnboardingPage.tsx
rename to fdev-ffrontend/src/pages/onboarding/OnboardingPage.tsx
diff --git a/frontend/src/pages/orders/OrdersPage.tsx b/fdev-ffrontend/src/pages/orders/OrdersPage.tsx
similarity index 100%
rename from frontend/src/pages/orders/OrdersPage.tsx
rename to fdev-ffrontend/src/pages/orders/OrdersPage.tsx
diff --git a/frontend/src/pages/pos/POSPage.tsx b/fdev-ffrontend/src/pages/pos/POSPage.tsx
similarity index 100%
rename from frontend/src/pages/pos/POSPage.tsx
rename to fdev-ffrontend/src/pages/pos/POSPage.tsx
diff --git a/frontend/src/pages/pos/index.ts b/fdev-ffrontend/src/pages/pos/index.ts
similarity index 100%
rename from frontend/src/pages/pos/index.ts
rename to fdev-ffrontend/src/pages/pos/index.ts
diff --git a/frontend/src/pages/procurement/index.ts b/fdev-ffrontend/src/pages/procurement/index.ts
similarity index 100%
rename from frontend/src/pages/procurement/index.ts
rename to fdev-ffrontend/src/pages/procurement/index.ts
diff --git a/frontend/src/pages/production/ProductionPage.tsx b/fdev-ffrontend/src/pages/production/ProductionPage.tsx
similarity index 100%
rename from frontend/src/pages/production/ProductionPage.tsx
rename to fdev-ffrontend/src/pages/production/ProductionPage.tsx
diff --git a/frontend/src/pages/recipes/RecipesPage.tsx b/fdev-ffrontend/src/pages/recipes/RecipesPage.tsx
similarity index 100%
rename from frontend/src/pages/recipes/RecipesPage.tsx
rename to fdev-ffrontend/src/pages/recipes/RecipesPage.tsx
diff --git a/frontend/src/pages/sales/SalesPage.tsx b/fdev-ffrontend/src/pages/sales/SalesPage.tsx
similarity index 100%
rename from frontend/src/pages/sales/SalesPage.tsx
rename to fdev-ffrontend/src/pages/sales/SalesPage.tsx
diff --git a/frontend/src/pages/settings/AccountSettingsPage.tsx b/fdev-ffrontend/src/pages/settings/AccountSettingsPage.tsx
similarity index 100%
rename from frontend/src/pages/settings/AccountSettingsPage.tsx
rename to fdev-ffrontend/src/pages/settings/AccountSettingsPage.tsx
diff --git a/frontend/src/pages/settings/BakeriesManagementPage.tsx b/fdev-ffrontend/src/pages/settings/BakeriesManagementPage.tsx
similarity index 100%
rename from frontend/src/pages/settings/BakeriesManagementPage.tsx
rename to fdev-ffrontend/src/pages/settings/BakeriesManagementPage.tsx
diff --git a/frontend/src/pages/settings/GeneralSettingsPage.tsx b/fdev-ffrontend/src/pages/settings/GeneralSettingsPage.tsx
similarity index 100%
rename from frontend/src/pages/settings/GeneralSettingsPage.tsx
rename to fdev-ffrontend/src/pages/settings/GeneralSettingsPage.tsx
diff --git a/frontend/src/pages/settings/SettingsPage.tsx b/fdev-ffrontend/src/pages/settings/SettingsPage.tsx
similarity index 100%
rename from frontend/src/pages/settings/SettingsPage.tsx
rename to fdev-ffrontend/src/pages/settings/SettingsPage.tsx
diff --git a/frontend/src/pages/settings/UsersManagementPage.tsx b/fdev-ffrontend/src/pages/settings/UsersManagementPage.tsx
similarity index 100%
rename from frontend/src/pages/settings/UsersManagementPage.tsx
rename to fdev-ffrontend/src/pages/settings/UsersManagementPage.tsx
diff --git a/frontend/src/router/index.tsx b/fdev-ffrontend/src/router/index.tsx
similarity index 100%
rename from frontend/src/router/index.tsx
rename to fdev-ffrontend/src/router/index.tsx
diff --git a/frontend/src/services/weatherRecommendationService.ts b/fdev-ffrontend/src/services/weatherRecommendationService.ts
similarity index 100%
rename from frontend/src/services/weatherRecommendationService.ts
rename to fdev-ffrontend/src/services/weatherRecommendationService.ts
diff --git a/frontend/src/store/index.ts b/fdev-ffrontend/src/store/index.ts
similarity index 100%
rename from frontend/src/store/index.ts
rename to fdev-ffrontend/src/store/index.ts
diff --git a/frontend/src/store/slices/authSlice.ts b/fdev-ffrontend/src/store/slices/authSlice.ts
similarity index 100%
rename from frontend/src/store/slices/authSlice.ts
rename to fdev-ffrontend/src/store/slices/authSlice.ts
diff --git a/frontend/src/store/slices/forecastSlice.ts b/fdev-ffrontend/src/store/slices/forecastSlice.ts
similarity index 100%
rename from frontend/src/store/slices/forecastSlice.ts
rename to fdev-ffrontend/src/store/slices/forecastSlice.ts
diff --git a/frontend/src/store/slices/tenantSlice.ts b/fdev-ffrontend/src/store/slices/tenantSlice.ts
similarity index 100%
rename from frontend/src/store/slices/tenantSlice.ts
rename to fdev-ffrontend/src/store/slices/tenantSlice.ts
diff --git a/fdev-ffrontend/src/styles/globals.css b/fdev-ffrontend/src/styles/globals.css
new file mode 100644
index 00000000..ba3a4b6b
--- /dev/null
+++ b/fdev-ffrontend/src/styles/globals.css
@@ -0,0 +1,96 @@
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';
+
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap');
+
+/* Base styles */
+* {
+ box-sizing: border-box;
+}
+
+body {
+ font-family: 'Inter', system-ui, -apple-system, sans-serif;
+ line-height: 1.5;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+/* Custom scrollbar */
+::-webkit-scrollbar {
+ width: 6px;
+}
+
+::-webkit-scrollbar-track {
+ background: #f1f5f9;
+}
+
+::-webkit-scrollbar-thumb {
+ background: #cbd5e1;
+ border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background: #94a3b8;
+}
+
+/* Focus styles */
+.focus-ring:focus {
+ outline: none;
+ box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1);
+ border-color: #f97316;
+}
+
+/* Animation classes */
+.animate-fade-in {
+ animation: fadeIn 0.5s ease-in-out;
+}
+
+.animate-slide-up {
+ animation: slideUp 0.3s ease-out;
+}
+
+@keyframes fadeIn {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+@keyframes slideUp {
+ from {
+ opacity: 0;
+ transform: translateY(10px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
+/* Custom components */
+.bakery-card {
+ @apply bg-white rounded-xl shadow-soft p-6 hover:shadow-medium transition-all duration-200;
+}
+
+.confidence-high {
+ @apply bg-green-100 text-green-800 border-green-200;
+}
+
+.confidence-medium {
+ @apply bg-yellow-100 text-yellow-800 border-yellow-200;
+}
+
+.confidence-low {
+ @apply bg-red-100 text-red-800 border-red-200;
+}
+
+/* Mobile-first responsive design helpers */
+@media (max-width: 640px) {
+ .mobile-padding {
+ padding-left: 1rem;
+ padding-right: 1rem;
+ }
+
+ .mobile-text-sm {
+ font-size: 0.875rem;
+ }
+}
\ No newline at end of file
diff --git a/frontend/src/types/alerts.ts b/fdev-ffrontend/src/types/alerts.ts
similarity index 100%
rename from frontend/src/types/alerts.ts
rename to fdev-ffrontend/src/types/alerts.ts
diff --git a/frontend/src/types/weather.ts b/fdev-ffrontend/src/types/weather.ts
similarity index 100%
rename from frontend/src/types/weather.ts
rename to fdev-ffrontend/src/types/weather.ts
diff --git a/frontend/src/utils/onboardingRouter.ts b/fdev-ffrontend/src/utils/onboardingRouter.ts
similarity index 100%
rename from frontend/src/utils/onboardingRouter.ts
rename to fdev-ffrontend/src/utils/onboardingRouter.ts
diff --git a/fdev-ffrontend/tailwind.config.js b/fdev-ffrontend/tailwind.config.js
new file mode 100644
index 00000000..f3714989
--- /dev/null
+++ b/fdev-ffrontend/tailwind.config.js
@@ -0,0 +1,133 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+ content: [
+ "./index.html",
+ "./src/**/*.{js,ts,jsx,tsx}",
+ ],
+ theme: {
+ extend: {
+ colors: {
+ // PanIA Brand Colors
+ primary: {
+ 50: '#fff7ed',
+ 100: '#ffedd5',
+ 200: '#fed7aa',
+ 300: '#fdba74',
+ 400: '#fb923c',
+ 500: '#f97316', // Main orange
+ 600: '#ea580c',
+ 700: '#c2410c',
+ 800: '#9a3412',
+ 900: '#7c2d12',
+ 950: '#431407',
+ },
+ secondary: {
+ 50: '#f8fafc',
+ 100: '#f1f5f9',
+ 200: '#e2e8f0',
+ 300: '#cbd5e1',
+ 400: '#94a3b8',
+ 500: '#64748b',
+ 600: '#475569',
+ 700: '#334155',
+ 800: '#1e293b',
+ 900: '#0f172a',
+ 950: '#020617',
+ },
+ // Traffic Light Indicators
+ success: {
+ 50: '#f0fdf4',
+ 100: '#dcfce7',
+ 500: '#22c55e',
+ 600: '#16a34a',
+ 700: '#15803d',
+ },
+ warning: {
+ 50: '#fffbeb',
+ 100: '#fef3c7',
+ 500: '#f59e0b',
+ 600: '#d97706',
+ 700: '#b45309',
+ },
+ danger: {
+ 50: '#fef2f2',
+ 100: '#fee2e2',
+ 500: '#ef4444',
+ 600: '#dc2626',
+ 700: '#b91c1c',
+ },
+ // Spanish Theme Colors
+ madrid: {
+ 50: '#fdf2f8',
+ 100: '#fce7f3',
+ 200: '#fbcfe8',
+ 300: '#f9a8d4',
+ 400: '#f472b6',
+ 500: '#ec4899',
+ 600: '#db2777',
+ 700: '#be185d',
+ 800: '#9d174d',
+ 900: '#831843',
+ },
+ },
+ fontFamily: {
+ 'sans': ['Inter', 'system-ui', 'sans-serif'],
+ 'display': ['Poppins', 'Inter', 'system-ui', 'sans-serif'],
+ },
+ fontSize: {
+ 'xs': ['0.75rem', { lineHeight: '1rem' }],
+ 'sm': ['0.875rem', { lineHeight: '1.25rem' }],
+ 'base': ['1rem', { lineHeight: '1.5rem' }],
+ 'lg': ['1.125rem', { lineHeight: '1.75rem' }],
+ 'xl': ['1.25rem', { lineHeight: '1.75rem' }],
+ '2xl': ['1.5rem', { lineHeight: '2rem' }],
+ '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
+ '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
+ },
+ spacing: {
+ '18': '4.5rem',
+ '88': '22rem',
+ '128': '32rem',
+ },
+ borderRadius: {
+ 'xl': '0.75rem',
+ '2xl': '1rem',
+ '3xl': '1.5rem',
+ },
+ boxShadow: {
+ 'soft': '0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04)',
+ 'medium': '0 4px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
+ 'strong': '0 10px 40px -10px rgba(0, 0, 0, 0.15), 0 2px 10px -2px rgba(0, 0, 0, 0.04)',
+ },
+ animation: {
+ 'fade-in': 'fadeIn 0.5s ease-in-out',
+ 'slide-up': 'slideUp 0.3s ease-out',
+ 'slide-down': 'slideDown 0.3s ease-out',
+ 'scale-in': 'scaleIn 0.2s ease-out',
+ 'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+ },
+ keyframes: {
+ fadeIn: {
+ '0%': { opacity: '0' },
+ '100%': { opacity: '1' },
+ },
+ slideUp: {
+ '0%': { transform: 'translateY(10px)', opacity: '0' },
+ '100%': { transform: 'translateY(0)', opacity: '1' },
+ },
+ slideDown: {
+ '0%': { transform: 'translateY(-10px)', opacity: '0' },
+ '100%': { transform: 'translateY(0)', opacity: '1' },
+ },
+ scaleIn: {
+ '0%': { transform: 'scale(0.95)', opacity: '0' },
+ '100%': { transform: 'scale(1)', opacity: '1' },
+ },
+ },
+ },
+ },
+ plugins: [
+ require('@tailwindcss/forms'),
+ require('@tailwindcss/typography'),
+ ],
+}
\ No newline at end of file
diff --git a/fdev-ffrontend/tsconfig.json b/fdev-ffrontend/tsconfig.json
new file mode 100644
index 00000000..2be7d0d5
--- /dev/null
+++ b/fdev-ffrontend/tsconfig.json
@@ -0,0 +1,31 @@
+{
+ "compilerOptions": {
+ "target": "ES2020",
+ "useDefineForClassFields": true,
+ "lib": ["ES2020", "DOM", "DOM.Iterable"],
+ "module": "ESNext",
+ "skipLibCheck": true,
+
+ /* Bundler mode */
+ "moduleResolution": "bundler",
+ "allowImportingTsExtensions": true,
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "noEmit": true,
+ "jsx": "react-jsx",
+
+ /* Linting */
+ "strict": false,
+ "noUnusedLocals": false,
+ "noUnusedParameters": false,
+ "noFallthroughCasesInSwitch": false,
+
+ /* Path mapping */
+ "baseUrl": ".",
+ "paths": {
+ "@/*": ["./src/*"]
+ }
+ },
+ "include": ["src", "vite-env.d.ts"],
+ "references": [{ "path": "./tsconfig.node.json" }]
+}
\ No newline at end of file
diff --git a/fdev-ffrontend/tsconfig.node.json b/fdev-ffrontend/tsconfig.node.json
new file mode 100644
index 00000000..decf631a
--- /dev/null
+++ b/fdev-ffrontend/tsconfig.node.json
@@ -0,0 +1,11 @@
+{
+ "compilerOptions": {
+ "composite": true,
+ "skipLibCheck": true,
+ "module": "ESNext",
+ "moduleResolution": "bundler",
+ "allowSyntheticDefaultImports": true,
+ "strict": true
+ },
+ "include": ["vite.config.js"]
+}
\ No newline at end of file
diff --git a/frontend/vite-env.d.ts b/fdev-ffrontend/vite-env.d.ts
similarity index 100%
rename from frontend/vite-env.d.ts
rename to fdev-ffrontend/vite-env.d.ts
diff --git a/frontend/vite.config.js b/fdev-ffrontend/vite.config.js
similarity index 100%
rename from frontend/vite.config.js
rename to fdev-ffrontend/vite.config.js
diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json
new file mode 100644
index 00000000..0ba8af08
--- /dev/null
+++ b/frontend/.eslintrc.json
@@ -0,0 +1,25 @@
+{
+ "env": {
+ "browser": true,
+ "es2020": true
+ },
+ "extends": [
+ "eslint:recommended",
+ "plugin:@typescript-eslint/recommended",
+ "plugin:react-hooks/recommended"
+ ],
+ "parser": "@typescript-eslint/parser",
+ "parserOptions": {
+ "ecmaVersion": "latest",
+ "sourceType": "module"
+ },
+ "plugins": ["react-refresh"],
+ "rules": {
+ "react-refresh/only-export-components": [
+ "warn",
+ { "allowConstantExport": true }
+ ],
+ "@typescript-eslint/no-explicit-any": "error",
+ "@typescript-eslint/no-unused-vars": ["error", { "argsIgnorePattern": "^_" }]
+ }
+}
\ No newline at end of file
diff --git a/frontend/.gitignore b/frontend/.gitignore
new file mode 100644
index 00000000..da798a8d
--- /dev/null
+++ b/frontend/.gitignore
@@ -0,0 +1,41 @@
+# Dependencies
+node_modules
+.pnp
+.pnp.js
+
+# Testing
+coverage
+
+# Production
+dist
+dist-ssr
+
+# Local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+# Storybook
+storybook-static
\ No newline at end of file
diff --git a/frontend/.prettierrc b/frontend/.prettierrc
new file mode 100644
index 00000000..60dbb133
--- /dev/null
+++ b/frontend/.prettierrc
@@ -0,0 +1,9 @@
+{
+ "semi": true,
+ "trailingComma": "es5",
+ "singleQuote": true,
+ "printWidth": 100,
+ "tabWidth": 2,
+ "useTabs": false,
+ "plugins": ["prettier-plugin-tailwindcss"]
+}
\ No newline at end of file
diff --git a/frontend/README.md b/frontend/README.md
new file mode 100644
index 00000000..02f427de
--- /dev/null
+++ b/frontend/README.md
@@ -0,0 +1,1372 @@
+frontend/
+├── public/
+│ ├── icons/ # PWA icons (multiple sizes)
+│ ├── manifest.json # PWA manifest
+│ └── sw.js # Service worker
+├── src/
+│ ├── components/
+│ │ ├── ui/ # Design system components
+│ │ │ ├── Button/
+│ │ │ │ ├── Button.tsx
+│ │ │ │ ├── Button.stories.tsx
+│ │ │ │ ├── Button.test.tsx
+│ │ │ │ └── index.ts
+│ │ │ ├── Input/
+│ │ │ ├── Card/
+│ │ │ ├── Modal/
+│ │ │ ├── Table/
+│ │ │ ├── Badge/
+│ │ │ ├── Avatar/
+│ │ │ ├── Tooltip/
+│ │ │ ├── Select/
+│ │ │ ├── DatePicker/
+│ │ │ └── index.ts
+│ │ ├── layout/
+│ │ │ ├── AppShell/
+│ │ │ ├── Header/
+│ │ │ ├── Sidebar/
+│ │ │ ├── Breadcrumbs/
+│ │ │ ├── PageHeader/
+│ │ │ └── Footer/
+│ │ ├── domain/
+│ │ │ ├── auth/
+│ │ │ ├── dashboard/
+│ │ │ ├── inventory/
+│ │ │ ├── production/
+│ │ │ ├── sales/
+│ │ │ ├── forecasting/
+│ │ │ ├── analytics/
+│ │ │ └── onboarding/
+│ │ └── shared/
+│ │ ├── LoadingSpinner/
+│ │ ├── EmptyState/
+│ │ ├── ErrorBoundary/
+│ │ ├── ConfirmDialog/
+│ │ └── DataTable/
+│ ├── pages/
+│ │ ├── public/
+│ │ │ ├── LandingPage/
+│ │ │ ├── LoginPage/
+│ │ │ └── RegisterPage/
+│ │ ├── app/
+│ │ │ ├── DashboardPage/
+│ │ │ ├── operations/
+│ │ │ │ ├── InventoryPage/
+│ │ │ │ ├── ProductionPage/
+│ │ │ │ ├── OrdersPage/
+│ │ │ │ ├── ProcurementPage/
+│ │ │ │ └── POSPage/
+│ │ │ ├── analytics/
+│ │ │ │ ├── ForecastingPage/
+│ │ │ │ ├── SalesAnalyticsPage/
+│ │ │ │ ├── PerformancePage/
+│ │ │ │ └── AIInsightsPage/
+│ │ │ ├── data/
+│ │ │ │ ├── WeatherPage/
+│ │ │ │ ├── TrafficPage/
+│ │ │ │ └── EventsPage/
+│ │ │ ├── communications/
+│ │ │ │ ├── NotificationsPage/
+│ │ │ │ ├── AlertsPage/
+│ │ │ │ └── PreferencesPage/
+│ │ │ ├── settings/
+│ │ │ │ ├── TeamPage/
+│ │ │ │ ├── BakeryConfigPage/
+│ │ │ │ ├── TrainingPage/
+│ │ │ │ └── SystemPage/
+│ │ │ └── onboarding/
+│ │ │ ├── UploadPage/
+│ │ │ ├── AnalysisPage/
+│ │ │ ├── ReviewPage/
+│ │ │ └── SetupPage/
+│ │ └── index.ts
+│ ├── hooks/
+│ │ ├── api/
+│ │ │ ├── useAuth.ts
+│ │ │ ├── useInventory.ts
+│ │ │ ├── useProduction.ts
+│ │ │ ├── useForecasting.ts
+│ │ │ ├── useSales.ts
+│ │ │ ├── useSSE.ts
+│ │ │ └── useWebSocket.ts
+│ │ ├── ui/
+│ │ │ ├── useModal.ts
+│ │ │ ├── useTheme.ts
+│ │ │ ├── useToast.ts
+│ │ │ └── useDebounce.ts
+│ │ └── business/
+│ │ ├── useBakeryWorkflow.ts
+│ │ ├── useProductionSchedule.ts
+│ │ └── useAlerts.ts
+│ ├── stores/
+│ │ ├── auth.store.ts
+│ │ ├── ui.store.ts
+│ │ ├── bakery.store.ts
+│ │ ├── alerts.store.ts
+│ │ └── index.ts
+│ ├── services/
+│ │ ├── api/
+│ │ │ ├── client.ts
+│ │ │ ├── auth.service.ts
+│ │ │ ├── tenant.service.ts
+│ │ │ ├── sales.service.ts
+│ │ │ ├── inventory.service.ts
+│ │ │ ├── forecasting.service.ts
+│ │ │ ├── training.service.ts
+│ │ │ ├── data.service.ts
+│ │ │ ├── notification.service.ts
+│ │ │ ├── orders.service.ts
+│ │ │ ├── production.service.ts
+│ │ │ ├── procurement.service.ts
+│ │ │ └── pos.service.ts
+│ │ ├── realtime/
+│ │ │ ├── sse.service.ts
+│ │ │ └── websocket.service.ts
+│ │ └── utils/
+│ │ ├── storage.service.ts
+│ │ └── cache.service.ts
+│ ├── router/
+│ │ ├── AppRouter.tsx
+│ │ ├── ProtectedRoute.tsx
+│ │ ├── routes.config.ts
+│ │ └── index.ts
+│ ├── styles/
+│ │ ├── globals.css
+│ │ ├── components.css
+│ │ ├── animations.css
+│ │ └── themes/
+│ │ ├── light.css
+│ │ └── dark.css
+│ ├── utils/
+│ │ ├── format.ts
+│ │ ├── validation.ts
+│ │ ├── constants.ts
+│ │ ├── date.ts
+│ │ └── currency.ts
+│ ├── types/
+│ │ ├── auth.types.ts
+│ │ ├── inventory.types.ts
+│ │ ├── production.types.ts
+│ │ ├── sales.types.ts
+│ │ ├── forecasting.types.ts
+│ │ ├── api.types.ts
+│ │ └── index.ts
+│ ├── locales/
+│ │ ├── es/
+│ │ │ ├── common.json
+│ │ │ ├── auth.json
+│ │ │ ├── inventory.json
+│ │ │ └── errors.json
+│ │ └── index.ts
+│ ├── App.tsx
+│ ├── main.tsx
+│ └── vite-env.d.ts
+├── .env.example
+├── .gitignore
+├── index.html
+├── package.json
+├── tsconfig.json
+├── vite.config.ts
+├── tailwind.config.js
+└── README.md
+
+
+# 🚀 Bakery AI Platform - Complete Frontend Rebuild from Scratch
+
+## 📋 Project Context
+
+You are working on **Bakery AI (PanIA)**, an intelligent platform for Madrid's bakery ecosystem that provides AI-powered demand forecasting, inventory management, and automated onboarding. The current frontend codebase has become disorganized and unmaintainable. **Your task is to build a completely new frontend from scratch** using modern best practices while preserving the existing backend API infrastructure.
+
+## 🎯 Mission: Complete Frontend Rebuild
+
+### Current Situation
+- ❌ **Frontend architecture is a mess** - components, pages, and logic scattered without organization
+- ❌ **No consistent design system** - UI components lack standardization
+- ❌ **Poor code structure** - files and folders organized without logic
+- ❌ **Outdated patterns** - not following modern React/TypeScript best practices
+- ❌ **Poor user experience** - interface doesn't meet 2024-2025 standards
+
+### Your Objective
+✅ **Build a brand new frontend from the ground up** that is:
+- Modern, maintainable, and scalable
+- Following 2024-2025 UX/UI best practices
+- Properly organized with clear architecture
+- Type-safe and performant
+- Mobile-first and accessible
+
+## 🏗️ What to Preserve vs Rebuild
+
+### ✅ **PRESERVE: Existing Backend Microservices Architecture**
+
+The backend has a comprehensive microservices architecture that should be fully integrated:
+
+```
+🏗️ Backend Microservices:
+├── 🔐 auth/ # Authentication & user management
+├── 🏢 tenant/ # Multi-tenant organization management
+├── 📊 sales/ # Sales data processing & onboarding
+├── 📦 inventory/ # Product catalog & stock management
+├── 📈 forecasting/ # AI demand predictions & analytics
+├── 🎯 training/ # ML model training & management
+├── 🌍 data/ # External data (weather, traffic)
+├── 📧 notification/ # Email & WhatsApp alerts
+├── 📋 orders/ # Order management & tracking
+├── 🏭 production/ # Production planning & batches
+├── 🛍️ procurement/ # Purchase orders & supplier management
+├── 📍 pos/ # Point of sale integrations
+└── 🌐 gateway/ # API gateway & routing
+```
+
+**Complete API Endpoint Mapping:**
+
+### 🔐 Authentication Service
+```
+POST /api/v1/auth/register
+POST /api/v1/auth/login
+POST /api/v1/auth/refresh
+DELETE /api/v1/auth/logout
+GET /api/v1/auth/me
+PUT /api/v1/auth/profile
+POST /api/v1/auth/password/reset
+PUT /api/v1/auth/password/change
+```
+
+### 🏢 Tenant Service
+```
+POST /api/v1/tenants/register
+GET /api/v1/tenants/{tenant_id}
+PUT /api/v1/tenants/{tenant_id}
+DELETE /api/v1/tenants/{tenant_id}
+GET /api/v1/tenants/{tenant_id}/members
+POST /api/v1/tenants/{tenant_id}/invite
+DELETE /api/v1/tenants/{tenant_id}/members/{user_id}
+PATCH /api/v1/tenants/{tenant_id}/members/{user_id}
+GET /api/v1/tenants/{tenant_id}/stats
+GET /api/v1/tenants/user/{user_id}
+```
+
+### 📊 Sales Service (includes Onboarding & Analytics)
+```
+# Sales Data Management
+GET /api/v1/tenants/{tenant_id}/sales
+POST /api/v1/tenants/{tenant_id}/sales/upload
+GET /api/v1/tenants/{tenant_id}/sales/summary
+GET /api/v1/tenants/{tenant_id}/sales/trends
+
+# AI Onboarding Automation
+POST /api/v1/tenants/{tenant_id}/onboarding/analyze
+POST /api/v1/tenants/{tenant_id}/onboarding/create-inventory
+POST /api/v1/tenants/{tenant_id}/onboarding/import-sales
+GET /api/v1/tenants/{tenant_id}/onboarding/business-model-guide
+
+# Analytics
+GET /api/v1/tenants/{tenant_id}/analytics/revenue
+GET /api/v1/tenants/{tenant_id}/analytics/products
+GET /api/v1/tenants/{tenant_id}/analytics/trends
+GET /api/v1/tenants/{tenant_id}/analytics/reports
+```
+
+### 📦 Inventory Service (Product Catalog & Stock Management)
+```
+# Product Management
+GET /api/v1/tenants/{tenant_id}/inventory/products
+POST /api/v1/tenants/{tenant_id}/inventory/products
+GET /api/v1/tenants/{tenant_id}/inventory/products/{product_id}
+PUT /api/v1/tenants/{tenant_id}/inventory/products/{product_id}
+DELETE /api/v1/tenants/{tenant_id}/inventory/products/{product_id}
+
+# Stock Management
+GET /api/v1/tenants/{tenant_id}/inventory/stock
+POST /api/v1/tenants/{tenant_id}/inventory/stock/adjustment
+GET /api/v1/tenants/{tenant_id}/inventory/stock/movements
+GET /api/v1/tenants/{tenant_id}/inventory/stock/alerts
+
+# AI Classification (300+ Bakery Products)
+POST /api/v1/tenants/{tenant_id}/inventory/classify-product
+POST /api/v1/tenants/{tenant_id}/inventory/classify-products-batch
+
+# Import/Export
+POST /api/v1/tenants/{tenant_id}/inventory/import
+GET /api/v1/tenants/{tenant_id}/inventory/export
+GET /api/v1/tenants/{tenant_id}/inventory/search
+```
+
+### 📈 Forecasting Service (AI Demand Predictions)
+```
+GET /api/v1/tenants/{tenant_id}/forecasts
+POST /api/v1/tenants/{tenant_id}/forecasts/generate
+GET /api/v1/tenants/{tenant_id}/forecasts/{forecast_id}
+GET /api/v1/tenants/{tenant_id}/predictions
+GET /api/v1/tenants/{tenant_id}/predictions/daily
+GET /api/v1/tenants/{tenant_id}/predictions/weekly
+GET /api/v1/tenants/{tenant_id}/predictions/alerts
+POST /api/v1/tenants/{tenant_id}/predictions/validate
+```
+
+### 🎯 Training Service (ML Model Management)
+```
+POST /api/v1/tenants/{tenant_id}/training/start
+GET /api/v1/tenants/{tenant_id}/training/status
+GET /api/v1/tenants/{tenant_id}/training/history
+POST /api/v1/tenants/{tenant_id}/training/stop
+GET /api/v1/tenants/{tenant_id}/models
+GET /api/v1/tenants/{tenant_id}/models/{model_id}
+GET /api/v1/tenants/{tenant_id}/models/{model_id}/metrics
+```
+
+### 🌍 Data Service (External Data Integration)
+```
+GET /api/v1/tenants/{tenant_id}/weather
+GET /api/v1/tenants/{tenant_id}/weather/forecast
+GET /api/v1/tenants/{tenant_id}/traffic
+GET /api/v1/tenants/{tenant_id}/traffic/patterns
+GET /api/v1/tenants/{tenant_id}/holidays
+GET /api/v1/tenants/{tenant_id}/events
+```
+
+### 📧 Notification Service
+```
+POST /api/v1/tenants/{tenant_id}/notifications/send
+GET /api/v1/tenants/{tenant_id}/notifications/history
+GET /api/v1/tenants/{tenant_id}/notifications/preferences
+PUT /api/v1/tenants/{tenant_id}/notifications/preferences
+POST /api/v1/tenants/{tenant_id}/notifications/test
+```
+
+### 📋 Orders Service
+```
+GET /api/v1/tenants/{tenant_id}/orders
+POST /api/v1/tenants/{tenant_id}/orders
+GET /api/v1/tenants/{tenant_id}/orders/{order_id}
+PUT /api/v1/tenants/{tenant_id}/orders/{order_id}
+DELETE /api/v1/tenants/{tenant_id}/orders/{order_id}
+GET /api/v1/tenants/{tenant_id}/orders/dashboard-summary
+POST /api/v1/tenants/{tenant_id}/orders/{order_id}/status
+```
+
+### 🏭 Production Service
+```
+GET /api/v1/tenants/{tenant_id}/production/batches
+POST /api/v1/tenants/{tenant_id}/production/batches
+GET /api/v1/tenants/{tenant_id}/production/batches/{batch_id}
+PUT /api/v1/tenants/{tenant_id}/production/batches/{batch_id}
+GET /api/v1/tenants/{tenant_id}/production/schedule
+POST /api/v1/tenants/{tenant_id}/production/schedule
+GET /api/v1/tenants/{tenant_id}/production/equipment
+```
+
+### 🛍️ Procurement Service
+```
+GET /api/v1/tenants/{tenant_id}/procurement/plans
+POST /api/v1/tenants/{tenant_id}/procurement/plans/generate
+GET /api/v1/tenants/{tenant_id}/procurement/plans/{plan_id}
+PUT /api/v1/tenants/{tenant_id}/procurement/plans/{plan_id}/status
+GET /api/v1/tenants/{tenant_id}/procurement/suppliers
+GET /api/v1/tenants/{tenant_id}/procurement/requirements
+```
+
+### 📍 POS Service (Point of Sale Integration)
+```
+GET /api/v1/tenants/{tenant_id}/pos/configurations
+POST /api/v1/tenants/{tenant_id}/pos/configurations
+GET /api/v1/tenants/{tenant_id}/pos/transactions
+POST /api/v1/tenants/{tenant_id}/pos/sync
+GET /api/v1/tenants/{tenant_id}/pos/sync-status
+```
+
+### 📡 **Real-Time SSE Infrastructure**
+
+The backend includes a sophisticated Server-Sent Events (SSE) system for real-time alerts and recommendations:
+
+#### SSE Service Architecture:
+```
+🔄 Real-Time Stream Flow:
+Alert/Recommendation Generated → Alert Processor → Redis Channel → SSE Service → Frontend Dashboard
+
+📡 SSE Endpoints:
+GET /api/v1/sse/alerts/stream/{tenant_id} # Real-time alert & recommendation stream
+
+🚨 Alert Types & Severity Levels:
+- URGENT: All channels (WhatsApp, Email, Push, Dashboard)
+- HIGH: WhatsApp + Email (6AM-10PM), Email only (night)
+- MEDIUM: Email (business hours 7AM-8PM), Dashboard always
+- LOW: Dashboard only
+
+💡 Recommendation Types:
+- Production optimization suggestions
+- Inventory reorder recommendations
+- Demand forecast insights
+- Cost optimization tips
+- Equipment maintenance alerts
+```
+
+#### Channel Routing Logic:
+```typescript
+// Backend determines channels by severity & time:
+const channels = {
+ urgent: ['whatsapp', 'email', 'push', 'dashboard'], // Immediate
+ high: ['whatsapp', 'email', 'dashboard'], // Extended hours
+ medium: ['email', 'dashboard'], // Business hours
+ low: ['dashboard'] // Always visible
+};
+
+// Frontend receives via SSE:
+eventSource.addEventListener('alert', (event) => {
+ const alert = JSON.parse(event.data);
+ // Auto-display urgent/high alerts
+ // Browser notifications for urgent alerts
+ // Sound alerts for critical items
+});
+
+eventSource.addEventListener('recommendation', (event) => {
+ const recommendation = JSON.parse(event.data);
+ // Display in recommendations panel
+ // Non-intrusive UI integration
+});
+```
+
+#### SSE Message Format:
+```typescript
+interface SSEMessage {
+ id: string;
+ item_type: 'alert' | 'recommendation';
+ type: string; // Specific alert type
+ severity: 'urgent' | 'high' | 'medium' | 'low';
+ title: string;
+ message: string;
+ actions: string[]; // Suggested actions
+ metadata: Record; // Context data
+ timestamp: string;
+ status: 'active' | 'acknowledged' | 'resolved';
+}
+```
+
+### 🔄 **Real-Time WebSocket Training Monitoring**
+
+In addition to SSE alerts, the system includes dedicated WebSocket connections for ML model training progress:
+
+#### WebSocket Training Architecture:
+```
+🎯 Training WebSocket Flow:
+Training Job Started → WebSocket Connection → Real-time Progress → Completion Status
+
+📡 WebSocket Endpoints:
+WS /api/v1/ws/tenants/{tenant_id}/training/jobs/{job_id}/live # Real-time training progress
+
+🤖 ML Training Process Types:
+- Data validation and preprocessing
+- Prophet model training (demand forecasting)
+- Model performance evaluation (MAPE, MAE, RMSE, R2 score)
+- Model storage and versioning
+- Training completion with metrics
+```
+
+#### WebSocket Message Types:
+```typescript
+interface TrainingWebSocketMessage {
+ // Progress Updates
+ type: 'training_progress';
+ job_id: string;
+ progress: {
+ percentage: number; // 0-100
+ current_step: string; // "Data validation", "Model training", etc.
+ products_completed: number; // Products processed so far
+ products_total: number; // Total products to process
+ estimated_time_remaining: number; // Seconds
+ started_at: string;
+ };
+
+ // Completion Events
+ type: 'training_completed';
+ job_id: string;
+ results: {
+ successful_trainings: number;
+ failed_trainings: number;
+ models_created: string[];
+ performance_metrics: {
+ accuracy: number; // R2 score
+ mape: number; // Mean Absolute Percentage Error
+ mae: number; // Mean Absolute Error
+ rmse: number; // Root Mean Square Error
+ };
+ training_duration: number; // Total training time in seconds
+ };
+
+ // Error Events
+ type: 'training_error';
+ job_id: string;
+ error: string;
+ timestamp: string;
+}
+```
+
+#### Training Configuration:
+```typescript
+// Backend training settings optimized for bakery data:
+const trainingConfig = {
+ maxTrainingTimeMinutes: 30, // 30 minute timeout
+ maxConcurrentJobs: 3, // Max 3 parallel training jobs
+ minTrainingDataDays: 30, // Require 30+ days of sales data
+
+ // Prophet algorithm parameters for bakery forecasting:
+ seasonalityMode: 'additive', // Better for bakery patterns
+ changePointPriorScale: 0.05, // Sensitivity to trend changes
+ seasonalityPriorScale: 10.0, // Strength of seasonal patterns
+ holidaysPriorScale: 10.0, // Spanish/Madrid holiday impact
+
+ // Spanish context:
+ enableSpanishHolidays: true, // National holidays
+ enableMadridHolidays: true, // Local Madrid holidays
+ enableCustomHolidays: true // Bakery-specific holidays
+};
+```
+
+#### WebSocket Integration Features:
+- ✅ **Real-Time Progress**: Live percentage updates during training
+- ✅ **Step-by-Step Monitoring**: Current training phase visibility
+- ✅ **Performance Metrics**: Live model accuracy metrics (MAPE, MAE, RMSE)
+- ✅ **Connection Management**: Auto-reconnection with JWT authentication
+- ✅ **Tenant Isolation**: Secure per-tenant training job monitoring
+- ✅ **Completion Detection**: Automatic WebSocket closure on job completion
+- ✅ **Error Handling**: Comprehensive error reporting and recovery
+
+### ❌ **REBUILD COMPLETELY: Frontend**
+Replace the entire frontend directory structure and codebase:
+
+```bash
+# Remove the old frontend completely:
+rm -rf frontend/src/components/
+rm -rf frontend/src/pages/
+rm -rf frontend/src/hooks/
+rm -rf frontend/src/styles/
+rm -rf frontend/src/router/
+# Keep only: package.json, vite.config.ts, index.html
+```
+
+## 📱 New Frontend Requirements
+
+### Target Users & Use Cases
+1. **Small Bakery Owners (Madrid)**: Mobile-first, simple workflows, 4AM production schedules
+2. **Operations Managers**: Desktop analytics, detailed reports, multi-location oversight
+3. **Production Staff**: Tablet-friendly, quick actions, hands-free when possible
+
+### Core User Workflows to Support
+```
+1. Morning Production Planning (4:00 AM):
+ Login → Check Forecasts → Plan Production → Update Inventory
+
+2. Daily Operations Management:
+ Monitor Sales → Adjust Production → Track Inventory → Handle Alerts
+
+3. Weekly Business Analysis:
+ Review Performance → Analyze Trends → Plan Improvements → Generate Reports
+
+4. New User Onboarding:
+ Register → Upload Sales Data → AI Setup → Start Forecasting (5-10 minutes)
+```
+
+## 🎨 Modern Frontend Architecture to Build
+
+### Tech Stack (Keep Existing Dependencies)
+```json
+{
+ "react": "^18.2.0",
+ "typescript": "^5.0.2",
+ "vite": "^4.4.5",
+ "react-router-dom": "^6.15.0",
+ "@reduxjs/toolkit": "^1.9.5",
+ "tailwindcss": "^3.3.0",
+ "react-hook-form": "^7.45.4",
+ "lucide-react": "^0.263.1",
+ "recharts": "^2.8.0",
+ "zod": "^3.22.2"
+}
+```
+
+### 🏗️ New Architecture Pattern: Service-Aligned Hub-and-Spoke
+
+Based on the comprehensive backend microservices, organize the frontend around service domains:
+
+```
+🏠 Central Dashboard
+├── 🔐 Authentication Hub
+│ ├── Login/Register
+│ ├── Profile Management
+│ └── Password Reset
+├── 🥖 Operations Hub
+│ ├── 📦 Inventory (Products, Stock, Alerts)
+│ ├── 🏭 Production (Batches, Schedule, Equipment)
+│ ├── 📋 Orders (Management, Status, Tracking)
+│ ├── 🛍️ Procurement (Plans, Suppliers, Requirements)
+│ └── 📍 POS (Integration, Sync, Transactions)
+├── 📊 Analytics Hub
+│ ├── 🔮 Forecasting (Predictions, Models, Validation)
+│ ├── 📈 Sales Analytics (Trends, Reports, Revenue)
+│ ├── 📉 Performance KPIs (Metrics, Dashboards)
+│ └── 🤖 AI Insights (Classifications, Recommendations)
+├── 🌍 Data Hub
+│ ├── Weather Integration (AEMET API)
+│ ├── Traffic Patterns
+│ ├── External Events
+│ └── Market Data
+├── 📧 Communications Hub
+│ ├── Notifications (Email, WhatsApp)
+│ ├── Alert Management
+│ └── Preference Settings
+└── ⚙️ Settings Hub
+ ├── 👥 Team Management (Members, Roles, Invites)
+ ├── 🏢 Bakery Configuration (Business Model, Settings)
+ ├── 🎯 Training (ML Models, Status, History)
+ └── 🔧 System Settings (API Keys, Integrations)
+```
+
+### 🧱 Component Architecture to Build
+
+```typescript
+// Design System Foundation
+components/ui/
+├── Button/ # Primary, secondary, ghost variants
+├── Input/ # Text, email, number with validation
+├── Card/ # Elevation levels, padding variants
+├── Modal/ # Sizes, overlay, animations
+├── Table/ # Sorting, filtering, pagination
+├── Form/ # React Hook Form + Zod integration
+├── Badge/ # Status indicators, color variants
+├── Avatar/ # User profile images, initials
+└── index.ts # Export all UI components
+
+// Layout Components
+components/layout/
+├── AppShell/ # Main application container
+├── Header/ # Top navigation, user menu
+├── Sidebar/ # Main navigation, collapsible
+├── Breadcrumbs/ # Navigation trail
+├── PageHeader/ # Page title, actions
+└── Footer/ # Copyright, links
+
+// Business Components
+components/domain/
+├── auth/ # Login, register, password reset
+├── dashboard/ # KPI cards, charts, activity feed
+├── inventory/ # Product cards, stock alerts
+├── production/ # Batch cards, equipment status
+├── sales/ # Transaction lists, POS integration
+├── forecasting/ # Prediction charts, confidence indicators
+└── onboarding/ # Step-by-step setup wizard
+
+// Shared Components
+components/shared/
+├── LoadingSpinner/ # Various loading states
+├── EmptyState/ # No data illustrations
+├── ErrorBoundary/ # Error handling with retry
+├── ConfirmDialog/ # Confirmation modals
+└── DataTable/ # Reusable table with features
+```
+
+## 🎨 2024-2025 Design System to Implement
+
+### Visual Identity (Bakery Theme)
+```css
+/* Color Palette */
+:root {
+ /* Primary: Warm Orange (artisan bread) */
+ --orange-50: #fff7ed;
+ --orange-500: #f97316;
+ --orange-900: #9a3412;
+
+ /* Secondary: Golden Wheat */
+ --amber-50: #fffbeb;
+ --amber-500: #f59e0b;
+ --amber-900: #92400e;
+
+ /* Success: Fresh Green */
+ --green-500: #22c55e;
+
+ /* Warning: Alert Orange */
+ --red-500: #ef4444;
+
+ /* Neutral: Modern Grays */
+ --slate-50: #f8fafc;
+ --slate-500: #64748b;
+ --slate-900: #0f172a;
+}
+
+/* Typography System */
+.text-display { font-size: 2.25rem; font-weight: 700; } /* Page headlines */
+.text-heading { font-size: 1.875rem; font-weight: 600; } /* Section titles */
+.text-title { font-size: 1.5rem; font-weight: 600; } /* Card titles */
+.text-body { font-size: 1rem; font-weight: 400; } /* Body text */
+.text-caption { font-size: 0.875rem; font-weight: 400; } /* Captions */
+
+/* Spacing System (8px grid) */
+.space-xs { margin: 0.5rem; } /* 8px */
+.space-sm { margin: 1rem; } /* 16px */
+.space-md { margin: 1.5rem; } /* 24px */
+.space-lg { margin: 2rem; } /* 32px */
+.space-xl { margin: 3rem; } /* 48px */
+```
+
+### Modern UI Patterns to Implement
+
+1. **Glassmorphism Cards**:
+```css
+.glass-card {
+ background: rgba(255, 255, 255, 0.25);
+ backdrop-filter: blur(10px);
+ border: 1px solid rgba(255, 255, 255, 0.18);
+ border-radius: 12px;
+}
+```
+
+2. **Neumorphism Buttons**:
+```css
+.neu-button {
+ background: linear-gradient(145deg, #f0f0f0, #cacaca);
+ box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff;
+}
+```
+
+3. **Micro-Interactions**:
+- Hover state transitions (200ms ease)
+- Loading button animations
+- Form field focus effects
+- Success/error state changes
+
+## 📱 Mobile-First Design Requirements
+
+### Responsive Breakpoints
+```css
+/* Mobile First Approach */
+.container {
+ padding: 1rem; /* Mobile: 16px */
+}
+
+@media (min-width: 640px) { /* Tablet */
+ .container { padding: 1.5rem; }
+}
+
+@media (min-width: 1024px) { /* Desktop */
+ .container { padding: 2rem; }
+}
+
+@media (min-width: 1280px) { /* Large Desktop */
+ .container { max-width: 1200px; margin: 0 auto; }
+}
+```
+
+### Touch-Optimized Interactions
+- **44px minimum touch targets** for all buttons/links
+- **Swipe gestures** for mobile navigation
+- **Pull-to-refresh** on data lists
+- **Long press** for context menus
+- **Double-tap** for quick actions
+
+### Progressive Web App Features
+```typescript
+// Implement PWA capabilities:
+- Service Worker for offline functionality
+- Web App Manifest for home screen install
+- Push notifications for alerts
+- Background sync for data updates
+- Cache strategies for fast loading
+```
+
+## 🤖 AI-Enhanced UX Features
+
+### Intelligent Interface Elements
+1. **Smart Search**: Predictive suggestions based on context
+2. **AI Recommendations**: Contextual tips and insights
+3. **Auto-Complete**: Forms pre-filled with AI predictions
+4. **Anomaly Highlights**: Visual indicators for unusual data
+5. **Voice Commands**: "Show today's production plan"
+
+### Conversational Interface Components
+```typescript
+// AI Assistant Components to Build:
+ // Floating chat widget
+ // Predictive search bar
+ // Smart help tooltips
+ // Speech-to-text input
+ // AI-generated insights
+```
+
+## 🔄 State Management Architecture
+
+### Modern State Pattern with Zustand
+```typescript
+// Replace Redux with focused Zustand stores:
+
+// Authentication State
+interface AuthState {
+ user: User | null;
+ isAuthenticated: boolean;
+ login: (credentials: LoginRequest) => Promise;
+ logout: () => void;
+}
+
+// UI State
+interface UIState {
+ sidebarOpen: boolean;
+ theme: 'light' | 'dark';
+ currentModal: string | null;
+ toggleSidebar: () => void;
+ setTheme: (theme: 'light' | 'dark') => void;
+}
+
+// Business State
+interface BakeryState {
+ currentTenant: Tenant | null;
+ businessModel: 'individual' | 'central';
+ notifications: Notification[];
+ setTenant: (tenant: Tenant) => void;
+}
+```
+
+### API Integration with React Query
+```typescript
+// Replace custom hooks with React Query:
+import { useQuery, useMutation } from '@tanstack/react-query';
+
+export const useInventory = (tenantId: string) => {
+ return useQuery({
+ queryKey: ['inventory', tenantId],
+ queryFn: () => apiClient.get(`/tenants/${tenantId}/inventory/products`),
+ staleTime: 5 * 60 * 1000, // 5 minutes
+ cacheTime: 10 * 60 * 1000, // 10 minutes
+ });
+};
+
+export const useCreateProduct = () => {
+ return useMutation({
+ mutationFn: (product: CreateProductRequest) =>
+ apiClient.post('/inventory/products', product),
+ onSuccess: () => {
+ queryClient.invalidateQueries(['inventory']);
+ },
+ });
+};
+```
+
+## 🛣️ Routing & Navigation Architecture
+
+### URL-Based Navigation with Service-Aligned Structure
+```typescript
+// Clean, RESTful URL structure aligned with backend services:
+const routes = [
+ // Public Routes
+ '/', # Landing page
+ '/auth/login', # Authentication
+ '/auth/register',
+
+ // Protected Application Routes
+ '/app', # Redirect to dashboard
+ '/app/dashboard', # Cross-service dashboard
+
+ // Operations Hub (aligned with backend services)
+ '/app/operations', # Operations hub overview
+ '/app/operations/inventory', # Inventory service frontend
+ '/app/operations/inventory/products', # Product catalog
+ '/app/operations/inventory/stock', # Stock management
+ '/app/operations/inventory/alerts', # Low stock alerts
+ '/app/operations/production', # Production service frontend
+ '/app/operations/production/batches', # Production batches
+ '/app/operations/production/schedule', # Production scheduling
+ '/app/operations/orders', # Orders service frontend
+ '/app/operations/orders/management', # Order management
+ '/app/operations/orders/tracking', # Order status tracking
+ '/app/operations/procurement', # Procurement service frontend
+ '/app/operations/procurement/plans', # Procurement planning
+ '/app/operations/procurement/suppliers', # Supplier management
+ '/app/operations/pos', # POS service frontend
+ '/app/operations/pos/integration', # POS configuration
+ '/app/operations/pos/transactions', # Transaction sync
+
+ // Analytics Hub (forecasting + sales analytics)
+ '/app/analytics', # Analytics hub overview
+ '/app/analytics/forecasting', # Forecasting service frontend
+ '/app/analytics/forecasting/predictions', # AI demand predictions
+ '/app/analytics/forecasting/models', # ML model management
+ '/app/analytics/sales', # Sales analytics
+ '/app/analytics/sales/trends', # Sales trend analysis
+ '/app/analytics/sales/reports', # Sales reporting
+ '/app/analytics/performance', # Performance KPIs
+
+ // Data Hub (external data integration)
+ '/app/data', # Data hub overview
+ '/app/data/weather', # Weather integration (AEMET)
+ '/app/data/traffic', # Traffic patterns
+ '/app/data/events', # External events
+
+ // Communications Hub
+ '/app/communications', # Communications overview
+ '/app/communications/notifications', # Notification management
+ '/app/communications/alerts', # Alert configuration
+ '/app/communications/preferences', # Communication preferences
+
+ // Settings Hub
+ '/app/settings', # Settings hub overview
+ '/app/settings/team', # Tenant service frontend
+ '/app/settings/team/members', # Team member management
+ '/app/settings/team/roles', # Role management
+ '/app/settings/bakery', # Bakery configuration
+ '/app/settings/training', # Training service frontend
+ '/app/settings/training/models', # ML model settings
+ '/app/settings/training/history', # Training history
+ '/app/settings/system', # System configuration
+
+ // Onboarding (special workflow)
+ '/app/onboarding', # AI-powered onboarding
+ '/app/onboarding/upload', # Sales data upload
+ '/app/onboarding/analysis', # AI analysis phase
+ '/app/onboarding/review', # Review AI suggestions
+ '/app/onboarding/setup', # Complete setup
+];
+
+// Context-aware navigation based on backend service responses
+
+
+
+```
+
+### Context-Aware Navigation
+```typescript
+// Smart navigation based on user context:
+- Bakery type (individual vs central) determines available features
+- User role (owner, manager, staff) controls access levels
+- Business model affects workflow organization
+- Mobile vs desktop changes navigation patterns
+```
+
+## 📊 Data Visualization & Analytics
+
+### Chart Components with Recharts
+```typescript
+// Standardized chart components:
+
+
+
+
+
+```
+
+### Dashboard Widget System
+```typescript
+// Modular dashboard widgets:
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+## 🔐 Authentication & Authorization
+
+### Modern Auth Flow
+```typescript
+// JWT-based authentication with refresh tokens:
+interface AuthContext {
+ user: User | null;
+ isLoading: boolean;
+ login: (email: string, password: string) => Promise;
+ register: (data: RegisterRequest) => Promise;
+ logout: () => void;
+ refreshToken: () => Promise;
+}
+
+// Route protection:
+
+
+
+```
+
+### Permission-Based UI
+```typescript
+// Components adapt based on user permissions:
+
+ Add Product
+
+```
+
+## 🧪 Form Management & Validation
+
+### React Hook Form + Zod Integration
+```typescript
+// Type-safe forms with validation:
+const productSchema = z.object({
+ name: z.string().min(1, 'Product name required'),
+ category: z.enum(['bread', 'pastry', 'ingredient']),
+ price: z.number().positive('Price must be positive'),
+});
+
+const CreateProductForm = () => {
+ const form = useForm({
+ resolver: zodResolver(productSchema),
+ defaultValues: { name: '', category: 'bread', price: 0 }
+ });
+
+ return (
+
+ );
+};
+```
+
+## 📁 New Project Structure to Build
+
+```
+frontend/
+├── public/
+│ ├── icons/ # PWA icons
+│ ├── manifest.json # PWA manifest
+│ └── sw.js # Service worker
+├── src/
+│ ├── components/ # Component library
+│ │ ├── ui/ # Design system components
+│ │ │ ├── Button/
+│ │ │ │ ├── Button.tsx
+│ │ │ │ ├── Button.stories.tsx
+│ │ │ │ ├── Button.test.tsx
+│ │ │ │ └── index.ts
+│ │ │ ├── Input/
+│ │ │ ├── Card/
+│ │ │ └── index.ts # Export all UI components
+│ │ ├── layout/ # Layout components
+│ │ │ ├── AppShell/
+│ │ │ ├── Header/
+│ │ │ ├── Sidebar/
+│ │ │ └── index.ts
+│ │ ├── domain/ # Business components
+│ │ │ ├── auth/
+│ │ │ ├── dashboard/
+│ │ │ ├── inventory/
+│ │ │ ├── production/
+│ │ │ └── index.ts
+│ │ └── shared/ # Shared utilities
+│ │ ├── LoadingSpinner/
+│ │ ├── ErrorBoundary/
+│ │ └── index.ts
+│ ├── pages/ # Page components
+│ │ ├── LandingPage/
+│ │ ├── LoginPage/
+│ │ ├── DashboardPage/
+│ │ ├── InventoryPage/
+│ │ └── index.ts
+│ ├── hooks/ # Custom hooks
+│ │ ├── api/ # API hooks (React Query)
+│ │ │ ├── useAuth.ts
+│ │ │ ├── useInventory.ts
+│ │ │ └── index.ts
+│ │ ├── ui/ # UI state hooks
+│ │ │ ├── useModal.ts
+│ │ │ ├── useTheme.ts
+│ │ │ └── index.ts
+│ │ └── business/ # Business logic hooks
+│ │ ├── useBakeryWorkflow.ts
+│ │ └── index.ts
+│ ├── stores/ # State management
+│ │ ├── auth.store.ts # Zustand stores
+│ │ ├── ui.store.ts
+│ │ ├── bakery.store.ts
+│ │ └── index.ts
+│ ├── services/ # API services
+│ │ ├── api.client.ts # HTTP client setup
+│ │ ├── auth.service.ts # Authentication API
+│ │ ├── inventory.service.ts # Inventory API
+│ │ └── index.ts
+│ ├── router/ # Routing configuration
+│ │ ├── AppRouter.tsx # Main router setup
+│ │ ├── ProtectedRoute.tsx # Route guards
+│ │ └── index.ts
+│ ├── styles/ # Global styles
+│ │ ├── globals.css # Global CSS
+│ │ ├── components.css # Component styles
+│ │ └── animations.css # Animation utilities
+│ ├── utils/ # Helper functions
+│ │ ├── format.ts # Data formatting
+│ │ ├── validation.ts # Validation helpers
+│ │ ├── constants.ts # App constants
+│ │ └── index.ts
+│ ├── types/ # TypeScript definitions
+│ │ ├── auth.types.ts
+│ │ ├── inventory.types.ts
+│ │ ├── api.types.ts
+│ │ └── index.ts
+│ ├── App.tsx # Root component
+│ ├── main.tsx # Application entry
+│ └── vite-env.d.ts # Vite types
+├── package.json
+├── vite.config.ts
+├── tailwind.config.js
+├── tsconfig.json
+└── README.md
+```
+
+## 🎯 Implementation Phases
+
+### Phase 1: Foundation (Week 1-2)
+1. **Setup new project structure** with proper folder organization
+2. **Build design system** - UI components with Storybook
+3. **Implement authentication flow** - login, register, JWT handling
+4. **Create routing structure** - React Router with protected routes
+5. **Setup state management** - Zustand stores for auth, UI, business logic
+
+### Phase 2: Core Features (Week 3-4)
+1. **Dashboard implementation** - KPI cards, charts, activity feed
+2. **Inventory management** - product lists, stock levels, alerts
+3. **Production planning** - batch scheduling, recipe management
+4. **Sales tracking** - transaction history, POS integration
+5. **Mobile optimization** - responsive design, touch interactions
+
+### Phase 3: Advanced Features (Week 5-6)
+1. **Analytics hub** - forecasting charts, trend analysis, reports
+2. **AI integration** - smart suggestions, predictive features
+3. **PWA capabilities** - offline mode, push notifications
+4. **Performance optimization** - lazy loading, caching strategies
+5. **Accessibility audit** - WCAG 2.2 compliance, keyboard navigation
+
+### Phase 4: Polish & Launch (Week 7-8)
+1. **UI/UX refinement** - micro-interactions, animations
+2. **Testing implementation** - unit tests, integration tests
+3. **Documentation** - component docs, user guides
+4. **Performance monitoring** - analytics, error tracking
+5. **Production deployment** - CI/CD pipeline, monitoring
+
+## 🔧 Development Guidelines
+
+### Code Quality Standards
+```typescript
+// TypeScript strict mode with no 'any'
+interface StrictTyping {
+ user: User; // ✅ Proper typing
+ data: unknown; // ✅ Use unknown for uncertain types
+ error: ApiError; // ✅ Define error types
+ // avoid: data: any; // ❌ Never use 'any'
+}
+
+// Component composition patterns:
+const ProductCard = ({ product, onEdit, onDelete }: ProductCardProps) => {
+ return (
+
+
+ {product.name}
+
+
+
+
+
+
+
+
+
+ );
+};
+```
+
+### Performance Best Practices
+```typescript
+// Lazy loading for code splitting:
+const AnalyticsPage = lazy(() => import('./pages/AnalyticsPage'));
+
+// Memoization for expensive calculations:
+const expensiveCalculation = useMemo(() => {
+ return processLargeDataset(data);
+}, [data]);
+
+// Debounced search:
+const debouncedSearch = useDebounce(searchTerm, 300);
+```
+
+### Accessibility Requirements
+```typescript
+// WCAG 2.2 AA compliance:
+
+
+// Focus management:
+const DialogComponent = () => {
+ const focusRef = useRef(null);
+
+ useEffect(() => {
+ focusRef.current?.focus();
+ }, []);
+
+ return (
+
+ );
+};
+```
+
+## 📋 Specific Business Requirements
+
+### Bakery-Specific Features
+1. **Dual Business Model Support**:
+ - Individual bakeries: On-site production, direct sales
+ - Central production: Mass production, multi-outlet distribution
+
+2. **Production Scheduling**:
+ - Early morning workflows (4:00-6:00 AM)
+ - Recipe scaling and ingredient calculations
+ - Equipment scheduling and capacity planning
+
+3. **Inventory Management**:
+ - Ingredient tracking with expiration dates
+ - Finished product inventory with shelf-life
+ - Automated reorder points and supplier integration
+
+4. **AI-Powered Forecasting**:
+ - Weather impact on demand (rainy days = less foot traffic)
+ - Seasonal patterns (holidays, local events)
+ - Product-specific demand predictions
+
+### Madrid Market Context
+- **Language**: Spanish UI with proper localization
+- **Currency**: Euro (€) formatting throughout
+- **Business Hours**: Early morning operations (4AM start)
+- **Mobile Usage**: 60%+ of interactions on mobile devices
+- **Internet**: Sometimes unreliable, need offline capabilities
+
+## 🚀 Success Metrics & Goals
+
+### Performance Targets
+- **Page Load Time**: < 2 seconds on 3G connections
+- **Bundle Size**: < 500KB initial bundle (gzipped)
+- **Lighthouse Score**: 90+ for Performance, Accessibility, Best Practices
+- **Mobile Score**: 95+ for mobile usability
+
+### User Experience Goals
+- **Onboarding Time**: 5-10 minutes (down from 2-3 hours)
+- **Task Completion**: 90%+ success rate for core workflows
+- **User Satisfaction**: NPS score > 8.5
+- **Mobile Adoption**: 60%+ of daily active users on mobile
+
+### Business Impact
+- **User Retention**: 80%+ monthly active users
+- **Feature Adoption**: 90%+ using core features within 30 days
+- **Support Tickets**: 50% reduction in UI/UX related issues
+- **Conversion Rate**: 85%+ trial-to-paid conversion
+
+## 🎨 Design Inspiration & Research
+
+### Modern SaaS Platforms to Study
+1. **Linear** - Clean design, excellent navigation, keyboard shortcuts
+2. **Notion** - Flexible layouts, contextual menus, progressive disclosure
+3. **Figma** - Collaborative features, real-time updates, intuitive interactions
+4. **Stripe Dashboard** - Data visualization, clear hierarchy, mobile-first
+5. **Vercel** - Performance focus, minimalist design, status indicators
+
+### AI-Enhanced Interfaces
+1. **Claude.ai** - Conversational interface, contextual help, smart suggestions
+2. **Cursor** - Predictive features, auto-completion, AI assistance
+3. **GitHub Copilot** - Code suggestions, contextual recommendations
+4. **Replit** - Real-time collaboration, AI-powered development environment
+
+### Mobile-First Enterprise Apps
+1. **Slack Mobile** - Touch-optimized, gesture navigation, offline support
+2. **Asana Mobile** - Task management, quick actions, responsive design
+3. **Trello Mobile** - Card-based interface, drag-and-drop interactions
+
+## 🔍 Research Requirements
+
+Before starting implementation, research:
+
+### Latest Design Trends (2024-2025)
+- **Micro-interactions**: Subtle animations that provide feedback
+- **Glassmorphism**: Translucent elements with backdrop blur
+- **Neumorphism**: Soft, inset shadow effects for buttons/cards
+- **Dark Mode**: System-preference aware theming
+- **Accessibility First**: WCAG 2.2 compliance from the start
+
+### AI-UX Patterns
+- **Predictive Interface**: UI that anticipates user needs
+- **Contextual Help**: Smart assistance based on current task
+- **Progressive Enhancement**: AI features that enhance without blocking
+- **Explainable AI**: Transparent AI decision-making
+
+### Performance Optimization
+- **Core Web Vitals**: LCP, FID, CLS optimization
+- **Progressive Loading**: Critical path prioritization
+- **Edge Computing**: CDN optimization for global performance
+- **Bundle Analysis**: Tree-shaking and code-splitting strategies
+
+## ⚡ Quick Start Checklist
+
+### ✅ Week 1: Foundation
+- [ ] Create new project structure with proper organization
+- [ ] Setup Tailwind CSS with custom design system
+- [ ] Implement authentication flow (login/register/logout)
+- [ ] Create basic layout components (Header, Sidebar, AppShell)
+- [ ] Setup React Router with protected routes
+
+### ✅ Week 2: Core Components
+- [ ] Build complete UI component library with Storybook
+- [ ] Implement Zustand stores for state management
+- [ ] Create API service layer with React Query
+- [ ] Build dashboard with KPI cards and charts
+- [ ] Add mobile-responsive navigation
+
+### ✅ Week 3: Business Features
+- [ ] Inventory management (products, stock levels, alerts)
+- [ ] Production planning (batches, recipes, scheduling)
+- [ ] Sales tracking (transactions, POS integration)
+- [ ] Forecasting (charts, predictions, confidence intervals)
+- [ ] Basic analytics and reporting
+
+### ✅ Week 4: UX Enhancement
+- [ ] AI-powered features (smart search, recommendations)
+- [ ] Progressive Web App (offline, notifications, install)
+- [ ] Accessibility audit and improvements (WCAG 2.2 AA)
+- [ ] Performance optimization (lazy loading, caching)
+- [ ] Cross-device testing and optimization
+
+## 🎯 Final Outcome
+
+Transform the Bakery AI Platform into:
+
+✅ **Modern, Professional Interface** - Following 2024-2025 design standards with glassmorphism, micro-interactions, and AI-enhanced UX
+
+✅ **Clean, Maintainable Codebase** - TypeScript-first, component-driven architecture with clear separation of concerns
+
+✅ **Mobile-First Experience** - Touch-optimized, responsive design with PWA capabilities and offline functionality
+
+✅ **AI-Enhanced Workflows** - Predictive features, smart suggestions, and contextual help that guide users intelligently
+
+✅ **High-Performance Application** - Fast loading, efficient rendering, and optimized for Madrid bakery operations
+
+✅ **Accessible Platform** - WCAG 2.2 AA compliant with support for all users and assistive technologies
+
+Remember: You're building for Madrid bakery owners who start work at 4:00 AM and need reliable, fast, intuitive tools to manage their businesses profitably. Every design and technical decision should prioritize their real operational needs over technical elegance.
\ No newline at end of file
diff --git a/frontend/index.html b/frontend/index.html
index 66ef8f1b..e7d78224 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,170 +1,27 @@
-
-
-
-
-
- PanIA - Inteligencia Artificial para tu Panadería en Madrid
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
🥖
-
Cargando PanIA...
-
-