260319:1246 Fix fronend UUID #01

frontend/components/drawings/columns.tsx

@@ -3,7 +3,7 @@
 import { ColumnDef } from '@tanstack/react-table';
 import { Drawing } from '@/types/drawing';
 import { Button } from '@/components/ui/button';
-import { ArrowUpDown, MoreHorizontal } from 'lucide-react';
+import { ArrowUpDown, MoreHorizontal, Pencil, Upload } from 'lucide-react';
 import Link from 'next/link';
 import {
   DropdownMenu,
@@ -68,9 +68,22 @@ export const columns: ColumnDef<Drawing>[] = [
             </DropdownMenuItem>
             <DropdownMenuSeparator />
             <DropdownMenuItem asChild>
-              <Link href={`/drawings/${drawing.uuid}`}>View Details</Link>
+              <Link href={`/drawings/${drawing.uuid}`}>
+                View Details
+              </Link>
+            </DropdownMenuItem>
+            <DropdownMenuItem asChild>
+              <Link href={`/drawings/${drawing.uuid}?edit=true`}>
+                <Pencil className="mr-2 h-4 w-4" />
+                Edit Detail
+              </Link>
+            </DropdownMenuItem>
+            <DropdownMenuItem asChild>
+              <Link href={`/drawings/${drawing.uuid}?upload=true`}>
+                <Upload className="mr-2 h-4 w-4" />
+                Upload Revision
+              </Link>
             </DropdownMenuItem>
-            {/* Add download/view functionality later */}
           </DropdownMenuContent>
         </DropdownMenu>
       );

frontend/components/drawings/upload-form.tsx

@@ -16,7 +16,7 @@ import {
 import { Card } from "@/components/ui/card";
 import { useRouter } from "next/navigation";
 import { useCreateDrawing } from "@/hooks/use-drawing";
-import { useContractDrawingCategories, useShopMainCategories, useShopSubCategories } from "@/hooks/use-master-data";
+import { useContractDrawingCategories, useShopMainCategories, useShopSubCategories, useProjects } from "@/hooks/use-master-data";
 import { useState, useEffect } from "react";
 import { Loader2 } from "lucide-react";
 import { Textarea } from "@/components/ui/textarea";
@@ -24,7 +24,7 @@ import { Textarea } from "@/components/ui/textarea";
 // Base Schema
 const baseSchema = z.object({
   drawingType: z.enum(["CONTRACT", "SHOP", "AS_BUILT"]),
-  projectId: z.number().default(1), // Hardcoded for now
+  projectId: z.string().min(1, "Project is required"),
   file: z.instanceof(File, { message: "File is required" }),
 });
 
@@ -72,19 +72,21 @@ const formSchema = z.discriminatedUnion("drawingType", [
 
 type DrawingFormData = z.infer<typeof formSchema>;
 
-interface DrawingUploadFormProps {
-  projectId?: number;
-}
-
-export function DrawingUploadForm({ projectId = 1 }: DrawingUploadFormProps) {
+export function DrawingUploadForm() {
   const router = useRouter();
 
-  // Hooks
-  const { data: contractCategories } = useContractDrawingCategories(projectId);
-  const { data: shopMainCats } = useShopMainCategories(projectId);
+  // Project list
+  const { data: projects = [], isLoading: isLoadingProjects } = useProjects();
+
+  // Selected project for category fetching
+  const [selectedProjectId, setSelectedProjectId] = useState<number | string | undefined>(undefined);
+
+  // Hooks — categories depend on selected project
+  const { data: contractCategories } = useContractDrawingCategories(selectedProjectId);
+  const { data: shopMainCats } = useShopMainCategories(selectedProjectId as number);
 
   const [selectedShopMainCat, setSelectedShopMainCat] = useState<number | undefined>();
-  const { data: shopSubCats } = useShopSubCategories(projectId, selectedShopMainCat);
+  const { data: shopSubCats } = useShopSubCategories(selectedProjectId as number, selectedShopMainCat);
 
   const {
     register,
@@ -95,18 +97,24 @@ export function DrawingUploadForm({ projectId = 1 }: DrawingUploadFormProps) {
   } = useForm<DrawingFormData>({
     resolver: zodResolver(formSchema) as any,
     defaultValues: {
-      projectId,
       drawingType: "CONTRACT",
     }
   });
 
   const drawingType = watch("drawingType");
+  const watchedProjectId = watch("projectId");
   const createMutation = useCreateDrawing(drawingType);
 
-  // Reset logic when type changes
+  // When project changes, update selectedProjectId for category hooks
   useEffect(() => {
-    // Optional: clear fields or set defaults
-  }, [drawingType]);
+    if (!watchedProjectId) {
+      setSelectedProjectId(undefined);
+      return;
+    }
+    // Try to resolve UUID→INT from projects list, or pass UUID directly
+    const project = projects.find((p: { id: string; uuid?: string }) => p.id === watchedProjectId || p.uuid === watchedProjectId) as { id: string; uuid?: string } | undefined;
+    setSelectedProjectId(project?.id ?? watchedProjectId);
+  }, [watchedProjectId, projects]);
 
   const onSubmit = (data: DrawingFormData) => {
     const formData = new FormData();
@@ -153,6 +161,32 @@ export function DrawingUploadForm({ projectId = 1 }: DrawingUploadFormProps) {
         <h3 className="text-lg font-semibold mb-4">Drawing Information</h3>
 
         <div className="space-y-4">
+          {/* Project Selector */}
+          <div>
+            <Label>Project *</Label>
+            <Select
+              onValueChange={(v) => setValue("projectId", v)}
+            >
+              <SelectTrigger>
+                {isLoadingProjects ? (
+                  <Loader2 className="h-4 w-4 animate-spin" />
+                ) : (
+                  <SelectValue placeholder="Select Project" />
+                )}
+              </SelectTrigger>
+              <SelectContent>
+                {projects.map((project: { id: string; projectName: string; projectCode: string }) => (
+                  <SelectItem key={project.id} value={project.id}>
+                    {project.projectCode} - {project.projectName}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+            {errors.projectId && (
+              <p className="text-sm text-destructive">{errors.projectId.message}</p>
+            )}
+          </div>
+
           <div>
             <Label>Drawing Type *</Label>
             <Select

frontend/components/transmittal/transmittal-form.tsx

@@ -53,7 +53,7 @@ import { cn } from "@/lib/utils";
 // Schema for items
 const itemSchema = z.object({
   itemType: z.enum(["DRAWING", "RFA", "CORRESPONDENCE"]),
-  itemId: z.number().min(1, "Document is required"),
+  itemId: z.coerce.number().min(1, "Document ID is required"),
   description: z.string().optional(),
   // Virtual fields for UI display
   documentNumber: z.string().optional(),
@@ -77,7 +77,7 @@ export function TransmittalForm() {
   const [docOpen, setDocOpen] = useState(false);
 
   const form = useForm<FormData>({
-    resolver: zodResolver(formSchema),
+    resolver: zodResolver(formSchema) as any,
     defaultValues: {
       projectId: "",
       recipientOrganizationId: "",
@@ -86,7 +86,7 @@ export function TransmittalForm() {
       purpose: "FOR_APPROVAL",
       remarks: "",
       items: [
-        { itemType: "DRAWING", itemId: 0, description: "" }, // Initial empty row
+        { itemType: "DRAWING", itemId: 0, description: "" },
       ],
     },
   });
@@ -147,7 +147,8 @@ export function TransmittalForm() {
   };
 
   const selectedDocId = form.watch("correspondenceId");
-  const selectedDoc = correspondences?.data?.find(
+  const correspondenceList = correspondences?.data || [];
+  const selectedDoc = correspondenceList.find(
     (c: { uuid: string }) => c.uuid === selectedDocId
   );
 
@@ -200,9 +201,9 @@ export function TransmittalForm() {
                         </SelectTrigger>
                       </FormControl>
                       <SelectContent>
-                        {(Array.isArray(orgsList) ? orgsList : []).map((o: { uuid: string; organizationName?: string; orgCode?: string }) => (
+                        {(Array.isArray(orgsList) ? orgsList : []).map((o: { uuid: string; organizationName?: string; organizationCode?: string }) => (
                           <SelectItem key={o.uuid} value={o.uuid}>
-                            {o.organizationName || o.orgCode}
+                            {o.organizationName || o.organizationCode}
                           </SelectItem>
                         ))}
                       </SelectContent>
@@ -233,7 +234,7 @@ export function TransmittalForm() {
                             )}
                           >
                             {selectedDoc
-                              ? selectedDoc.correspondence_number
+                              ? (selectedDoc as { correspondenceNumber?: string }).correspondenceNumber || 'Selected'
                               : "Select reference..."}
                             <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
                           </Button>
@@ -245,11 +246,11 @@ export function TransmittalForm() {
                           <CommandList>
                             <CommandEmpty>No document found.</CommandEmpty>
                             <CommandGroup>
-                              {correspondences?.data?.map(
-                                (doc: { uuid: string; correspondence_number: string }) => (
+                              {correspondenceList.map(
+                                (doc: { uuid: string; correspondenceNumber?: string }) => (
                                   <CommandItem
                                     key={doc.uuid}
-                                    value={doc.correspondence_number}
+                                    value={doc.correspondenceNumber || doc.uuid}
                                     onSelect={() => {
                                       form.setValue("correspondenceId", doc.uuid);
                                       setDocOpen(false);
@@ -263,7 +264,7 @@ export function TransmittalForm() {
                                           : "opacity-0"
                                       )}
                                     />
-                                    {doc.correspondence_number}
+                                    {doc.correspondenceNumber || doc.uuid}
                                   </CommandItem>
                                 )
                               )}

frontend/components/transmittal/transmittal-list.tsx

@@ -18,20 +18,25 @@ export function TransmittalList({ data }: TransmittalListProps) {
 
   const columns: ColumnDef<Transmittal>[] = [
     {
-      accessorKey: "transmittalNo",
+      id: "transmittalNo",
       header: "Transmittal No.",
-      cell: ({ row }) => (
-        <span className="font-medium">{row.getValue("transmittalNo")}</span>
-      ),
+      cell: ({ row }) => {
+        const no = row.original.correspondence?.correspondenceNumber || row.original.transmittalNo || '-';
+        return <span className="font-medium">{no}</span>;
+      },
     },
     {
-      accessorKey: "subject",
+      id: "subject",
       header: "Subject",
-      cell: ({ row }) => (
-        <div className="max-w-[300px] truncate" title={row.getValue("subject")}>
-          {row.getValue("subject")}
-        </div>
-      ),
+      cell: ({ row }) => {
+        const currentRev = row.original.correspondence?.revisions?.find(r => r.isCurrent);
+        const subject = currentRev?.title || row.original.subject || '-';
+        return (
+          <div className="max-w-[300px] truncate" title={subject}>
+            {subject}
+          </div>
+        );
+      },
     },
     {
       accessorKey: "purpose",
@@ -49,10 +54,13 @@ export function TransmittalList({ data }: TransmittalListProps) {
       },
     },
     {
-      accessorKey: "createdAt",
+      id: "createdAt",
       header: "Date",
-      cell: ({ row }) =>
-        format(new Date(row.getValue("createdAt")), "dd MMM yyyy"),
+      cell: ({ row }) => {
+        const dateStr = row.original.correspondence?.createdAt || row.original.createdAt;
+        if (!dateStr) return '-';
+        return format(new Date(dateStr), "dd MMM yyyy");
+      },
     },
     {
       id: "actions",