Prevent report card text overlap

backend/src/reports/adoptionReport.ts

@@ -97,10 +97,26 @@ const fitText = (doc: PDFKit.PDFDocument, text: string, x: number, y: number, wi
   return doc.y;
 };
 
-const drawFact = (doc: PDFKit.PDFDocument, label: string, value: string, x: number, y: number, width: number) => {
+const measureFactHeight = (doc: PDFKit.PDFDocument, value: string, width: number, minHeight = 43) => {
-  doc.roundedRect(x, y, width, 43, 6).fillAndStroke(colors.panel, colors.border);
+  doc.font('Helvetica-Bold').fontSize(10);
+  const textHeight = doc.heightOfString(value, {
+    width: width - 16,
+    lineGap: 1,
+  });
+  return Math.max(minHeight, 27 + Math.min(textHeight, 38));
+};
+
+const drawFact = (doc: PDFKit.PDFDocument, label: string, value: string, x: number, y: number, width: number, height?: number) => {
+  const cardHeight = height ?? measureFactHeight(doc, value, width);
+  doc.roundedRect(x, y, width, cardHeight, 6).fillAndStroke(colors.panel, colors.border);
   doc.fillColor(colors.muted).fontSize(7).font('Helvetica-Bold').text(label.toUpperCase(), x + 8, y + 8, { width: width - 16 });
-  doc.fillColor(colors.ink).fontSize(10).font('Helvetica-Bold').text(value, x + 8, y + 21, { width: width - 16, ellipsis: true });
+  doc.fillColor(colors.ink).fontSize(10).font('Helvetica-Bold').text(value, x + 8, y + 21, {
+    width: width - 16,
+    height: cardHeight - 27,
+    lineGap: 1,
+    ellipsis: true,
+  });
+  return cardHeight;
 };
 
 const drawTextCard = (doc: PDFKit.PDFDocument, label: string, value: string, x: number, y: number, width: number, height = 58) => {
@@ -351,16 +367,14 @@ export const renderAdoptionReportPdf = async ({
     y = page.margin;
   }
   y = drawSectionTitle(doc, 'Veterinary Clinic Info', y);
-  const vetFacts = [
+  drawFact(doc, 'Clinic name', bird.vet_clinic_name || 'Not recorded', page.margin, y, factWidth);
-    ['Clinic name', bird.vet_clinic_name || 'Not recorded'],
+  drawFact(doc, 'Account #', bird.vet_account_number || 'Not recorded', page.margin + factWidth + factGap, y, factWidth);
-    ['Clinic address', bird.vet_clinic_address || 'Not recorded'],
+  y += 50;
-    ['Account #', bird.vet_account_number || 'Not recorded'],
+  const clinicAddressHeight = measureFactHeight(doc, bird.vet_clinic_address || 'Not recorded', contentWidth, 58);
-    ['Dr. name', bird.vet_doctor_name || 'Not recorded'],
+  drawFact(doc, 'Clinic address', bird.vet_clinic_address || 'Not recorded', page.margin, y, contentWidth, clinicAddressHeight);
-  ];
+  y += clinicAddressHeight + 7;
-  vetFacts.forEach(([label, value], index) => {
+  drawFact(doc, 'Dr. name', bird.vet_doctor_name || 'Not recorded', page.margin, y, factWidth);
-    drawFact(doc, label, value, page.margin + (index % 2) * (factWidth + factGap), y + Math.floor(index / 2) * 50, factWidth);
+  y += 50;
-  });
-  y += Math.ceil(vetFacts.length / 2) * 50 + 8;
 
   y = drawSectionTitle(doc, 'Vet Visit History', y);
   y = drawTable(