These files describe the data, server logic, API surface, and state around a business model. If you are building products, orders, users, invoices, or reservations, these are the files you will touch most often.
For example, an order feature may keep order status values in order.constant.ts, saved order fields in order.document.ts, payment completion logic in order.service.ts, and page-callable actions in order.signal.ts.
Constants, status values, default options, and shared model types. Example: order status such as pending, paid, shipped.
model.dictionary.ts
shared
Labels, field names, and text keys used by the model. Example: product name, price, stock labels.
Stored data shape, filters, and document model definition. Example: what fields an invoice saves and how it can be queried.
Server-side business logic. Example: create an order, apply a coupon, calculate shipping, or complete payment.
Public actions, slices, endpoints, and internal jobs that pages can call. Example: load order list or request OCR.
Client or model state used across screens. Example: selected filters, cart state, or temporary form state.
UI Files
UI files describe how a model appears on screen. They use PascalCase because they export React components or UI groups.
A business model usually appears in several screen sizes: a small badge, a list row, a detail card, an admin panel, and sometimes a full dashboard section. UI files help you keep those screen pieces close to the model they represent.
Model.View.tsx: Use it for display components, such as ProductCard, OrderSummary, UserProfile, or InvoicePreview.
Model.Unit.tsx: Use it for small reusable units inside the model UI, such as status badges, price rows, or avatar blocks.
Model.Template.tsx: Use it for repeated screen templates or layout patterns, such as a standard admin detail layout.
Model.Util.tsx: Use it for UI-level actions or helper components, such as remove buttons, edit modal triggers, or upload controls.
Model.Zone.tsx: Use it for larger areas, such as admin screens, list/detail zones, tab content, or dashboard sections.