Types
types/README.md
Types
Definiciones de tipos TypeScript centralizadas por dominio. Actúan como Single Source of Truth para los contratos entre hooks, componentes y servicios.
Descripción General
Los tipos se declaran como interface en archivos index.ts por dominio. Ningún componente ni hook declara tipos localmente — toda interfaz reside aquí y se importa desde @/types/<dominio>.
Los tipos de entidades de Firestore (schemas) se infieren de Zod en @/schemas/ y no se duplican aquí. En types/ solo viven los tipos propios de la capa de presentación: view models, props de componentes, contextos de diálogos y contratos de hooks.
Estructura de Archivos
types/
├── auth/
│ └── index.ts # Tipos del módulo de autenticación
├── categories/
│ └── index.ts # Tipos del módulo de categorías (ver detalle abajo)
├── icons/
│ └── index.ts # IIconOption — forma de cada opción de ícono
├── materials/
│ └── index.ts # Tipos del módulo de materiales (ver detalle abajo)
└── users/
└── index.ts # Tipos del módulo de usuarios
🗂️ types/categories
El archivo más completo del proyecto. Agrupa todos los contratos del módulo de categorías.
View Models
| Tipo | Descripción |
|---|---|
ISubcategoryView | { id, name, materialsCount } |
ICategoryView | { id, name, subcategories: ISubcategoryView[] } |
IGroupCatalogView | { id, title, description, iconName, categories: ICategoryView[] } |
Contextos de Dialog
| Tipo | Descripción |
|---|---|
ICreateCategoryCtx | Datos necesarios para crear una categoría: groupId, groupTitle |
ICreateSubcategoryCtx | Extiende con categoryId, categoryTitle |
ISubcategoryOption | { id, name } — opción en el selector de subcategoría destino |
IDeleteSubcategoryCtx | Datos para el flow de eliminación con materiales asignados |
Props de Componentes
Todos los componentes de components/categories/ tienen su interfaz de props aquí:
ICardSubcategoryProps, ICollapsableCategoryProps, IDialogCreateCategoryProps, IDialogCreateGroupProps, IDialogCreateSubcategoryProps, IDialogDeleteSubcategoryProps, IAlertDialogDeleteCategoryProps, IAlertDialogDeleteGroupProps, IAlertDialogConfirmDeleteProps, IDialogEditGroupProps, IDialogEditNameProps, IFormSlotProps
Retorno del Hook de Página
IUseCategoriesPageReturn — contrato completo de useCategoriesPage().
Params y Returns de Hooks por Componente
| Params | Returns |
|---|---|
IUseCardSubcategoryParams | IUseCardSubcategoryReturn |
IUseCollapsableCategoryParams | IUseCollapsableCategoryReturn |
IUseDialogCreateGroupParams | IUseDialogCreateGroupReturn |
IUseDialogCreateCategoryParams | IUseDialogCreateCategoryReturn |
IUseDialogCreateSubcategoryParams | IUseDialogCreateSubcategoryReturn |
IUseDialogDeleteSubcategoryParams | IUseDialogDeleteSubcategoryReturn |
🔑 types/icons
export interface IIconOption {
key: string; // Identificador slug (ej. 'brick-wall')
label: string; // Texto legible (ej. 'Mampostería')
lucideName: string; // Nombre del componente en lucide-react
Icon: LucideIcon; // Componente React listo para renderizar
}
Usado en: CONSTRUCTION_ICON_OPTIONS, DialogCreateGroup, DialogEditGroup, CollapsableCategory, FormSlot.
📦 types/materials
View Models
| Tipo | Descripción |
|---|---|
IMaterialRow | Modelo de vista para filas de tabla: { id, name, categorization, groupId, categoryId, subcategoryId, usageCount } |
Filtros
| Tipo | Descripción |
|---|---|
IMaterialFilters | Filtros opcionales para consultas: { groupId?, categoryId?, subcategoryId? } |
Props de Componentes
| Tipo | Descripción |
|---|---|
IMaterialFiltersBarProps | Props para MaterialFiltersBar: { categoryCatalog, filters, onFiltersChange } |
Payloads de Operaciones
| Tipo | Descripción |
|---|---|
ICreateMaterialData | Payload para crear un material: los 7 campos (name, subcategoryId, categoryId, groupId, groupName, categoryName, subcategoryName) |
IEditMaterialData | Mismos 7 campos que ICreateMaterialData (para edición) |
Contextos de Dialog
| Tipo | Descripción |
|---|---|
IEditMaterialCtx | { id, initialData: IEditMaterialData } — contexto para editar |
IDeleteMaterialCtx | { id, name } — contexto para confirmar eliminación |
Params y Returns de Hooks
| Tipo | Descripción |
|---|---|
IUseDialogCreateMaterialParams | { categoryCatalog, onOpenChange, onConfirm? } |
IUseDialogEditMaterialParams | { open, categoryCatalog, initialData?, onOpenChange, onConfirm? } |
IUseMaterialCatalogPageReturn | Contrato completo del hook de página: incluye materials, filters, setFilters, filteredMaterials, isMutating, handlers CRUD, etc. |
Convención para Agregar Tipos
- Identificar el dominio (
categories,materials,users, etc.). - Abrir
types/<dominio>/index.tsy agregar la interfaz al final. - Nombrar con prefijo
I+ PascalCase. - Si se necesita en un componente, exportarlo también desde
components/<dominio>/index.ts. - Nunca duplicar tipos que ya existen en
@/schemas/— usarz.infer<typeof Schema>.