Danh sách tất cả các Hook dùng chung - shared hooks

Dưới đây là danh sách tất cả các Hook dùng chung (shared hooks) trong mã nguồn của hệ thống (nằm chủ yếu tại src/shared/hooks):

1. Các Hook dành cho UI / Tương tác:

useGlobalModal: Quản lý trạng thái đóng/mở và dữ liệu của các modal toàn cục.
useConfirm: Hook dùng để hiển thị các hộp thoại xác nhận (confirm dialog).
useTheme: Quản lý chế độ giao diện Sáng/Tối (Light/Dark mode) của ứng dụng.
useMediaQuery: Kiểm tra kích thước màn hình hiện tại (hỗ trợ responsive/mobile).
useKeyboardNavigation: Xử lý điều hướng bằng bàn phím trong các component.
useEditableTableKeyboard: Hỗ trợ thao tác bằng bàn phím (di chuyển, chỉnh sửa) trên các bảng dữ liệu dạng nhập liệu.
useStepper: Quản lý các bước (Step) trong các form nhiều bước (Wizard form).

2. Các Hook quản lý Dữ liệu hệ thống / Tùy chọn (Options/Select):

useFormOptions: Fetch hoặc quản lý các giá trị tùy chọn (Options) chung cho các Form.
useColorOptions: Lấy danh sách các thuộc tính Màu sắc.
useEmployeeOptions: Lấy danh sách nhân viên để cho vào dropdown/combobox.
useFabricCatalogOptions: Lấy danh sách danh mục vải.
useYarnCatalogOptions: Lấy danh sách danh mục sợi.
usePaymentAccountOptions: Lấy danh sách các tài khoản ngân hàng / phương thức thanh toán.
useShippingRateOptions: Lấy thông tin về giá cước vận chuyển.
useActiveCustomers: Lấy danh sách các khách hàng đang hoạt động.

3. Các Hook Hệ thống / Xác thực:

useAuth: Quản lý thông tin xác thực, token và session của người dùng hiện tại (đăng nhập, đăng xuất).
useTenant: Quản lý tenant_id phục vụ cho mô hình multi-tenant (dữ liệu theo cơ sở/chi nhánh).
useCompanySettings: Lấy thông tin cài đặt hệ thống của công ty/cơ sở (tên, logo, địa chỉ, v.v.).

4. Hook Tiện ích:

useAutoSave: Tự động lưu bản nháp (Draft) của các Form phức tạp vào LocalStorage/Database để tránh bị mất dữ liệu.

#ReactJS #ReactHooks #WebDevelopment #Coding #Frontend #CleanCode #ERP

Danh sách những cụm Hook cốt lõi còn lại mà hệ thống đang sử dụng

Bên cạnh các Shared Hook về giao diện, theo cấu trúc kiến trúc (Architecture) của dự án thì phần lớn Business Logic và Use-cases đã được tách ra thành các custom hook riêng lẻ. Dưới đây là danh sách những cụm Hook cốt lõi còn lại mà hệ thống đang sử dụng:

1. Application Layer Hooks (Tầng Business Logic & Data Fetching)

Đây là các Hook đóng vai trò như các Use-case thực thi tác vụ API, Caching, Validation cho từng nghiệp vụ cụ thể (src/application/*):

Quản lý Kho (Inventory): useInventory, useRawFabric, useFinishedFabric, useYarnReceipts, useRawFabricExport, useFinishedFabricExport.
Quản lý Đơn hàng (Orders): useOrders, useOrderProgress, useOrderKanban, useCreateOrderV2, useReserveRolls.
Sản xuất (Production): useWorkOrders, useDyeingOrders, useWeavingInvoices, useWorkOrderLogic, useBom.
Hợp đồng (Contracts): useContracts, useContractForm, useContractDetail, useContractTemplates.
Báo giá (Quotations): useQuotations, useConvertToOrder.
CRM (Khách hàng & Nhà cung cấp): useCustomers, useSuppliers, useEmployees.
Giao hàng (Shipments): useShipments, useShippingRates, useDriverPortal.
Thanh toán & Công nợ (Payments): usePayments, useAccounts, useCashFlow, useExpenses.
Báo cáo & Thống kê (Analytics): useDashboardData, useReports.
Cài đặt hệ thống (Settings): useCompanySettings, useColors, useFabricCatalog, useYarnCatalog.

2. CRM Portal Hooks (Dành riêng cho Khách hàng truy cập)

Các hook phục vụ cho Portal của khách hàng (src/application/crm/portal/*):

usePortalOrders, usePortalDebt, usePortalPayments, usePortalQuotations, usePortalShipments, usePortalOrderRequest.
useNotifications (Nằm ở src/features/customer-portal/...)

3. Integration & System Cache (Đồng bộ Realtime)

Nằm tại src/integration/* chuyên xử lý logic đồng bộ hóa:

useRealtimeInvalidationBridge: Lắng nghe thay đổi dữ liệu từ Supabase Realtime và cập nhật UI ngay lập tức.
useQueryInvalidationBridge: Xử lý xóa và làm mới cache của React Query.

4. Domain / Kiến trúc lõi

useDomainEvent: Hook xử lý phát / lắng nghe các sự kiện (event) ở tầng Domain (src/domain/events).

5. Shared Component Logic (Logic giao diện phức tạp)

Một số component dùng chung rất lớn có tách logic ra thành Hook lẻ tại src/shared/components/*:

useDebtAging: Xử lý tính toán công nợ theo tuổi nợ (30/60/90 ngày).
useRollMatrixLogic: Xử lý phân bổ logic chọn từng cây vải (ma trận cuộn vải).
useTapToMove: Logic di chuyển và chạm dành cho Ops UI (UI điều hành kho).

#ReactJS #ReactHooks #WebDevelopment #Coding #Frontend #CleanCode #SoftwareArchitecture #ERPBase