Running worker status (#7215)

* Add more information to the TaskManagement panel

- Overview of task counts
- Display alert if background worker is not running

* Add a divider
This commit is contained in:
Oliver 2024-05-14 13:59:06 +10:00 committed by GitHub
parent 90e15b6bf3
commit 21209d6242
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 86 additions and 30 deletions

View File

@ -23,7 +23,8 @@ export function useInstance<T = any>({
hasPrimaryKey = true, hasPrimaryKey = true,
refetchOnMount = true, refetchOnMount = true,
refetchOnWindowFocus = false, refetchOnWindowFocus = false,
throwError = false throwError = false,
updateInterval
}: { }: {
endpoint: ApiEndpoints; endpoint: ApiEndpoints;
pk?: string | undefined; pk?: string | undefined;
@ -34,6 +35,7 @@ export function useInstance<T = any>({
refetchOnMount?: boolean; refetchOnMount?: boolean;
refetchOnWindowFocus?: boolean; refetchOnWindowFocus?: boolean;
throwError?: boolean; throwError?: boolean;
updateInterval?: number;
}) { }) {
const [instance, setInstance] = useState<T | undefined>(defaultValue); const [instance, setInstance] = useState<T | undefined>(defaultValue);
@ -74,7 +76,8 @@ export function useInstance<T = any>({
}); });
}, },
refetchOnMount: refetchOnMount, refetchOnMount: refetchOnMount,
refetchOnWindowFocus: refetchOnWindowFocus refetchOnWindowFocus: refetchOnWindowFocus,
refetchInterval: updateInterval
}); });
const refreshInstance = useCallback(function () { const refreshInstance = useCallback(function () {

View File

@ -1,9 +1,19 @@
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Accordion } from '@mantine/core'; import {
Accordion,
Alert,
Divider,
Paper,
SimpleGrid,
Stack,
Text
} from '@mantine/core';
import { lazy } from 'react'; import { lazy } from 'react';
import { StylishText } from '../../../../components/items/StylishText'; import { StylishText } from '../../../../components/items/StylishText';
import { ApiEndpoints } from '../../../../enums/ApiEndpoints';
import { Loadable } from '../../../../functions/loading'; import { Loadable } from '../../../../functions/loading';
import { useInstance } from '../../../../hooks/UseInstance';
const PendingTasksTable = Loadable( const PendingTasksTable = Loadable(
lazy(() => import('../../../../tables/settings/PendingTasksTable')) lazy(() => import('../../../../tables/settings/PendingTasksTable'))
@ -17,33 +27,76 @@ const FailedTasksTable = Loadable(
lazy(() => import('../../../../tables/settings/FailedTasksTable')) lazy(() => import('../../../../tables/settings/FailedTasksTable'))
); );
export default function TaskManagementPanel() { function TaskCountOverview({ title, value }: { title: string; value: number }) {
return ( return (
<Accordion defaultValue="pending"> <Paper p="md" shadow="xs">
<Accordion.Item value="pending" key="pending-tasks"> <Stack gap="xs">
<Accordion.Control> <StylishText size="md">{title}</StylishText>
<StylishText size="lg">{t`Pending Tasks`}</StylishText> <Text>{value}</Text>
</Accordion.Control> </Stack>
<Accordion.Panel> </Paper>
<PendingTasksTable /> );
</Accordion.Panel> }
</Accordion.Item>
<Accordion.Item value="scheduled" key="scheduled-tasks"> export default function TaskManagementPanel() {
<Accordion.Control> const { instance: taskInfo } = useInstance({
<StylishText size="lg">{t`Scheduled Tasks`}</StylishText> endpoint: ApiEndpoints.task_overview,
</Accordion.Control> hasPrimaryKey: false,
<Accordion.Panel> refetchOnMount: true,
<ScheduledTasksTable /> defaultValue: {},
</Accordion.Panel> updateInterval: 30 * 1000
</Accordion.Item> });
<Accordion.Item value="failed" key="failed-tasks">
<Accordion.Control> return (
<StylishText size="lg">{t`Failed Tasks`}</StylishText> <>
</Accordion.Control> {!taskInfo.is_running && (
<Accordion.Panel> <Alert title={t`Background Worker Not Running`} color="red">
<FailedTasksTable /> <Text>{t`The background task manager service is not running. Contact your system administrator.`}</Text>
</Accordion.Panel> </Alert>
</Accordion.Item> )}
</Accordion> <Stack gap="xs">
<SimpleGrid cols={3} spacing="xs">
<TaskCountOverview
title={t`Pending Tasks`}
value={taskInfo?.pending_tasks}
/>
<TaskCountOverview
title={t`Scheduled Tasks`}
value={taskInfo?.scheduled_tasks}
/>
<TaskCountOverview
title={t`Failed Tasks`}
value={taskInfo?.failed_tasks}
/>
</SimpleGrid>
<Divider />
<Accordion defaultValue="pending">
<Accordion.Item value="pending" key="pending-tasks">
<Accordion.Control>
<StylishText size="lg">{t`Pending Tasks`}</StylishText>
</Accordion.Control>
<Accordion.Panel>
<PendingTasksTable />
</Accordion.Panel>
</Accordion.Item>
<Accordion.Item value="scheduled" key="scheduled-tasks">
<Accordion.Control>
<StylishText size="lg">{t`Scheduled Tasks`}</StylishText>
</Accordion.Control>
<Accordion.Panel>
<ScheduledTasksTable />
</Accordion.Panel>
</Accordion.Item>
<Accordion.Item value="failed" key="failed-tasks">
<Accordion.Control>
<StylishText size="lg">{t`Failed Tasks`}</StylishText>
</Accordion.Control>
<Accordion.Panel>
<FailedTasksTable />
</Accordion.Panel>
</Accordion.Item>
</Accordion>
</Stack>
</>
); );
} }