np-dms/lcbp3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

690326:2139 Fixing Refactor ADR-019 Naming convention uuid #07
CI / CD Pipeline / build (push) Successful in 10m6s
Details
CI / CD Pipeline / deploy (push) Failing after 1m16s
Details

Browse Source
This commit is contained in:
admin
2026-03-26 21:39:03 +07:00
parent 25ea2fcd0f
commit 0a1ea1e4bb
8 changed files with 190 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/app/(admin)/admin/doc-control/contracts/page.tsx
+11 -10
View File
@@ -38,7 +38,7 @@ import { SearchContractDto, CreateContractDto, UpdateContractDto } from '@/types
import { AxiosError } from 'axios';
interface _Project {
id: string; // ADR-019: uuid exposed as 'id'
id: string; // ADR-019: uuid exposed as 'id' (string)
projectCode: string;
projectName: string;
}
@@ -86,7 +86,7 @@ const useProjectsList = () => {
export default function ContractsPage() {
const [search, setSearch] = useState('');
const { data: contracts, isLoading } = useContracts({ search: search || undefined });
const { data: projects } = useProjectsList();
const { data: projects } = useProjectsList() as { data: _Project[] | undefined };
const queryClient = useQueryClient();
@@ -286,7 +286,9 @@ export default function ContractsPage() {
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
<DialogContent>
<DialogHeader>
<DialogTitle>{editingUuid ? 'Edit Contract' : 'New Contract'}</DialogTitle>
<DialogTitle>
{editingUuid ? `Edit Contract: ${watch('contractCode') || '...'}` : 'New Contract'}
</DialogTitle>
</DialogHeader>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
<div className="space-y-2">
@@ -296,13 +298,12 @@ export default function ContractsPage() {
<SelectValue placeholder="Select Project" />
</SelectTrigger>
<SelectContent>
{(projects as { id?: number; uuid?: string; projectCode: string; projectName: string }[])?.map(
(p) => (
<SelectItem key={p.uuid || p.id} value={String(p.id || p.uuid)}>
{p.projectCode} - {p.projectName}
</SelectItem>
)
)}
{projects?.map((p) => (
// ADR-019: Project exposes UUID as 'id' (string)
<SelectItem key={p.id} value={p.id}>
{p.projectCode} - {p.projectName}
</SelectItem>
))}
</SelectContent>
</Select>
{errors.projectId && <p className="text-sm text-red-500">{errors.projectId.message}</p>}
frontend/app/(admin)/admin/doc-control/numbering/page.tsx
+5 -5
View File
@@ -16,10 +16,10 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
import { useProjects, useCorrespondenceTypes, useContracts, useDisciplines } from '@/hooks/use-master-data';
interface ProjectItem {
id: number | string;
publicId?: string; // ADR-019: exposed as 'id' in API responses
publicId: string; // ADR-019: UUID from API
projectName: string;
projectCode: string;
isActive?: boolean;
}
import { ManualOverrideForm } from '@/components/numbering/manual-override-form';
@@ -38,7 +38,7 @@ export default function NumberingPage() {
useEffect(() => {
if (projects.length > 0 && !selectedProjectId) {
const first = projects[0] as ProjectItem;
setSelectedProjectId(String(first.publicId ?? first.id));
setSelectedProjectId(String(first.publicId));
}
}, [projects, selectedProjectId]);
@@ -48,7 +48,7 @@ export default function NumberingPage() {
const [isTesting, setIsTesting] = useState(false);
const [testTemplate, setTestTemplate] = useState<NumberingTemplate | null>(null);
const selectedProject = (projects as ProjectItem[]).find((p) => String(p.publicId ?? p.id) === selectedProjectId);
const selectedProject = (projects as ProjectItem[]).find((p) => String(p.publicId) === selectedProjectId);
const selectedProjectName = selectedProject?.projectName || 'Unknown Project';
// Master Data
@@ -116,7 +116,7 @@ export default function NumberingPage() {
</SelectTrigger>
<SelectContent>
{(projects as ProjectItem[]).map((project) => (
<SelectItem key={String(project.publicId ?? project.id)} value={String(project.publicId ?? project.id)}>
<SelectItem key={project.publicId} value={project.publicId}>
{project.projectCode} - {project.projectName}
</SelectItem>
))}
frontend/app/(admin)/admin/doc-control/projects/page.tsx
+3 -4
View File
@@ -33,8 +33,7 @@ import {
import { Skeleton } from '@/components/ui/skeleton';
interface Project {
uuid: string;
id?: number; // Excluded from API responses (ADR-019)
id: string; // ADR-019: uuid exposed as 'id'
projectCode: string;
projectName: string;
isActive: boolean;
@@ -72,7 +71,7 @@ export default function ProjectsPage() {
const confirmDelete = () => {
if (projectToDelete) {
deleteProject.mutate(projectToDelete.uuid, {
deleteProject.mutate(projectToDelete.id, {
onSuccess: () => {
setDeleteDialogOpen(false);
setProjectToDelete(null);
@@ -146,7 +145,7 @@ export default function ProjectsPage() {
];
const handleEdit = (project: Project) => {
setEditingUuid(project.uuid);
setEditingUuid(project.id);
reset({
projectCode: project.projectCode,
projectName: project.projectName,
frontend/app/(admin)/admin/doc-control/reference/disciplines/page.tsx
+16 -4
View File
@@ -21,6 +21,18 @@ export default function DisciplinesPage() {
header: 'Code',
cell: ({ row }) => <span className="font-mono font-bold">{row.getValue('disciplineCode')}</span>,
},
{
accessorKey: 'contract',
header: 'Contract',
cell: ({ row }) => {
const contract = row.original.contract;
return contract ? (
<span className="text-sm">{contract.contractName} ({contract.contractCode})</span>
) : (
<span className="text-muted-foreground text-sm">-</span>
);
},
},
{
accessorKey: 'codeNameTh',
header: 'Name (TH)',
@@ -44,9 +56,9 @@ export default function DisciplinesPage() {
},
];
const contractOptions = contracts.map((c: { id: number; contractCode: string; contractName: string }) => ({
const contractOptions = contracts.map((c: { id?: number; publicId?: string; contractCode: string; contractName: string }) => ({
label: `${c.contractName} (${c.contractCode})`,
value: String(c.id),
value: String(c.publicId ?? c.id ?? ''),
}));
return (
@@ -86,8 +98,8 @@ export default function DisciplinesPage() {
</SelectTrigger>
<SelectContent>
<SelectItem value="all">All Contracts</SelectItem>
{contracts.map((c: { id: number; contractCode: string; contractName: string }) => (
<SelectItem key={c.id} value={String(c.id)}>
{contracts.map((c: { id?: number; publicId?: string; contractCode: string; contractName: string }) => (
<SelectItem key={String(c.publicId ?? c.id ?? '')} value={String(c.publicId ?? c.id ?? '')}>
{c.contractName} ({c.contractCode})
</SelectItem>
))}
frontend/app/(admin)/admin/doc-control/reference/rfa-types/page.tsx
+20 -8
View File
@@ -21,6 +21,18 @@ export default function RfaTypesPage() {
header: 'Code',
cell: ({ row }) => <span className="font-mono font-bold">{row.getValue('typeCode')}</span>,
},
{
accessorKey: 'contract',
header: 'Contract',
cell: ({ row }) => {
const contract = row.original.contract;
return contract ? (
<span className="text-sm">{contract.contractName} ({contract.contractCode})</span>
) : (
<span className="text-muted-foreground text-sm">-</span>
);
},
},
{
accessorKey: 'typeNameTh',
header: 'Name (TH)',
@@ -48,9 +60,9 @@ export default function RfaTypesPage() {
},
];
const contractOptions = contracts.map((c: { id: number | string; contract_name?: string; contract_code?: string; contractName?: string; contractCode?: string }) => ({
const contractOptions = contracts.map((c: { id?: number; publicId?: string; contract_name?: string; contract_code?: string; contractName?: string; contractCode?: string }) => ({
label: `${c.contractName || c.contract_name} (${c.contractCode || c.contract_code})`,
value: String(c.id),
value: String(c.publicId ?? c.id ?? ''),
}));
return (
@@ -87,8 +99,8 @@ export default function RfaTypesPage() {
</SelectTrigger>
<SelectContent>
<SelectItem value="all">All Contracts</SelectItem>
{contracts.map((c: { id: number | string; contract_name?: string; contract_code?: string; contractName?: string; contractCode?: string }) => (
<SelectItem key={c.id} value={String(c.id)}>
{contracts.map((c: { id?: number; publicId?: string; contract_name?: string; contract_code?: string; contractName?: string; contractCode?: string }) => (
<SelectItem key={String(c.publicId ?? c.id ?? '')} value={String(c.publicId ?? c.id ?? '')}>
{c.contractName || c.contract_name} ({c.contractCode || c.contract_code})
</SelectItem>
))}
@@ -104,11 +116,11 @@ export default function RfaTypesPage() {
required: true,
options: contractOptions,
},
{ name: 'type_code', label: 'Code', type: 'text', required: true },
{ name: 'type_name_th', label: 'Name (TH)', type: 'text', required: true },
{ name: 'type_name_en', label: 'Name (EN)', type: 'text' },
{ name: 'typeCode', label: 'Code', type: 'text', required: true },
{ name: 'typeNameTh', label: 'Name (TH)', type: 'text', required: true },
{ name: 'typeNameEn', label: 'Name (EN)', type: 'text' },
{ name: 'remark', label: 'Remark', type: 'textarea' },
{ name: 'is_active', label: 'Active', type: 'checkbox' },
{ name: 'isActive', label: 'Active', type: 'checkbox' },
]}
/>
</div>
frontend/app/(admin)/admin/doc-control/reference/tags/page.tsx
+3 -3
View File
@@ -16,9 +16,9 @@ export default function TagsPage() {
const projectOptions = [
{ label: 'Global (All Projects)', value: '__none__' },
...(projectsData || []).map((p: { id: number | string; projectName?: string; projectCode?: string }) => ({
label: (p.projectName || p.projectCode || `Project ${p.id}`) as string,
value: String(p.id), // p.id = UUID string via serialization
...(projectsData || []).map((p: { id?: number; publicId?: string; projectName?: string; projectCode?: string }) => ({
label: (p.projectName || p.projectCode || `Project ${p.publicId || p.id}`) as string,
value: String(p.publicId ?? p.id ?? ''), // ADR-019: publicId is the UUID exposed in API
})),
];
frontend/types/master-data.ts
+14
View File
@@ -16,6 +16,13 @@ export interface Discipline {
codeNameEn: string;
codeNameTh?: string;
isActive: boolean;
contract?: {
id?: number;
publicId?: string;
contractCode: string;
contractName: string;
};
contractId?: number | string;
}
export interface RfaType {
@@ -25,6 +32,13 @@ export interface RfaType {
typeNameEn?: string;
remark?: string;
isActive: boolean;
contract?: {
id?: number;
publicId?: string;
contractCode: string;
contractName: string;
};
contractId?: number | string;
}
export interface Tag {
specs/05-Engineering-Guidelines/05-03-frontend-guidelines.md
+118
View File
@@ -606,6 +606,124 @@ test.describe('Correspondence Workflow', () => {
---
## 🆔 ADR-019 UUID Handling (Critical)
**Backend ใช้ Hybrid ID Strategy:** INT PK (internal) + UUID (public API)
- **Database:** `id` = INT AI (Primary Key), `uuid` = UUID (MariaDB native type)
- **Backend Entity:** `id` = INT (@Exclude), `publicId` = UUID (exposed as `id` in API via @Expose)
- **API Response:** ส่ง `id` (ซึ่งจริงๆ คือ `publicId` UUID string) ไม่มี INT id
### ⚠️ Common Pitfalls (และวิธีแก้)
#### 1. ใช้ `.id` กับ Entity ที่ควรใช้ `.publicId`
```tsx
// ❌ WRONG - entity.id อาจเป็น undefined หรือ INT ที่ถูก @Exclude
contracts.map((c) => <SelectItem key={c.id} value={String(c.id)}>)
// ✅ CORRECT - ใช้ publicId (UUID) ที่ API ส่งมา
contracts.map((c) => <SelectItem key={c.publicId} value={c.publicId}>)
// หรือ fallback สำหรับ backward compatibility
contracts.map((c) => <SelectItem key={c.publicId ?? c.id} value={String(c.publicId ?? c.id)}>)
```
#### 2. parseInt() บน UUID string
```tsx
// ❌ WRONG - parseInt บน UUID จะได้ค่า garbage
const id = parseInt(projectId); // "0195..." → 19 (wrong!)
// ✅ CORRECT - ส่ง UUID string ตรงๆ ไป backend
const id = projectId; // "019505a1-7c3e-7000-8000-abc123def456"
// ✅ CORRECT - ถ้าต้องการ INT ให้ backend resolve เองผ่าน UuidResolver
// Backend DTO รับ `projectUuid: string` แล้ว resolve เป็น `projectId: number` เอง
```
#### 3. Field Name Mismatch (snake_case vs camelCase)
```tsx
// ❌ WRONG - ใช้ชื่อ field ไม่ตรงกับ TypeScript interface
fields={[{ name: 'type_code', label: 'Code' }]}
// interface มี typeCode (camelCase) แต่ form ส่ง type_code (snake_case)
// ✅ CORRECT - ใช้ชื่อ field ตรงกับ interface
fields={[{ name: 'typeCode', label: 'Code' }]}
```
#### 4. Contract/Project Select ไม่มีข้อมูล
```tsx
// ❌ WRONG - สมมติว่า API ส่ง { id: number }
const options = contracts.map((c) => ({ value: String(c.id), label: c.contractName }))
// ✅ CORRECT - API ส่ง { publicId: string } ตาม ADR-019
const options = contracts.map((c) => ({
value: String(c.publicId ?? c.id ?? ''), // fallback รองรับทั้ง 2 กรณี
label: c.contractName
}))
```
### 📝 Pattern: Contract/Project Select Options
```typescript
// types/master-data.ts - Entity interfaces
export interface Contract {
id?: number; // Internal INT (อาจถูก @Exclude)
publicId?: string; // UUID ที่ API ส่ง (ต้องใช้ตัวนี้)
contractCode: string;
contractName: string;
}
// page.tsx - Select options
const contractOptions = contracts.map((c) => ({
label: `${c.contractName} (${c.contractCode})`,
value: String(c.publicId ?? c.id ?? ''), // ADR-019: publicId เป็น UUID
}));
// GenericCrudTable fields
fields={[
{
name: 'contractId',
label: 'Contract',
type: 'select',
required: true,
options: contractOptions, // ใช้ UUID string เป็น value
},
]}
```
### 📝 Pattern: Relation Column in Table
```typescript
// เพิ่ม column แสดง relation (Contract/Project)
const columns: ColumnDef<Discipline>[] = [
{
accessorKey: 'disciplineCode',
header: 'Code',
},
{
accessorKey: 'contract', // relation object จาก backend
header: 'Contract',
cell: ({ row }) => {
const contract = row.original.contract;
return contract ? (
<span>{contract.contractName} ({contract.contractCode})</span>
) : (
<span className="text-muted-foreground">-</span>
);
},
},
// ... other columns
];
```
### ✅ Checklist ก่อน Commit
- [ ] ใช้ `publicId ?? id` pattern สำหรับ entity identifiers
- [ ] ไม่ใช้ `parseInt()` บน UUID values
- [ ] Field names ตรงกับ TypeScript interfaces (camelCase)
- [ ] Select options ใช้ UUID string เป็น value
- [ ] แสดง relation columns (Contract/Project) ในตาราง
---
## 🚫 Anti-Patterns (สิ่งที่ห้ามทำ)
1. ❌ **ห้ามใช้ Inline Styles** - ใช้ Tailwind เท่านั้น