@inventreedb/ui 0.0.1 → 0.0.2

package/src/tables/settings/BarcodeScanHistoryTable.tsx

@@ -1,281 +0,0 @@
-import { t } from '@lingui/core/macro';
-import {
-  Alert,
-  Badge,
-  Divider,
-  Drawer,
-  Group,
-  type MantineStyleProp,
-  Stack,
-  Table,
-  Text
-} from '@mantine/core';
-import { useDisclosure } from '@mantine/hooks';
-import { IconExclamationCircle } from '@tabler/icons-react';
-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 type { TableFilter } from '@lib/types/Filters';
-import { CopyButton } from '../../components/buttons/CopyButton';
-import { PassFailButton } from '../../components/buttons/YesNoButton';
-import { StylishText } from '../../components/items/StylishText';
-import { RenderUser } from '../../components/render/User';
-import { shortenString } from '../../functions/tables';
-import { useDeleteApiFormModal } from '../../hooks/UseForm';
-import { useTable } from '../../hooks/UseTable';
-import { useGlobalSettingsState } from '../../states/SettingsState';
-import { useUserState } from '../../states/UserState';
-import type { TableColumn } from '../Column';
-import { UserFilter } from '../Filter';
-import { InvenTreeTable } from '../InvenTreeTable';
-import { RowDeleteAction } from '../RowActions';
-
-/*
- * Render detail information for a particular barcode scan result.
- */
-function BarcodeScanDetail({ scan }: Readonly<{ scan: any }>) {
-  const dataStyle: MantineStyleProp = {
-    textWrap: 'wrap',
-    lineBreak: 'auto',
-    wordBreak: 'break-word'
-  };
-
-  const hasResponseData = useMemo(() => {
-    return scan.response && Object.keys(scan.response).length > 0;
-  }, [scan.response]);
-
-  const hasContextData = useMemo(() => {
-    return scan.context && Object.keys(scan.context).length > 0;
-  }, [scan.context]);
-
-  return (
-    <Stack gap='xs'>
-      <Divider />
-      <Table>
-        <Table.Tbody>
-          <Table.Tr>
-            <Table.Td colSpan={2}>
-              <StylishText size='sm'>{t`Barcode Information`}</StylishText>
-            </Table.Td>
-          </Table.Tr>
-          <Table.Tr>
-            <Table.Th>{t`Barcode`}</Table.Th>
-            <Table.Td>
-              <Text size='sm' style={dataStyle}>
-                {scan.data}
-              </Text>
-            </Table.Td>
-            <Table.Td>
-              <CopyButton value={scan.data} size='xs' />
-            </Table.Td>
-          </Table.Tr>
-          <Table.Tr>
-            <Table.Th>{t`Timestamp`}</Table.Th>
-            <Table.Td>{scan.timestamp}</Table.Td>
-          </Table.Tr>
-          <Table.Tr>
-            <Table.Th>{t`User`}</Table.Th>
-            <Table.Td>
-              <RenderUser instance={scan.user_detail} />
-            </Table.Td>
-          </Table.Tr>
-          <Table.Tr>
-            <Table.Th>{t`Endpoint`}</Table.Th>
-            <Table.Td>{scan.endpoint}</Table.Td>
-          </Table.Tr>
-          <Table.Tr>
-            <Table.Th>{t`Result`}</Table.Th>
-            <Table.Td>
-              <PassFailButton value={scan.result} />
-            </Table.Td>
-          </Table.Tr>
-          {hasContextData && (
-            <Table.Tr>
-              <Table.Td colSpan={2}>
-                <StylishText size='sm'>{t`Context`}</StylishText>
-              </Table.Td>
-            </Table.Tr>
-          )}
-          {hasContextData &&
-            Object.keys(scan.context).map((key) => (
-              <Table.Tr key={key}>
-                <Table.Th>{key}</Table.Th>
-                <Table.Td>
-                  <Text size='sm' style={dataStyle}>
-                    {scan.context[key]}
-                  </Text>
-                </Table.Td>
-                <Table.Td>
-                  <CopyButton value={scan.context[key]} size='xs' />
-                </Table.Td>
-              </Table.Tr>
-            ))}
-          {hasResponseData && (
-            <Table.Tr>
-              <Table.Td colSpan={2}>
-                <StylishText size='sm'>{t`Response`}</StylishText>
-              </Table.Td>
-            </Table.Tr>
-          )}
-          {hasResponseData &&
-            Object.keys(scan.response).map((key) => (
-              <Table.Tr key={key}>
-                <Table.Th>{key}</Table.Th>
-                <Table.Td>
-                  <Text size='sm' style={dataStyle}>
-                    {scan.response[key]}
-                  </Text>
-                </Table.Td>
-                <Table.Td>
-                  <CopyButton value={scan.response[key]} size='xs' />
-                </Table.Td>
-              </Table.Tr>
-            ))}
-        </Table.Tbody>
-      </Table>
-    </Stack>
-  );
-}
-
-/*
- * Display the barcode scan history table
- */
-export default function BarcodeScanHistoryTable() {
-  const user = useUserState();
-  const table = useTable('barcode-history');
-
-  const globalSettings = useGlobalSettingsState();
-
-  const [opened, { open, close }] = useDisclosure(false);
-
-  const tableColumns: TableColumn[] = useMemo(() => {
-    return [
-      {
-        accessor: 'timestamp',
-        sortable: true,
-        switchable: false,
-        render: (record: any) => {
-          return (
-            <Group justify='space-between' wrap='nowrap'>
-              <Text>{record.timestamp}</Text>
-              {record.user_detail && (
-                <Badge size='xs'>{record.user_detail.username}</Badge>
-              )}
-            </Group>
-          );
-        }
-      },
-      {
-        accessor: 'data',
-        sortable: false,
-        switchable: true,
-        render: (record: any) => {
-          return (
-            <Text
-              size='xs'
-              style={{
-                textWrap: 'wrap',
-                lineBreak: 'auto',
-                wordBreak: 'break-word'
-              }}
-            >
-              {shortenString({ str: record.data, len: 100 })}
-            </Text>
-          );
-        }
-      },
-      {
-        accessor: 'endpoint',
-        sortable: true
-      },
-      {
-        accessor: 'result',
-        sortable: true,
-        render: (record: any) => {
-          return <PassFailButton value={record.result} />;
-        }
-      }
-    ];
-  }, []);
-
-  const filters: TableFilter[] = useMemo(() => {
-    return [
-      UserFilter({}),
-      {
-        name: 'result',
-        label: t`Result`,
-        description: t`Filter by result`
-      }
-    ];
-  }, []);
-
-  const canDelete: boolean = useMemo(() => {
-    return user.isStaff() && user.hasDeleteRole(UserRoles.admin);
-  }, [user]);
-
-  const [selectedResult, setSelectedResult] = useState<any>({});
-
-  const deleteResult = useDeleteApiFormModal({
-    url: ApiEndpoints.barcode_history,
-    pk: selectedResult.pk,
-    title: t`Delete Barcode Scan Record`,
-    table: table
-  });
-
-  const rowActions = useCallback(
-    (record: any) => {
-      return [
-        RowDeleteAction({
-          hidden: !canDelete,
-          onClick: () => {
-            setSelectedResult(record);
-            deleteResult.open();
-          }
-        })
-      ];
-    },
-    [canDelete, user]
-  );
-
-  return (
-    <>
-      {deleteResult.modal}
-      <Drawer
-        opened={opened}
-        size='xl'
-        position='right'
-        title={<StylishText>{t`Barcode Scan Details`}</StylishText>}
-        onClose={close}
-      >
-        <BarcodeScanDetail scan={selectedResult} />
-      </Drawer>
-      <Stack gap='xs'>
-        {!globalSettings.isSet('BARCODE_STORE_RESULTS') && (
-          <Alert
-            color='red'
-            icon={<IconExclamationCircle />}
-            title={t`Logging Disabled`}
-          >
-            <Text>{t`Barcode logging is not enabled`}</Text>
-          </Alert>
-        )}
-        <InvenTreeTable
-          url={apiUrl(ApiEndpoints.barcode_history)}
-          tableState={table}
-          columns={tableColumns}
-          props={{
-            tableFilters: filters,
-            enableBulkDelete: canDelete,
-            rowActions: rowActions,
-            onRowClick: (row) => {
-              setSelectedResult(row);
-              open();
-            }
-          }}
-        />
-      </Stack>
-    </>
-  );
-}

package/src/tables/settings/CustomStateTable.tsx

@@ -1,226 +0,0 @@
-import { t } from '@lingui/core/macro';
-import { Badge } from '@mantine/core';
-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 type { TableFilter } from '@lib/types/Filters';
-import { AddItemButton } from '../../components/buttons/AddItemButton';
-import type {
-  StatusCodeInterface,
-  StatusCodeListInterface
-} from '../../components/render/StatusRenderer';
-import { statusColorMap } from '../../defaults/backendMappings';
-import { useCustomStateFields } from '../../forms/CommonForms';
-import {
-  useCreateApiFormModal,
-  useDeleteApiFormModal,
-  useEditApiFormModal
-} from '../../hooks/UseForm';
-import { useTable } from '../../hooks/UseTable';
-import { useGlobalStatusState } from '../../states/StatusState';
-import { useUserState } from '../../states/UserState';
-import type { TableColumn } from '../Column';
-import { InvenTreeTable } from '../InvenTreeTable';
-import {
-  type RowAction,
-  RowDeleteAction,
-  RowDuplicateAction,
-  RowEditAction
-} from '../RowActions';
-
-/**
- * Table for displaying list of custom states
- */
-export default function CustomStateTable() {
-  const table = useTable('customstates');
-
-  const statusCodes = useGlobalStatusState();
-
-  // Find the associated logical state key
-  const getLogicalState = useCallback(
-    (group: string, key: number) => {
-      const valuesList = Object.values(statusCodes.status ?? {}).find(
-        (value: StatusCodeListInterface) => value.status_class === group
-      );
-
-      const value = Object.values(valuesList?.values ?? {}).find(
-        (value: StatusCodeInterface) => value.key === key
-      );
-
-      return value?.label ?? value?.name ?? '';
-    },
-    [statusCodes]
-  );
-
-  const user = useUserState();
-
-  const tableFilters: TableFilter[] = useMemo(() => {
-    return [
-      {
-        name: 'reference_status',
-        label: t`Status Group`,
-        field_type: 'choice',
-        choices: Object.values(statusCodes.status ?? {}).map(
-          (value: StatusCodeListInterface) => ({
-            label: value.status_class,
-            value: value.status_class
-          })
-        )
-      }
-    ];
-  }, [statusCodes]);
-
-  const columns: TableColumn[] = useMemo(() => {
-    return [
-      {
-        accessor: 'reference_status',
-        title: t`Status`,
-        sortable: true
-      },
-      {
-        accessor: 'logical_key',
-        title: t`Logical State`,
-        sortable: true,
-        render: (record: any) => {
-          const stateText = getLogicalState(
-            record.reference_status,
-            record.logical_key
-          );
-          return stateText ? stateText : record.logical_key;
-        }
-      },
-      {
-        accessor: 'name',
-        title: t`Identifier`,
-        sortable: true
-      },
-      {
-        accessor: 'label',
-        title: t`Display Name`,
-        sortable: true
-      },
-      {
-        accessor: 'key',
-        sortable: true
-      },
-      {
-        accessor: 'color',
-        render: (record: any) => {
-          return (
-            <Badge
-              color={statusColorMap[record.color] || statusColorMap['default']}
-              variant='filled'
-              size='xs'
-            >
-              {record.color}
-            </Badge>
-          );
-        }
-      }
-    ];
-  }, [getLogicalState]);
-
-  const newCustomStateFields = useCustomStateFields();
-  const duplicateCustomStateFields = useCustomStateFields();
-  const editCustomStateFields = useCustomStateFields();
-
-  const [initialStateData, setInitialStateData] = useState<any>({});
-
-  const newCustomState = useCreateApiFormModal({
-    url: ApiEndpoints.custom_state_list,
-    title: t`Add State`,
-    fields: newCustomStateFields,
-    table: table
-  });
-
-  const duplicateCustomState = useCreateApiFormModal({
-    url: ApiEndpoints.custom_state_list,
-    title: t`Add State`,
-    fields: duplicateCustomStateFields,
-    initialData: initialStateData,
-    table: table
-  });
-
-  const [selectedCustomState, setSelectedCustomState] = useState<
-    number | undefined
-  >(undefined);
-
-  const editCustomState = useEditApiFormModal({
-    url: ApiEndpoints.custom_state_list,
-    pk: selectedCustomState,
-    title: t`Edit State`,
-    fields: editCustomStateFields,
-    table: table
-  });
-
-  const deleteCustomState = useDeleteApiFormModal({
-    url: ApiEndpoints.custom_state_list,
-    pk: selectedCustomState,
-    title: t`Delete State`,
-    table: table
-  });
-
-  const rowActions = useCallback(
-    (record: any): RowAction[] => {
-      return [
-        RowEditAction({
-          hidden: !user.hasChangeRole(UserRoles.admin),
-          onClick: () => {
-            setSelectedCustomState(record.pk);
-            editCustomState.open();
-          }
-        }),
-        RowDuplicateAction({
-          hidden: !user.hasAddRole(UserRoles.admin),
-          onClick: () => {
-            setInitialStateData(record);
-            duplicateCustomState.open();
-          }
-        }),
-        RowDeleteAction({
-          hidden: !user.hasDeleteRole(UserRoles.admin),
-          onClick: () => {
-            setSelectedCustomState(record.pk);
-            deleteCustomState.open();
-          }
-        })
-      ];
-    },
-    [user]
-  );
-
-  const tableActions = useMemo(() => {
-    return [
-      <AddItemButton
-        key={'add'}
-        onClick={() => {
-          setInitialStateData({});
-          newCustomState.open();
-        }}
-        tooltip={t`Add State`}
-      />
-    ];
-  }, []);
-
-  return (
-    <>
-      {newCustomState.modal}
-      {editCustomState.modal}
-      {duplicateCustomState.modal}
-      {deleteCustomState.modal}
-      <InvenTreeTable
-        url={apiUrl(ApiEndpoints.custom_state_list)}
-        tableState={table}
-        columns={columns}
-        props={{
-          rowActions: rowActions,
-          tableActions: tableActions,
-          tableFilters: tableFilters,
-          enableDownload: true
-        }}
-      />
-    </>
-  );
-}

package/src/tables/settings/CustomUnitsTable.tsx

@@ -1,125 +0,0 @@
-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 { customUnitsFields } 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 { InvenTreeTable } from '../InvenTreeTable';
-import { type RowAction, RowDeleteAction, RowEditAction } from '../RowActions';
-
-/**
- * Table for displaying list of custom physical units
- */
-export default function CustomUnitsTable() {
-  const table = useTable('custom-units');
-
-  const user = useUserState();
-
-  const columns: TableColumn[] = useMemo(() => {
-    return [
-      {
-        accessor: 'name',
-        switchable: false,
-        sortable: true
-      },
-      {
-        accessor: 'definition',
-        switchable: false,
-        sortable: false
-      },
-      {
-        accessor: 'symbol',
-        switchable: false,
-        sortable: true
-      }
-    ];
-  }, []);
-
-  const newUnit = useCreateApiFormModal({
-    url: ApiEndpoints.custom_unit_list,
-    title: t`Add Custom Unit`,
-    fields: customUnitsFields(),
-    table: table
-  });
-
-  const [selectedUnit, setSelectedUnit] = useState<number>(-1);
-
-  const editUnit = useEditApiFormModal({
-    url: ApiEndpoints.custom_unit_list,
-    pk: selectedUnit,
-    title: t`Edit Custom Unit`,
-    fields: customUnitsFields(),
-    onFormSuccess: (record: any) => table.updateRecord(record)
-  });
-
-  const deleteUnit = useDeleteApiFormModal({
-    url: ApiEndpoints.custom_unit_list,
-    pk: selectedUnit,
-    title: t`Delete Custom Unit`,
-    table: table
-  });
-
-  const rowActions = useCallback(
-    (record: any): RowAction[] => {
-      return [
-        RowEditAction({
-          hidden: !user.hasChangeRole(UserRoles.admin),
-          onClick: () => {
-            setSelectedUnit(record.pk);
-            editUnit.open();
-          }
-        }),
-        RowDeleteAction({
-          hidden: !user.hasDeleteRole(UserRoles.admin),
-          onClick: () => {
-            setSelectedUnit(record.pk);
-            deleteUnit.open();
-          }
-        })
-      ];
-    },
-    [user]
-  );
-
-  const tableActions = useMemo(() => {
-    const actions = [];
-
-    actions.push(
-      <AddItemButton
-        tooltip={t`Add custom unit`}
-        onClick={() => newUnit.open()}
-        hidden={!user.isStaff() || !user.hasChangeRole(UserRoles.admin)}
-      />
-    );
-
-    return actions;
-  }, [user]);
-
-  return (
-    <>
-      {newUnit.modal}
-      {editUnit.modal}
-      {deleteUnit.modal}
-      <InvenTreeTable
-        url={apiUrl(ApiEndpoints.custom_unit_list)}
-        tableState={table}
-        columns={columns}
-        props={{
-          rowActions: rowActions,
-          tableActions: tableActions,
-          enableDownload: true
-        }}
-      />
-    </>
-  );
-}