---
# FRONTEND INVENTORY - Template SaaS
# Version: 4.1.0
# Ultima actualizacion: 2026-01-25
# Nota: AUDITORIA DE COHERENCIA - Sincronizado con codigo real
# CORRECCION 2026-01-24: Sales (SAAS-018) y Commissions (SAAS-020) SI implementados en frontend
# ACTUALIZACION 2026-01-25: Rutas Sales/Commissions agregadas al router, authStore completado
# Verificado: 6 paginas Sales, 5 paginas Commissions, APIs y hooks completos

metadata:
  proyecto: "template-saas"
  tipo: "FRONTEND"
  version: "4.1.0"
  updated: "2026-01-25"
  framework: "React 19.0.0 + Vite 6.0.6"
  styling: "Tailwind CSS 3.4.17"
  state: "Zustand 5.0.2"
  forms: "React Hook Form 7.54.2 + Zod"
  testing: "Vitest 4.0.17 + React Testing Library 16.3.1"
  estado: "parcial"
  nota_auditoria: "Inventario sincronizado con codigo real 2026-01-24"

portals:
  - nombre: "user"
    descripcion: "Portal usuario final (Dashboard)"
    ruta: "/"
    estado: "completado"
    pages:
      - Dashboard
      - Profile
      - Settings
      - Notifications
      - Files (Storage)
      - AI Chat
    components:
      - DashboardLayout
      - Sidebar
      - Header
      - NotificationBell
      - FileUploader
      - AIChatWidget

  - nombre: "admin"
    descripcion: "Portal admin de tenant"
    ruta: "/admin"
    estado: "completado"
    pages:
      - AdminDashboard
      - TeamManagement
      - Billing
      - AuditLogs
      - FeatureFlags
      - Webhooks
      - Settings
      - WhatsAppSettings
    components:
      - AdminLayout
      - TeamTable
      - InviteModal
      - BillingCard
      - SubscriptionManager
      - AuditLogViewer
      - WebhookManager
      - WhatsAppTestMessage

  - nombre: "superadmin"
    descripcion: "Portal superadmin"
    ruta: "/superadmin"
    estado: "completado"
    pages:
      - SuperadminDashboard
      - TenantsManagement
      - SystemMetrics
      - PlansManagement
      - GlobalFeatureFlags
    components:
      - SuperadminLayout
      - TenantTable
      - MetricsCharts
      - PlanEditor

  - nombre: "onboarding"
    descripcion: "Wizard de onboarding 4 pasos"
    ruta: "/onboarding"
    estado: "completado"
    pages:
      - OnboardingWizard
    components:
      - CompanyStep
      - InviteStep
      - PlanStep
      - CompleteStep
      - WizardProgress

  - nombre: "auth"
    descripcion: "Autenticacion"
    ruta: "/auth"
    estado: "completado"
    pages:
      - Login
      - Register
      - ForgotPassword
      - ResetPassword
      - VerifyEmail
    components:
      - AuthLayout
      - LoginForm
      - RegisterForm
      - OAuthButtons

  - nombre: "sales"
    descripcion: "Sales Foundation - Leads, Oportunidades, Pipeline"
    ruta: "/dashboard/sales"
    estado: "completado"
    pages:
      - SalesPage
      - LeadsPage
      - LeadDetailPage
      - OpportunitiesPage
      - OpportunityDetailPage
      - ActivitiesPage
    components: []
    nota: "SAAS-018 - CORRECCION: SI implementado. Verificado en src/pages/dashboard/sales/. 2026-01-24"

  - nombre: "commissions"
    descripcion: "Commissions - Esquemas, Entradas, Períodos, Ganancias"
    ruta: "/dashboard/commissions"
    estado: "completado"
    pages:
      - CommissionsPage
      - SchemesPage
      - EntriesPage
      - PeriodsPage
      - MyEarningsPage
    components: []
    nota: "SAAS-020 - CORRECCION: SI implementado. Verificado en src/pages/dashboard/commissions/. 2026-01-24"

shared:
  components:
    ui:
      nota: "NO IMPLEMENTADOS como wrappers - Se usa @headlessui/react y @heroicons/react directamente"
      implementados: []
      planificados:
        - Button
        - Input
        - Select
        - Modal
        - Card
        - Table
        - Tabs
        - Badge
        - Avatar
        - Tooltip
        - Toast
        - Skeleton
        - Spinner
        - Alert
        - Dropdown
    forms:
      nota: "NO IMPLEMENTADOS - Se usa react-hook-form directamente"
      implementados: []
      planificados:
        - FormField
        - FormError
        - FormLabel
        - FormSelect
        - FormTextarea
        - FormCheckbox
    layout:
      nota: "NO IMPLEMENTADOS como componentes separados"
      implementados: []
      planificados:
        - PageHeader
        - PageContent
        - EmptyState
        - ErrorBoundary
        - LoadingState
    # Componentes realmente implementados (por categoria)
    ai:
      - AIChat.tsx
      - AISettings.tsx
      - ChatMessage.tsx
    analytics:
      - MetricCard.tsx
      - TrendChart.tsx
    audit:
      - ActivityTimeline.tsx
      - AuditFilters.tsx
      - AuditLogRow.tsx
      - AuditStatsCard.tsx
    auth:
      - OAuthButtons.tsx
    common:
      - ExportButton.tsx
      - ExportModal.tsx
    feature-flags:
      - FeatureFlagCard.tsx
      - FeatureFlagForm.tsx
      - TenantOverridesPanel.tsx
    notifications:
      - DevicesManager.tsx
      - NotificationBell.tsx
      - NotificationDrawer.tsx
      - NotificationItem.tsx
      - PushPermissionBanner.tsx
    storage:
      - FileItem.tsx
      - FileList.tsx
      - FileUpload.tsx
      - StorageUsageCard.tsx
    webhooks:
      - WebhookCard.tsx
      - WebhookDeliveryList.tsx
      - WebhookForm.tsx
    whatsapp:
      - WhatsAppTestMessage.tsx

  stores:
    nota_auditoria: "6 stores implementados - Auditoria 2026-01-25"
    implementados:
      - nombre: "authStore"
        archivo: "auth.store.ts"
        estado: "completado"
        actions_implementadas:
          - login
          - logout
          - setUser
          - setTokens
          - setLoading
          - refreshTokens
          - updateProfile
        actions_faltantes: []
        usa_persist: true
        storage_key: "auth-storage"
        nota: "COMPLETADO 2026-01-25: refreshTokens y updateProfile implementados"
      - nombre: "uiStore"
        archivo: "ui.store.ts"
        estado: "completado"
        actions_implementadas:
          - toggleSidebar
          - setSidebarOpen
          - setTheme
        usa_persist: true
        storage_key: "ui-storage"
        nota: "NO DOCUMENTADO previamente - agregado en auditoria"
      - nombre: "tenantStore"
        archivo: "tenant.store.ts"
        estado: "completado"
        actions_implementadas:
          - setTenant
          - fetchTenant
          - updateTenant
          - switchTenant
          - clearTenant
          - clearError
        usa_persist: true
        storage_key: "tenant-storage"
        nota: "IMPLEMENTADO 2026-01-25 - Correccion de gaps cross-project"
      - nombre: "subscriptionStore"
        archivo: "subscription.store.ts"
        estado: "completado"
        actions_implementadas:
          - setSubscription
          - fetchSubscription
          - fetchPlans
          - changePlan
          - cancelSubscription
          - reactivateSubscription
          - clearSubscription
          - clearError
        usa_persist: true
        storage_key: "subscription-storage"
        nota: "IMPLEMENTADO 2026-01-25 - Correccion de gaps cross-project"
      - nombre: "notificationStore"
        archivo: "notification.store.ts"
        estado: "completado"
        actions_implementadas:
          - fetchNotifications
          - markAsRead
          - markAllAsRead
          - deleteNotification
          - clearAllNotifications
          - updatePreferences
          - addNotification
          - clearError
        usa_persist: true
        storage_key: "notification-storage"
        nota: "IMPLEMENTADO 2026-01-25 - Correccion de gaps cross-project"
      - nombre: "featureFlagStore"
        archivo: "feature-flag.store.ts"
        estado: "completado"
        actions_implementadas:
          - fetchFlags
          - isEnabled
          - getFlagValue
          - refreshFlags
          - clearFlags
          - clearError
        usa_persist: true
        storage_key: "feature-flag-storage"
        nota: "IMPLEMENTADO 2026-01-25 - Correccion de gaps cross-project"
    no_implementados: []

  services:
    - nombre: "api (axios instance)"
      estado: "completado"
    - nombre: "auth.api"
      estado: "completado"
    - nombre: "tenants.api"
      estado: "completado"
    - nombre: "users.api"
      estado: "completado"
    - nombre: "billing.api"
      estado: "completado"
    - nombre: "notifications.api"
      estado: "completado"
    - nombre: "storage.api"
      estado: "completado"
    - nombre: "ai.api"
      estado: "completado"
    - nombre: "webhooks.api"
      estado: "completado"
    - nombre: "audit.api"
      estado: "completado"
    - nombre: "feature-flags.api"
      estado: "completado"
    - nombre: "plans.api"
      estado: "completado"
    - nombre: "onboarding.api"
      estado: "completado"
    - nombre: "whatsapp.api"
      estado: "completado"
    - nombre: "sales/leads.api"
      estado: "completado"
    - nombre: "sales/opportunities.api"
      estado: "completado"
    - nombre: "sales/activities.api"
      estado: "completado"
    - nombre: "sales/pipeline.api"
      estado: "completado"
    - nombre: "sales/dashboard.api"
      estado: "completado"
    - nombre: "commissions/schemes.api"
      estado: "completado"
    - nombre: "commissions/assignments.api"
      estado: "completado"
    - nombre: "commissions/entries.api"
      estado: "completado"
    - nombre: "commissions/periods.api"
      estado: "completado"
    - nombre: "commissions/dashboard.api"
      estado: "completado"
    - nombre: "portfolio/categories.api"
      estado: "completado"
    - nombre: "portfolio/products.api"
      estado: "completado"

  hooks:
    auth:
      - useAuth
      - useCurrentUser
      - usePermissions
      - useRoles
    tenant:
      - useTenant
      - useTenantSettings
    billing:
      - useSubscription
      - usePlans
      - useInvoices
      - useBillingPortal
    notifications:
      - useNotifications
      - usePushNotifications
      - useDevices
      - useWebSocket
    storage:
      - useFiles
      - useUpload
      - useStorageUsage
    ai:
      - useAI
      - useAIChat
      - useAIUsage
    webhooks:
      - useWebhooks
      - useWebhookDeliveries
    audit:
      - useAuditLogs
      - useActivityLogs
    feature_flags:
      - useFeatureFlag
      - useFeatureFlags
    onboarding:
      - useOnboarding
      - useOnboardingStatus
    whatsapp:
      - useWhatsApp
      - useWhatsAppMessages
    sales:
      - useLeads
      - useLead
      - useCreateLead
      - useUpdateLead
      - useDeleteLead
      - useConvertLead
      - useOpportunities
      - useOpportunity
      - useCreateOpportunity
      - useUpdateOpportunity
      - useMoveOpportunity
      - useMarkAsWon
      - useMarkAsLost
      - usePipeline
      - usePipelineStages
      - useActivities
      - useCreateActivity
      - useCompleteActivity
      - useSalesSummary
      - useForecast
    commissions:
      - useSchemes
      - useActiveSchemes
      - useScheme
      - useCreateScheme
      - useUpdateScheme
      - useDeleteScheme
      - useDuplicateScheme
      - useToggleSchemeActive
      - useAssignments
      - useUserActiveScheme
      - useAssign
      - useDeactivateAssignment
      - useEntries
      - usePendingEntries
      - useCalculateCommission
      - useSimulateCommission
      - useBulkApprove
      - useBulkReject
      - usePeriods
      - useOpenPeriod
      - useCreatePeriod
      - useClosePeriod
      - useReopenPeriod
      - useMarkPeriodPaid
      - useCommissionsSummary
      - useMyEarnings
      - useTopEarners
    portfolio:
      - useCategories
      - useCategory
      - useCategoryTree
      - useCreateCategory
      - useUpdateCategory
      - useDeleteCategory
      - useProducts
      - useProduct
      - useCreateProduct
      - useUpdateProduct
      - useUpdateProductStatus
      - useDuplicateProduct
      - useDeleteProduct
      - useProductVariants
      - useCreateVariant
      - useUpdateVariant
      - useDeleteVariant
      - useProductPrices
      - useCreatePrice
      - useUpdatePrice
      - useDeletePrice
    forms:
      - useForm
      - useFormField
    ui:
      - useModal
      - useToast
      - useDebounce
      - useClickOutside
      - useMediaQuery

resumen:
  nota_auditoria: "ACTUALIZACION 2026-01-25: Portfolio module agregado"
  total_pages: 38
  total_components_implementados: 40
  total_components_documentados_no_impl: 60
  total_stores_implementados: 6
  total_stores_no_implementados: 0
  total_hooks_implementados: 85
  total_hooks_documentados_no_impl: 0
  total_api_services: 26
  total_tests: 0
  tests_pendientes: "Vitest setup pendiente"

planificado:
  pages_actuales: 38
  pages_objetivo: 38
  components_actuales: 40
  components_objetivo: 100
  stores_actuales: 6
  stores_objetivo: 6
  hooks_actuales: 85
  hooks_objetivo: 85
  nota: "SAAS-019 Portfolio: 21 hooks y 2 API services agregados"

gaps_identificados:
  criticos: []
  altos:
    - "Componentes UI base: No existen wrappers (se usa headlessui directo)"
  medios:
    - "Componentes Forms no implementados como wrappers"
  resueltos_2026_01_24:
    - "Portal Sales (SAAS-018): Ahora completado (6 paginas)"
    - "Portal Commissions (SAAS-020): Ahora completado (5 paginas)"
  resueltos_2026_01_25:
    - "authStore completado (refreshTokens y updateProfile implementados)"
    - "Rutas Sales/Commissions agregadas al router (antes existian paginas pero no rutas)"
    - "Documentacion FRONTEND-ROUTING.md creada"
    - "4 Zustand stores implementados: tenantStore, subscriptionStore, notificationStore, featureFlagStore"

dependencias_npm:
  core:
    - "react@18.x"
    - "react-dom@18.x"
    - "react-router-dom@6.x"
    - "vite"
  state:
    - "zustand"
    - "@tanstack/react-query"
  forms:
    - "react-hook-form"
    - "zod"
    - "@hookform/resolvers"
  styling:
    - "tailwindcss"
    - "@headlessui/react"
    - "@heroicons/react"
  utils:
    - "axios"
    - "date-fns"
    - "clsx"
  notifications:
    - "socket.io-client"

ultima_actualizacion: "2026-01-25"
actualizado_por: "Claude Opus 4.5 (SAAS-019 Portfolio)"
historial_cambios:
  - fecha: "2026-01-25"
    tipo: "implementacion"
    descripcion: "SAAS-019 Portfolio: 21 React Query hooks y 2 API services (categories.api.ts, products.api.ts)"
    agente: "Claude Opus 4.5 (SAAS-019 Portfolio)"
  - fecha: "2026-01-25"
    tipo: "implementacion"
    descripcion: "4 Zustand stores implementados (tenant, subscription, notification, feature-flag). Correccion de gaps cross-project. index.ts actualizado."
    agente: "Claude Opus 4.5 (Correccion Gaps Cross-Project)"
  - fecha: "2026-01-25"
    tipo: "alineacion"
    descripcion: "Rutas Sales/Commissions agregadas al router. authStore completado (refreshTokens, updateProfile). Documentacion FRONTEND-ROUTING.md creada."
    agente: "Claude Opus 4.5 (Alineacion Doc-Codigo)"
  - fecha: "2026-01-24"
    tipo: "correccion_critica"
    descripcion: "CORRECCION: Sales (6 paginas) y Commissions (5 paginas) SI implementados. Build de frontend exitoso (2733 modulos). APIs y hooks ya listados correctamente."
    agente: "Claude Opus 4.5 (Validacion de Coherencia)"