feat: show attachment filenames in claims and payments tables

apps/Backend/src/storage/payments-storage.ts

@@ -98,6 +98,7 @@ export const paymentsStorage: IStorage = {
         claim: {
           include: {
             serviceLines: true,
+            claimFiles: true,
           },
         },
         serviceLines: true,
@@ -132,6 +133,7 @@ export const paymentsStorage: IStorage = {
         claim: {
           include: {
             serviceLines: true,
+            claimFiles: true,
           },
         },
         serviceLines: true,
@@ -164,6 +166,7 @@ export const paymentsStorage: IStorage = {
         claim: {
           include: {
             serviceLines: true,
+            claimFiles: true,
           },
         },
         serviceLines: true,
@@ -199,6 +202,7 @@ export const paymentsStorage: IStorage = {
         claim: {
           include: {
             serviceLines: true,
+            claimFiles: true,
           },
         },
         serviceLines: true,
@@ -236,6 +240,7 @@ export const paymentsStorage: IStorage = {
         claim: {
           include: {
             serviceLines: true,
+            claimFiles: true,
           },
         },
         serviceLines: true,

apps/Frontend/src/components/claims/claims-recent-table.tsx

@@ -16,6 +16,7 @@ import {
   Delete,
   Edit,
   Eye,
+  Paperclip,
 } from "lucide-react";
 import { apiRequest, queryClient } from "@/lib/queryClient";
 import { useToast } from "@/hooks/use-toast";
@@ -313,6 +314,7 @@ export default function ClaimsRecentTable({
               <TableHead>Member ID</TableHead>
               <TableHead>Total Billed</TableHead>
               <TableHead>Status</TableHead>
+              <TableHead>Attachments</TableHead>
               <TableHead className="text-right">Actions</TableHead>
             </TableRow>
           </TableHeader>
@@ -426,6 +428,26 @@ export default function ClaimsRecentTable({
                     </div>
                   </TableCell>
 
+                  <TableCell>
+                    {claim.claimFiles && claim.claimFiles.length > 0 ? (
+                      <ul className="space-y-1">
+                        {claim.claimFiles.map((f) => (
+                          <li
+                            key={f.id ?? f.filename}
+                            className="flex items-center gap-1 text-xs text-gray-700"
+                          >
+                            <Paperclip className="h-3 w-3 text-gray-400 shrink-0" />
+                            <span className="truncate max-w-[140px]" title={f.filename}>
+                              {f.filename}
+                            </span>
+                          </li>
+                        ))}
+                      </ul>
+                    ) : (
+                      <span className="text-xs text-gray-400">—</span>
+                    )}
+                  </TableCell>
+
                   <TableCell className="text-right">
                     <div className="flex justify-end space-x-2">
                       {allowDelete && (

apps/Frontend/src/components/payments/payments-recent-table.tsx

@@ -20,6 +20,7 @@ import {
   ThumbsDown,
   DollarSign,
   Ban,
+  Paperclip,
 } from "lucide-react";
 import { apiRequest, queryClient } from "@/lib/queryClient";
 import { useToast } from "@/hooks/use-toast";
@@ -488,6 +489,7 @@ export default function PaymentsRecentTable({
               <TableHead>Amount</TableHead>
               <TableHead>Service Date</TableHead>
               <TableHead>Status</TableHead>
+              <TableHead>Attachments</TableHead>
               <TableHead className="text-right">Actions</TableHead>
             </TableRow>
           </TableHeader>
@@ -622,6 +624,26 @@ export default function PaymentsRecentTable({
                       </div>
                     </TableCell>
 
+                    <TableCell>
+                      {payment.claim?.claimFiles && payment.claim.claimFiles.length > 0 ? (
+                        <ul className="space-y-1">
+                          {payment.claim.claimFiles.map((f: { id?: number; filename: string }) => (
+                            <li
+                              key={f.id ?? f.filename}
+                              className="flex items-center gap-1 text-xs text-gray-700"
+                            >
+                              <Paperclip className="h-3 w-3 text-gray-400 shrink-0" />
+                              <span className="truncate max-w-[140px]" title={f.filename}>
+                                {f.filename}
+                              </span>
+                            </li>
+                          ))}
+                        </ul>
+                      ) : (
+                        <span className="text-xs text-gray-400">—</span>
+                      )}
+                    </TableCell>
+
                     <TableCell className="text-right">
                       <div className="flex justify-end space-x-2">
                         {allowDelete && (

packages/db/types/payment-types.ts

@@ -87,6 +87,7 @@ export type PaymentWithExtras = Prisma.PaymentGetPayload<{
     claim: {
       include: {
         serviceLines: true;
+        claimFiles: true;
       };
     };
     serviceLines: true; // ✅ OCR-only service lines directly under Payment