From bf22248025eeec9f9812a9c9be692bba481c7177 Mon Sep 17 00:00:00 2001
From: michael <michael@modernfreedom.com>
Date: Sun, 25 Jan 2026 08:26:31 -0600
Subject: [PATCH] Fix PDF export formatting by parsing HTML and bullet text

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 frontend/components/PDFReport.tsx | 57 +++++++++++++++++++++++++++++--
 1 file changed, 55 insertions(+), 2 deletions(-)

diff --git a/frontend/components/PDFReport.tsx b/frontend/components/PDFReport.tsx
index fa39dc4..5399147 100755
--- a/frontend/components/PDFReport.tsx
+++ b/frontend/components/PDFReport.tsx
@@ -11,6 +11,59 @@ interface PDFReportProps {
     proofs: any[];
 }
 
+const formatFeedbackTextForPDF = (text: string): React.ReactNode => {
+    if (!text) return null;
+
+    // Normalize HTML tags and bullet characters
+    let normalizedText = text
+        .replace(/<\/li>/gi, '\n')
+        .replace(/<\/ul>/gi, '\n')
+        .replace(/<ul[^>]*>/gi, '')
+        .replace(/<li[^>]*>/gi, '• ')
+        .replace(/<[^>]+>/g, '')
+        .replace(/\s*•\s*/g, '\n• ')
+        .replace(/\n{2,}/g, '\n')
+        .trim();
+
+    const lines = normalizedText.split('\n').filter(line => line.trim());
+
+    const bulletLines: string[] = [];
+    const introLines: string[] = [];
+
+    lines.forEach(line => {
+        const trimmed = line.trim();
+        if (trimmed.startsWith('•')) {
+            bulletLines.push(trimmed.replace(/^•\s*/, '').trim());
+        } else if (trimmed) {
+            if (bulletLines.length === 0) {
+                introLines.push(trimmed);
+            } else {
+                const lastBullet = bulletLines.pop();
+                if (lastBullet) {
+                    bulletLines.push(`${lastBullet} ${trimmed}`);
+                } else {
+                    bulletLines.push(trimmed);
+                }
+            }
+        }
+    });
+
+    return (
+        <>
+            {introLines.length > 0 && (
+                <p style={{ margin: '0 0 8px 0' }}>{introLines.join(' ')}</p>
+            )}
+            {bulletLines.length > 0 && (
+                <ul style={{ margin: 0, paddingLeft: '18px', listStyleType: 'disc' }}>
+                    {bulletLines.map((item, index) => (
+                        <li key={index} style={{ marginBottom: '4px' }}>{item}</li>
+                    ))}
+                </ul>
+            )}
+        </>
+    );
+};
+
 const RagStatusBadge: React.FC<{ status: RagStatus }> = ({ status }) => {
     let bgColor = '#E5E7EB'; // Gray for Error
     let textColor = '#1F2937';
@@ -115,7 +168,7 @@ export const PDFReport: React.FC<PDFReportProps> = ({ campaignName, proofs }) =>
                                         <p style={{fontSize: '12px', margin: '4px 0 0 0', color: '#6B21A8', fontStyle: 'italic'}}>"{feedback.financialPromotionReason}"</p>
                                     </div>
                                 )}
-                                <p style={{ fontSize: '14px', lineHeight: 1.5, margin: 0 }}>{feedback.leadAgentSummary}</p>
+                                <div style={{ fontSize: '14px', lineHeight: 1.5, margin: 0 }}>{formatFeedbackTextForPDF(feedback.leadAgentSummary)}</div>
                             </div>
                         </div>
 
@@ -129,7 +182,7 @@ export const PDFReport: React.FC<PDFReportProps> = ({ campaignName, proofs }) =>
                                         </h4>
                                         <RagStatusBadge status={review.ragStatus} />
                                     </div>
-                                    <p style={{ fontSize: '13px', lineHeight: 1.5, margin: '0 0 10px 0', borderTop: '1px solid #eee', paddingTop: '10px' }}>{review.feedback}</p>
+                                    <div style={{ fontSize: '13px', lineHeight: 1.5, margin: '0 0 10px 0', borderTop: '1px solid #eee', paddingTop: '10px' }}>{formatFeedbackTextForPDF(review.feedback)}</div>
                                     {review.issues && review.issues.length > 0 && (
                                         <div>
                                             <h5 style={{ fontSize: '13px', fontWeight: 'bold', margin: '0 0 5px 0' }}>Actionable Issues:</h5>