diff --git a/.changeset/devtools-refresh-after-scheduled-task-action.md b/.changeset/devtools-refresh-after-scheduled-task-action.md new file mode 100644 index 0000000000..07e4dc1f8a --- /dev/null +++ b/.changeset/devtools-refresh-after-scheduled-task-action.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-devtools': patch +--- + +Scheduled Tasks page now refreshes its table automatically after a task is triggered or cancelled, so the updated status is visible without reloading the browser. diff --git a/plugins/devtools/src/components/Content/ScheduledTasksContent/ScheduledTasksContent.tsx b/plugins/devtools/src/components/Content/ScheduledTasksContent/ScheduledTasksContent.tsx index af86b9b237..35e218dbc1 100644 --- a/plugins/devtools/src/components/Content/ScheduledTasksContent/ScheduledTasksContent.tsx +++ b/plugins/devtools/src/components/Content/ScheduledTasksContent/ScheduledTasksContent.tsx @@ -105,7 +105,8 @@ export const ScheduledTasksContent = () => { const plugins = configApi.getOptionalStringArray('devTools.scheduledTasks.plugins') || []; const [selectedPlugin, setSelectedPlugin] = useState(plugins[0] || ''); - const { scheduledTasks, loading, error } = useScheduledTasks(selectedPlugin); + const { scheduledTasks, loading, error, refresh } = + useScheduledTasks(selectedPlugin); const { triggerTask, cancelTask, isLoading } = useScheduledTasksOperations(); const [inputValue, setInputValue] = useState(''); @@ -227,6 +228,8 @@ export const ScheduledTasksContent = () => { message: `Error triggering task ${rowData.taskId}: ${e.message}`, severity: 'error', }); + } finally { + refresh(); } }} > @@ -249,6 +252,8 @@ export const ScheduledTasksContent = () => { message: `Error cancelling task ${rowData.taskId}: ${e.message}`, severity: 'error', }); + } finally { + refresh(); } }} > diff --git a/plugins/devtools/src/hooks/useScheduledTasks.ts b/plugins/devtools/src/hooks/useScheduledTasks.ts index 2797526dec..77f888a28e 100644 --- a/plugins/devtools/src/hooks/useScheduledTasks.ts +++ b/plugins/devtools/src/hooks/useScheduledTasks.ts @@ -15,7 +15,7 @@ */ import { devToolsApiRef } from '../api'; import { useApi } from '@backstage/core-plugin-api'; -import useAsync from 'react-use/esm/useAsync'; +import useAsyncRetry from 'react-use/esm/useAsyncRetry'; export const useScheduledTasks = (plugin: string) => { const api = useApi(devToolsApiRef); @@ -24,7 +24,8 @@ export const useScheduledTasks = (plugin: string) => { value, loading, error: asyncError, - } = useAsync(async () => { + retry: refresh, + } = useAsyncRetry(async () => { return api.getScheduledTasksByPlugin(plugin); }, [api, plugin]); @@ -33,6 +34,7 @@ export const useScheduledTasks = (plugin: string) => { scheduledTasks: undefined, loading: false, error: asyncError.message, + refresh, }; } @@ -40,5 +42,6 @@ export const useScheduledTasks = (plugin: string) => { scheduledTasks: value?.scheduledTasks, loading, error: value?.error, + refresh, }; };