[Mola-maker]

Why

The HITL (human-in-the-loop) approval form renders hitlDetail.body as Markdown via FlexibleForm's flexFormDescription. A single \n in the body is a Markdown soft break, which collapses to a space when rendered — so multi-line bodies (e.g. a dry-run result pushed through {{ ti.xcom_pull(...) }}) display as one long line, even though the Rendered Template tab shows them correctly.

This PR covers the HITL body part of #74018. The XCom tab part of the same issue is already handled separately by #74112, so this uses related: rather than closes:.

What changed

• src/components/ReactMarkdown.tsx
  • Callers can now pass extra remarkPlugins; they are merged with the built-in remark-gfm instead of being silently overridden (previously a passed remarkPlugins prop was discarded).
  • Adds an exported, dependency-free remark plugin remarkSoftBreaks that splits text nodes on single line breaks (\n / \r\n) into explicit break nodes, which render as <br />.
• src/components/FlexibleForm/FlexibleForm.tsx
  • Renders flexFormDescription with remarkSoftBreaks enabled. flexFormDescription is only used for the HITL operator body, so Dag docs, notes, param descriptions and all other Markdown rendering are unaffected and keep the previous soft-break behavior.
• src/components/ReactMarkdown.test.tsx
  • New tests: single line breaks render as <br> with the plugin enabled, and keep collapsing to a space without it (default behavior unchanged).

Verification

• pnpm vitest run src/components/FlexibleForm src/components/ReactMarkdown.test.tsx — 7 files / 50 tests pass, including the 2 new tests.
• tsc --p tsconfig.app.json — clean.

related: #74018

---

Was generative AI tooling used to co-author this PR?

• Yes — Kimi (Moonshot AI coding assistant), for implementation and tests; changes reviewed locally with the UI test suite and type checker

Generated-by: Kimi (Moonshot AI) following the guidelines

[bbovenzi]

Please provide a before/after screenshot

[Mola-maker]

Thanks for the review! Here are the before/after screenshots, rendered from the actual FlexibleForm/ReactMarkdown components in the repo's vitest setup, using a HITL body with a multi-line plain-text payload (the "before" shot is from main, the "after" shot from this PR branch):

Before — single line breaks collapse, the multi-line body wraps into one paragraph:

After — each line of the body is preserved with remarkSoftBreaks:

(Test body: "[Dry-Run Ergebnis]\nDelete: /mnt/x/y/z/data/test.gdb\n...test2...test3...test4.gdb" — 5 lines; the rendered output goes from 0 <br> elements to 4.)

[bbovenzi]

Just one nit

[bbovenzi]

Suggested change

	type MdastNode = {
	type MarkdownNode = {

Nit. A more readable name here would help.

[bbovenzi]

Also let's fix the CI

[Zhnz]

I just want to hint to my comment on the main issue. If the HITLOperator body actually renders Markdown, then the current behaviour would be correct, wouldn't it? The issue I had in this case then is not realizing, that the body is rendered in Markdown, which is mentioned nowhere on the HITLOperator tutorial. Implementing this PR would therefore break the Markdown support, which is actually mentioned here.

[bbovenzi]

I just want to hint to my comment on the main issue. If the HITLOperator body actually renders Markdown, then the current behaviour would be correct, wouldn't it? The issue I had in this case then is not realizing, that the body is rendered in Markdown, which is mentioned nowhere on the HITLOperator tutorial. Implementing this PR would therefore break the Markdown support, which is actually mentioned here.

Good point. Let's update the docs first.

[bbovenzi]

Let's update docs before all of this remarkSoftBreaks

[pierrejeambrun]

Can't reproduce on main, #66809 fixed it.

Closing as stale we just need to update the doc:

[Mola-maker]

well，ok