diff --git a/frontend/packages/react-form-wizard/src/review/ReviewStep.tsx b/frontend/packages/react-form-wizard/src/review/ReviewStep.tsx
index 0d5c02debc7..84a05dac052 100644
--- a/frontend/packages/react-form-wizard/src/review/ReviewStep.tsx
+++ b/frontend/packages/react-form-wizard/src/review/ReviewStep.tsx
@@ -706,6 +706,20 @@ function renderReviewInputDescriptionContent(node: WizardInputDomNode): ReactNod
return <>>
}
+/** When review value is a plain string with newlines, show each segment on its own line. */
+function renderReviewValueWithNewlines(valueContent: ReactNode): ReactNode {
+ if (typeof valueContent === 'string' && valueContent.includes('\n')) {
+ const lines = valueContent.split('\n')
+ return lines.map((line, index) => (
+
+ {index > 0 ?
: null}
+ {line}
+
+ ))
+ }
+ return valueContent
+}
+
/** Base margin 32px; each nested ARRAY_INPUT adds 2px. */
function reviewArrayInstanceMarginLeft(arrayInputNesting: number): number {
return 32 + 2 * arrayInputNesting
@@ -863,13 +877,13 @@ function renderReviewInputRows(nodes: readonly WizardInputDomNode[], ctx: Review
onPenIconClick={() => onReviewEdit(inputNode, 'navigate')}
onArrowClick={yamlVisible ? () => onReviewEdit(inputNode, 'highlight') : undefined}
>
- {valueContent}
+ {renderReviewValueWithNewlines(valueContent)}
) : (
<>
{termContent}
- {valueContent}
+ {renderReviewValueWithNewlines(valueContent)}
>
)}