Small typescript cleanups (#7685)

* cleanup typescript:S1128 * fix typescript:S1854 * clean up typescript:S6749 * fix names for typescript:S6754
2024-08-30 18:33:04 +00:00 · 2024-07-19 00:50:53 +02:00 · 2024-07-19 00:50:53 +02:00 · 0a2817dbf3
commit 0a2817dbf3
parent 0f1645e389
42 changed files with 198 additions and 260 deletions
--- a/src/frontend/src/components/DashboardItemProxy.tsx
+++ b/src/frontend/src/components/DashboardItemProxy.tsx
@ -31,7 +31,7 @@ export function DashboardItemProxy({
    queryFn: fetchData,
    refetchOnWindowFocus: autoupdate
  });
-  const [dashdata, setDashData] = useState({ title: t`Title`, value: '000' });
+  const [dashData, setDashData] = useState({ title: t`Title`, value: '000' });

  useEffect(() => {
    if (data) {
@ -44,7 +44,7 @@ export function DashboardItemProxy({
    <div key={id}>
      <StatisticItem
        id={id}
-        data={dashdata}
+        data={dashData}
        isLoading={isLoading || isFetching}
      />
    </div>
--- a/src/frontend/src/components/buttons/AdminButton.tsx
+++ b/src/frontend/src/components/buttons/AdminButton.tsx
@ -1,11 +1,8 @@
 import { t } from '@lingui/macro';
 import { IconUserStar } from '@tabler/icons-react';
 import { useCallback, useMemo } from 'react';
-import { useNavigate } from 'react-router-dom';

 import { ModelType } from '../../enums/ModelType';
-import { navigateToLink } from '../../functions/navigation';
-import { base_url } from '../../main';
 import { useLocalState } from '../../states/LocalState';
 import { useUserState } from '../../states/UserState';
 import { ModelInformationDict } from '../render/ModelType';
--- a/src/frontend/src/components/buttons/PrintingActions.tsx
+++ b/src/frontend/src/components/buttons/PrintingActions.tsx
@ -2,7 +2,7 @@ import { t } from '@lingui/macro';
 import { notifications } from '@mantine/notifications';
 import { IconPrinter, IconReport, IconTags } from '@tabler/icons-react';
 import { useQuery } from '@tanstack/react-query';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';

 import { api } from '../../App';
 import { ApiEndpoints } from '../../enums/ApiEndpoints';
--- a/src/frontend/src/components/details/DetailsImage.tsx
+++ b/src/frontend/src/components/details/DetailsImage.tsx
@ -85,7 +85,7 @@ function UploadModal({
  apiPath: string;
  setImage: (image: string) => void;
 }) {
-  const [file1, setFile] = useState<FileWithPath | null>(null);
+  const [currentFile, setCurrentFile] = useState<FileWithPath | null>(null);
  let uploading = false;

  // Components to show in the Dropzone when no file is selected
@ -168,7 +168,7 @@ function UploadModal({
  return (
    <Paper style={{ height: '220px' }}>
      <Dropzone
-        onDrop={(files) => setFile(files[0])}
+        onDrop={(files) => setCurrentFile(files[0])}
        maxFiles={1}
        accept={IMAGE_MIME_TYPE}
        loading={uploading}
@ -198,7 +198,9 @@ function UploadModal({
              }}
            />
          </Dropzone.Reject>
-          <Dropzone.Idle>{file1 ? fileInfo(file1) : noFileIdle}</Dropzone.Idle>
+          <Dropzone.Idle>
+            {currentFile ? fileInfo(currentFile) : noFileIdle}
+          </Dropzone.Idle>
        </Group>
      </Dropzone>
      <Paper
@ -218,12 +220,15 @@ function UploadModal({
      >
        <Button
          variant="outline"
-          disabled={!file1}
-          onClick={() => setFile(null)}
+          disabled={!currentFile}
+          onClick={() => setCurrentFile(null)}
        >
          <Trans>Clear</Trans>
        </Button>
-        <Button disabled={!file1} onClick={() => uploadImage(file1)}>
+        <Button
+          disabled={!currentFile}
+          onClick={() => uploadImage(currentFile)}
+        >
          <Trans>Submit</Trans>
        </Button>
      </Paper>
@ -354,7 +359,6 @@ export function DetailsImage(props: Readonly<DetailImageProps>) {
  };

  return (
-    <>
    <AspectRatio ref={ref} maw={IMAGE_DIMENSION} ratio={1} pos="relative">
      <>
        <ApiImage
@ -363,9 +367,7 @@ export function DetailsImage(props: Readonly<DetailImageProps>) {
          maw={IMAGE_DIMENSION}
          onClick={expandImage}
        />
-          {permissions.hasChangeRole(props.appRole) &&
-            hasOverlay &&
-            hovered && (
+        {permissions.hasChangeRole(props.appRole) && hasOverlay && hovered && (
          <Overlay color="black" opacity={0.8} onClick={expandImage}>
            <ImageActionButtons
              visible={hovered}
@ -379,6 +381,5 @@ export function DetailsImage(props: Readonly<DetailImageProps>) {
        )}
      </>
    </AspectRatio>
-    </>
  );
 }
--- a/src/frontend/src/components/errors/GenericErrorPage.tsx
+++ b/src/frontend/src/components/errors/GenericErrorPage.tsx
@ -1,7 +1,6 @@
 import { Trans } from '@lingui/macro';
 import {
  ActionIcon,
-  Alert,
  Button,
  Card,
  Center,
--- a/src/frontend/src/components/forms/fields/ApiFormField.tsx
+++ b/src/frontend/src/components/forms/fields/ApiFormField.tsx
@ -1,15 +1,7 @@
 import { t } from '@lingui/macro';
-import {
-  Alert,
-  FileInput,
-  NumberInput,
-  Stack,
-  Switch,
-  TextInput
-} from '@mantine/core';
+import { Alert, FileInput, NumberInput, Stack, Switch } from '@mantine/core';
 import { UseFormReturnType } from '@mantine/form';
 import { useId } from '@mantine/hooks';
-import { IconX } from '@tabler/icons-react';
 import { ReactNode, useCallback, useEffect, useMemo } from 'react';
 import { Control, FieldValues, useController } from 'react-hook-form';

--- a/src/frontend/src/components/forms/fields/TableField.tsx
+++ b/src/frontend/src/components/forms/fields/TableField.tsx
@ -1,5 +1,5 @@
 import { Trans, t } from '@lingui/macro';
-import { Container, Flex, Group, Table } from '@mantine/core';
+import { Container, Group, Table } from '@mantine/core';
 import { useEffect, useMemo } from 'react';
 import { FieldValues, UseControllerReturn } from 'react-hook-form';

--- a/src/frontend/src/components/importer/ImporterImportProgress.tsx
+++ b/src/frontend/src/components/importer/ImporterImportProgress.tsx
@ -29,7 +29,6 @@ export default function ImporterImportProgress({
  }, []);

  return (
-    <>
    <Center>
      <Container>
        <Stack gap="xs">
@ -41,6 +40,5 @@ export default function ImporterImportProgress({
        </Stack>
      </Container>
    </Center>
-    </>
  );
 }
--- a/src/frontend/src/components/items/GettingStartedCarousel.tsx
+++ b/src/frontend/src/components/items/GettingStartedCarousel.tsx
@ -1,6 +1,6 @@
 import { Trans } from '@lingui/macro';
 import { Carousel } from '@mantine/carousel';
-import { Anchor, Button, Paper, Text, Title, rem } from '@mantine/core';
+import { Anchor, Button, Paper, Text, Title } from '@mantine/core';

 import { DocumentationLinkItem } from './DocumentationLinks';
 import * as classes from './GettingStartedCarousel.css';
--- a/src/frontend/src/components/modals/QrCodeModal.tsx
+++ b/src/frontend/src/components/modals/QrCodeModal.tsx
@ -35,7 +35,7 @@ export function QrCodeModal({
    key: 'camId',
    defaultValue: null
  });
-  const [ScanningEnabled, setIsScanning] = useState<boolean>(false);
+  const [scanningEnabled, setScanningEnabled] = useState<boolean>(false);
  const [wasAutoPaused, setWasAutoPaused] = useState<boolean>(false);
  const documentState = useDocumentVisibility();

@ -48,7 +48,7 @@ export function QrCodeModal({

  // Stop/star when leaving or reentering page
  useEffect(() => {
-    if (ScanningEnabled && documentState === 'hidden') {
+    if (scanningEnabled && documentState === 'hidden') {
      stopScanning();
      setWasAutoPaused(true);
    } else if (wasAutoPaused && documentState === 'visible') {
@ -128,12 +128,12 @@ export function QrCodeModal({
            icon: <IconX />
          });
        });
-      setIsScanning(true);
+      setScanningEnabled(true);
    }
  }

  function stopScanning() {
-    if (qrCodeScanner && ScanningEnabled) {
+    if (qrCodeScanner && scanningEnabled) {
      qrCodeScanner.stop().catch((err: string) => {
        showNotification({
          title: t`Error while stopping`,
@ -142,7 +142,7 @@ export function QrCodeModal({
          icon: <IconX />
        });
      });
-      setIsScanning(false);
+      setScanningEnabled(false);
    }
  }

@ -151,7 +151,7 @@ export function QrCodeModal({
      <Group>
        <Text size="sm">{camId?.label}</Text>
        <Space style={{ flex: 1 }} />
-        <Badge>{ScanningEnabled ? t`Scanning` : t`Not scanning`}</Badge>
+        <Badge>{scanningEnabled ? t`Scanning` : t`Not scanning`}</Badge>
      </Group>
      <Container px={0} id="reader" w={'100%'} mih="300px" />
      {!camId ? (
@ -164,14 +164,14 @@ export function QrCodeModal({
            <Button
              style={{ flex: 1 }}
              onClick={() => startScanning()}
-              disabled={camId != undefined && ScanningEnabled}
+              disabled={camId != undefined && scanningEnabled}
            >
              <Trans>Start scanning</Trans>
            </Button>
            <Button
              style={{ flex: 1 }}
              onClick={() => stopScanning()}
-              disabled={!ScanningEnabled}
+              disabled={!scanningEnabled}
            >
              <Trans>Stop scanning</Trans>
            </Button>
--- a/src/frontend/src/components/nav/NotificationDrawer.tsx
+++ b/src/frontend/src/components/nav/NotificationDrawer.tsx
@ -7,7 +7,6 @@ import {
  Drawer,
  Group,
  Loader,
-  LoadingOverlay,
  Space,
  Stack,
  Text,
--- a/src/frontend/src/components/render/Instance.tsx
+++ b/src/frontend/src/components/render/Instance.tsx
@ -1,6 +1,6 @@
 import { t } from '@lingui/macro';
 import { Alert, Anchor, Group, Skeleton, Space, Text } from '@mantine/core';
-import { useQuery, useSuspenseQuery } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
 import { ReactNode, useCallback } from 'react';

 import { api } from '../../App';
--- a/src/frontend/src/components/render/Part.tsx
+++ b/src/frontend/src/components/render/Part.tsx
@ -15,7 +15,7 @@ export function RenderPart(
  const { instance } = props;

  let badgeText = '';
-  let badgeColor = 'green';
+  let badgeColor = '';

  let stock = instance.total_in_stock;

--- a/src/frontend/src/forms/BuildForms.tsx
+++ b/src/frontend/src/forms/BuildForms.tsx
@ -1,5 +1,5 @@
 import { t } from '@lingui/macro';
-import { ActionIcon, Alert, Stack, Text } from '@mantine/core';
+import { Alert, Stack, Text } from '@mantine/core';
 import {
  IconCalendar,
  IconLink,
--- a/src/frontend/src/forms/PurchaseOrderForms.tsx
+++ b/src/frontend/src/forms/PurchaseOrderForms.tsx
@ -33,10 +33,7 @@ import {
  ApiFormAdjustFilterType,
  ApiFormFieldSet
 } from '../components/forms/fields/ApiFormField';
-import {
-  TableField,
-  TableFieldExtraRow
-} from '../components/forms/fields/TableField';
+import { TableFieldExtraRow } from '../components/forms/fields/TableField';
 import { Thumbnail } from '../components/images/Thumbnail';
 import { ProgressBar } from '../components/items/ProgressBar';
 import { StylishText } from '../components/items/StylishText';
--- a/src/frontend/src/forms/StockForms.tsx
+++ b/src/frontend/src/forms/StockForms.tsx
@ -7,13 +7,10 @@ import { Suspense, useCallback, useMemo, useState } from 'react';

 import { api } from '../App';
 import { ActionButton } from '../components/buttons/ActionButton';
-import { StandaloneField } from '../components/forms/StandaloneField';
 import {
  ApiFormAdjustFilterType,
-  ApiFormField,
  ApiFormFieldSet
 } from '../components/forms/fields/ApiFormField';
-import { ChoiceField } from '../components/forms/fields/ChoiceField';
 import { TableFieldExtraRow } from '../components/forms/fields/TableField';
 import { Thumbnail } from '../components/images/Thumbnail';
 import { StylishText } from '../components/items/StylishText';
--- a/src/frontend/src/hooks/UseImportSession.tsx
+++ b/src/frontend/src/hooks/UseImportSession.tsx
@ -1,8 +1,6 @@
 import { useCallback, useMemo } from 'react';

-import { api } from '../App';
 import { ApiEndpoints } from '../enums/ApiEndpoints';
-import { apiUrl } from '../states/ApiState';
 import { useInstance } from './UseInstance';

 /*
--- a/src/frontend/src/hooks/UseInstance.tsx
+++ b/src/frontend/src/hooks/UseInstance.tsx
@ -1,5 +1,5 @@
 import { useQuery } from '@tanstack/react-query';
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useState } from 'react';

 import { api } from '../App';
 import { ApiEndpoints } from '../enums/ApiEndpoints';
--- a/src/frontend/src/pages/Auth/Logged-In.tsx
+++ b/src/frontend/src/pages/Auth/Logged-In.tsx
@ -14,7 +14,6 @@ export default function Logged_In() {
  }, [navigate]);

  return (
-    <>
    <Container>
      <Stack align="center">
        <Card shadow="sm" padding="lg" radius="md">
@ -29,6 +28,5 @@ export default function Logged_In() {
        </Card>
      </Stack>
    </Container>
-    </>
  );
 }
--- a/src/frontend/src/pages/Auth/Logout.tsx
+++ b/src/frontend/src/pages/Auth/Logout.tsx
@ -14,7 +14,6 @@ export default function Logout() {
  }, []);

  return (
-    <>
    <Container>
      <Stack align="center">
        <Card shadow="sm" padding="lg" radius="md">
@ -29,6 +28,5 @@ export default function Logout() {
        </Card>
      </Stack>
    </Container>
-    </>
  );
 }
--- a/src/frontend/src/pages/Index/Playground.tsx
+++ b/src/frontend/src/pages/Index/Playground.tsx
@ -146,7 +146,6 @@ function ApiFormsPlayground() {
 function StatusLabelPlayground() {
  const [status, setStatus] = useState<string>('10');
  return (
-    <>
    <Group>
      <Text>Stock Status</Text>
      <TextInput
@ -155,7 +154,6 @@ function StatusLabelPlayground() {
      />
      <StatusRenderer type={ModelType.stockitem} status={status} />
    </Group>
-    </>
  );
 }

@ -202,14 +200,12 @@ function PlaygroundArea({
  content: ReactNode;
 }) {
  return (
-    <>
    <Accordion.Item value={`accordion-playground-${title}`}>
      <Accordion.Control>
        <Text>{title}</Text>
      </Accordion.Control>
      <Accordion.Panel>{content}</Accordion.Panel>
    </Accordion.Item>
-    </>
  );
 }

--- a/src/frontend/src/pages/Index/Scan.tsx
+++ b/src/frontend/src/pages/Index/Scan.tsx
@ -41,7 +41,7 @@ import {
 } from '@tabler/icons-react';
 import { Html5Qrcode } from 'html5-qrcode';
 import { CameraDevice } from 'html5-qrcode/camera/core';
-import { ReactNode, useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';

 import { api } from '../../App';
 import { DocInfo } from '../../components/items/DocInfo';
@ -553,7 +553,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
  });
  const [cameras, setCameras] = useState<any[]>([]);
  const [cameraValue, setCameraValue] = useState<string | null>(null);
-  const [ScanningEnabled, setIsScanning] = useState<boolean>(false);
+  const [scanningEnabled, setScanningEnabled] = useState<boolean>(false);
  const [wasAutoPaused, setWasAutoPaused] = useState<boolean>(false);
  const documentState = useDocumentVisibility();

@ -580,7 +580,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {

  // Stop/start when leaving or reentering page
  useEffect(() => {
-    if (ScanningEnabled && documentState === 'hidden') {
+    if (scanningEnabled && documentState === 'hidden') {
      btnStopScanning();
      setWasAutoPaused(true);
    } else if (wasAutoPaused && documentState === 'visible') {
@ -642,7 +642,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
  }

  function btnStartScanning() {
-    if (camId && qrCodeScanner && !ScanningEnabled) {
+    if (camId && qrCodeScanner && !scanningEnabled) {
      qrCodeScanner
        .start(
          camId.id,
@ -662,12 +662,12 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
            icon: <IconX />
          });
        });
-      setIsScanning(true);
+      setScanningEnabled(true);
    }
  }

  function btnStopScanning() {
-    if (qrCodeScanner && ScanningEnabled) {
+    if (qrCodeScanner && scanningEnabled) {
      qrCodeScanner.stop().catch((err: string) => {
        showNotification({
          title: t`Error while stopping`,
@ -676,7 +676,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
          icon: <IconX />
        });
      });
-      setIsScanning(false);
+      setScanningEnabled(false);
    }
  }

@ -690,7 +690,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
    const cam = cameras.find((cam) => cam.id === cameraValue);

    // stop scanning if cam changed while scanning
-    if (qrCodeScanner && ScanningEnabled) {
+    if (qrCodeScanner && scanningEnabled) {
      // stop scanning
      qrCodeScanner.stop().then(() => {
        // change ID
@ -723,7 +723,7 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
          })}
          size="sm"
        />
-        {ScanningEnabled ? (
+        {scanningEnabled ? (
          <ActionIcon
            onClick={btnStopScanning}
            title={t`Stop scanning`}
@ -742,8 +742,8 @@ function InputImageBarcode({ action }: Readonly<ScanInputInterface>) {
          </ActionIcon>
        )}
        <Space style={{ flex: 1 }} />
-        <Badge color={ScanningEnabled ? 'green' : 'orange'}>
-          {ScanningEnabled ? t`Scanning` : t`Not scanning`}
+        <Badge color={scanningEnabled ? 'green' : 'orange'}>
+          {scanningEnabled ? t`Scanning` : t`Not scanning`}
        </Badge>
      </Group>
      <Container px={0} id="reader" w={'100%'} mih="300px" />
--- a/src/frontend/src/pages/Index/Settings/AccountSettings/SecurityContent.tsx
+++ b/src/frontend/src/pages/Index/Settings/AccountSettings/SecurityContent.tsx
@ -204,7 +204,7 @@ function EmailContent() {

 function SsoContent({ dataProvider }: { dataProvider: any | undefined }) {
  const [value, setValue] = useState<string>('');
-  const [currentProviders, setcurrentProviders] = useState<[]>();
+  const [currentProviders, setCurrentProviders] = useState<[]>();
  const { isLoading, data } = useQuery({
    queryKey: ['sso-list'],
    queryFn: () =>
@ -225,7 +225,7 @@ function SsoContent({ dataProvider }: { dataProvider: any | undefined }) {
    // remove providers that are used currently
    let newData = dataProvider.providers;
    newData = newData.filter(isAlreadyInUse);
-    setcurrentProviders(newData);
+    setCurrentProviders(newData);
  }, [dataProvider, data]);

  function removeProvider() {
--- a/src/frontend/src/pages/Index/Settings/UserSettings.tsx
+++ b/src/frontend/src/pages/Index/Settings/UserSettings.tsx
@ -120,7 +120,6 @@ export default function UserSettings() {
  }

  return (
-    <>
    <Stack gap="xs">
      <SettingsHeader
        title={t`Account Settings`}
@ -132,6 +131,5 @@ export default function UserSettings() {
      />
      <PanelGroup pageKey="user-settings" panels={userSettingsPanels} />
    </Stack>
-    </>
  );
 }
--- a/src/frontend/src/pages/Notifications.tsx
+++ b/src/frontend/src/pages/Notifications.tsx
@ -147,11 +147,9 @@ export default function NotificationsPage() {
  }, [unreadTable, readTable]);

  return (
-    <>
    <Stack>
      <PageDetail title={t`Notifications`} />
      <PanelGroup pageKey="notifications" panels={notificationPanels} />
    </Stack>
-    </>
  );
 }
--- a/src/frontend/src/pages/build/BuildIndex.tsx
+++ b/src/frontend/src/pages/build/BuildIndex.tsx
@ -9,11 +9,9 @@ import { BuildOrderTable } from '../../tables/build/BuildOrderTable';
 */
 export default function BuildIndex() {
  return (
-    <>
    <Stack>
      <PageDetail title={t`Build Orders`} actions={[]} />
      <BuildOrderTable />
    </Stack>
-    </>
  );
 }
--- a/src/frontend/src/pages/company/CompanyDetail.tsx
+++ b/src/frontend/src/pages/company/CompanyDetail.tsx
@ -39,7 +39,6 @@ import { UserRoles } from '../../enums/Roles';
 import { companyFields } from '../../forms/CompanyForms';
 import { useEditApiFormModal } from '../../hooks/UseForm';
 import { useInstance } from '../../hooks/UseInstance';
-import { apiUrl } from '../../states/ApiState';
 import { useUserState } from '../../states/UserState';
 import { AddressTable } from '../../tables/company/AddressTable';
 import { ContactTable } from '../../tables/company/ContactTable';
--- a/src/frontend/src/pages/part/PartPricingPanel.tsx
+++ b/src/frontend/src/pages/part/PartPricingPanel.tsx
@ -31,11 +31,7 @@ export enum panelOptions {
 export default function PartPricingPanel({ part }: { part: any }) {
  const user = useUserState();

-  const {
-    instance: pricing,
-    refreshInstance,
-    instanceQuery
-  } = useInstance({
+  const { instance: pricing, instanceQuery } = useInstance({
    pk: part?.pk,
    hasPrimaryKey: true,
    endpoint: ApiEndpoints.part_pricing_get,
--- a/src/frontend/src/pages/part/pricing/BomPricingPanel.tsx
+++ b/src/frontend/src/pages/part/pricing/BomPricingPanel.tsx
@ -12,11 +12,7 @@ import { ReactNode, useMemo, useState } from 'react';

 import { CHART_COLORS } from '../../../components/charts/colors';
 import { tooltipFormatter } from '../../../components/charts/tooltipFormatter';
-import {
-  formatCurrency,
-  formatDecimal,
-  formatPriceRange
-} from '../../../defaults/formatters';
+import { formatDecimal, formatPriceRange } from '../../../defaults/formatters';
 import { ApiEndpoints } from '../../../enums/ApiEndpoints';
 import { ModelType } from '../../../enums/ModelType';
 import { useTable } from '../../../hooks/UseTable';
--- a/src/frontend/src/pages/purchasing/PurchasingIndex.tsx
+++ b/src/frontend/src/pages/purchasing/PurchasingIndex.tsx
@ -47,11 +47,9 @@ export default function PurchasingIndex() {
  }, []);

  return (
-    <>
    <Stack>
      <PageDetail title={t`Purchasing`} />
      <PanelGroup pageKey="purchasing-index" panels={panels} />
    </Stack>
-    </>
  );
 }
--- a/src/frontend/src/pages/sales/SalesIndex.tsx
+++ b/src/frontend/src/pages/sales/SalesIndex.tsx
@ -40,11 +40,9 @@ export default function PurchasingIndex() {
  }, []);

  return (
-    <>
    <Stack>
      <PageDetail title={t`Sales`} />
      <PanelGroup pageKey="sales-index" panels={panels} />
    </Stack>
-    </>
  );
 }
--- a/src/frontend/src/tables/DownloadAction.tsx
+++ b/src/frontend/src/tables/DownloadAction.tsx
@ -1,5 +1,4 @@
 import { t } from '@lingui/macro';
-import { ActionIcon, Menu, Tooltip } from '@mantine/core';
 import {
  IconDownload,
  IconFileSpreadsheet,
@ -33,12 +32,10 @@ export function DownloadAction({
  }, [formatOptions, downloadCallback]);

  return (
-    <>
    <ActionDropdown
      tooltip={t`Download Data`}
      icon={<IconDownload />}
      actions={actions}
    />
-    </>
  );
 }
--- a/src/frontend/src/tables/UploadAction.tsx
+++ b/src/frontend/src/tables/UploadAction.tsx
@ -4,9 +4,5 @@ import { IconUpload } from '@tabler/icons-react';
 import { ActionButton } from '../components/buttons/ActionButton';

 export function UploadAction({}) {
-  return (
-    <>
-      <ActionButton icon={<IconUpload />} tooltip={t`Upload Data`} />
-    </>
-  );
+  return <ActionButton icon={<IconUpload />} tooltip={t`Upload Data`} />;
 }
--- a/src/frontend/src/tables/general/AttachmentTable.tsx
+++ b/src/frontend/src/tables/general/AttachmentTable.tsx
@ -8,7 +8,7 @@ import {
  IconUpload,
  IconX
 } from '@tabler/icons-react';
-import { ReactNode, useCallback, useEffect, useMemo, useState } from 'react';
+import { ReactNode, useCallback, useMemo, useState } from 'react';

 import { api } from '../../App';
 import { ActionButton } from '../../components/buttons/ActionButton';
@ -28,7 +28,7 @@ import { useUserState } from '../../states/UserState';
 import { TableColumn } from '../Column';
 import { TableFilter } from '../Filter';
 import { InvenTreeTable } from '../InvenTreeTable';
-import { RowAction, RowDeleteAction, RowEditAction } from '../RowActions';
+import { RowDeleteAction, RowEditAction } from '../RowActions';

 /**
 * Define set of columns to display for the attachment table
--- a/src/frontend/src/tables/part/PartThumbTable.tsx
+++ b/src/frontend/src/tables/part/PartThumbTable.tsx
@ -128,13 +128,13 @@ export function PartThumbTable({
  pk,
  setImage
 }: ThumbTableProps) {
-  const [img, selectImage] = useState<string | null>(null);
+  const [thumbImage, setThumbImage] = useState<string | null>(null);
  const [filterInput, setFilterInput] = useState<string>('');
-  const [filterQuery, setFilter] = useState<string>(search);
+  const [filterQuery, setFilterQuery] = useState<string>(search);

  // Keep search filters from updating while user is typing
  useEffect(() => {
-    const timeoutId = setTimeout(() => setFilter(filterInput), 500);
+    const timeoutId = setTimeout(() => setFilterQuery(filterInput), 500);
    return () => clearTimeout(timeoutId);
  }, [filterInput]);

@ -160,7 +160,6 @@ export function PartThumbTable({
      <Suspense>
        <Divider />
        <Paper p="sm">
-          <>
          <SimpleGrid cols={8}>
            {!thumbQuery.isFetching
              ? thumbQuery.data?.data.map(
@ -168,8 +167,8 @@ export function PartThumbTable({
                    <PartThumbComponent
                      element={data}
                      key={index}
-                        selected={img}
-                        selectImage={selectImage}
+                      selected={thumbImage}
+                      selectImage={setThumbImage}
                    />
                  )
                )
@ -183,7 +182,6 @@ export function PartThumbTable({
                  />
                ))}
          </SimpleGrid>
-          </>
        </Paper>
      </Suspense>

@ -197,8 +195,8 @@ export function PartThumbTable({
            }}
          />
          <Button
-            disabled={!img}
-            onClick={() => setNewImage(img, pk, setImage)}
+            disabled={!thumbImage}
+            onClick={() => setNewImage(thumbImage, pk, setImage)}
          >
            <Trans>Select</Trans>
          </Button>
--- a/src/frontend/src/tables/purchasing/PurchaseOrderLineItemTable.tsx
+++ b/src/frontend/src/tables/purchasing/PurchaseOrderLineItemTable.tsx
@ -1,6 +1,5 @@
 import { t } from '@lingui/macro';
 import { Text } from '@mantine/core';
-import { Action } from '@mdxeditor/editor';
 import { IconFileArrowLeft, IconSquareArrowRight } from '@tabler/icons-react';
 import { useCallback, useMemo, useState } from 'react';

--- a/src/frontend/src/tables/settings/ImportSessionTable.tsx
+++ b/src/frontend/src/tables/settings/ImportSessionTable.tsx
@ -25,7 +25,6 @@ import { RowAction, RowDeleteAction } from '../RowActions';

 export default function ImportSesssionTable() {
  const table = useTable('importsession');
-  const user = useUserState();

  const [opened, setOpened] = useState<boolean>(false);

--- a/src/frontend/src/tables/stock/InstalledItemsTable.tsx
+++ b/src/frontend/src/tables/stock/InstalledItemsTable.tsx
@ -50,7 +50,6 @@ export default function InstalledItemsTable({
  }, [user]);

  return (
-    <>
    <InvenTreeTable
      url={apiUrl(ApiEndpoints.stock_item_list)}
      tableState={table}
@ -64,6 +63,5 @@ export default function InstalledItemsTable({
        }
      }}
    />
-    </>
  );
 }
--- a/src/frontend/tests/login.ts
+++ b/src/frontend/tests/login.ts
@ -1,5 +1,5 @@
 import { expect } from './baseFixtures.js';
-import { baseUrl, loginUrl, logoutUrl, user } from './defaults';
+import { baseUrl, logoutUrl, user } from './defaults';

 /*
 * Perform form based login operation from the "login" URL
--- a/src/frontend/tests/pui_basic.spec.ts
+++ b/src/frontend/tests/pui_basic.spec.ts
@ -1,5 +1,5 @@
 import { expect, test } from './baseFixtures.js';
-import { baseUrl, loginUrl, user } from './defaults.js';
+import { baseUrl, user } from './defaults.js';
 import { doLogin, doQuickLogin } from './login.js';

 test('PUI - Basic Login Test', async ({ page }) => {
--- a/src/frontend/tests/pui_general.spec.ts
+++ b/src/frontend/tests/pui_general.spec.ts
@ -1,6 +1,6 @@
 import { test } from './baseFixtures.js';
 import { baseUrl } from './defaults.js';
-import { doLogout, doQuickLogin } from './login.js';
+import { doQuickLogin } from './login.js';

 test('PUI - Parts', async ({ page }) => {
  await doQuickLogin(page);
--- a/src/frontend/tests/pui_settings.spec.ts
+++ b/src/frontend/tests/pui_settings.spec.ts
@ -1,6 +1,6 @@
 import { test } from './baseFixtures.js';
 import { baseUrl } from './defaults.js';
-import { doLogout, doQuickLogin } from './login.js';
+import { doQuickLogin } from './login.js';

 test('PUI - Admin', async ({ page }) => {
  // Note here we login with admin access