vagogedms

Thư viện UI và hạ tầng dùng chung cho các ứng dụng Next.js trong hệ sinh thái VGG DMS: layout, namespace / quyền, bảng lọc, Redux, API client, i18n và tiện ích.

• Repository: gitlab.com/vgg-lib/vagogedms
• Báo lỗi / đề xuất: Issues
• Lịch sử thay đổi: CHANGELOG.md

Yêu cầu

Ứng dụng host cần cài các peer dependencies (phiên bản tham chiếu trong package.json):

React 18, Next.js 14, Ant Design 4, AG Grid 31, Redux, axios, next-auth, cookies-next, i18next / react-i18next, react-use, @ant-design/icons, và next-http-proxy-middleware (khi dùng proxy).

Cài đặt gói này cùng các peer tương thích để tránh lỗi thiếu module hoặc lệch kiểu TypeScript.

Cài đặt

Theo registry nội bộ của team (nếu có, cấu hình qua .npmrc):

yarn add vagogedms
# hoặc
npm install vagogedms

Đóng gói cục bộ để thử trong monorepo:

yarn pack:local

Sau đó cài file .tgz sinh ra vào app consumer.

Sử dụng

Entry chính

Mã nguồn phát triển nằm trong src/; bản build xuất ra thư mục components/ (đây là nội dung được publish trong trường files của npm).

import {
  DMSLayout,
  NamespaceWrapper,
  GridTable,
  Filters,
} from "vagogedms";

Export con (types)

package.json khai báo exports cho một số submodule, ví dụ:

import type { /* ... */ } from "vagogedms/components/types/api";
import type { /* ... */ } from "vagogedms/components/types/user";

Danh sách export đầy đủ nằm trong src/index.ts (sau build sẽ tương ứng trong components/index.js / .d.ts).

Phạm vi gói (tóm tắt)

| Nhóm | Ví dụ | |------|--------| | Layout & điều hướng | DMSLayout, Sidebar, dropdown namespace / ACL, NamespaceSettingContainer | | Wrapper | NamespaceWrapper, AccessLevelWrapper, PermissionWrapper | | Component | GridTable, Filters, Buttons, Inputs, ContentLayout, upload, MFE động | | Dữ liệu | API (_api, namespace, permissions, upload), Redux (address, app-configs, permission, mfe) | | Khác | constants, utils, i18n, handlers (vggDMSHandler, healthCheck), FilterProvider, HOC filter |

Tài liệu chi tiết hơn cho màn namespace có thể xem tại src/layouts/namespaceSetting/README.md.

Phát triển

Scripts

| Lệnh | Mô tả | |------|--------| | yarn build | Xóa components/, chạy tsc, copy styles & assets vào components/ | | yarn clean | Xóa thư mục components/ | | yarn gen-styles | Copy src/styles → components/styles | | yarn gen-assets | Copy src/assets → components/assets | | yarn format | Prettier ghi đè | | yarn format:check | Prettier chỉ kiểm tra |

Hook prepare chạy build sau khi cài dependency (phù hợp khi phụ thuộc qua git hoặc file:).

Môi trường build

Các script mặc định dùng lệnh kiểu Unix (rm, cp). Trên Windows, chạy trong Git Bash, WSL, hoặc CI Linux để build ổn định.

Phiên bản & cấp phép

• Phiên bản hiện tại: xem trường version trong package.json.
• Giấy phép: ISC (theo package.json).