690327:1118 Fixing Refactor ADR-019 Naming convention uuid #14

frontend/app/(admin)/admin/doc-control/contracts/page.tsx

@@ -36,6 +36,7 @@ import {
 import { Skeleton } from '@/components/ui/skeleton';
 import { SearchContractDto, CreateContractDto, UpdateContractDto } from '@/types/dto/contract/contract.dto';
 import { AxiosError } from 'axios';
+import { Contract, getContractPublicId, getProjectPublicId } from '@/types/contract';
 
 interface _Project {
   publicId: string; // ADR-019: uuid exposed as 'publicId' (string)
@@ -43,21 +44,6 @@ interface _Project {
   projectName: string;
 }
 
-interface Contract {
-  id: string; // ADR-019: uuid exposed as 'id'
-  contractCode: string;
-  contractName: string;
-  projectId: number;
-  description?: string;
-  startDate?: string;
-  endDate?: string;
-  project?: {
-    id: string; // ADR-019: project uuid exposed as 'id'
-    projectCode: string;
-    projectName: string;
-  };
-}
-
 const contractSchema = z.object({
   contractCode: z.string().min(1, 'Contract Code is required'),
   contractName: z.string().min(1, 'Contract Name is required'),
@@ -125,6 +111,7 @@ export default function ContractsPage() {
 
   const [dialogOpen, setDialogOpen] = useState(false);
   const [editingUuid, setEditingUuid] = useState<string | null>(null);
+  const [editingContract, setEditingContract] = useState<Contract | null>(null);
 
   // Stats for Delete Dialog
   const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
@@ -137,7 +124,14 @@ export default function ContractsPage() {
 
   const confirmDelete = () => {
     if (contractToDelete) {
-      deleteContract.mutate(contractToDelete.id, {
+      const contractUuid = getContractPublicId(contractToDelete);
+
+      if (!contractUuid) {
+        toast.error('Invalid contract UUID');
+        return;
+      }
+
+      deleteContract.mutate(contractUuid, {
         onSuccess: () => {
           setDeleteDialogOpen(false);
           setContractToDelete(null);
@@ -205,9 +199,11 @@ export default function ContractsPage() {
   ];
 
   const handleEdit = (contract: Contract) => {
-    setEditingUuid(contract.id);
-    // ADR-019: nested project exposes UUID as 'id'
-    const pId = contract.project?.id || '';
+    const contractUuid = getContractPublicId(contract);
+    setEditingUuid(contractUuid || null);
+    setEditingContract(contract); // Store contract for caption display
+    // ADR-019: resolve nested project UUID from canonical field
+    const pId = getProjectPublicId(contract.project);
     reset({
       contractCode: contract.contractCode,
       contractName: contract.contractName,
@@ -221,6 +217,7 @@ export default function ContractsPage() {
 
   const handleCreate = () => {
     setEditingUuid(null);
+    setEditingContract(null); // Clear editing contract
     reset({
       contractCode: '',
       contractName: '',
@@ -287,7 +284,7 @@ export default function ContractsPage() {
         <DialogContent>
           <DialogHeader>
             <DialogTitle>
-              {editingUuid ? `Edit Contract: ${watch('contractCode') || '...'}` : 'New Contract'}
+              {editingUuid ? `Edit Contract: ${editingContract?.contractCode || '...'}` : 'New Contract'}
             </DialogTitle>
           </DialogHeader>
           <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">

frontend/app/(admin)/admin/doc-control/numbering/[id]/edit/page.tsx

@@ -12,6 +12,7 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { useCorrespondenceTypes, useContracts, useDisciplines } from '@/hooks/use-master-data';
 import { useProjects } from '@/hooks/use-projects';
 import { toast } from 'sonner';
+import { Contract, getContractPublicId } from '@/types/contract';
 
 export default function EditTemplatePage() {
   const params = useParams();
@@ -25,9 +26,9 @@ export default function EditTemplatePage() {
   const { data: projects = [] } = useProjects();
   const projectId = template?.projectId || 1;
   const { data: contractsData } = useContracts(projectId);
-  const contracts = Array.isArray(contractsData) ? contractsData : [];
-  const firstContract = contracts[0] as { id?: number; publicId?: string } | undefined;
-  const contractId = firstContract?.publicId ?? firstContract?.id;
+  const contracts = (Array.isArray(contractsData) ? contractsData : []) as Contract[];
+  const firstContract = contracts[0];
+  const contractId = getContractPublicId(firstContract);
   const { data: disciplines = [] } = useDisciplines(contractId);
 
   const selectedProjectName =

frontend/app/(admin)/admin/doc-control/numbering/new/page.tsx

@@ -6,6 +6,7 @@ import { useRouter } from 'next/navigation';
 import { useCorrespondenceTypes, useContracts, useDisciplines } from '@/hooks/use-master-data';
 import { useProjects } from '@/hooks/use-projects';
 import { toast } from 'sonner';
+import { Contract, getContractPublicId } from '@/types/contract';
 
 export default function NewTemplatePage() {
   const router = useRouter();
@@ -15,9 +16,9 @@ export default function NewTemplatePage() {
   const { data: projects = [] } = useProjects();
   const projectId = 1; // Default or sync with selection
   const { data: contractsData } = useContracts(projectId);
-  const contracts = Array.isArray(contractsData) ? contractsData : [];
-  const firstContract = contracts[0] as { id?: number; publicId?: string } | undefined;
-  const contractId = firstContract?.publicId ?? firstContract?.id;
+  const contracts = (Array.isArray(contractsData) ? contractsData : []) as Contract[];
+  const firstContract = contracts[0];
+  const contractId = getContractPublicId(firstContract);
   const { data: disciplines = [] } = useDisciplines(contractId);
 
   const selectedProjectName =

frontend/app/(admin)/admin/doc-control/numbering/page.tsx

@@ -28,6 +28,7 @@ import { AuditLogsTable } from '@/components/numbering/audit-logs-table';
 import { VoidReplaceForm } from '@/components/numbering/void-replace-form';
 import { CancelNumberForm } from '@/components/numbering/cancel-number-form';
 import { BulkImportForm } from '@/components/numbering/bulk-import-form';
+import { Contract, getContractPublicId } from '@/types/contract';
 
 export default function NumberingPage() {
   const { data: projects = [] } = useProjects();
@@ -54,9 +55,9 @@ export default function NumberingPage() {
   // Master Data
   const { data: correspondenceTypes = [] } = useCorrespondenceTypes();
   const { data: contractsData } = useContracts(selectedProjectId);
-  const contracts = Array.isArray(contractsData) ? contractsData : [];
-  const firstContract = contracts[0] as { id?: number; publicId?: string } | undefined;
-  const contractId = firstContract?.publicId ?? firstContract?.id;
+  const contracts = (Array.isArray(contractsData) ? contractsData : []) as Contract[];
+  const firstContract = contracts[0];
+  const contractId = getContractPublicId(firstContract);
   const { data: disciplines = [] } = useDisciplines(contractId);
 
   const { data: templateResponse, isLoading: _isLoadingTemplates } = useTemplates();

frontend/app/(admin)/admin/doc-control/reference/disciplines/page.tsx

@@ -7,13 +7,14 @@ import { ColumnDef } from '@tanstack/react-table';
 import { Discipline } from '@/types/master-data';
 import { useState } from 'react';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
+import { Contract, getContractPublicId } from '@/types/contract';
 
 export default function DisciplinesPage() {
   const [selectedContractId, setSelectedContractId] = useState<string | null>(null);
 
   const { data: contractsData = [] } = useContracts();
   // Ensure we consistently use an array
-  const contracts = Array.isArray(contractsData) ? contractsData : [];
+  const contracts = (Array.isArray(contractsData) ? contractsData : []) as Contract[];
 
   const columns: ColumnDef<Discipline>[] = [
     {
@@ -56,10 +57,20 @@ export default function DisciplinesPage() {
     },
   ];
 
-  const contractOptions = contracts.map((c: { id?: number; publicId?: string; contractCode: string; contractName: string }) => ({
-    label: `${c.contractName} (${c.contractCode})`,
-    value: String(c.publicId ?? c.id ?? ''),
-  }));
+  const contractOptions = contracts
+    .map((c) => {
+      const contractUuid = getContractPublicId(c);
+
+      if (!contractUuid) {
+        return null;
+      }
+
+      return {
+        label: `${c.contractName} (${c.contractCode})`,
+        value: contractUuid,
+      };
+    })
+    .filter((option): option is { label: string; value: string } => option !== null);
 
   return (
     <div className="p-6">
@@ -84,7 +95,7 @@ export default function DisciplinesPage() {
             data as unknown as Parameters<typeof masterDataService.createDiscipline>[0]
           )
         }
-        updateFn={(_id, _data) => Promise.reject('Not implemented yet')}
+        updateFn={(id, data) => masterDataService.updateDiscipline(id, data)}
         deleteFn={(id) => masterDataService.deleteDiscipline(id)}
         columns={columns}
         filters={
@@ -98,11 +109,19 @@ export default function DisciplinesPage() {
               </SelectTrigger>
               <SelectContent>
                 <SelectItem value="all">All Contracts</SelectItem>
-                {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>
-                ))}
+                {contracts.map((c) => {
+                  const contractUuid = getContractPublicId(c);
+
+                  if (!contractUuid) {
+                    return null;
+                  }
+
+                  return (
+                    <SelectItem key={contractUuid} value={contractUuid}>
+                      {c.contractName} ({c.contractCode})
+                    </SelectItem>
+                  );
+                })}
               </SelectContent>
             </Select>
           </div>
@@ -116,19 +135,19 @@ export default function DisciplinesPage() {
             options: contractOptions,
           },
           {
-            name: 'discipline_code',
+            name: 'disciplineCode',
             label: 'Code',
             type: 'text',
             required: true,
           },
           {
-            name: 'code_name_th',
+            name: 'codeNameTh',
             label: 'Name (TH)',
             type: 'text',
             required: true,
           },
-          { name: 'code_name_en', label: 'Name (EN)', type: 'text' },
-          { name: 'is_active', label: 'Active', type: 'checkbox' },
+          { name: 'codeNameEn', label: 'Name (EN)', type: 'text' },
+          { name: 'isActive', label: 'Active', type: 'checkbox' },
         ]}
       />
     </div>

frontend/app/(admin)/admin/doc-control/reference/rfa-types/page.tsx

@@ -7,13 +7,14 @@ import { ColumnDef } from '@tanstack/react-table';
 import { useState } from 'react';
 import { RfaType } from '@/types/master-data';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
+import { Contract, getContractPublicId } from '@/types/contract';
 
 export default function RfaTypesPage() {
   const [selectedContractId, setSelectedContractId] = useState<string | null>(null);
 
   const { data: contractsData = [] } = useContracts();
   // Ensure we consistently use an array
-  const contracts = Array.isArray(contractsData) ? contractsData : [];
+  const contracts = (Array.isArray(contractsData) ? contractsData : []) as Contract[];
 
   const columns: ColumnDef<RfaType>[] = [
     {
@@ -60,10 +61,20 @@ export default function RfaTypesPage() {
     },
   ];
 
-  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.publicId ?? c.id ?? ''),
-  }));
+  const contractOptions = contracts
+    .map((c) => {
+      const contractUuid = getContractPublicId(c);
+
+      if (!contractUuid) {
+        return null;
+      }
+
+      return {
+        label: `${c.contractName} (${c.contractCode})`,
+        value: contractUuid,
+      };
+    })
+    .filter((option): option is { label: string; value: string } => option !== null);
 
   return (
     <div className="p-6">
@@ -99,11 +110,19 @@ export default function RfaTypesPage() {
               </SelectTrigger>
               <SelectContent>
                 <SelectItem value="all">All Contracts</SelectItem>
-                {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>
-                ))}
+                {contracts.map((c) => {
+                  const contractUuid = getContractPublicId(c);
+
+                  if (!contractUuid) {
+                    return null;
+                  }
+
+                  return (
+                    <SelectItem key={contractUuid} value={contractUuid}>
+                      {c.contractName} ({c.contractCode})
+                    </SelectItem>
+                  );
+                })}
               </SelectContent>
             </Select>
           </div>