# FRONTEND INVENTORY - MiChangarrito
# Version: 1.0.0
# Ultima actualizacion: 2026-01-07
# Sistema: SIMCO - NEXUS v4.0

metadata:
  proyecto: "michangarrito"
  componente: "frontend-web"
  framework: "React 18"
  bundler: "Vite"
  styling: "TailwindCSS"
  puerto: 3140
  estado: "100% paginas completadas"

# ============================================================================
# RESUMEN
# ============================================================================

resumen:
  total_paginas: 7
  total_componentes: 15
  total_contexts: 3
  arquitectura: "SPA"
  state_management: "Context API + React Query"
  router: "React Router v6"

# ============================================================================
# ESTRUCTURA DE CARPETAS
# ============================================================================

estructura:
  root: "apps/web"
  src: "apps/web/src"
  componentes: "apps/web/src/components"
  paginas: "apps/web/src/pages"
  contexts: "apps/web/src/contexts"
  lib: "apps/web/src/lib"
  assets: "apps/web/src/assets"

# ============================================================================
# PAGINAS
# ============================================================================

paginas:
  - nombre: "Login"
    ruta: "/login"
    archivo: "pages/Login.tsx"
    descripcion: "Inicio de sesion"
    protegida: false
    estado: completado

  - nombre: "Dashboard"
    ruta: "/"
    archivo: "pages/Dashboard.tsx"
    descripcion: "Panel principal con metricas"
    protegida: true
    estado: completado

  - nombre: "POS"
    ruta: "/pos"
    archivo: "pages/POS.tsx"
    descripcion: "Punto de venta"
    protegida: true
    estado: completado

  - nombre: "Products"
    ruta: "/products"
    archivo: "pages/Products.tsx"
    descripcion: "Gestion de productos"
    protegida: true
    estado: completado

  - nombre: "Customers"
    ruta: "/customers"
    archivo: "pages/Customers.tsx"
    descripcion: "Gestion de clientes"
    protegida: true
    estado: completado

  - nombre: "Sales"
    ruta: "/sales"
    archivo: "pages/Sales.tsx"
    descripcion: "Historial de ventas"
    protegida: true
    estado: completado

  - nombre: "Settings"
    ruta: "/settings"
    archivo: "pages/Settings.tsx"
    descripcion: "Configuracion del negocio"
    protegida: true
    estado: completado

# ============================================================================
# COMPONENTES
# ============================================================================

componentes:
  layout:
    - nombre: "Layout"
      archivo: "components/Layout.tsx"
      descripcion: "Layout principal con sidebar"

    - nombre: "Sidebar"
      archivo: "components/Sidebar.tsx"
      descripcion: "Menu lateral de navegacion"

    - nombre: "Header"
      archivo: "components/Header.tsx"
      descripcion: "Header con usuario y notificaciones"

  pos:
    - nombre: "ProductGrid"
      archivo: "components/pos/ProductGrid.tsx"
      descripcion: "Grid de productos para venta"

    - nombre: "Cart"
      archivo: "components/pos/Cart.tsx"
      descripcion: "Carrito de compra"

    - nombre: "PaymentModal"
      archivo: "components/pos/PaymentModal.tsx"
      descripcion: "Modal de pago"

    - nombre: "ReceiptModal"
      archivo: "components/pos/ReceiptModal.tsx"
      descripcion: "Ticket de venta"

  products:
    - nombre: "ProductList"
      archivo: "components/products/ProductList.tsx"
      descripcion: "Tabla de productos"

    - nombre: "ProductForm"
      archivo: "components/products/ProductForm.tsx"
      descripcion: "Formulario crear/editar producto"

    - nombre: "CategorySelect"
      archivo: "components/products/CategorySelect.tsx"
      descripcion: "Selector de categoria"

  customers:
    - nombre: "CustomerList"
      archivo: "components/customers/CustomerList.tsx"
      descripcion: "Tabla de clientes"

    - nombre: "CustomerForm"
      archivo: "components/customers/CustomerForm.tsx"
      descripcion: "Formulario de cliente"

    - nombre: "CreditHistory"
      archivo: "components/customers/CreditHistory.tsx"
      descripcion: "Historial de fiados"

  common:
    - nombre: "Button"
      archivo: "components/ui/Button.tsx"
      descripcion: "Boton reutilizable"

    - nombre: "Input"
      archivo: "components/ui/Input.tsx"
      descripcion: "Input con validacion"

    - nombre: "Modal"
      archivo: "components/ui/Modal.tsx"
      descripcion: "Modal base"

    - nombre: "Table"
      archivo: "components/ui/Table.tsx"
      descripcion: "Tabla con paginacion"

    - nombre: "Card"
      archivo: "components/ui/Card.tsx"
      descripcion: "Card container"

# ============================================================================
# CONTEXTS
# ============================================================================

contexts:
  - nombre: "AuthContext"
    archivo: "contexts/AuthContext.tsx"
    descripcion: "Estado de autenticacion"
    provee:
      - user
      - token
      - login()
      - logout()
      - isAuthenticated

  - nombre: "CartContext"
    archivo: "contexts/CartContext.tsx"
    descripcion: "Estado del carrito POS"
    provee:
      - items
      - addItem()
      - removeItem()
      - updateQuantity()
      - clear()
      - total

  - nombre: "TenantContext"
    archivo: "contexts/TenantContext.tsx"
    descripcion: "Configuracion del tenant"
    provee:
      - tenant
      - settings
      - updateSettings()

# ============================================================================
# LIB / UTILIDADES
# ============================================================================

lib:
  - nombre: "api"
    archivo: "lib/api.ts"
    descripcion: "Cliente HTTP con Axios"

  - nombre: "auth"
    archivo: "lib/auth.ts"
    descripcion: "Funciones de autenticacion"

  - nombre: "format"
    archivo: "lib/format.ts"
    descripcion: "Formateo de moneda, fechas"

  - nombre: "storage"
    archivo: "lib/storage.ts"
    descripcion: "LocalStorage helpers"

# ============================================================================
# RUTAS
# ============================================================================

rutas:
  publicas:
    - /login

  protegidas:
    - /
    - /pos
    - /products
    - /customers
    - /sales
    - /settings

  por_rol:
    owner:
      - todas
    employee:
      - /
      - /pos
      - /sales
    viewer:
      - /
      - /sales

# ============================================================================
# COMANDOS
# ============================================================================

comandos:
  dev: "npm run dev"
  build: "npm run build"
  preview: "npm run preview"
  lint: "npm run lint"

# ============================================================================
# DEPENDENCIAS PRINCIPALES
# ============================================================================

dependencias:
  react: "^18.x"
  react-router-dom: "^6.x"
  axios: "^1.x"
  react-query: "^5.x"
  tailwindcss: "^3.x"
  lucide-react: "^0.x"
  react-hook-form: "^7.x"
  zod: "^3.x"

# ============================================================================
# NOTAS
# ============================================================================

notas:
  - "Responsive design para tablet y desktop"
  - "Dark mode pendiente"
  - "PWA pendiente"
  - "Offline mode pendiente"