Skip to content

UI: Add Details tab to the mapped task instance view#68340

Open
pierrejeambrun wants to merge 1 commit into
apache:mainfrom
astronomer:ui-mapped-task-details-tab
Open

UI: Add Details tab to the mapped task instance view#68340
pierrejeambrun wants to merge 1 commit into
apache:mainfrom
astronomer:ui-mapped-task-details-tab

Conversation

@pierrejeambrun

@pierrejeambrun pierrejeambrun commented Jun 10, 2026

Copy link
Copy Markdown
Member

Mapped tasks (the /mapped view opened from the Grid) now have a Details tab, like normal task instances already do. It shows the task definition (operator, trigger rule, owner, retries, pool, queue, …) plus a per-state summary of the mapped instances, sourced from the grid TI summaries the page already loads.

Screenshots

Screenshot 2026-06-10 at 15 44 27
  • Mapped task → Details tab

Was generative AI tooling used to co-author this PR?
  • Yes — Claude Code (Opus 4.8)

Generated-by: Claude Code (Opus 4.8) following the guidelines

@boring-cyborg boring-cyborg Bot added area:translations area:UI Related to UI/UX. For Frontend Developers. translation:default labels Jun 10, 2026
@pierrejeambrun pierrejeambrun marked this pull request as ready for review June 10, 2026 13:47
return (
<ReactFlowProvider>
<DetailsLayout tabs={tabs}>
<DetailsLayout outletContext={taskInstance} tabs={tabs}>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

What does this context actually do? We're only using it here and I don't get what its helping us with?

@pierrejeambrun pierrejeambrun Jun 11, 2026

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

This is to re-use the Grid summary. Otherwise the detail tab will have to useGridTiSummariesStream to fetch the TI summary. But since this is a stream, it's a custom implementation, not re-using react query cache and all, so this would open a second stream request to get the TI summaries.

This allow to share the stream from the grid view with the details view, via a context.

Preventing a second call to useGridTiSummariesStream and preventing a second stream request for data we already have.


// The aggregate summary (per-state counts, dates) is streamed once by the parent page and
// shared through the router outlet, so this tab does not re-open the TI summaries stream.
const taskInstance = useOutletContext<LightGridTaskInstanceSummary | undefined>();

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Do we want to use this hook anywhere else?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

No, we are only consuming the parent context once, here. (retrieving the TIsummaries provided by the parent page to avoid opening a second stream for that)

Mapped tasks (the /mapped view opened from the Grid) now have a Details tab
like normal task instances. It shows the task definition (operator, trigger
rule, owner, retries, pool, queue, ...) and a per-state summary of the mapped
instances, sourced from the grid TI summaries already loaded by the page.
@pierrejeambrun pierrejeambrun force-pushed the ui-mapped-task-details-tab branch from 25a96b5 to 203f4c4 Compare June 11, 2026 09:26
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.

2 participants