diff --git a/src/frontend/src/components/tables/plugin/PluginListTable.tsx b/src/frontend/src/components/tables/plugin/PluginListTable.tsx index 7dfe681e31..e0c352eaa4 100644 --- a/src/frontend/src/components/tables/plugin/PluginListTable.tsx +++ b/src/frontend/src/components/tables/plugin/PluginListTable.tsx @@ -1,14 +1,18 @@ import { t } from '@lingui/macro'; -import { Group, Text, Tooltip } from '@mantine/core'; +import { Alert, Group, Stack, Text, Tooltip } from '@mantine/core'; +import { modals } from '@mantine/modals'; +import { notifications } from '@mantine/notifications'; import { IconCircleCheck, IconCircleX, IconHelpCircle } from '@tabler/icons-react'; -import { useMemo } from 'react'; +import { useCallback, useMemo } from 'react'; +import { api } from '../../../App'; import { useTableRefresh } from '../../../hooks/TableRefresh'; import { ApiPaths, apiUrl } from '../../../states/ApiState'; +import { StylishText } from '../../items/StylishText'; import { TableColumn } from '../Column'; import { InvenTreeTable, InvenTreeTableProps } from '../InvenTreeTable'; import { RowAction } from '../RowActions'; @@ -92,6 +96,80 @@ export function PluginListTable({ props }: { props: InvenTreeTableProps }) { [] ); + const activatePlugin = useCallback( + (plugin_id: number, plugin_name: string, active: boolean) => { + modals.openConfirmModal({ + title: ( + + {active ? t`Activate Plugin` : t`Deactivate Plugin`} + + ), + children: ( + } + title={ + active + ? t`Confirm plugin activation` + : t`Confirm plugin deactivation` + } + > + + + {active + ? t`The following plugin will be activated` + : t`The following plugin will be deactivated`} + : + + + {plugin_name} + + + + ), + labels: { + cancel: t`Cancel`, + confirm: t`Confirm` + }, + onConfirm: () => { + let url = apiUrl(ApiPaths.plugin_list, plugin_id) + 'activate/'; + + const id = 'plugin-activate'; + + // Show a progress notification + notifications.show({ + id: id, + message: active ? t`Activating plugin` : t`Deactivating plugin`, + loading: true + }); + + api + .patch(url, { active: active }) + .then(() => { + refreshTable(); + notifications.hide(id); + notifications.show({ + title: t`Plugin updated`, + message: active + ? t`The plugin was activated` + : t`The plugin was deactivated`, + color: 'green' + }); + }) + .catch((_err) => { + notifications.hide(id); + notifications.show({ + title: t`Error`, + message: t`Error updating plugin`, + color: 'red' + }); + }); + } + }); + }, + [] + ); + // Determine available actions for a given plugin function rowActions(record: any): RowAction[] { let actions: RowAction[] = []; @@ -101,13 +179,19 @@ export function PluginListTable({ props }: { props: InvenTreeTableProps }) { actions.push({ title: t`Deactivate`, color: 'red', - icon: + icon: , + onClick: () => { + activatePlugin(record.pk, record.name, false); + } }); } else { actions.push({ title: t`Activate`, color: 'green', - icon: + icon: , + onClick: () => { + activatePlugin(record.pk, record.name, true); + } }); } }