feat: Add toast notifications to all wizards

- Imported showToast utility from react-hot-toast wrapper
- Added success toast after successful API calls in all 7 wizards
- Added error toast on API failures for better user feedback
- Replaced silent errors with user-visible toast notifications

Wizards updated:
- CustomerWizard: Toast on customer creation
- EquipmentWizard: Toast on equipment creation
- QualityTemplateWizard: Toast on template creation
- SupplierWizard: Toast on supplier + price list creation
- RecipeWizard: Toast on recipe creation
- SalesEntryWizard: Toast on sales record creation
- CustomerOrderWizard: Toast on customer + order creation

This completes the toast notification implementation (High Priority item).
Users now get immediate visual feedback on success/failure instead of
relying on console.log or error state alone.
This commit is contained in:
Claude
2025-11-09 21:22:41 +00:00
parent c3a580905f
commit 9adc9725fd
8 changed files with 418 additions and 8 deletions

View File

@@ -15,6 +15,7 @@ import {
import { useTenant } from '../../../../stores/tenant.store';
import OrdersService from '../../../../api/services/orders';
import { inventoryService } from '../../../../api/services/inventory';
import { showToast } from '../../../../utils/toast';
import {
CustomerCreate,
CustomerType,
@@ -116,11 +117,14 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange,
};
const createdCustomer = await OrdersService.createCustomer(customerData);
showToast.success('Cliente creado exitosamente');
onDataChange({ ...data, customer: createdCustomer, isNewCustomer: true });
onNext();
} catch (err: any) {
console.error('Error creating customer:', err);
setError(err.response?.data?.detail || 'Error al crear el cliente');
const errorMessage = err.response?.data?.detail || 'Error al crear el cliente';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setCreatingCustomer(false);
}
@@ -633,11 +637,14 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange, on
await OrdersService.createOrder(orderData);
showToast.success('Pedido creado exitosamente');
onDataChange({ ...data, ...deliveryData });
onComplete();
} catch (err: any) {
console.error('Error creating order:', err);
setError(err.response?.data?.detail || 'Error al crear el pedido');
const errorMessage = err.response?.data?.detail || 'Error al crear el pedido';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setLoading(false);
}

View File

@@ -14,6 +14,7 @@ import {
} from 'lucide-react';
import { useTenant } from '../../../../stores/tenant.store';
import OrdersService from '../../../../api/services/orders';
import { showToast } from '../../../../utils/toast';
interface WizardDataProps extends WizardStepProps {
data: Record<string, any>;
@@ -308,11 +309,14 @@ const PreferencesTermsStep: React.FC<WizardDataProps> = ({ data, onDataChange, o
await OrdersService.createCustomer(currentTenant.id, customerData);
showToast.success('Cliente creado exitosamente');
onDataChange({ ...data, ...preferences });
onComplete();
} catch (err: any) {
console.error('Error saving customer:', err);
setError(err.response?.data?.detail || 'Error al guardar el cliente');
const errorMessage = err.response?.data?.detail || 'Error al guardar el cliente';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setLoading(false);
}

View File

@@ -3,6 +3,7 @@ import { WizardStep, WizardStepProps } from '../../../ui/WizardModal/WizardModal
import { Wrench, CheckCircle2, Loader2 } from 'lucide-react';
import { useTenant } from '../../../../stores/tenant.store';
import { equipmentService } from '../../../../api/services/equipment';
import { showToast } from '../../../../utils/toast';
interface WizardDataProps extends WizardStepProps {
data: Record<string, any>;
@@ -48,11 +49,14 @@ const EquipmentDetailsStep: React.FC<WizardDataProps> = ({ data, onDataChange, o
await equipmentService.createEquipment(currentTenant.id, equipmentCreateData);
showToast.success('Equipo creado exitosamente');
onDataChange({ ...data, ...equipmentData });
onComplete();
} catch (err: any) {
console.error('Error creating equipment:', err);
setError(err.response?.data?.detail || 'Error al crear el equipo');
const errorMessage = err.response?.data?.detail || 'Error al crear el equipo';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setLoading(false);
}

View File

@@ -4,6 +4,7 @@ import { ClipboardCheck, CheckCircle2, Loader2 } from 'lucide-react';
import { useTenant } from '../../../../stores/tenant.store';
import { qualityTemplateService } from '../../../../api/services/qualityTemplates';
import { QualityCheckTemplateCreate } from '../../../../api/types/qualityTemplates';
import { showToast } from '../../../../utils/toast';
interface WizardDataProps extends WizardStepProps {
data: Record<string, any>;
@@ -62,11 +63,14 @@ const TemplateInfoStep: React.FC<WizardDataProps> = ({ data, onDataChange, onCom
await qualityTemplateService.createTemplate(currentTenant.id, templateCreateData);
showToast.success('Plantilla de calidad creada exitosamente');
onDataChange({ ...data, ...templateData });
onComplete();
} catch (err: any) {
console.error('Error creating quality template:', err);
setError(err.response?.data?.detail || 'Error al crear la plantilla de calidad');
const errorMessage = err.response?.data?.detail || 'Error al crear la plantilla de calidad';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setLoading(false);
}

View File

@@ -6,6 +6,7 @@ import { recipesService } from '../../../../api/services/recipes';
import { inventoryService } from '../../../../api/services/inventory';
import { IngredientResponse } from '../../../../api/types/inventory';
import { RecipeCreate, RecipeIngredientCreate, MeasurementUnit } from '../../../../api/types/recipes';
import { showToast } from '../../../../utils/toast';
interface WizardDataProps extends WizardStepProps {
data: Record<string, any>;
@@ -259,11 +260,14 @@ const IngredientsStep: React.FC<WizardDataProps> = ({ data, onDataChange, onComp
};
await recipesService.createRecipe(currentTenant.id, recipeData);
showToast.success('Receta creada exitosamente');
onDataChange({ ...data, ingredients: selectedIngredients });
onComplete();
} catch (err: any) {
console.error('Error creating recipe:', err);
setError(err.response?.data?.detail || 'Error al crear la receta');
const errorMessage = err.response?.data?.detail || 'Error al crear la receta';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setSaving(false);
}

View File

@@ -17,6 +17,7 @@ import {
import { useTenant } from '../../../../stores/tenant.store';
import { salesService } from '../../../../api/services/sales';
import { inventoryService } from '../../../../api/services/inventory';
import { showToast } from '../../../../utils/toast';
// ========================================
// STEP 1: Entry Method Selection
@@ -735,10 +736,13 @@ const ReviewStep: React.FC<EntryMethodStepProps> = ({ data, onComplete }) => {
}
}
showToast.success('Registro de ventas guardado exitosamente');
onComplete();
} catch (err: any) {
console.error('Error saving sales data:', err);
setError(err.response?.data?.detail || 'Error al guardar los datos de ventas');
const errorMessage = err.response?.data?.detail || 'Error al guardar los datos de ventas';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setLoading(false);
}

View File

@@ -4,6 +4,7 @@ import { Building2, Package, Euro, CheckCircle2, Phone, Mail, Loader2, AlertCirc
import { useTenant } from '../../../../stores/tenant.store';
import { suppliersService } from '../../../../api/services/suppliers';
import { inventoryService } from '../../../../api/services/inventory';
import { showToast } from '../../../../utils/toast';
interface WizardDataProps extends WizardStepProps {
data: Record<string, any>;
@@ -260,11 +261,14 @@ const ProductsPricingStep: React.FC<WizardDataProps> = ({ data, onDataChange, on
});
}
showToast.success('Proveedor creado exitosamente');
onDataChange({ ...data, products });
onComplete();
} catch (err: any) {
console.error('Error saving supplier:', err);
setError(err.response?.data?.detail || 'Error al guardar el proveedor');
const errorMessage = err.response?.data?.detail || 'Error al guardar el proveedor';
setError(errorMessage);
showToast.error(errorMessage);
} finally {
setSaving(false);
}