You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airflow.apache.org by "omareltomy (via GitHub)" <gi...@apache.org> on 2025/09/24 23:44:53 UTC
[PR] fix: add auto-refresh to backfill banner [airflow]
omareltomy opened a new pull request, #56086:
URL: https://github.com/apache/airflow/pull/56086
The backfill banner was not auto-refreshing when backfills completed, requiring manual refresh (F5) to remove the banner. This change adds the same auto-refresh pattern used by other components.
- Import useAutoRefresh from src/utils
- Add refetchInterval to useBackfillServiceListBackfillsUi query
- Only refresh when there are active backfills (completed_at === null)
This ensures the banner automatically disappears when all backfills are completed, providing consistent UX with other UI components.
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
## What changes were proposed in this pull request?
This PR adds auto-refresh functionality to the backfill banner component to ensure it automatically disappears when backfills complete, providing consistent user experience with other UI components in Airflow.
**Changes made:**
- Import `useAutoRefresh` utility from `src/utils`
- Add `refetchInterval` configuration to the `useBackfillServiceListBackfillsUi` query
- Implement conditional refresh logic that only triggers when there are active backfills (`completed_at === null`)
## Why are the changes needed?
The backfill banner was not automatically updating its state when backfills completed, causing it to remain visible even after all backfill operations finished. Users had to manually refresh (F5) or navigate away and back to make the banner disappear.
**Issue reproduction:**
1. Start a backfill on any DAG - banner appears correctly
2. Wait for backfill to complete
3. Navigate around the UI - banner remains visible
4. Manual refresh (F5) was required to remove the completed banner
This created an inconsistent user experience compared to other auto-refreshing components in the Airflow UI.
## Does this PR introduce _any_ user-facing change?
**Yes** - The backfill banner will now automatically disappear when all backfills complete, without requiring manual page refresh. The banner will refresh at the configured interval (`auto_refresh_interval` setting) only when there are active backfills running.
## How was this patch tested?
- **Code pattern validation**: The implementation follows the exact same pattern used by other auto-refreshing components in the Airflow UI (DAGs list, HITL components, etc.)
- **Logic verification**: The conditional refresh logic (`completed_at === null`) ensures the banner only refreshes when there are actually active backfills to avoid unnecessary API calls
- **TypeScript compliance**: Proper typing added for query parameters to maintain code quality
**Testing approach:**
The fix leverages the existing `useAutoRefresh` utility which is already proven to work across the Airflow UI. The implementation is identical to other successful auto-refresh implementations, ensuring reliability and consistency.
<!-- Please keep an empty line above the dashes. -->
---
**^ Add meaningful description above**
Read the **[Pull Request Guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#pull-request-guidelines)** for more information.
In case of fundamental code changes, an Airflow Improvement Proposal ([AIP](https://cwiki.apache.org/confluence/display/AIRFLOW/Airflow+Improvement+Proposals)) is needed.
In case of a new dependency, check compliance with the [ASF 3rd Party License Policy](https://www.apache.org/legal/resolved.html#category-x).
In case of backwards incompatible changes please leave a note in a newsfragment file, named `{pr_number}.significant.rst` or `{issue_number}.significant.rst`, in [airflow-core/newsfragments](https://github.com/apache/airflow/tree/main/airflow-core/newsfragments).
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3339544584
@pierrejeambrun Sorry to bother you Pierre, I think I made the TS changes can you please tell me if there's anything else I need to do?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "bbovenzi (via GitHub)" <gi...@apache.org>.
bbovenzi commented on code in PR #56086:
URL: https://github.com/apache/airflow/pull/56086#discussion_r2388954113
##########
airflow-core/src/airflow/ui/rules/typescript.js:
##########
@@ -22,8 +22,9 @@
/**
* @import { FlatConfig } from "@typescript-eslint/utils/ts-eslint";
*/
-import typescript from "@typescript-eslint/eslint-plugin";
-import typescriptParser from "@typescript-eslint/parser";
+import tseslint from "typescript-eslint";
+
+const { parser: typescriptParser, plugin: typescript } = tseslint;
Review Comment:
Yes, let's please revert this change.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3340786751
Thanks for your patience @jscheffl I really appreciate it, I did try to test it locally first this time and it gave me no errors regarding my specific file change, please check again and hopefully it works this time!
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "jscheffl (via GitHub)" <gi...@apache.org>.
jscheffl commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3340560749
Static checks are failing.
Might be beneficial to run prek pre-commit hooks. See developer handbook hoe to install. See https://github.com/boschglobal/airflow/blob/main/contributing-docs/03_contributors_quick_start.rst
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "jscheffl (via GitHub)" <gi...@apache.org>.
jscheffl commented on code in PR #56086:
URL: https://github.com/apache/airflow/pull/56086#discussion_r2383946559
##########
airflow-core/src/airflow/ui/rules/typescript.js:
##########
@@ -22,8 +22,9 @@
/**
* @import { FlatConfig } from "@typescript-eslint/utils/ts-eslint";
*/
-import typescript from "@typescript-eslint/eslint-plugin";
-import typescriptParser from "@typescript-eslint/parser";
+import tseslint from "typescript-eslint";
+
+const { parser: typescriptParser, plugin: typescript } = tseslint;
Review Comment:
Is there a reason that you adjust typescript rules with your PR? If not please revert.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "jscheffl (via GitHub)" <gi...@apache.org>.
jscheffl commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3340486020
> @pierrejeambrun Sorry to bother you Pierre, I think I made the TS changes can you please tell me if there's anything else I need to do?
No, except the CI need to be green and a committer needs to review this is all you need to make. We only have added complexity if a major change is made (newsfragment).
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3348709957
My bad, I am doing that now
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy closed pull request #56086: fix: add auto-refresh to backfill banner
URL: https://github.com/apache/airflow/pull/56086
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3349007517
I will fix this mess, will delete all these commits and make a new final one. thanks for your patience
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "pierrejeambrun (via GitHub)" <gi...@apache.org>.
pierrejeambrun commented on code in PR #56086:
URL: https://github.com/apache/airflow/pull/56086#discussion_r2382441765
##########
airflow-core/src/airflow/ui/src/components/Banner/BackfillBanner.tsx:
##########
@@ -48,10 +50,17 @@ const buttonProps = {
const BackfillBanner = ({ dagId }: Props) => {
const { t: translate } = useTranslation("components");
+ const refetchInterval = useAutoRefresh({ dagId });
+
const { data, isLoading } = useBackfillServiceListBackfillsUi({
dagId,
+ }, undefined, {
+ refetchInterval: (query: any) =>
Review Comment:
```suggestion
refetchInterval: (query) =>
```
You don't need any here, typescript can infer the type.
That will most likley remove the need for manual typing bellow too.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "bbovenzi (via GitHub)" <gi...@apache.org>.
bbovenzi commented on code in PR #56086:
URL: https://github.com/apache/airflow/pull/56086#discussion_r2382923416
##########
airflow-core/src/airflow/ui/src/components/Banner/BackfillBanner.tsx:
##########
@@ -48,10 +50,17 @@ const buttonProps = {
const BackfillBanner = ({ dagId }: Props) => {
const { t: translate } = useTranslation("components");
+ const refetchInterval = useAutoRefresh({ dagId });
+
const { data, isLoading } = useBackfillServiceListBackfillsUi({
dagId,
+ }, undefined, {
+ refetchInterval: (query) =>
+ query.state.data?.backfills?.some((bf: BackfillResponse) => bf.completed_at === null)
Review Comment:
```suggestion
query.state.data?.backfills?.some((bf: BackfillResponse) => bf.completed_at === null && bf.is_paused === false)
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
Re: [PR] fix: add auto-refresh to backfill banner [airflow]
Posted by "omareltomy (via GitHub)" <gi...@apache.org>.
omareltomy commented on PR #56086:
URL: https://github.com/apache/airflow/pull/56086#issuecomment-3339580701
Thanks for the suggestion @bbovenzi
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org