Skip to content

[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228

Merged
potiuk merged 4 commits into
v3-2-testfrom
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged

[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom
backport-bfe46f6-v3-2-test

Conversation

@github-actions

@github-actionsgithub-actionsBot commented Apr 14, 2026

Copy link
Copy Markdown
Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette

Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.

The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.

closes: #64253

  • UI: Remove unnecessary useCallback in useMonacoTheme

Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.

  • UI: Use culori for Monaco theme color conversion

Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.

Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.

  • UI: Fix codespell typo in useMonacoTheme comment

unparseable -> unparsable.
(cherry picked from commit bfe46f6)

Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com

@github-actionsgithub-actionsBot mentioned this pull request Apr 14, 2026
Merged
1 task
@boring-cyborgboring-cyborgBot added the area:UI Related to UI/UX. For Frontend Developers. label Apr 14, 2026
@bbovenzi
bbovenzi marked this pull request as ready for review April 14, 2026 16:15
@vatsrahul1001vatsrahul1001 added this to the Airflow 3.2.2 milestone Apr 15, 2026
@vatsrahul1001
vatsrahul1001 marked this pull request as draft April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun marked this pull request as ready for review April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed the v3-2-test branch 3 times, most recently from 075c4fc to 3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed the backport-bfe46f6-v3-2-test branch from 0acfd00 to cf2752cCompareApril 23, 2026 05:36
shivaamand others added 4 commits April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed the backport-bfe46f6-v3-2-test branch from cf2752c to c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk merged commit 6cf3db7 into v3-2-testApr 26, 2026
79 checks passed
@potiuk
potiuk deleted the backport-bfe46f6-v3-2-test branch April 26, 2026 19:44
vatsrahul1001 pushed a commit that referenced this pull request Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001 added the type:misc/internal Changelog: Misc changes that should appear in change log label May 19, 2026
vatsrahul1001 pushed a commit that referenced this pull request May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001 mentioned this pull request May 21, 2026
Closed
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees

No one assigned

Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects

None yet

Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all 
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Force GitHub README to respect dark mode
(function() {
var style = document.createElement('style');
style.textContent = '
.markdown-body {
color-scheme: dark light;
}
.markdown-body pre { background: #161b22 !important; }
.markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }
.markdown-body table th, .markdown-body table td { border-color: #30363d !important; }
.markdown-body img { background: #0d1117; }
.markdown-body blockquote { border-left-color: #8b949e; }
.markdown-body hr { border-color: #30363d; }
';
document.head.appendChild(style);
})();
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Highlight search terms from Google/DuckDuckGo/Bing referrer
(function() {
var ref = document.referrer;
var terms = [];
if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {
var url = new URL(ref);
var q = url.searchParams.get('q') || url.searchParams.get('p');
if (q) {
terms = q.split(/\s+/).filter(function(t) { return t.length > 2; });
}
}
if (terms.length === 0) return;
var style = document.createElement('style');
style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';
document.head.appendChild(style);
function highlight(node) {
if (node.nodeType === 3) { // text node
var text = node.textContent;
var found = false;
terms.forEach(function(term) {
var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi');
if (regex.test(text)) {
found = true;
var frag = document.createDocumentFragment();
var parts = text.split(regex);
parts.forEach(function(part, i) {
if (i % 2 === 0) {
frag.appendChild(document.createTextNode(part));
} else {
var span = document.createElement('span');
span.className = 'userscript-highlight';
span.textContent = part;
frag.appendChild(span);
}
});
node.parentNode.replaceChild(frag, node);
}
});
} else if (node.nodeType === 1 && node.childNodes) { // element
var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];
if (!skipTags.includes(node.tagName)) {
Array.from(node.childNodes).forEach(highlight);
}
}
}
highlight(document.body);
// Re-highlight on dynamic content
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1 || node.nodeType === 3) highlight(node);
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Strip utm_, fbclid, gclid, etc. from all links on page
(function() {
var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',
'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',
'ref', 'ref_src', 'source', 'medium', 'campaign'];
function cleanUrl(url) {
try {
var u = new URL(url, window.location.origin);
var changed = false;
trackingParams.forEach(function(p) {
if (u.searchParams.has(p)) {
u.searchParams.delete(p);
changed = true;
}
});
return changed ? u.toString() : url;
} catch (e) {
return url;
}
}
function cleanLinks() {
document.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
cleanLinks();
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1) {
if (node.tagName === 'A') cleanLinks();
node.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Auto-enable theater mode on YouTube
(function() {
function tryTheater() {
var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]');
if (btn && !btn.classList.contains('activated')) {
btn.click();
}
}
// Try immediately
tryTheater();
// Try after navigation (SPA)
var lastUrl = location.href;
setInterval(function() {
if (location.href !== lastUrl) {
lastUrl = location.href;
setTimeout(tryTheater, 500);
}
}, 1000);
// Also try on player load
var observer = new MutationObserver(tryTheater);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Remove or un-stick sticky/fixed headers that block content
(function() {
function unstick() {
document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) {
if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {
el.style.position = 'static';
el.style.top = 'auto';
el.style.zIndex = 'auto';
}
});
}
unstick();
var observer = new MutationObserver(unstick);
observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });
})();
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Universal Dark Mode - works on any site
(function() {
var enabled = true;
function applyDarkMode() {
if (!enabled) return;
// Create style element if it doesn't exist
var style = document.getElementById('universal-dark-mode-style');
if (!style) {
style = document.createElement('style');
style.id = 'universal-dark-mode-style';
document.head.appendChild(style);
}
// Dark mode CSS - inverts colors but preserves images/video
style.textContent = '
/* Invert everything except media */
html {
filter: invert(1) hue-rotate(180deg) !important;
background: #1a1a2e !important;
}
/* Restore images, videos, iframes, canvas */
img, video, iframe, canvas, svg, picture, [style*="background-image"] {
filter: invert(1) hue-rotate(180deg) !important;
}
/* Preserve specific elements that should not be inverted */
.no-dark-mode, .no-dark-mode *,
[data-theme="light"], [data-theme="light"],
.ace_editor, .ace_editor *,
.CodeMirror, .CodeMirror *,
.monaco-editor, .monaco-editor *,
.markdown-body pre, .markdown-body pre *,
.highlight, .highlight *,
pre code, pre code * {
filter: none !important;
}
/* Fix common UI elements */
.modal, .popup, .dropdown-menu, .tooltip, .popover {
filter: invert(1) hue-rotate(180deg) !important;
background: #2d2d44 !important;
border-color: #444 !important;
}
/* Scrollbars */
::-webkit-scrollbar { background: #1a1a2e !important; }
::-webkit-scrollbar-thumb { background: #444 !important; }
::-webkit-scrollbar-thumb:hover { background: #555 !important; }
/* Selection */
::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
';
}
function removeDarkMode() {
var style = document.getElementById('universal-dark-mode-style');
if (style) style.remove();
}
// Toggle with Alt+Shift+D
document.addEventListener('keydown', function(e) {
if (e.altKey && e.shiftKey && e.key === 'D') {
e.preventDefault();
enabled = !enabled;
if (enabled) {
applyDarkMode();
console.log('[Universal Dark Mode] Enabled');
} else {
removeDarkMode();
console.log('[Universal Dark Mode] Disabled');
}
}
});
// Apply on load
applyDarkMode();
// Re-apply on dynamic content
var observer = new MutationObserver(function(mutations) {
if (enabled && !document.getElementById('universal-dark-mode-style')) {
applyDarkMode();
}
});
observer.observe(document.head, { childList: true });
console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');
})();
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) by github-actions[bot] · Pull Request #65228 · apache/airflow · GitHub
Skip to content
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748) - #65228
Merged
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Apr 26, 2026
Merged
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)#65228
potiuk merged 4 commits into
v3-2-testfrom 
backport-bfe46f6-v3-2-test
Conversation
@github-actions
@github-actionsgithub-actionsBot
commented
Apr 14, 2026

Copy link


Copy Markdown

Contributor
  • UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived

from Chakra UI color tokens so that the DAG Code viewer, diff viewer,

and JSON editors visually integrate with the rest of the app instead

of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D

canvas and reads it back via getImageData to convert Chakra's OKLCH

color values into the #rrggbb strings that Monaco's defineTheme

accepts — ctx.fillStyle readback cannot be used because modern

Chrome preserves the original OKLCH string. Themes are registered

once via a module-level flag and then passed to every Monaco editor

via the beforeMount callback.
closes: #64253
  • UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,

so the useCallback wrapper around defineAirflowMonacoThemes

is redundant. Pass the function reference directly instead.

Also fix prettier formatting in tests.
  • UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle

(depended on Canvas2D rendering and browser-specific fillStyle

behavior, and required canvas mocking in happy-dom tests). Replace

it with culori's parse/formatHex, which handles OKLCH and other

modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the

getComputedStyle spy does not leak between runs.
  • UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.

(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi 6463385+shivaam@users.noreply.github.com
@github-actionsgithub-actionsBot
mentioned this pull request
Apr 14, 2026
 Merged

1 task
@boring-cyborgboring-cyborgBot
added
the 
area:UI
Related to UI/UX. For Frontend Developers.
label
Apr 14, 2026
@bbovenzi
bbovenzi
marked this pull request as ready for review
April 14, 2026 16:15
@vatsrahul1001vatsrahul1001
added this to the Airflow 3.2.2 milestone
Apr 15, 2026
@vatsrahul1001
vatsrahul1001
marked this pull request as draft
April 15, 2026 04:00
@pierrejeambrun
pierrejeambrun
marked this pull request as ready for review
April 15, 2026 08:26
@vatsrahul1001
vatsrahul1001force-pushed
the
v3-2-test
branch
3 times, most recently
from
075c4fc to
3fe9a9aCompareApril 23, 2026 05:03
@vatsrahul1001
vatsrahul1001force-pushed
the
backport-bfe46f6-v3-2-test
branch
from
0acfd00 to
cf2752cCompareApril 23, 2026 05:36
shivaamand others
added 4 commits
April 26, 2026 18:53
@shivaam@potiuk
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
34585d1
…#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
@github-actions@dependabot@potiuk
[v3-2-test] Bump actions/github-script in the github-actions-updates …
85bb177
…group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@potiuk@justinpakzad
[v3-2-test] Added breeze generate issue content for airflow-ctl (#65042…
e278cc9
…) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@potiuk
[v3-2-test] Run release calendar verification on its own schedule (#6…
c75aef3
…5118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
@potiuk
potiukforce-pushed
the
backport-bfe46f6-v3-2-test
branch
from
cf2752c to
c75aef3CompareApril 26, 2026 16:54
@potiuk
potiuk
merged commit 6cf3db7
into
v3-2-testApr 26, 2026

79 checks passed

@potiuk
potiuk
deleted the

backport-bfe46f6-v3-2-test

branch
April 26, 2026 19:44
vatsrahul1001 pushed a commit
that referenced
this pull request
Apr 27, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
5c6e8a5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
added
the 
type:misc/internal
Changelog: Misc changes that should appear in change log
label
May 19, 2026
vatsrahul1001 pushed a commit
that referenced
this pull request
May 20, 2026
@github-actions@shivaam
@dependabot@potiuk@justinpakzad@vatsrahul1001
[v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (…
b472ab5
…#64748) (#65228)
* [v3-2-test] UI: Rework Monaco editor theme to match Chakra UI palette (#64748)
* UI: Rework Monaco editor theme to match Chakra UI palette
Register custom airflow-light and airflow-dark Monaco themes derived
from Chakra UI color tokens so that the DAG Code viewer, diff viewer,
and JSON editors visually integrate with the rest of the app instead
of using Monaco's default vs/vs-dark themes.
The new useMonacoTheme hook rasterizes a single pixel through a 2D
canvas and reads it back via getImageData to convert Chakra's OKLCH
color values into the #rrggbb strings that Monaco's defineTheme
accepts — ctx.fillStyle readback cannot be used because modern
Chrome preserves the original OKLCH string. Themes are registered
once via a module-level flag and then passed to every Monaco editor
via the beforeMount callback.
closes: #64253
* UI: Remove unnecessary useCallback in useMonacoTheme
Address review feedback: React Compiler handles memoization,
so the useCallback wrapper around defineAirflowMonacoThemes
is redundant. Pass the function reference directly instead.
Also fix prettier formatting in tests.
* UI: Use culori for Monaco theme color conversion
Address review feedback: the canvas-based cssVarToHex was brittle
(depended on Canvas2D rendering and browser-specific fillStyle
behavior, and required canvas mocking in happy-dom tests). Replace
it with culori's parse/formatHex, which handles OKLCH and other
modern color spaces directly with no DOM rasterization.
Also add afterEach(vi.restoreAllMocks()) to the tests so the
getComputedStyle spy does not leak between runs.
* UI: Fix codespell typo in useMonacoTheme comment
unparseable -> unparsable.
(cherry picked from commit bfe46f6)
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
* [v3-2-test] Bump actions/github-script in the github-actions-updates group (#65150) (#65160)
Bumps the github-actions-updates group with 1 update: [actions/github-script](https://github.com/actions/github-script).
Updates `actions/github-script` from 8.0.0 to 9.0.0
- [Release notes](https://github.com/actions/github-script/releases)
- [Commits](actions/github-script@ed59741...3a2844b)
(cherry picked from commit e5a047c)
---
updated-dependencies:
- dependency-name: actions/github-script
dependency-version: 9.0.0
dependency-type: direct:production
update-type: version-update:semver-major
dependency-group: github-actions-updates
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* [v3-2-test] Added breeze generate issue content for airflow-ctl (#65042) (#65241)
* Add breeze generate issue content for airflow-ctl
* add new command to doc
(cherry picked from commit b24538b)
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
* [v3-2-test] Run release calendar verification on its own schedule (#65118) (#65242)
* Move release calendar verification to its own scheduled workflow
Run dev/verify_release_calendar.py from a dedicated daily scheduled
workflow instead of as a canary job in the main CI pipeline, and
notify the #release-management Slack channel when the check fails so
the issue is surfaced to release managers directly.
* Include wiki and calendar links in release calendar Slack alert
(cherry picked from commit 048e9a1)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shivam Rastogi <6463385+shivaam@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Jarek Potiuk <jarek@potiuk.com>
Co-authored-by: Justin Pakzad <114518232+justinpakzad@users.noreply.github.com>
@vatsrahul1001vatsrahul1001
mentioned this pull request
May 21, 2026

Closed

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

Reviewers

@bbovenzibbovenzibbovenzi approved these changes
@pierrejeambrunpierrejeambrunAwaiting requested review from pierrejeambrunpierrejeambrun is a code owner
@ryanahamiltonryanahamiltonAwaiting requested review from ryanahamiltonryanahamilton is a code owner
@shubhamraj-gitshubhamraj-gitAwaiting requested review from shubhamraj-gitshubhamraj-git is a code owner
@guan404mingguan404mingAwaiting requested review from guan404mingguan404ming is a code owner
@vatsrahul1001vatsrahul1001Awaiting requested review from vatsrahul1001vatsrahul1001 is a code owner
@choo121600choo121600Awaiting requested review from choo121600choo121600 is a code owner
@potiukpotiukAwaiting requested review from potiuk
@jscheffljschefflAwaiting requested review from jscheffl
@vincbeckvincbeckAwaiting requested review from vincbeck
@shahar1shahar1Awaiting requested review from shahar1
@jedcunninghamjedcunninghamAwaiting requested review from jedcunningham
@bugraoz93bugraoz93Awaiting requested review from bugraoz93
@kaxilkaxilAwaiting requested review from kaxil
@amoghrajeshamoghrajeshAwaiting requested review from amoghrajesh
@ashbashbAwaiting requested review from ashb
@jason810496jason810496Awaiting requested review from jason810496
@ephraimbuddyephraimbuddyAwaiting requested review from ephraimbuddy
@gopidesupavangopidesupavanAwaiting requested review from gopidesupavan
@hussein-awalahussein-awalaAwaiting requested review from hussein-awala
@dabladablaAwaiting requested review from dabla
@RNHTTRRNHTTRAwaiting requested review from RNHTTR
@josh-felljosh-fellAwaiting requested review from josh-fell
@FokkoFokkoAwaiting requested review from Fokko
@o-nikolaso-nikolasAwaiting requested review from o-nikolas
@uranusjruranusjrAwaiting requested review from uranusjr
@Lee-WLee-WAwaiting requested review from Lee-W
@mobuchowskimobuchowskiAwaiting requested review from mobuchowski
@dheerajturagadheerajturagaAwaiting requested review from dheerajturaga
@rawwarrawwarAwaiting requested review from rawwar
@XD-DENGXD-DENGAwaiting requested review from XD-DENG
@bolkedebruinbolkedebruinAwaiting requested review from bolkedebruin

Assignees


No one assigned


Labels

area:UIRelated to UI/UX. For Frontend Developers.type:misc/internalChangelog: Misc changes that should appear in change log

Projects


None yet


Milestone

Airflow 3.2.2

Development

Successfully merging this pull request may close these issues.

4 participants

@bbovenzi@potiuk@vatsrahul1001@shivaam