@@ -136,19 +136,27 @@ export default function BookTherapyPage({ story }: Props) {
136
136
137
137
function replacePartnerName ( partnerName : string ) {
138
138
const accordionDetailsElements = document . querySelectorAll ( '.MuiAccordionDetails-root' ) ;
139
- const introductionElement = document . querySelector ( 'h1 + .MuiTypography-root ' ) ;
139
+ const introductionElement : HTMLParagraphElement | null = document . querySelector ( 'h1 + p ' ) ;
140
140
141
141
accordionDetailsElements . forEach ( ( detailsElement ) => {
142
142
const paragraphElements = detailsElement . querySelectorAll ( 'p' ) ;
143
143
144
- [ ...paragraphElements , introductionElement ] . forEach ( ( paragraph ) => {
145
- if ( ! paragraph ) return ;
146
- const currentText = paragraph . textContent ;
144
+ const allElementsToProcess = [ ...paragraphElements ] ;
145
+ if ( introductionElement ) {
146
+ allElementsToProcess . push ( introductionElement ) ;
147
+ }
148
+
149
+ allElementsToProcess . forEach ( ( element ) => {
150
+ if ( ! element ) return ;
151
+
152
+ // Use innerHTML to preserve embedded HTML elements
153
+ const currentHtml = element . innerHTML ;
147
154
148
155
// Replace all instances of '{partnerName}' with the provided partnerName
149
- const newText = currentText ?. replace ( / \{ p a r t n e r N a m e \} / g, partnerName ) ;
156
+ const escapedPartnerName = partnerName . replace ( / < / g, '<' ) . replace ( / > / g, '>' ) ;
157
+ const newHtml = currentHtml . replace ( / \{ p a r t n e r N a m e \} / g, escapedPartnerName ) ;
150
158
151
- paragraph . textContent = newText || null ;
159
+ element . innerHTML = newHtml ;
152
160
} ) ;
153
161
} ) ;
154
162
}
0 commit comments