Skip to content

[v3-2-test] UI: Add per-searchbar 'Match anywhere' toggle for substring search (#66015)#66106

Merged
pierrejeambrun merged 1 commit into
v3-2-testfrom
backport-d748835-v3-2-test
Apr 30, 2026
Merged

[v3-2-test] UI: Add per-searchbar 'Match anywhere' toggle for substring search (#66015)#66106
pierrejeambrun merged 1 commit into
v3-2-testfrom
backport-d748835-v3-2-test

Conversation

@github-actions
Copy link
Copy Markdown
Contributor

  • UI: Add per-searchbar 'Match anywhere' toggle for substring search

Follow-up to #64963. The default search now uses the new prefix patterns
(*_prefix_pattern) for index-friendly lookups. Users who relied on
the prior substring behavior (*_pattern) can opt back in per
searchbar via a small regex-icon toggle.

Both surfaces support it:

  • SearchBar — page-level inputs on Pools, Connections, Variables,
    Assets, Asset events, and Dags lists.
  • FilterBar text pills — when supportsAdvancedSearch is set on
    the FilterConfig, the pill renders the toggle inline while editing
    and shows a regex indicator next to the value when collapsed. Wired
    on TaskInstances, DagRuns, Events, XCom, and HITL.

URL is intentionally untouched: shared links default to fast prefix
mode; toggle state is per-searchbar in localStorage
(advanced_search-<id>). The toggle uses onMouseDown +
preventDefault so clicking it inside a FilterPill does not collapse
the pill.

  • Move toggle inside FilterPill input, drop warning palette

Address review feedback:

  • Move the advanced-search toggle from a sibling next to the InputWithAddon
    to a real endAddon slot inside the same rounded box. The toggle now
    sits flush on the right of the pill input, mirroring the "Pool:" label on
    the left.
  • Drop the colorPalette="warning" (orange) for the on state. Use the
    brand palette in both states; outline = off, solid = on. The UI doesn't
    use the warning palette much elsewhere, so this is more consistent.
  • Move the toggle's tooltip strings (search.advanced.{title,description})
    from dags.json to common.json since the toggle renders on
    admin-namespace pages too. Drop the toggleAriaLabel translation key —
    aria-labels stay as plain English.
  • Update 64963.significant.rst to point users at this opt-in toggle as
    the way back to the previous substring search behavior.
  • Style FilterPill toggle as flush rounded addon

Make the toggle inside the FilterPill match the look of the "Pool:" label
on the left:

  • Render as a Box-as-button with borderRightRadius="full" and
    alignSelf="stretch" so it fills the full pill height instead of
    being a tiny crushed icon centered in white space.
  • Off state matches the label palette (gray.muted bg). On state uses the
    brand palette (solid bg, contrast fg).
  • New variant="addon" | "standalone" on AdvancedSearchToggle.
    standalone keeps the previous IconButton look used next to the
    SearchBar; addon is the rounded right-side fill used inside
    InputWithAddon.
  • Drop the pr={1} wrapper around InputWithAddon's endAddon so
    the addon abuts the pill's rounded edge.
  • Rename newsfragment to 66015 and split into two parts

Move the user-visible note from 64963.significant.rst to a new
66015.significant.rst (this PR's number) and split it into two
paragraphs:

  • Trim newsfragment, drop localStorage/URL detail
    (cherry picked from commit d748835)

Co-authored-by: Pierre Jeambrun pierrejbrun@gmail.com

…ng search (#66015)

* UI: Add per-searchbar 'Match anywhere' toggle for substring search

Follow-up to #64963. The default search now uses the new prefix patterns
(``*_prefix_pattern``) for index-friendly lookups. Users who relied on
the prior substring behavior (``*_pattern``) can opt back in per
searchbar via a small regex-icon toggle.

Both surfaces support it:

* ``SearchBar`` — page-level inputs on Pools, Connections, Variables,
  Assets, Asset events, and Dags lists.
* ``FilterBar`` text pills — when ``supportsAdvancedSearch`` is set on
  the FilterConfig, the pill renders the toggle inline while editing
  and shows a regex indicator next to the value when collapsed. Wired
  on TaskInstances, DagRuns, Events, XCom, and HITL.

URL is intentionally untouched: shared links default to fast prefix
mode; toggle state is per-searchbar in ``localStorage``
(``advanced_search-<id>``). The toggle uses ``onMouseDown`` +
``preventDefault`` so clicking it inside a FilterPill does not collapse
the pill.

* Move toggle inside FilterPill input, drop warning palette

Address review feedback:

- Move the advanced-search toggle from a sibling next to the InputWithAddon
  to a real ``endAddon`` slot inside the same rounded box. The toggle now
  sits flush on the right of the pill input, mirroring the "Pool:" label on
  the left.
- Drop the ``colorPalette="warning"`` (orange) for the on state. Use the
  brand palette in both states; outline = off, solid = on. The UI doesn't
  use the warning palette much elsewhere, so this is more consistent.
- Move the toggle's tooltip strings (``search.advanced.{title,description}``)
  from ``dags.json`` to ``common.json`` since the toggle renders on
  admin-namespace pages too. Drop the ``toggleAriaLabel`` translation key —
  aria-labels stay as plain English.
- Update ``64963.significant.rst`` to point users at this opt-in toggle as
  the way back to the previous substring search behavior.

* Style FilterPill toggle as flush rounded addon

Make the toggle inside the FilterPill match the look of the "Pool:" label
on the left:

- Render as a Box-as-button with ``borderRightRadius="full"`` and
  ``alignSelf="stretch"`` so it fills the full pill height instead of
  being a tiny crushed icon centered in white space.
- Off state matches the label palette (gray.muted bg). On state uses the
  brand palette (solid bg, contrast fg).
- New ``variant="addon" | "standalone"`` on ``AdvancedSearchToggle``.
  ``standalone`` keeps the previous IconButton look used next to the
  ``SearchBar``; ``addon`` is the rounded right-side fill used inside
  ``InputWithAddon``.
- Drop the ``pr={1}`` wrapper around ``InputWithAddon``'s ``endAddon`` so
  the addon abuts the pill's rounded edge.

* Rename newsfragment to 66015 and split into two parts

Move the user-visible note from `64963.significant.rst` to a new
`66015.significant.rst` (this PR's number) and split it into two
paragraphs:

- The first paragraph references #64963 — the change from full-match
  `*_pattern` to index-friendly `*_prefix_pattern`.
- The second paragraph references #66015 — the new per-searchbar
  "Match anywhere" toggle that lets users opt back into substring
  search.

* Trim newsfragment, drop localStorage/URL detail
(cherry picked from commit d748835)

Co-authored-by: Pierre Jeambrun <pierrejbrun@gmail.com>
@pierrejeambrun pierrejeambrun merged commit 545efc4 into v3-2-test Apr 30, 2026
74 checks passed
@pierrejeambrun pierrejeambrun deleted the backport-d748835-v3-2-test branch April 30, 2026 14:04
@vatsrahul1001 vatsrahul1001 added this to the Airflow 3.2.2 milestone May 18, 2026
@vatsrahul1001 vatsrahul1001 added the type:misc/internal Changelog: Misc changes that should appear in change log label May 18, 2026
vatsrahul1001 pushed a commit that referenced this pull request May 20, 2026
…ng search (#66015) (#66106)

* UI: Add per-searchbar 'Match anywhere' toggle for substring search

Follow-up to #64963. The default search now uses the new prefix patterns
(``*_prefix_pattern``) for index-friendly lookups. Users who relied on
the prior substring behavior (``*_pattern``) can opt back in per
searchbar via a small regex-icon toggle.

Both surfaces support it:

* ``SearchBar`` — page-level inputs on Pools, Connections, Variables,
  Assets, Asset events, and Dags lists.
* ``FilterBar`` text pills — when ``supportsAdvancedSearch`` is set on
  the FilterConfig, the pill renders the toggle inline while editing
  and shows a regex indicator next to the value when collapsed. Wired
  on TaskInstances, DagRuns, Events, XCom, and HITL.

URL is intentionally untouched: shared links default to fast prefix
mode; toggle state is per-searchbar in ``localStorage``
(``advanced_search-<id>``). The toggle uses ``onMouseDown`` +
``preventDefault`` so clicking it inside a FilterPill does not collapse
the pill.

* Move toggle inside FilterPill input, drop warning palette

Address review feedback:

- Move the advanced-search toggle from a sibling next to the InputWithAddon
  to a real ``endAddon`` slot inside the same rounded box. The toggle now
  sits flush on the right of the pill input, mirroring the "Pool:" label on
  the left.
- Drop the ``colorPalette="warning"`` (orange) for the on state. Use the
  brand palette in both states; outline = off, solid = on. The UI doesn't
  use the warning palette much elsewhere, so this is more consistent.
- Move the toggle's tooltip strings (``search.advanced.{title,description}``)
  from ``dags.json`` to ``common.json`` since the toggle renders on
  admin-namespace pages too. Drop the ``toggleAriaLabel`` translation key —
  aria-labels stay as plain English.
- Update ``64963.significant.rst`` to point users at this opt-in toggle as
  the way back to the previous substring search behavior.

* Style FilterPill toggle as flush rounded addon

Make the toggle inside the FilterPill match the look of the "Pool:" label
on the left:

- Render as a Box-as-button with ``borderRightRadius="full"`` and
  ``alignSelf="stretch"`` so it fills the full pill height instead of
  being a tiny crushed icon centered in white space.
- Off state matches the label palette (gray.muted bg). On state uses the
  brand palette (solid bg, contrast fg).
- New ``variant="addon" | "standalone"`` on ``AdvancedSearchToggle``.
  ``standalone`` keeps the previous IconButton look used next to the
  ``SearchBar``; ``addon`` is the rounded right-side fill used inside
  ``InputWithAddon``.
- Drop the ``pr={1}`` wrapper around ``InputWithAddon``'s ``endAddon`` so
  the addon abuts the pill's rounded edge.

* Rename newsfragment to 66015 and split into two parts

Move the user-visible note from `64963.significant.rst` to a new
`66015.significant.rst` (this PR's number) and split it into two
paragraphs:

- The first paragraph references #64963 — the change from full-match
  `*_pattern` to index-friendly `*_prefix_pattern`.
- The second paragraph references #66015 — the new per-searchbar
  "Match anywhere" toggle that lets users opt back into substring
  search.

* Trim newsfragment, drop localStorage/URL detail
(cherry picked from commit d748835)

Co-authored-by: Pierre Jeambrun <pierrejbrun@gmail.com>
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 type:misc/internal Changelog: Misc changes that should appear in change log

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants