Enforces API vs Domain type separation for Nazim frontend. Use when creating new resources, hooks, mappers, or components. Covers snake_case API types, camelCase domain types, mapper layer, and component usage.
All modules MUST follow the API/Domain type separation pattern for maintainability and type safety.
frontend/src/
├── types/api/{resource}.ts # snake_case, matches Laravel API
├── types/domain/{resource}.ts # camelCase, nested UI model
├── mappers/{resource}Mapper.ts # API ↔ Domain conversion
├── hooks/use{Resource}.tsx # Returns domain models
└── pages/{Resource}.tsx # Uses domain types only
types/api/{resource}.ts)string for dates (ISO strings)Resource, ResourceInsert, ResourceUpdateexport interface Student {
id: string;
organization_id: string;
school_id: string | null;
admission_no: string;
full_name: string;
created_at: string;
updated_at: string;
}
export interface StudentInsert { /* ... */ }
export type StudentUpdate = Partial<StudentInsert>;
types/domain/{resource}.ts)Date objects for dates (not strings)export interface Student {
id: string;
organizationId: string;
schoolId: string | null;
admissionNumber: string;
fullName: string;
address: Address;
guardians: Guardian[];
createdAt: Date;
updatedAt: Date;
}
mappers/{resource}Mapper.ts)mapResourceApiToDomain(api: Api.Student): StudentmapResourceDomainToInsert(domain: Partial<Student>): StudentInsertmapResourceDomainToUpdate(domain: Partial<Student>): StudentUpdateimport type * as StudentApi from '@/types/api/student';
import type { Student } from '@/types/domain/student';
export function mapStudentApiToDomain(api: StudentApi.Student): Student { /* ... */ }
export function mapStudentDomainToInsert(domain: Partial<Student>): StudentApi.StudentInsert { /* ... */ }
import type * as ResourceApi from '@/types/api/resource'import type { Resource } from '@/types/domain/resource'mapResourceApiToDomainmapResourceDomainToInsertexport type { Resource } from '@/types/domain/resource'student.fullName, student.address.cityDate objects for datestypes/api/{resource}.ts (snake_case, match Laravel)types/domain/{resource}.ts (camelCase, nested)mappers/{resource}Mapper.ts (bidirectional conversion)