@inventreedb/ui 0.0.1

package/src/tables/settings/ImportSessionTable.tsx

@@ -0,0 +1,175 @@
+import { t } from '@lingui/core/macro';
+import { useCallback, useMemo, useState } from 'react';
+
+import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
+import { ModelType } from '@lib/enums/ModelType';
+import { apiUrl } from '@lib/functions/Api';
+import type { TableFilter } from '@lib/types/Filters';
+import { AddItemButton } from '../../components/buttons/AddItemButton';
+import ImporterDrawer from '../../components/importer/ImporterDrawer';
+import { AttachmentLink } from '../../components/items/AttachmentLink';
+import { ProgressBar } from '../../components/items/ProgressBar';
+import { RenderUser } from '../../components/render/User';
+import { dataImporterSessionFields } from '../../forms/ImporterForms';
+import { useFilters } from '../../hooks/UseFilter';
+import {
+  useCreateApiFormModal,
+  useDeleteApiFormModal
+} from '../../hooks/UseForm';
+import { useTable } from '../../hooks/UseTable';
+import type { TableColumn } from '../Column';
+import { DateColumn, StatusColumn } from '../ColumnRenderers';
+import { StatusFilterOptions, UserFilter } from '../Filter';
+import { InvenTreeTable } from '../InvenTreeTable';
+import { type RowAction, RowDeleteAction } from '../RowActions';
+
+export default function ImportSessionTable() {
+  const table = useTable('importsession');
+
+  const [opened, setOpened] = useState<boolean>(false);
+
+  const [selectedSession, setSelectedSession] = useState<number | undefined>(
+    undefined
+  );
+
+  const deleteSession = useDeleteApiFormModal({
+    url: ApiEndpoints.import_session_list,
+    pk: selectedSession,
+    title: t`Delete Import Session`,
+    table: table
+  });
+
+  const newImportSession = useCreateApiFormModal({
+    url: ApiEndpoints.import_session_list,
+    title: t`Create Import Session`,
+    fields: dataImporterSessionFields(),
+    onFormSuccess: (response: any) => {
+      setSelectedSession(response.pk);
+      setOpened(true);
+      table.refreshTable();
+    }
+  });
+
+  const columns: TableColumn[] = useMemo(() => {
+    return [
+      {
+        accessor: 'model_type',
+        sortable: true
+      },
+      StatusColumn({ model: ModelType.importsession, accessor: 'status' }),
+      {
+        accessor: 'data_file',
+        render: (record: any) => (
+          <AttachmentLink attachment={record.data_file} />
+        ),
+        sortable: false,
+        noContext: true
+      },
+      DateColumn({
+        accessor: 'timestamp',
+        title: t`Uploaded`
+      }),
+      {
+        accessor: 'user',
+        sortable: false,
+        title: t`User`,
+        render: (record: any) => RenderUser({ instance: record.user_detail })
+      },
+      {
+        sortable: false,
+        accessor: 'row_count',
+        title: t`Imported Rows`,
+        render: (record: any) => (
+          <ProgressBar
+            progressLabel={true}
+            value={record.completed_row_count}
+            maximum={record.row_count}
+          />
+        )
+      }
+    ];
+  }, []);
+
+  const modelTypeFilters = useFilters({
+    url: apiUrl(ApiEndpoints.import_session_list),
+    method: 'OPTIONS',
+    accessor: 'data.actions.POST.model_type.choices',
+    transform: (item: any) => {
+      return {
+        value: item.value,
+        label: item.display_name
+      };
+    }
+  });
+
+  const tableFilters: TableFilter[] = useMemo(() => {
+    return [
+      {
+        name: 'model_type',
+        label: t`Model Type`,
+        description: t`Filter by target model type`,
+        choices: modelTypeFilters.choices
+      },
+      {
+        name: 'status',
+        label: t`Status`,
+        description: t`Filter by import session status`,
+        choiceFunction: StatusFilterOptions(ModelType.importsession)
+      },
+      UserFilter({})
+    ];
+  }, [modelTypeFilters.choices]);
+
+  const tableActions = useMemo(() => {
+    return [
+      <AddItemButton
+        key='create-import-session'
+        tooltip={t`Create Import Session`}
+        onClick={() => newImportSession.open()}
+      />
+    ];
+  }, []);
+
+  const rowActions = useCallback((record: any): RowAction[] => {
+    return [
+      RowDeleteAction({
+        onClick: () => {
+          setSelectedSession(record.pk);
+          deleteSession.open();
+        }
+      })
+    ];
+  }, []);
+
+  return (
+    <>
+      {newImportSession.modal}
+      {deleteSession.modal}
+      <InvenTreeTable
+        url={apiUrl(ApiEndpoints.import_session_list)}
+        tableState={table}
+        columns={columns}
+        props={{
+          rowActions: rowActions,
+          tableActions: tableActions,
+          tableFilters: tableFilters,
+          enableBulkDelete: true,
+          enableSelection: true,
+          onRowClick: (record: any) => {
+            setSelectedSession(record.pk);
+            setOpened(true);
+          }
+        }}
+      />
+      <ImporterDrawer
+        sessionId={selectedSession ?? -1}
+        opened={selectedSession !== undefined && opened}
+        onClose={() => {
+          setSelectedSession(undefined);
+          setOpened(false);
+          table.refreshTable();
+        }}
+      />
+    </>
+  );
+}

package/src/tables/settings/PendingTasksTable.tsx

@@ -0,0 +1,63 @@
+import { t } from '@lingui/core/macro';
+import { useMemo } from 'react';
+
+import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
+import { apiUrl } from '@lib/functions/Api';
+import { useTable } from '../../hooks/UseTable';
+import { useUserState } from '../../states/UserState';
+import type { TableColumn } from '../Column';
+import { InvenTreeTable } from '../InvenTreeTable';
+
+export default function PendingTasksTable({
+  onRecordsUpdated
+}: Readonly<{
+  onRecordsUpdated: () => void;
+}>) {
+  const table = useTable('tasks-pending');
+  const user = useUserState();
+
+  const columns: TableColumn[] = useMemo(() => {
+    return [
+      {
+        accessor: 'func',
+        title: t`Task`,
+        switchable: false
+      },
+      {
+        accessor: 'task_id',
+        title: t`Task ID`
+      },
+      {
+        accessor: 'name',
+        title: t`Name`
+      },
+      {
+        accessor: 'lock',
+        title: t`Created`,
+        sortable: true,
+        switchable: false
+      },
+      {
+        accessor: 'args',
+        title: t`Arguments`
+      },
+      {
+        accessor: 'kwargs',
+        title: t`Keywords`
+      }
+    ];
+  }, []);
+
+  return (
+    <InvenTreeTable
+      url={apiUrl(ApiEndpoints.task_pending_list)}
+      tableState={table}
+      columns={columns}
+      props={{
+        afterBulkDelete: onRecordsUpdated,
+        enableBulkDelete: user.isStaff(),
+        enableSelection: true
+      }}
+    />
+  );
+}

package/src/tables/settings/ProjectCodeTable.tsx

@@ -0,0 +1,115 @@
+import { t } from '@lingui/core/macro';
+import { useCallback, useMemo, useState } from 'react';
+
+import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
+import { UserRoles } from '@lib/enums/Roles';
+import { apiUrl } from '@lib/functions/Api';
+import { AddItemButton } from '../../components/buttons/AddItemButton';
+import { projectCodeFields } from '../../forms/CommonForms';
+import {
+  useCreateApiFormModal,
+  useDeleteApiFormModal,
+  useEditApiFormModal
+} from '../../hooks/UseForm';
+import { useTable } from '../../hooks/UseTable';
+import { useUserState } from '../../states/UserState';
+import type { TableColumn } from '../Column';
+import { DescriptionColumn, ResponsibleColumn } from '../ColumnRenderers';
+import { InvenTreeTable } from '../InvenTreeTable';
+import { type RowAction, RowDeleteAction, RowEditAction } from '../RowActions';
+
+/**
+ * Table for displaying list of project codes
+ */
+export default function ProjectCodeTable() {
+  const table = useTable('project-codes');
+
+  const user = useUserState();
+
+  const columns: TableColumn[] = useMemo(() => {
+    return [
+      {
+        accessor: 'code',
+        sortable: true
+      },
+      DescriptionColumn({}),
+      ResponsibleColumn({})
+    ];
+  }, []);
+
+  const newProjectCode = useCreateApiFormModal({
+    url: ApiEndpoints.project_code_list,
+    title: t`Add Project Code`,
+    fields: projectCodeFields(),
+    table: table
+  });
+
+  const [selectedProjectCode, setSelectedProjectCode] = useState<
+    number | undefined
+  >(undefined);
+
+  const editProjectCode = useEditApiFormModal({
+    url: ApiEndpoints.project_code_list,
+    pk: selectedProjectCode,
+    title: t`Edit Project Code`,
+    fields: projectCodeFields(),
+    table: table
+  });
+
+  const deleteProjectCode = useDeleteApiFormModal({
+    url: ApiEndpoints.project_code_list,
+    pk: selectedProjectCode,
+    title: t`Delete Project Code`,
+    table: table
+  });
+
+  const rowActions = useCallback(
+    (record: any): RowAction[] => {
+      return [
+        RowEditAction({
+          hidden: !user.hasChangeRole(UserRoles.admin),
+          onClick: () => {
+            setSelectedProjectCode(record.pk);
+            editProjectCode.open();
+          }
+        }),
+        RowDeleteAction({
+          hidden: !user.hasDeleteRole(UserRoles.admin),
+          onClick: () => {
+            setSelectedProjectCode(record.pk);
+            deleteProjectCode.open();
+          }
+        })
+      ];
+    },
+    [user]
+  );
+
+  const tableActions = useMemo(() => {
+    return [
+      <AddItemButton
+        key='add'
+        onClick={() => newProjectCode.open()}
+        tooltip={t`Add project code`}
+      />
+    ];
+  }, []);
+
+  return (
+    <>
+      {newProjectCode.modal}
+      {editProjectCode.modal}
+      {deleteProjectCode.modal}
+      <InvenTreeTable
+        url={apiUrl(ApiEndpoints.project_code_list)}
+        tableState={table}
+        columns={columns}
+        props={{
+          rowActions: rowActions,
+          tableActions: tableActions,
+          enableDownload: true
+        }}
+      />
+    </>
+  );
+}

package/src/tables/settings/ScheduledTasksTable.tsx

@@ -0,0 +1,62 @@
+import { t } from '@lingui/core/macro';
+import { Group, Text } from '@mantine/core';
+import { IconCircleCheck, IconCircleX } from '@tabler/icons-react';
+import { useMemo } from 'react';
+
+import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
+import { apiUrl } from '@lib/functions/Api';
+import { useTable } from '../../hooks/UseTable';
+import type { TableColumn } from '../Column';
+import { InvenTreeTable } from '../InvenTreeTable';
+
+export default function ScheduledTasksTable() {
+  const table = useTable('tasks-scheduled');
+
+  const columns: TableColumn[] = useMemo(() => {
+    return [
+      {
+        accessor: 'func',
+        title: t`Task`,
+        sortable: true,
+        switchable: false
+      },
+      {
+        accessor: 'last_run',
+        title: t`Last Run`,
+        sortable: true,
+        switchable: false,
+        render: (record: any) => {
+          if (!record.last_run) {
+            return '-';
+          }
+
+          return (
+            <Group justify='space-between'>
+              <Text>{record.last_run}</Text>
+              {record.success ? (
+                <IconCircleCheck color='green' />
+              ) : (
+                <IconCircleX color='red' />
+              )}
+            </Group>
+          );
+        }
+      },
+      {
+        accessor: 'next_run',
+        title: t`Next Run`,
+        sortable: true,
+        switchable: false
+      }
+    ];
+  }, []);
+
+  return (
+    <InvenTreeTable
+      url={apiUrl(ApiEndpoints.task_scheduled_list)}
+      tableState={table}
+      columns={columns}
+      props={{}}
+    />
+  );
+}

package/src/tables/settings/StocktakeReportTable.tsx

@@ -0,0 +1,111 @@
+import { t } from '@lingui/core/macro';
+import { useCallback, useMemo, useState } from 'react';
+
+import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
+import { apiUrl } from '@lib/functions/Api';
+import type { ApiFormFieldSet } from '@lib/types/Forms';
+import { AddItemButton } from '../../components/buttons/AddItemButton';
+import { AttachmentLink } from '../../components/items/AttachmentLink';
+import { RenderUser } from '../../components/render/User';
+import { generateStocktakeReportFields } from '../../forms/PartForms';
+import {
+  useCreateApiFormModal,
+  useDeleteApiFormModal
+} from '../../hooks/UseForm';
+import { useTable } from '../../hooks/UseTable';
+import type { TableColumn } from '../Column';
+import { DateColumn } from '../ColumnRenderers';
+import { InvenTreeTable } from '../InvenTreeTable';
+import { type RowAction, RowDeleteAction } from '../RowActions';
+
+export default function StocktakeReportTable() {
+  const table = useTable('stocktake-report');
+
+  const tableColumns: TableColumn[] = useMemo(() => {
+    return [
+      {
+        accessor: 'report',
+        title: t`Report`,
+        sortable: false,
+        switchable: false,
+        render: (record: any) => <AttachmentLink attachment={record.report} />,
+        noContext: true
+      },
+      {
+        accessor: 'part_count',
+        title: t`Part Count`,
+        sortable: false
+      },
+      DateColumn({
+        accessor: 'date',
+        title: t`Date`
+      }),
+      {
+        accessor: 'user',
+        title: t`User`,
+        sortable: false,
+        render: (record: any) => RenderUser({ instance: record.user_detail })
+      }
+    ];
+  }, []);
+
+  const [selectedReport, setSelectedReport] = useState<number | undefined>(
+    undefined
+  );
+
+  const deleteReport = useDeleteApiFormModal({
+    url: ApiEndpoints.part_stocktake_report_list,
+    pk: selectedReport,
+    title: t`Delete Report`,
+    onFormSuccess: () => table.refreshTable()
+  });
+
+  const generateFields: ApiFormFieldSet = useMemo(
+    () => generateStocktakeReportFields(),
+    []
+  );
+
+  const generateReport = useCreateApiFormModal({
+    url: ApiEndpoints.part_stocktake_report_generate,
+    title: t`Generate Stocktake Report`,
+    fields: generateFields,
+    successMessage: t`Stocktake report scheduled`
+  });
+
+  const tableActions = useMemo(() => {
+    return [
+      <AddItemButton
+        tooltip={t`New Stocktake Report`}
+        onClick={() => generateReport.open()}
+      />
+    ];
+  }, []);
+
+  const rowActions = useCallback((record: any): RowAction[] => {
+    return [
+      RowDeleteAction({
+        onClick: () => {
+          setSelectedReport(record.pk);
+          deleteReport.open();
+        }
+      })
+    ];
+  }, []);
+
+  return (
+    <>
+      {generateReport.modal}
+      {deleteReport.modal}
+      <InvenTreeTable
+        url={apiUrl(ApiEndpoints.part_stocktake_report_list)}
+        tableState={table}
+        columns={tableColumns}
+        props={{
+          enableSearch: false,
+          rowActions: rowActions,
+          tableActions: tableActions
+        }}
+      />
+    </>
+  );
+}