bakery-admin/bakery-ia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify the onboardinf flow components 4

Browse Source
This commit is contained in:
Urtzi Alfaro
2025-09-08 22:28:26 +02:00
parent a8f6e9d593
commit ddb75f8e55
3 changed files with 101 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
frontend/src/components/domain/onboarding/steps/MLTrainingStep.tsx
View File

@@ -1,4 +1,4 @@
import React, { useState, useCallback } from 'react';
import React, { useState, useCallback, useEffect } from 'react';
import { Button } from '../../../ui/Button';
import { useCurrentTenant } from '../../../../stores/tenant.store';
import { useCreateTrainingJob, useTrainingWebSocket } from '../../../../api/hooks/training';
@@ -20,9 +20,7 @@ interface TrainingProgress {
}
export const MLTrainingStep: React.FC<MLTrainingStepProps> = ({
onPrevious,
onComplete,
isFirstStep
onComplete
}) => {
const [trainingProgress, setTrainingProgress] = useState<TrainingProgress | null>(null);
const [isTraining, setIsTraining] = useState(false);
@@ -87,6 +85,14 @@ export const MLTrainingStep: React.FC<MLTrainingStepProps> = ({
} : undefined
);
// Auto-trigger training when component mounts
useEffect(() => {
if (currentTenant?.id && !isTraining && !trainingProgress && !error) {
console.log('🚀 Auto-starting ML training for tenant:', currentTenant.id);
handleStartTraining();
}
}, [currentTenant?.id]); // Only run when tenant is available
const handleStartTraining = async () => {
if (!currentTenant?.id) {
setError('No se encontró información del tenant');
@@ -140,7 +146,7 @@ export const MLTrainingStep: React.FC<MLTrainingStepProps> = ({
<div className="space-y-6">
<div className="text-center">
<p className="text-[var(--text-secondary)] mb-6">
Ahora entrenaremos tu modelo de inteligencia artificial utilizando los datos de ventas
Perfecto! Ahora entrenaremos automáticamente tu modelo de inteligencia artificial utilizando los datos de ventas
e inventario que has proporcionado. Este proceso puede tomar varios minutos.
</p>
</div>
@@ -151,14 +157,12 @@ export const MLTrainingStep: React.FC<MLTrainingStepProps> = ({
{!isTraining && !trainingProgress && (
<div className="space-y-4">
<div className="mx-auto w-16 h-16 bg-[var(--color-primary)]/10 rounded-full flex items-center justify-center">
<svg className="w-8 h-8 text-[var(--color-primary)]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
</svg>
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-[var(--color-primary)]"></div>
</div>
<div>
<h3 className="text-lg font-semibold mb-2">Listo para Entrenar</h3>
<h3 className="text-lg font-semibold mb-2">Iniciando Entrenamiento Automático</h3>
<p className="text-[var(--text-secondary)] text-sm">
Tu modelo está listo para ser entrenado con los datos proporcionados.
Preparando el entrenamiento de tu modelo con los datos proporcionados...
</p>
</div>
</div>
@@ -246,36 +250,7 @@ export const MLTrainingStep: React.FC<MLTrainingStepProps> = ({
</div>
)}
{/* Actions */}
<div className="flex justify-between">
<Button
variant="outline"
onClick={onPrevious}
disabled={isFirstStep || isTraining}
>
Anterior
</Button>
{!isTraining && !trainingProgress && (
<Button
onClick={handleStartTraining}
size="lg"
disabled={!currentTenant?.id}
>
Iniciar Entrenamiento
</Button>
)}
{trainingProgress?.stage === 'completed' && (
<Button
onClick={() => onComplete()}
size="lg"
variant="success"
>
Continuar
</Button>
)}
</div>
{/* Auto-completion when training finishes - no manual buttons needed */}
</div>
);
};