🍮 Sweet Control

Sistema web de gestión de costos y producción para negocios de postres fríos. Desarrollado con React + Firebase. Funciona online y offline.

URL de producción: https://sweet-control-cc9ae.web.app

---

📋 ¿Para qué sirve?

Sweet Control permite a pequeños negocios de postres:

• Registrar ingredientes con precios exactos y calcular el costo por gramo
• Crear recetas base escalables — define una vez, produce cualquier cantidad
• Calcular costos y precios de venta con margen de ganancia configurable
• Registrar lotes de producción y analizar pérdidas (merma)
• Ver estadísticas semanales de producción, ventas y ganancias
• Gestionar múltiples usuarios con roles y permisos
• Usar un asistente de IA para generar ideas de recetas

---

🛠️ Stack tecnológico

Tecnología	Uso
React 18 + Vite	Frontend
Tailwind CSS v3	Estilos
Firebase Auth	Autenticación
Firebase Firestore	Base de datos en tiempo real
Firebase Hosting	Deploy gratuito
Recharts	Gráficos del Dashboard
Cloudflare Workers	Proxy para API de IA
Groq API (LLaMA 3.3)	Asistente de recetas con IA
html2canvas + jsPDF	Exportar Dashboard a PDF

---

🗂️ Estructura del proyecto

src/ ├── components/ │ ├── Layout/ │ │ └── Layout.jsx # Sidebar, navbar, barra móvil │ └── UI/ │ ├── AlertaBorrador.jsx # Banner de borrador sin guardar │ ├── AsistenteIA.jsx # Chat con IA para recetas │ ├── Ayuda.jsx # Centro de ayuda flotante │ ├── BotonRol.jsx # Botón con control de permisos │ ├── ConvertidorMedidas.jsx # Convertidor ml/g/tazas │ └── ModalConfirmacion.jsx # Modal reutilizable ├── context/ │ ├── AuthContext.jsx # Autenticación y sesión │ └── TemaContext.jsx # Temas de color por usuario ├── firebase/ │ └── config.js # Configuración Firebase ├── hooks/ │ ├── useActividad.js # Historial de acciones │ ├── useAuth.js # Hook de autenticación │ ├── useBackup.js # Exportar/importar JSON │ ├── useBorrador.js # Borradores en localStorage │ ├── useExportarPDF.js # Exportar a PDF │ ├── useGestionUsuarios.js # Crear/editar usuarios │ ├── useInactividad.js # Cierre por inactividad │ ├── useInsumos.js # CRUD de insumos │ ├── useProduccion.js # CRUD de lotes │ ├── useRecetas.js # CRUD de recetas + escalar │ ├── useUnidades.js # Unidades de medida │ └── useUsuarios.js # Listado de usuarios └── pages/ ├── BackupPanel.jsx # Panel de backup (en Config) ├── Calculadora.jsx # Cálculo de costos y precios ├── Configuracion.jsx # Configuración del sistema ├── Dashboard.jsx # Gráficos y estadísticas ├── DemoPanel.jsx # Datos demo (en Config) ├── Insumos.jsx # Gestión de ingredientes ├── Login.jsx # Pantalla de inicio de sesión ├── MiPerfil.jsx # Perfil y cambio de contraseña ├── Produccion.jsx # Registro de lotes ├── Recetas.jsx # Gestión de recetas └── SeguridadPanel.jsx # Borrado seguro (en Config)

---

🔐 Sistema de usuarios y roles

Rol	Permisos
👑 Admin	Acceso total — usuarios, configuración, backup, seguridad
✏️ Editor	Crear y editar insumos, recetas y lotes. No puede eliminar
👁️ Visor	Solo lectura — consulta sin modificar nada

• Login por nombre de usuario (no por correo)
• Sesión expira al cerrar el navegador
• Cierre automático por inactividad de 30 minutos
• Cada usuario tiene su propio tema de color

---

📦 Módulos del sistema

🧂 Insumos

Registro de ingredientes con precio, cantidad y unidad de compra. Calcula automáticamente el precio por gramo. Historial de precios y alertas de insumos con más de 30 días sin actualizar.

🍶 Recetas

Recetas base escalables — se define para X porciones y el sistema escala a cualquier cantidad. Incluye preparación tipo libro de cocina. Simulador de escala con cálculo de costos y margen de ganancia. Asistente IA para generar recetas automáticamente.

🧮 Calculadora

Dos modos de precio:

• Por margen % — define el porcentaje y calcula el precio
• Precio exacto — escribe el precio y calcula el margen real

Registra lotes oficiales o simula sin guardar. Historial de las últimas 5 simulaciones.

📋 Producción

Registro de lotes vinculados a recetas. Análisis de merma — alerta si la pérdida supera el 10%. Filtros por estado: pendientes, venta parcial, todo vendido.

📊 Dashboard

Gráficos semanales de producción, ventas y ganancias. Meta de ventas configurable con barra de progreso. Tabla resumen exportable a PDF.

⚙️ Configuración

• Unidades — medidas personalizadas con equivalencia en gramos
• Usuarios — crear, editar rol, activar/desactivar
• Actividad — historial de las últimas 50 acciones
• Backup — exportar/importar JSON completo
• Demo — datos ficticios para entrenamiento del equipo
• Seguridad — borrado masivo con confirmación de texto

---

🚀 Instalación y desarrollo local

Requisitos

• Node.js v20 o superior
• npm v10 o superior
• Git

Pasos

# 1. Clonar el repositorio
git clone https://github.com/TUUSUARIO/sweet-control.git
cd sweet-control

# 2. Instalar dependencias
npm install

# 3. Configurar Firebase
# Crea src/firebase/config.js con tus credenciales
# (ver sección Configuración de entorno)

# 4. Arrancar en local
npm run dev
# Disponible en http://localhost:5173

Configuración de entorno

Crea src/firebase/config.js con tus datos de Firebase:

import { initializeApp }                        from "firebase/app"
import { getFirestore, initializeFirestore,
         persistentLocalCache }                 from "firebase/firestore"
import { getAuth, browserSessionPersistence,
         setPersistence }                       from "firebase/auth"

const firebaseConfig = {
  apiKey:            "TU_API_KEY",
  authDomain:        "TU_PROYECTO.firebaseapp.com",
  projectId:         "TU_PROYECTO",
  storageBucket:     "TU_PROYECTO.appspot.com",
  messagingSenderId: "TU_SENDER_ID",
  appId:             "TU_APP_ID"
}

const app = initializeApp(firebaseConfig)
export const db   = initializeFirestore(app, {
  cache: persistentLocalCache()
})
export const auth = getAuth(app)
setPersistence(auth, browserSessionPersistence)

Asistente IA (opcional)

El asistente de IA usa Cloudflare Workers como proxy. Para configurarlo crea un Worker en workers.cloudflare.com y actualiza FUNCION_URL en src/components/UI/AsistenteIA.jsx.

---

🌐 Deploy a producción

# 1. Generar build de producción
npm run build

# 2. Publicar en Firebase Hosting
firebase deploy --only hosting

# Para publicar cambios futuros siempre usar ambos comandos

---

🛡️ Seguridad

• Las reglas de Firestore validan roles en el servidor
• La API key de Firebase está restringida a los dominios autorizados
• La API key de IA nunca está en el código — vive en Cloudflare Workers
• El borrado masivo requiere escribir BORRAR TODO y doble confirmación
• Toda acción crítica queda registrada con usuario, fecha y hora

---

🧪 Datos demo

El sistema incluye un modo demo para entrenar al equipo:

1. Ve a Configuración → 🧪 Demo
2. Clic en "Cargar datos demo"
3. Los datos demo se identifican con el sufijo DEMO y el emoji 🧪
4. Se pueden borrar sin afectar los datos reales

---

📁 Colecciones en Firestore

Colección	Descripción
usuarios	Perfiles, roles y preferencias
insumos	Ingredientes con precios
recetas	Recetas base con ingredientes
unidades	Unidades de medida
produccion	Lotes de producción
actividad	Historial de acciones

---

🔮 Roadmap — próximas funciones

• Vitrina pública de productos con galería
• Panel de administración de la vitrina
• Compartir productos en redes sociales
• Notificaciones por Telegram cuando la merma es alta
• App móvil nativa con Capacitor
• Historial de precios con gráfico de tendencia

---

📝 Comandos útiles

npm run dev          # Arrancar servidor local
npm run build        # Generar build de producción
firebase deploy      # Publicar en Firebase Hosting
git add .            # Preparar cambios
git commit -m "msg"  # Guardar versión
git push             # Subir a GitHub

---

👨‍💻 Desarrollo

Proyecto desarrollado en colaboración con Claude (Anthropic). Iniciado en abril de 2026.

---

Sweet Control — Gestiona tus postres, maximiza tus ganancias 🍦