1 files changed, 85 insertions, 0 deletions
diff --git a/lib/vendor-investigation/table/contract-dialog.tsx b/lib/vendor-investigation/table/contract-dialog.tsx
new file mode 100644
index 00000000..28e6963b
--- /dev/null
+++ b/lib/vendor-investigation/table/contract-dialog.tsx
@@ -0,0 +1,85 @@
+"use client"
+
+import * as React from "react"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+} from "@/components/ui/dialog"
+import { Button } from "@/components/ui/button"
+import { Avatar } from "@/components/ui/avatar"
+import { ScrollArea } from "@/components/ui/scroll-area"
+import { ContactItem } from "@/config/vendorInvestigationsColumnsConfig"
+
+interface ContactsDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  investigationId: number | null
+  contacts: ContactItem[]
+}
+
+export function ContactsDialog({
+  open,
+  onOpenChange,
+  investigationId,
+  contacts,
+}: ContactsDialogProps) {
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>Vendor Contacts</DialogTitle>
+          <DialogDescription>
+            {contacts.length > 0
+              ? `Showing ${contacts.length} contacts for investigation #${investigationId}`
+              : `No contacts found for investigation #${investigationId}`}
+          </DialogDescription>
+        </DialogHeader>
+        <ScrollArea className="max-h-[60vh] pr-4">
+          {contacts.length > 0 ? (
+            <div className="space-y-4">
+              {contacts.map((contact, index) => (
+                <div
+                  key={index}
+                  className="flex items-start gap-4 p-3 rounded-lg border"
+                >
+                  <Avatar className="w-10 h-10">
+                    <span>{contact.contactName?.charAt(0) || "C"}</span>
+                  </Avatar>
+                  <div className="flex-1 space-y-1">
+                    <p className="font-medium">{contact.contactName || "Unnamed"}</p>
+                    {contact.contactEmail && (
+                      <p className="text-sm text-muted-foreground">
+                        {contact.contactEmail}
+                      </p>
+                    )}
+                    {contact.contactPhone && (
+                      <p className="text-sm text-muted-foreground">
+                        {contact.contactPhone}
+                      </p>
+                    )}
+                    {contact.contactPosition && (
+                      <p className="text-sm text-muted-foreground">
+                        Position: {contact.contactPosition}
+                      </p>
+                    )}
+                  </div>
+                </div>
+              ))}
+            </div>
+          ) : (
+            <div className="text-center py-6 text-muted-foreground">
+              No contacts available
+            </div>
+          )}
+        </ScrollArea>
+        <DialogFooter>
+          <Button onClick={() => onOpenChange(false)}>Close</Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}
+\ No newline at end of file