Skip to content

Fix DAG documentation rendering and description_md inline code in trigger modal#69138

Open
bramhanandlingala wants to merge 3 commits into
apache:mainfrom
bramhanandlingala:fix/#69116
Open

Fix DAG documentation rendering and description_md inline code in trigger modal#69138
bramhanandlingala wants to merge 3 commits into
apache:mainfrom
bramhanandlingala:fix/#69116

Conversation

@bramhanandlingala

@bramhanandlingala bramhanandlingala commented Jun 29, 2026

Copy link
Copy Markdown
Contributor

Fixes #69116

While working with Param description_md in Airflow 3, I noticed that
inline code like name was getting extra blank lines before and after
it instead of rendering inline. Also DAG Docs were not showing in the
trigger popup at all, and the dialog was too narrow for longer descriptions.

Root Cause

The inline code issue was caused by p={2} in ReactMarkdown.tsx which
adds 8px padding on all sides including top and bottom. This causes the
line height to break inside a p element making it look like paragraph
breaks around every inline code span.

For DAG Docs, the modal was already fetching dag.doc_md via
useDagServiceGetDag but never rendering it anywhere in the dialog.

For the narrow dialog, Dialog.Content had no width override so it was
using Chakra default width which is too small for longer descriptions.

Changes

ReactMarkdown.tsx

  • Changed p={2} to px={1.5} py={0.5} on inline Code component
  • Added borderRadius, fontSize, verticalAlign to make inline code
    visually distinct from normal text
  • Reduced PreComponent margin from my={3} to my={2}
  • Removed inline prop from code component (not valid in react-markdown v9)
  • Restored rel and target on LinkComponent

TriggerDAGModal.tsx

  • Added maxW="3xl" width="90vw" to Dialog.Content
  • Added collapsible Accordion section that shows dag.doc_md at the
    top of the modal when DAG documentation exists

components.json

  • Added dagDocs translation key under triggerDag

Type of change

  • Bug fix
  • Frontend only — no backend, API or database changes

@bramhanandlingala bramhanandlingala changed the title Fix: Params description_md rendering issues and add DAG docs to trigger modal Fix DAG documentation rendering and description_md inline code in trigger modal Jul 2, 2026

@pierrejeambrun pierrejeambrun left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR

Please include screenshots, before and after. (also screenshot of other places where we render markdown, to check side effects)

Also just limit the diff to the problem mentioned (param doc having too many blank lines).

The change around the 'Dag Doc' should be in their own PR and are not related to fixing the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:translations area:UI Related to UI/UX. For Frontend Developers. translation:default

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Params description displayed odd after Airflow 3 update. Excessive newlines after code blocks etc.

2 participants