Update reconciliation comments display to show comment counts

Adds reconciliation comments count to delivery data and updates UI to reflect this count, changing button color when comments exist.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 1e4433b5-47ab-464c-b663-fea2e53367dd
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/1e4433b5-47ab-464c-b663-fea2e53367dd/rQ1f1Q3

.replit

@@ -24,7 +24,7 @@ localPort = 38451
 externalPort = 3002
 
 [[ports]]
-localPort = 40433
+localPort = 40863
 externalPort = 3003
 
 [[ports]]

client/src/pages/BLReconciliation.tsx

@@ -948,10 +948,20 @@ export default function BLReconciliation() {
                                   variant="outline"
                                   size="sm"
                                   onClick={() => handleOpenCommentModal(delivery)}
-                                  className={`h-8 w-8 p-0 text-gray-600 hover:text-gray-700 ${delivery.reconciled ? 'opacity-70' : ''}`}
+                                  className={`h-8 w-8 p-0 ${
-                                  title="Voir/Gérer les commentaires"
+                                    delivery.reconciliationCommentsCount && delivery.reconciliationCommentsCount > 0
+                                      ? 'text-blue-600 hover:text-blue-700 border-blue-300' 
+                                      : 'text-gray-600 hover:text-gray-700'
+                                  } ${delivery.reconciled ? 'opacity-70' : ''}`}
+                                  title={`Voir/Gérer les commentaires ${
+                                    delivery.reconciliationCommentsCount ? `(${delivery.reconciliationCommentsCount})` : ''
+                                  }`}
                                 >
-                                  <MessageSquare className="h-4 w-4" />
+                                  <MessageSquare className={`h-4 w-4 ${
+                                    delivery.reconciliationCommentsCount && delivery.reconciliationCommentsCount > 0
+                                      ? 'fill-blue-100' 
+                                      : ''
+                                  }`} />
                                 </Button>
                                 {!delivery.reconciled ? (
                                   <>

server/storage.ts

@@ -782,9 +782,23 @@ export class DatabaseStorage implements IStorage {
           }
         }
 
+        // Compter les commentaires de rapprochement pour cette livraison
+        let commentsCount = 0;
+        try {
+          const [countResult] = await db
+            .select({ count: sql<number>`count(*)` })
+            .from(reconciliationComments)
+            .where(eq(reconciliationComments.deliveryId, delivery.id));
+          
+          commentsCount = Number(countResult?.count || 0);
+        } catch (error) {
+          console.error(`Failed to count reconciliation comments for delivery #${delivery.id}:`, error);
+        }
+
         return {
           ...delivery,
-          order: associatedOrder
+          order: associatedOrder,
+          reconciliationCommentsCount: commentsCount
         };
       })
     );
@@ -898,9 +912,23 @@ export class DatabaseStorage implements IStorage {
           }
         }
 
+        // Compter les commentaires de rapprochement pour cette livraison
+        let commentsCount = 0;
+        try {
+          const [countResult] = await db
+            .select({ count: sql<number>`count(*)` })
+            .from(reconciliationComments)
+            .where(eq(reconciliationComments.deliveryId, delivery.id));
+          
+          commentsCount = Number(countResult?.count || 0);
+        } catch (error) {
+          console.error(`Failed to count reconciliation comments for delivery #${delivery.id}:`, error);
+        }
+
         return {
           ...delivery,
-          order: associatedOrder
+          order: associatedOrder,
+          reconciliationCommentsCount: commentsCount
         };
       })
     );
@@ -978,10 +1006,24 @@ export class DatabaseStorage implements IStorage {
       }
     }
 
+    // Compter les commentaires de rapprochement pour cette livraison
+    let commentsCount = 0;
+    try {
+      const [countResult] = await db
+        .select({ count: sql<number>`count(*)` })
+        .from(reconciliationComments)
+        .where(eq(reconciliationComments.deliveryId, id));
+      
+      commentsCount = Number(countResult?.count || 0);
+    } catch (error) {
+      console.error(`Failed to count reconciliation comments for delivery #${id}:`, error);
+    }
+
     return {
       ...delivery,
       creator,
-      order: associatedOrder
+      order: associatedOrder,
+      reconciliationCommentsCount: commentsCount
     } as DeliveryWithRelations;
   }
 
@@ -3278,12 +3320,17 @@ export class MemStorage implements IStorage {
         }
       }
 
+      // Compter les commentaires de rapprochement pour cette livraison
+      const commentsCount = Array.from(this.reconciliationComments.values())
+        .filter(comment => comment.deliveryId === delivery.id).length;
+
       return {
         ...delivery,
         supplier: this.suppliers.get(delivery.supplierId),
         group: this.groups.get(delivery.groupId),
         creator: this.users.get(delivery.createdBy || ''),
-        order: associatedOrder
+        order: associatedOrder,
+        reconciliationCommentsCount: commentsCount
       };
     });
   }
@@ -3315,12 +3362,17 @@ export class MemStorage implements IStorage {
         }
       }
 
+      // Compter les commentaires de rapprochement pour cette livraison
+      const commentsCount = Array.from(this.reconciliationComments.values())
+        .filter(comment => comment.deliveryId === delivery.id).length;
+
       return {
         ...delivery,
         supplier: this.suppliers.get(delivery.supplierId),
         group: this.groups.get(delivery.groupId),
         creator: this.users.get(delivery.createdBy || ''),
-        order: associatedOrder
+        order: associatedOrder,
+        reconciliationCommentsCount: commentsCount
       };
     });
   }
@@ -3343,12 +3395,17 @@ export class MemStorage implements IStorage {
       }
     }
     
+    // Compter les commentaires de rapprochement pour cette livraison
+    const commentsCount = Array.from(this.reconciliationComments.values())
+      .filter(comment => comment.deliveryId === delivery.id).length;
+
     return {
       ...delivery,
       supplier: this.suppliers.get(delivery.supplierId),
       group: this.groups.get(delivery.groupId),
       creator: this.users.get(delivery.createdBy || ''),
-      order: associatedOrder
+      order: associatedOrder,
+      reconciliationCommentsCount: commentsCount
     };
   }
 

shared/schema.ts

@@ -717,6 +717,7 @@ export type DeliveryWithRelations = Delivery & {
   group: Group;
   creator: User;
   order?: OrderWithRelations;
+  reconciliationCommentsCount?: number;
 };
 
 export type PublicityWithRelations = Publicity & {