From 96e180040dc4c230eed51ee106c5f273017dd951 Mon Sep 17 00:00:00 2001
From: robbond <rob@rdbsolutions.co.uk>
Date: Mon, 9 Mar 2026 13:11:28 +0000
Subject: [PATCH] fix for pdf formatting and hyperlinks

---
 .../representation/representationElements.js  |  15 +-
 components/elements/index.js                  |   7 +
 .../pdftemplates/lpaQuestionnaire_pdf.js      | 211 ++++++++--------
 components/utils/index.js                     | 229 +++++++++---------
 4 files changed, 241 insertions(+), 221 deletions(-)

diff --git a/components/case/representation/representationElements.js b/components/case/representation/representationElements.js
index 0cd58bd7..3ab97732 100644
--- a/components/case/representation/representationElements.js
+++ b/components/case/representation/representationElements.js
@@ -735,6 +735,12 @@ export const RenderMultiline = ({
         input.onChange(valStr);
     };
 
+    const handleBlur = () => {
+        const updated = updateLinks(editValue);
+        setEditValue(updated);
+        input.onChange(updated);
+    };
+
     var modules = {
         toolbar: [
             [{ "header": [1, 2, false] }],
@@ -765,6 +771,7 @@ export const RenderMultiline = ({
                     theme="snow"
                     value={editValue}
                     onChange={changeEdit}
+                    onBlur={handleBlur}
                 />
                 <textarea
                     {...input}
@@ -796,11 +803,16 @@ export const RenderRichMultiline = ({
     );
 
     const changeEdit = (valStr) => {
-        valStr = updateLinks(valStr);
         setEditValue(valStr);
         input.onChange(valStr);
     };
 
+    const handleBlur = () => {
+        const updated = updateLinks(editValue);
+        setEditValue(updated);
+        input.onChange(updated);
+    };
+
     var modules = {
         toolbar: [
             [{ "header": [1, 2, false] }],
@@ -820,6 +832,7 @@ export const RenderRichMultiline = ({
                 theme="snow"
                 value={editValue}
                 onChange={changeEdit}
+                onBlur={handleBlur}
             />
             <textarea
                 {...input}
diff --git a/components/elements/index.js b/components/elements/index.js
index b6b74696..3c6d9ba1 100644
--- a/components/elements/index.js
+++ b/components/elements/index.js
@@ -479,6 +479,12 @@ export const RenderRichMultiline = ({
         input.onChange(valStr);
     };
 
+    const handleBlur = () => {
+        const updated = updateLinks(editValue);
+        setEditValue(updated);
+        input.onChange(updated);
+    };
+
     var modules = {
         toolbar: [
             [{ "header": [1, 2, false] }],
@@ -513,6 +519,7 @@ export const RenderRichMultiline = ({
                     theme="snow"
                     value={editValue}
                     onChange={changeEdit}
+                    onBlur={handleBlur}
                 />
                 <textarea
                     {...input}
diff --git a/components/pdftemplates/lpaQuestionnaire_pdf.js b/components/pdftemplates/lpaQuestionnaire_pdf.js
index 139aa96a..2e8ca321 100644
--- a/components/pdftemplates/lpaQuestionnaire_pdf.js
+++ b/components/pdftemplates/lpaQuestionnaire_pdf.js
@@ -5,7 +5,7 @@ import {
     StyleSheet,
     Text,
     View,
-    Font,
+    Font
 } from "@react-pdf/renderer";
 import Html from "react-pdf-html";
 import { getFormCollectionByID, bytesToSize } from "../../components/utils";
@@ -27,16 +27,16 @@ const styles = StyleSheet.create({
         backgroundColor: "white",
         padding: 20,
         fontSize: 16,
-        paddingBottom: 50,
+        paddingBottom: 50
     },
     header: {
         fontSize: 25,
         fontFamily: "Helvetica",
         flexDirection: "row",
-        justifyContent: "space-between",
+        justifyContent: "space-between"
     },
     subHeader: {
-        fontSize: 20,
+        fontSize: 20
     },
     logoImage: { width: "200pt" },
     questionBullet: { width: "5%", fontSize: 12 },
@@ -51,7 +51,7 @@ const styles = StyleSheet.create({
         border: 1,
         borderColor: "#eee",
         paddingLeft: 10,
-        backgroundColor: "white",
+        backgroundColor: "white"
     },
     questionAnswerSmall: {
         color: "#757575",
@@ -63,7 +63,7 @@ const styles = StyleSheet.create({
         paddingLeft: 10,
         paddingRight: 10,
         backgroundColor: "white",
-        marginRight: 10,
+        marginRight: 10
     },
     questionAnswerSmaller: {
         color: "#757575",
@@ -73,7 +73,7 @@ const styles = StyleSheet.create({
         border: 1,
         borderColor: "#eee",
         paddingLeft: 10,
-        backgroundColor: "white",
+        backgroundColor: "white"
     },
     questionAnswerMid: {
         color: "#757575",
@@ -83,7 +83,7 @@ const styles = StyleSheet.create({
         border: 1,
         borderColor: "#eee",
         paddingLeft: 10,
-        backgroundColor: "white",
+        backgroundColor: "white"
     },
     questionAnswerWide: {
         color: "#757575",
@@ -92,7 +92,7 @@ const styles = StyleSheet.create({
         border: 1,
         borderColor: "#eee",
         backgroundColor: "white",
-        padding: 5,
+        padding: 5
     },
 
     questionAnswerFull: {
@@ -102,13 +102,13 @@ const styles = StyleSheet.create({
         padding: 5,
         border: 1,
         borderColor: "#eee",
-        backgroundColor: "white",
+        backgroundColor: "white"
     },
     sectionContainer: {
         backgroundColor: "#F8F8F8",
         padding: 10,
         marginTop: 20,
-        fontSize: 15,
+        fontSize: 15
     },
     pageNumber: {
         position: "absolute",
@@ -117,13 +117,13 @@ const styles = StyleSheet.create({
         left: 0,
         right: 0,
         textAlign: "center",
-        color: "grey",
+        color: "grey"
     },
 
     richArea: {
         fontSize: 12,
-        flexDirection: "column",
-    },
+        flexDirection: "column"
+    }
 });
 
 export const lpaQuestionnaire_pdf = ({ docProps }) => {
@@ -145,16 +145,15 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
 
     Font.registerHyphenationCallback((word) => [word]);
 
-    function CleanHTML(htmlStr) {
-        let cleanStr =
-            typeof htmlStr === "string"
-                ? htmlStr.replace(
-                      /<p><br><\/p>|<p class=\"ql-align-justify\"><br><\/p>/g,
-                      ""
-                  )
-                : "";
+    function CleanHTML(html = "") {
+        if (typeof html !== "string") return "";
 
-        return cleanStr;
+        return html
+            .replace(/&nbsp;/gi, " ")
+            .replace(/<(p|div)([^>]*)>\s*(<br\s*\/?>)?\s*<\/\1>/gi, "")
+            .replace(/<p([^>]*)>\s*<\/p>/gi, "")
+            .replace(/(<br\s*\/?>\s*){3,}/gi, "<br /><br />")
+            .trim();
     }
 
     return (
@@ -166,7 +165,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <Text
                                 style={{
                                     width: "60%",
-                                    fontFamily: "Helvetica-Bold",
+                                    fontFamily: "Helvetica-Bold"
                                 }}
                             >
                                 {getTrans(
@@ -180,7 +179,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                         width: "60%",
                                         fontSize: 15,
                                         marginTop: 20,
-                                        fontFamily: "Helvetica-Bold",
+                                        fontFamily: "Helvetica-Bold"
                                     }}
                                 >
                                     {getTrans(
@@ -205,7 +204,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text style={{ fontSize: 14 }}>
@@ -220,7 +219,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>1.</Text>
@@ -238,7 +237,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>2.</Text>
@@ -256,7 +255,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>3.</Text>
@@ -274,7 +273,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>4.</Text>
@@ -294,7 +293,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text style={{ fontSize: 14 }}>
@@ -308,7 +307,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
@@ -316,7 +315,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                     wrap={false}
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -347,7 +346,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>6.</Text>
@@ -365,14 +364,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -404,14 +403,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -442,14 +441,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -478,14 +477,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -511,7 +510,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text style={{ fontSize: 14 }}>
@@ -525,7 +524,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
@@ -533,7 +532,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                     wrap={false}
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -555,14 +554,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -584,13 +583,13 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -613,7 +612,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>14.</Text>
@@ -634,7 +633,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text style={{ fontSize: 14 }}>
@@ -649,7 +648,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>15.</Text>
@@ -666,14 +665,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -700,14 +699,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -736,14 +735,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -772,14 +771,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -806,14 +805,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -842,14 +841,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -879,7 +878,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>22.</Text>
@@ -896,14 +895,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -936,7 +935,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text style={{ fontSize: 14 }}>
@@ -951,7 +950,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}>24.</Text>
@@ -966,7 +965,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}></Text>
@@ -985,14 +984,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}></Text>
@@ -1023,7 +1022,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}></Text>
@@ -1041,7 +1040,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 wrap={false}
                                 style={{
                                     flexDirection: "row",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                             >
                                 <Text style={styles.questionBullet}></Text>
@@ -1058,14 +1057,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1098,7 +1097,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                             wrap={false}
                         >
@@ -1113,14 +1112,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1151,14 +1150,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1189,14 +1188,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1229,14 +1228,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1263,14 +1262,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1302,14 +1301,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1338,14 +1337,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1374,14 +1373,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     flexDirection: "column",
-                                    marginBottom: 10,
+                                    marginBottom: 10
                                 }}
                                 // wrap={false}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <Text style={styles.questionBullet}>
@@ -1413,7 +1412,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         <View
                             style={{
                                 marginTop: 10,
-                                fontFamily: "Helvetica-Bold",
+                                fontFamily: "Helvetica-Bold"
                             }}
                         >
                             <Text>
@@ -1429,14 +1428,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 style={{
                                     flexDirection: "row",
                                     marginBottom: 10,
-                                    alignItems: "center",
+                                    alignItems: "center"
                                 }}
                             >
                                 <View
                                     style={{
                                         flexDirection: "row",
                                         marginBottom: 10,
-                                        alignItems: "center",
+                                        alignItems: "center"
                                     }}
                                 >
                                     <Text
@@ -1459,7 +1458,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                             border: 1,
                                             borderColor: "#eee",
                                             backgroundColor: "white",
-                                            paddingRight: 10,
+                                            paddingRight: 10
                                         }}
                                         wrap={true}
                                     >
@@ -1470,7 +1469,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                     style={{
                                         flexDirection: "row",
                                         marginBottom: 10,
-                                        alignItems: "center",
+                                        alignItems: "center"
                                     }}
                                 >
                                     <Text
@@ -1480,7 +1479,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                                     ? "60"
                                                     : "40",
                                             fontSize: 12,
-                                            marginLeft: 10,
+                                            marginLeft: 10
                                         }}
                                     >
                                         {getTrans(
@@ -1498,7 +1497,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                 style={{
                                     flexDirection: "row",
                                     marginBottom: 10,
-                                    alignItems: "center",
+                                    alignItems: "center"
                                 }}
                             >
                                 <Text style={{ width: "18%", fontSize: 12 }}>
@@ -1516,7 +1515,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                             <View
                                 style={{
                                     marginTop: 10,
-                                    fontFamily: "Helvetica-Bold",
+                                    fontFamily: "Helvetica-Bold"
                                 }}
                             >
                                 <Text style={{ fontSize: 14 }}>
@@ -1531,14 +1530,14 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                     wrap={false}
                                     style={{
                                         flexDirection: "column",
-                                        marginBottom: 10,
+                                        marginBottom: 10
                                     }}
                                 >
                                     <View
                                         wrap={false}
                                         style={{
                                             flexDirection: "row",
-                                            marginBottom: 10,
+                                            marginBottom: 10
                                         }}
                                     >
                                         <Text style={styles.questionTextWide}>
@@ -1551,7 +1550,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                     <View
                                         style={[
                                             styles.questionAnswerFull,
-                                            { flexDirection: "column" },
+                                            { flexDirection: "column" }
                                         ]}
                                     >
                                         {values.hasOwnProperty("filesList") &&
@@ -1562,7 +1561,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                                                         style={{
                                                             flexDirection:
                                                                 "row",
-                                                            marginBottom: 4,
+                                                            marginBottom: 4
                                                         }}
                                                     >
                                                         <Text
@@ -1614,7 +1613,7 @@ export const lpaQuestionnaire_pdf = ({ docProps }) => {
                         borderColor: "#eee",
                         padding: 20,
                         paddingTop: 30,
-                        height: "100%",
+                        height: "100%"
                     }}
                 ></View>
             </Page>
diff --git a/components/utils/index.js b/components/utils/index.js
index 0f332227..4e3f6462 100644
--- a/components/utils/index.js
+++ b/components/utils/index.js
@@ -5,7 +5,7 @@ import {
     getBasicSearchDetails,
     getBasicSearchDetailsPaged,
     getPortalModuleDetailsProxy,
-    getPortalModuleDetails,
+    getPortalModuleDetails
 } from "../../actions";
 import data from "../../data/collections.json";
 import { useRouter } from "next/router";
@@ -20,7 +20,7 @@ export const getFormCollection = (formtype) => {
     const collectionName = jsonpath({
         path: "$..[?(@ && @.LogicalName=='" + formtype + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
     return collectionName[0];
 };
@@ -29,7 +29,7 @@ export const getFormCollectionByID = (appealTypeID) => {
     const collectionName = jsonpath({
         path: "$..[?(@ && @.appealTypeID =='" + appealTypeID + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
     return collectionName[0];
 };
@@ -38,7 +38,7 @@ export const getNavigationPropertyByPrimaryAttribute = (primaryAttribute) => {
     const collectionName = jsonpath({
         path: "$..[?(@ && @.PrimaryIdAttribute =='" + primaryAttribute + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
     return collectionName[0];
 };
@@ -47,7 +47,7 @@ export const getFormIDByLogicalName = (appealTypeLogicalName) => {
     const collectionName = jsonpath({
         path: "$..[?(@ && @.LogicalName =='" + appealTypeLogicalName + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
     return collectionName[0];
 };
@@ -56,7 +56,7 @@ export const getPickListLabel = (data, picklistType, picklistID) => {
     const pickListData = jsonpath({
         path: "$..[?(@ && @.LogicalName=='" + picklistType + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
 
     const pickListLabel = jsonpath({
@@ -66,7 +66,7 @@ export const getPickListLabel = (data, picklistType, picklistID) => {
             "')].Label.LocalizedLabels..Label",
 
         json: pickListData,
-        eval: true,
+        eval: true
     });
     return pickListLabel[0];
 };
@@ -75,7 +75,7 @@ export const getRadioLabel = (data, radiotListName, radioListID) => {
     const radioListData = jsonpath({
         path: "$..[?(@ && @.LogicalName=='" + radiotListName + "')]",
         json: data,
-        eval: true,
+        eval: true
     });
 
     const pickListLabel = jsonpath({
@@ -85,7 +85,7 @@ export const getRadioLabel = (data, radiotListName, radioListID) => {
             "')].Label.LocalizedLabels..Label",
 
         json: radioListData,
-        eval: true,
+        eval: true
     });
     return pickListLabel[0];
 };
@@ -100,7 +100,7 @@ export const getSearchDetails = async (searchResultsObj) => {
     searchResultsObj = searchResultsObj.value;
     const detailsObj = searchResultsObj.map((searchDetail, index) => {
         let formMeta = getFormCollectionByID(
-            searchDetail.pinswg_appealcasetype,
+            searchDetail.pinswg_appealcasetype
         );
         // console.log(
         //     "------------------- Details: ",
@@ -117,11 +117,11 @@ export const getSearchDetails = async (searchResultsObj) => {
                     "pinswg_dnses",
                     searchDetail.title,
                     "pinswg_dnsid",
-                    searchDetail.incidentid,
+                    searchDetail.incidentid
                 ) || {
                     "@odata.count": 1,
-                    "value": [{ "title": searchDetail.title }],
-                },
+                    "value": [{ "title": searchDetail.title }]
+                }
             );
         } else {
             // formMeta?.LogicalCollectionName &&
@@ -131,11 +131,11 @@ export const getSearchDetails = async (searchResultsObj) => {
                     formMeta.LogicalCollectionName,
                     searchDetail.title,
                     formMeta.PrimaryIdAttribute,
-                    searchDetail.incidentid,
+                    searchDetail.incidentid
                 ) || {
                     "@odata.count": 1,
-                    "value": [{ "title": searchDetail.title }],
-                },
+                    "value": [{ "title": searchDetail.title }]
+                }
             );
         }
     });
@@ -159,7 +159,7 @@ export const getPartSavedDetails = (searchResultsObj) => {
             console.log(searchDetail.title);
         } else {
             let formMeta = getFormCollectionByID(
-                searchDetail.pinswg_appealcasetype,
+                searchDetail.pinswg_appealcasetype
             );
             // console.log(formMeta);
             detailsArr.push(
@@ -167,8 +167,8 @@ export const getPartSavedDetails = (searchResultsObj) => {
                     formMeta.LogicalCollectionName,
                     searchDetail.title,
                     formMeta.PrimaryIdAttribute,
-                    searchDetail.incidentid,
-                ),
+                    searchDetail.incidentid
+                )
             );
         }
     });
@@ -279,7 +279,7 @@ export const getSearchDetailsPaged = async (searchResultsObj) => {
         if (!acc[appealType]) acc[appealType] = [];
         acc[appealType].push({
             incidentID: detail.incidentid,
-            title: detail.title,
+            title: detail.title
         });
         return acc;
     }, {});
@@ -307,7 +307,7 @@ export const getSearchDetailsPaged = async (searchResultsObj) => {
                 formMeta.LogicalCollectionName, // appealTypeName
                 null, // caseReference is no longer used in batch
                 formMeta.PrimaryIdAttribute, // primaryIdAttribute
-                incidentIDs, // pass array of incidentIDs
+                incidentIDs // pass array of incidentIDs
             );
 
             allDetails.push(...details);
@@ -323,7 +323,7 @@ export const getProgressObj = (
     formObjXML,
     titleList,
     mandatoryFieldsData,
-    props,
+    props
 ) => {
     const parser = new DOMParser();
     const BuildFormObj = (formObjXML) => {
@@ -336,7 +336,7 @@ export const getProgressObj = (
                 "//tabs/tab[" +
                     (index + 1) +
                     "]//rows/row/control[not(@parentField)]/..",
-                doc,
+                doc
             );
 
             return BuildRowObj(sectionXML, titleList[key].value);
@@ -376,10 +376,10 @@ export const getProgressObj = (
                                   0) ||
                           (_.has(props.props.form.appealForm, "values") &&
                               Object.keys(
-                                  props.props.form.appealForm.values,
+                                  props.props.form.appealForm.values
                               ).filter((k) => k.startsWith("pinswg_fileUpload"))
                                   .length > 0)
-                        : rowCount == formObj[key].fieldsTotal,
+                        : rowCount == formObj[key].fieldsTotal
             };
         });
 
@@ -401,17 +401,17 @@ export const getProgressObj = (
 
                 var parentFieldShowOnValue = xpath.select(
                     "//@parentFieldShowOnValue",
-                    doc,
+                    doc
                 );
 
                 var requiredDocumentValue = xpath.select(
                     "//@requiredDocumentValue",
-                    doc,
+                    doc
                 );
 
                 var requiredDocumentLabel = xpath.select(
                     "//@requiredDocumentLabel",
-                    doc,
+                    doc
                 );
 
                 var hint = xpath.select("//label/@hint", doc);
@@ -449,7 +449,7 @@ export const getProgressObj = (
                         datafieldname[0].value +
                         "')]",
                     json: mandatoryFieldsData,
-                    eval: true,
+                    eval: true
                 });
 
                 if (datafieldname[0].value.includes("pinswg_fileUpload")) {
@@ -461,7 +461,7 @@ export const getProgressObj = (
                                 "label": rows[0].value,
                                 "datafieldname": datafieldname[0].value,
                                 "datafieldcontent": datafieldcontent,
-                                "validation": validation,
+                                "validation": validation
                             };
                         }
                     } else {
@@ -471,7 +471,7 @@ export const getProgressObj = (
                             "datafieldname": datafieldname[0].value,
                             "key": key,
                             "picklistData": props.props.formData.pickListData,
-                            "mandatoryFieldsData": mandatoryFieldsData,
+                            "mandatoryFieldsData": mandatoryFieldsData
                         };
                     }
                 } else {
@@ -483,7 +483,7 @@ export const getProgressObj = (
                                 "label": rows[0].value,
                                 "datafieldname": datafieldname[0].value,
                                 "datafieldcontent": datafieldcontent,
-                                "validation": validation,
+                                "validation": validation
                             };
                         } else {
                             return null;
@@ -518,7 +518,7 @@ export const getProgressObj = (
             "title": titleList,
             "validationFieldsTotal": filterUnwanted(rowObj).length,
             "fieldsTotal": rowObj.length,
-            "fieldsrowObj": rowObj,
+            "fieldsrowObj": rowObj
         };
     };
 
@@ -616,7 +616,7 @@ export const getDetailsProxy = (resultsObj, detailsType) => {
                     ? searchDetail.ticketnumber
                     : searchDetail[
                           "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
-                      ],
+                      ]
             );
         } else {
             detailsArr.push(
@@ -627,8 +627,8 @@ export const getDetailsProxy = (resultsObj, detailsType) => {
                         ? searchDetail.ticketnumber
                         : searchDetail[
                               "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
-                          ],
-                ),
+                          ]
+                )
             );
         }
     });
@@ -678,98 +678,99 @@ export const getDocumentTypeFromFilename = (filename) => {
     return doctypeCode;
 };
 
-export const updateLinks = (jsonObj) => {
-    const parser = new DOMParser();
+export const updateLinks = (input) => {
+    const EMPTY_QUILL_PARAGRAPHS_REGEX =
+        /<p[^>]*>\s*(?:<br\s*\/?>|&nbsp;|\s)*\s*<\/p>/gi;
 
-    // Function to process the HTML string and replace URLs with <a> tags
-    const processHtmlString = (htmlString) => {
-        const doc = parser.parseFromString(htmlString, "text/html");
+    const URL_REGEX = /\b(https?:\/\/[^\s<]+)/gi;
 
-        // Find all text nodes in the document
-        const walk = (node) => {
-            if (node.nodeType === Node.TEXT_NODE) {
-                const urlRegex =
-                    /(?:https?:\/\/)?(?:www\.)?([a-zA-Z0-9.-]+\.[a-zA-Z]{2,})(\/[^\s]*)?/g;
-                let match;
-                let currentText = node.textContent;
-                let lastIndex = 0;
-                let newNodeContent = [];
+    const stripTrailingUrlPunctuation = (url) => {
+        let cleanUrl = url;
+        let trailing = "";
 
-                // Process all URLs found in the current text node
-                while ((match = urlRegex.exec(currentText)) !== null) {
-                    // Before the URL
-                    if (match.index > lastIndex) {
-                        newNodeContent.push(
-                            currentText.slice(lastIndex, match.index),
-                        );
+        while (/[.,!?;:'"]$/.test(cleanUrl)) {
+            trailing = cleanUrl.slice(-1) + trailing;
+            cleanUrl = cleanUrl.slice(0, -1);
+        }
+
+        const pairs = [
+            [")", "("],
+            ["]", "["],
+            ["}", "{"]
+        ];
+
+        let changed = true;
+        while (changed && cleanUrl) {
+            changed = false;
+
+            for (const [close, open] of pairs) {
+                if (cleanUrl.endsWith(close)) {
+                    const openCount = (
+                        cleanUrl.match(new RegExp(`\\${open}`, "g")) || []
+                    ).length;
+                    const closeCount = (
+                        cleanUrl.match(new RegExp(`\\${close}`, "g")) || []
+                    ).length;
+
+                    if (closeCount > openCount) {
+                        trailing = close + trailing;
+                        cleanUrl = cleanUrl.slice(0, -1);
+                        changed = true;
                     }
-
-                    // Construct the full URL (default to https://)
-                    let fullUrl = match[0];
-                    if (
-                        !fullUrl.startsWith("http://") &&
-                        !fullUrl.startsWith("https://")
-                    ) {
-                        fullUrl = `https://${match[1]}${match[2] || ""}`; // Default to https
-                    }
-
-                    // Create the anchor element
-                    const anchor = document.createElement("a");
-                    anchor.href = fullUrl;
-                    anchor.textContent = match[0];
-                    anchor.target = "_blank";
-                    anchor.setAttribute("rel", "noopener noreferrer");
-
-                    // Add the anchor tag to the node content
-                    newNodeContent.push(anchor);
-
-                    // Update the last index processed
-                    lastIndex = urlRegex.lastIndex;
-                }
-
-                // Add the remaining text after the last URL
-                if (lastIndex < currentText.length) {
-                    newNodeContent.push(currentText.slice(lastIndex));
-                }
-
-                // If there were any replacements, update the text node
-                if (newNodeContent.length > 0) {
-                    const fragment = document.createDocumentFragment();
-                    newNodeContent.forEach((item) => {
-                        if (typeof item === "string") {
-                            fragment.appendChild(document.createTextNode(item));
-                        } else {
-                            fragment.appendChild(item);
-                        }
-                    });
-                    node.parentNode.replaceChild(fragment, node);
                 }
             }
+        }
 
-            // Traverse child nodes
-            for (let i = 0; i < node.childNodes.length; i++) {
-                walk(node.childNodes[i]);
-            }
-        };
-
-        walk(doc.body);
-
-        return doc.body.innerHTML;
+        return { cleanUrl, trailing };
     };
 
-    // Iterate over the JSON object and process values that are strings (HTML content)
-    for (const key in jsonObj) {
-        if (jsonObj.hasOwnProperty(key)) {
-            const value = jsonObj[key];
+    const processHtmlString = (htmlString) => {
+        if (typeof htmlString !== "string" || !htmlString) return htmlString;
 
-            // If the value is a string and contains HTML, process it
-            if (typeof value === "string" && /<[^>]*>/g.test(value)) {
-                jsonObj[key] = processHtmlString(value);
+        let html = htmlString.replace(EMPTY_QUILL_PARAGRAPHS_REGEX, "");
+
+        const anchorPlaceholders = [];
+        html = html.replace(/<a\b[^>]*>[\s\S]*?<\/a>/gi, (match) => {
+            const token = `__ANCHOR_PLACEHOLDER_${anchorPlaceholders.length}__`;
+            anchorPlaceholders.push(match);
+            return token;
+        });
+
+        html = html.replace(URL_REGEX, (match) => {
+            const { cleanUrl, trailing } = stripTrailingUrlPunctuation(match);
+
+            if (!cleanUrl) return match;
+
+            return `<a href="${cleanUrl}" target="_blank" rel="noopener noreferrer">${cleanUrl}</a>${trailing}`;
+        });
+
+        html = html.replace(/__ANCHOR_PLACEHOLDER_(\d+)__/g, (_, index) => {
+            return anchorPlaceholders[Number(index)];
+        });
+
+        return html;
+    };
+
+    if (typeof input === "string") {
+        return processHtmlString(input);
+    }
+
+    if (!input || typeof input !== "object" || Array.isArray(input)) {
+        return input;
+    }
+
+    const updated = { ...input };
+
+    for (const key in updated) {
+        if (Object.prototype.hasOwnProperty.call(updated, key)) {
+            const value = updated[key];
+            if (typeof value === "string") {
+                updated[key] = processHtmlString(value);
             }
         }
     }
 
-    return jsonObj;
+    return updated;
 };
 
 export const whichRepType = (props) => {