Optimized and organized all clients imports

client/src/App.tsx

@@ -5,11 +5,6 @@ import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { ErrorComponent } from "@refinedev/antd";
 import "@refinedev/antd/dist/reset.css";
 
-import routerBindings, { DocumentTitleHandler, UnsavedChangesNotifier } from "@refinedev/react-router-v6";
-import dataProvider from "./components/dataProvider";
-import { useTranslation } from "react-i18next";
-import { BrowserRouter, Outlet, Route, Routes } from "react-router-dom";
-import { ColorModeContextProvider } from "./contexts/color-mode";
 import {
   FileOutlined,
   HighlightOutlined,
@@ -18,16 +13,21 @@ import {
   ToolOutlined,
   UserOutlined,
 } from "@ant-design/icons";
+import loadable from "@loadable/component";
+import routerBindings, { DocumentTitleHandler, UnsavedChangesNotifier } from "@refinedev/react-router-v6";
 import { ConfigProvider } from "antd";
 import { Locale } from "antd/es/locale";
-import { languages } from "./i18n";
+import { useEffect, useState } from "react";
-import loadable from "@loadable/component";
+import { useTranslation } from "react-i18next";
-import SpoolmanNotificationProvider from "./components/notificationProvider";
+import { BrowserRouter, Outlet, Route, Routes } from "react-router-dom";
+import dataProvider from "./components/dataProvider";
+import { Favicon } from "./components/favicon";
 import { SpoolmanLayout } from "./components/layout";
 import liveProvider from "./components/liveProvider";
+import SpoolmanNotificationProvider from "./components/notificationProvider";
+import { ColorModeContextProvider } from "./contexts/color-mode";
+import { languages } from "./i18n";
 import { getAPIURL, getBasePath } from "./utils/url";
-import { Favicon } from "./components/favicon";
-import { useEffect, useState } from "react";
 
 interface ResourcePageProps {
   resource: "spools" | "filaments" | "vendors";

client/src/components/column.tsx

@@ -1,19 +1,18 @@
+import { DateField, TextField } from "@refinedev/antd";
+import { UseQueryResult } from "@tanstack/react-query";
 import { Button, Col, Dropdown, Row, Space, Spin } from "antd";
 import { ColumnFilterItem, ColumnType } from "antd/es/table/interface";
+import dayjs from "dayjs";
+import utc from "dayjs/plugin/utc";
+import { AlignType } from "rc-table/lib/interface";
+import { Link } from "react-router-dom";
 import { getFiltersForField, typeFilters } from "../utils/filtering";
+import { enrichText } from "../utils/parsing";
+import { Field, FieldType } from "../utils/queryFields";
 import { TableState } from "../utils/saveload";
 import { getSortOrderForField, typeSorters } from "../utils/sorting";
 import { NumberFieldUnit, NumberFieldUnitRange } from "./numberField";
-import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
-import { DateField, TextField } from "@refinedev/antd";
-import { useTranslate } from "@refinedev/core";
-import { enrichText } from "../utils/parsing";
-import { UseQueryResult } from "@tanstack/react-query";
-import { Link } from "react-router-dom";
-import { Field, FieldType } from "../utils/queryFields";
 import SpoolIcon from "./spoolIcon";
-import { AlignType } from "rc-table/lib/interface";
 
 dayjs.extend(utc);
 

client/src/components/dataProvider.ts

@@ -1,7 +1,7 @@
-import { AxiosInstance } from "axios";
-import { stringify } from "query-string";
 import { DataProvider } from "@refinedev/core";
 import { axiosInstance } from "@refinedev/simple-rest";
+import { AxiosInstance } from "axios";
+import { stringify } from "query-string";
 
 type MethodTypes = "get" | "delete" | "head" | "options";
 type MethodTypesWithBody = "post" | "put" | "patch";

client/src/components/dateTimePicker.tsx

@@ -1,8 +1,8 @@
 import { DatePicker } from "antd";
 import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
-import timezone from "dayjs/plugin/timezone";
 import advancedFormat from "dayjs/plugin/advancedFormat";
+import timezone from "dayjs/plugin/timezone";
+import utc from "dayjs/plugin/utc";
 
 dayjs.extend(utc);
 dayjs.extend(timezone);

client/src/components/extraFields.tsx

@@ -1,13 +1,13 @@
 import { DateField, TextField } from "@refinedev/antd";
-import { Field, FieldType } from "../utils/queryFields";
-import { NumberFieldUnit, NumberFieldUnitRange } from "./numberField";
-import { enrichText } from "../utils/parsing";
-import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
 import { Checkbox, Form, Input, InputNumber, Select, Typography } from "antd";
 import { FormItemProps, Rule } from "antd/es/form";
+import dayjs from "dayjs";
+import utc from "dayjs/plugin/utc";
+import { enrichText } from "../utils/parsing";
+import { Field, FieldType } from "../utils/queryFields";
 import { DateTimePicker } from "./dateTimePicker";
 import { InputNumberRange } from "./inputNumberRange";
+import { NumberFieldUnit, NumberFieldUnitRange } from "./numberField";
 
 dayjs.extend(utc);
 

client/src/components/filamentImportModal.tsx

@@ -1,10 +1,9 @@
-import { Form, InputNumber, Modal, Select } from "antd";
+import { useTranslate } from "@refinedev/core";
-import { useState } from "react";
+import { Form, Modal, Select } from "antd";
-import { ExternalFilament, useGetExternalDBFilaments } from "../utils/queryExternalDB";
+import { Trans } from "react-i18next";
 import { formatFilamentLabel } from "../pages/spools/functions";
 import { searchMatches } from "../utils/filtering";
-import { useTranslate } from "@refinedev/core";
+import { ExternalFilament, useGetExternalDBFilaments } from "../utils/queryExternalDB";
-import { Trans } from "react-i18next";
 
 export function FilamentImportModal(props: {
   isOpen: boolean;

client/src/components/header/index.tsx

@@ -1,13 +1,13 @@
 import { DownOutlined } from "@ant-design/icons";
 import type { RefineThemedLayoutV2HeaderProps } from "@refinedev/antd";
 import { useGetLocale, useSetLocale } from "@refinedev/core";
-import { Button, Dropdown, Layout as AntdLayout, MenuProps, Space, Switch, theme } from "antd";
+import { Layout as AntdLayout, Button, Dropdown, MenuProps, Space, Switch, theme } from "antd";
 import React, { useContext } from "react";
 import { ColorModeContext } from "../../contexts/color-mode";
 
-import "/node_modules/flag-icons/css/flag-icons.min.css";
 import { languages } from "../../i18n";
 import QRCodeScannerModal from "../qrCodeScanner";
+import "/node_modules/flag-icons/css/flag-icons.min.css";
 
 const { useToken } = theme;
 

client/src/components/layout.tsx

@@ -1,11 +1,11 @@
 import { ThemedLayoutV2, ThemedSiderV2, ThemedTitleV2 } from "@refinedev/antd";
-import { Header } from "./header";
-import { Footer } from "antd/es/layout/layout";
-import { Version } from "./version";
-import { Button } from "antd";
-import Logo from "../icon.svg?react";
 import { useTranslate } from "@refinedev/core";
+import { Button } from "antd";
+import { Footer } from "antd/es/layout/layout";
+import Logo from "../icon.svg?react";
 import { getBasePath } from "../utils/url";
+import { Header } from "./header";
+import { Version } from "./version";
 
 const SpoolmanFooter: React.FC = () => {
   const t = useTranslate();

client/src/components/liveProvider.ts

@@ -1,5 +1,4 @@
 import { BaseKey, LiveEvent, LiveProvider } from "@refinedev/core";
-import { getBasePath } from "../utils/url";
 
 /**
  * A spoolman websocket event.

client/src/components/liveify.ts

@@ -1,7 +1,7 @@
 import { LiveEvent } from "@refinedev/core";
-import liveProvider from "./liveProvider";
-import { getAPIURL } from "../utils/url";
 import { useEffect, useState } from "react";
+import { getAPIURL } from "../utils/url";
+import liveProvider from "./liveProvider";
 
 const liveProviderInstance = liveProvider(getAPIURL());
 

client/src/components/multiColorPicker.tsx

@@ -1,5 +1,5 @@
 import { CloseOutlined, PlusOutlined } from "@ant-design/icons";
-import { Badge, Button, ColorPicker, InputNumber, Space } from "antd";
+import { Badge, Button, ColorPicker, Space } from "antd";
 
 function generateRandomColor() {
   return "000000".replace(/0/g, function () {

client/src/components/numberField.tsx

@@ -1,6 +1,6 @@
-import React from "react";
-import { Typography } from "antd";
 import { NumberFieldProps } from "@refinedev/antd/dist/components/fields/types";
+import { Typography } from "antd";
+import React from "react";
 
 const { Text } = Typography;
 

client/src/components/otherModels.tsx

@@ -1,8 +1,8 @@
 import { useQuery } from "@tanstack/react-query";
+import { Tooltip } from "antd";
+import { ColumnFilterItem } from "antd/es/table/interface";
 import { IFilament } from "../pages/filaments/model";
 import { IVendor } from "../pages/vendors/model";
-import { ColumnFilterItem } from "antd/es/table/interface";
-import { Tooltip } from "antd";
 import { getAPIURL } from "../utils/url";
 
 export function useSpoolmanFilamentFilter(enabled: boolean = false) {

client/src/components/qrCodeScanner.tsx

@@ -1,9 +1,9 @@
-import React, { useState } from "react";
-import { FloatButton, Modal, Space } from "antd";
-import { QrScanner } from "@yudiel/react-qr-scanner";
-import { useNavigate } from "react-router-dom";
 import { CameraOutlined } from "@ant-design/icons";
 import { useTranslate } from "@refinedev/core";
+import { QrScanner } from "@yudiel/react-qr-scanner";
+import { FloatButton, Modal, Space } from "antd";
+import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
 
 const QRCodeScannerModal: React.FC = () => {
   const [visible, setVisible] = useState(false);

client/src/pages/filaments/create.tsx

@@ -1,20 +1,20 @@
-import { HttpError, IResourceComponentsProps, useInvalidate, useTranslate } from "@refinedev/core";
 import { Create, useForm, useSelect } from "@refinedev/antd";
-import { Form, Input, Select, InputNumber, ColorPicker, Button, Typography, Radio } from "antd";
+import { HttpError, IResourceComponentsProps, useInvalidate, useTranslate } from "@refinedev/core";
+import { Button, ColorPicker, Form, Input, InputNumber, Radio, Select, Typography } from "antd";
 import TextArea from "antd/es/input/TextArea";
-import { numberFormatter, numberParser } from "../../utils/parsing";
-import { IVendor } from "../vendors/model";
-import { IFilament, IFilamentParsedExtras } from "./model";
-import { EntityType, useGetFields } from "../../utils/queryFields";
-import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { getCurrencySymbol, useCurrency } from "../../utils/settings";
-import { ExternalFilament } from "../../utils/queryExternalDB";
-import { FilamentImportModal } from "../../components/filamentImportModal";
-import { getOrCreateVendorFromExternal } from "../vendors/functions";
-import { MultiColorPicker } from "../../components/multiColorPicker";
 import { useEffect, useState } from "react";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
+import { FilamentImportModal } from "../../components/filamentImportModal";
+import { MultiColorPicker } from "../../components/multiColorPicker";
+import { numberFormatter, numberParser } from "../../utils/parsing";
+import { ExternalFilament } from "../../utils/queryExternalDB";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { getCurrencySymbol, useCurrency } from "../../utils/settings";
+import { getOrCreateVendorFromExternal } from "../vendors/functions";
+import { IVendor } from "../vendors/model";
+import { IFilament, IFilamentParsedExtras } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/filaments/edit.tsx

@@ -1,17 +1,16 @@
-import { useEffect, useState } from "react";
-import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
 import { Edit, useForm, useSelect } from "@refinedev/antd";
-import { Form, Input, DatePicker, Select, InputNumber, ColorPicker, message, Alert, Typography, Radio } from "antd";
+import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
-import dayjs from "dayjs";
+import { Alert, ColorPicker, DatePicker, Form, Input, InputNumber, message, Radio, Select, Typography } from "antd";
 import TextArea from "antd/es/input/TextArea";
+import dayjs from "dayjs";
+import { useEffect, useState } from "react";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
+import { MultiColorPicker } from "../../components/multiColorPicker";
 import { numberFormatter, numberParser } from "../../utils/parsing";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { getCurrencySymbol, useCurrency } from "../../utils/settings";
 import { IVendor } from "../vendors/model";
 import { IFilament, IFilamentParsedExtras } from "./model";
-import { EntityType, useGetFields } from "../../utils/queryFields";
-import { ExtraFieldFormItem, StringifiedExtras } from "../../components/extraFields";
-import { ParsedExtras } from "../../components/extraFields";
-import { getCurrencySymbol, useCurrency } from "../../utils/settings";
-import { MultiColorPicker } from "../../components/multiColorPicker";
 
 /*
 The API returns the extra fields as JSON values, but we need to parse them into their real types

client/src/pages/filaments/list.tsx

@@ -1,33 +1,33 @@
-import { useMemo, useState } from "react";
+import { EditOutlined, EyeOutlined, FileOutlined, FilterOutlined, PlusSquareOutlined } from "@ant-design/icons";
-import { IResourceComponentsProps, useTranslate, useInvalidate, useNavigation } from "@refinedev/core";
+import { List, useTable } from "@refinedev/antd";
-import { useTable, List } from "@refinedev/antd";
+import { IResourceComponentsProps, useInvalidate, useNavigation, useTranslate } from "@refinedev/core";
-import { Table, Button, Dropdown } from "antd";
+import { Button, Dropdown, Table } from "antd";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { IFilament } from "./model";
+import { useMemo, useState } from "react";
-import { EditOutlined, EyeOutlined, FileOutlined, FilterOutlined, PlusSquareOutlined } from "@ant-design/icons";
+import { useNavigate } from "react-router-dom";
-import { TableState, useInitialTableState, useStoreInitialState } from "../../utils/saveload";
 import {
+  ActionsColumn,
+  CustomFieldColumn,
   DateColumn,
   FilteredQueryColumn,
   NumberColumn,
   RichColumn,
   SortedColumn,
   SpoolIconColumn,
-  ActionsColumn,
-  CustomFieldColumn,
 } from "../../components/column";
+import { useLiveify } from "../../components/liveify";
 import {
   useSpoolmanArticleNumbers,
   useSpoolmanFilamentNames,
   useSpoolmanMaterials,
   useSpoolmanVendors,
 } from "../../components/otherModels";
-import { useLiveify } from "../../components/liveify";
 import { removeUndefined } from "../../utils/filtering";
 import { EntityType, useGetFields } from "../../utils/queryFields";
-import { useNavigate } from "react-router-dom";
+import { TableState, useInitialTableState, useStoreInitialState } from "../../utils/saveload";
 import { useCurrency } from "../../utils/settings";
+import { IFilament } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/filaments/show.tsx

@@ -1,17 +1,17 @@
-import React from "react";
+import { DateField, NumberField, Show, TextField } from "@refinedev/antd";
 import { IResourceComponentsProps, useShow, useTranslate } from "@refinedev/core";
-import { Show, NumberField, DateField, TextField } from "@refinedev/antd";
 import { Button, Typography } from "antd";
-import { NumberFieldUnit } from "../../components/numberField";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { IFilament } from "./model";
+import React from "react";
-import { enrichText } from "../../utils/parsing";
 import { useNavigate } from "react-router-dom";
-import { EntityType, useGetFields } from "../../utils/queryFields";
 import { ExtraFieldDisplay } from "../../components/extraFields";
-import { useCurrency } from "../../utils/settings";
+import { NumberFieldUnit } from "../../components/numberField";
 import SpoolIcon from "../../components/spoolIcon";
+import { enrichText } from "../../utils/parsing";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { useCurrency } from "../../utils/settings";
+import { IFilament } from "./model";
 dayjs.extend(utc);
 
 const { Title } = Typography;

client/src/pages/help/index.tsx

@@ -1,13 +1,13 @@
-import React from "react";
+import { FileOutlined, HighlightOutlined, UserOutlined } from "@ant-design/icons";
 import { IResourceComponentsProps, useTranslate } from "@refinedev/core";
+import { List, theme } from "antd";
+import { Content } from "antd/es/layout/layout";
+import Title from "antd/es/typography/Title";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { Content } from "antd/es/layout/layout";
+import React from "react";
-import { List, theme } from "antd";
-import Title from "antd/es/typography/Title";
-import { FileOutlined, HighlightOutlined, UserOutlined } from "@ant-design/icons";
-import { Link } from "react-router-dom";
 import { Trans } from "react-i18next";
+import { Link } from "react-router-dom";
 
 dayjs.extend(utc);
 

client/src/pages/home/index.tsx

@@ -1,14 +1,14 @@
-import React, { ReactNode } from "react";
+import { FileOutlined, HighlightOutlined, PlusOutlined, UnorderedListOutlined, UserOutlined } from "@ant-design/icons";
 import { IResourceComponentsProps, useList, useTranslate } from "@refinedev/core";
+import { Card, Col, Row, Statistic, theme } from "antd";
+import { Content } from "antd/es/layout/layout";
+import Title from "antd/es/typography/Title";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { Content } from "antd/es/layout/layout";
+import React, { ReactNode } from "react";
-import { Card, Col, Row, Statistic, theme } from "antd";
-import Title from "antd/es/typography/Title";
-import Logo from "../../icon.svg?react";
-import { FileOutlined, HighlightOutlined, PlusOutlined, UnorderedListOutlined, UserOutlined } from "@ant-design/icons";
-import { ISpool } from "../spools/model";
 import { Link } from "react-router-dom";
+import Logo from "../../icon.svg?react";
+import { ISpool } from "../spools/model";
 
 dayjs.extend(utc);
 

client/src/pages/printing/index.tsx

@@ -1,13 +1,13 @@
-import React from "react";
+import { PageHeader } from "@refinedev/antd";
 import { IResourceComponentsProps, useTranslate } from "@refinedev/core";
+import { theme } from "antd";
+import { Content } from "antd/es/layout/layout";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { Content } from "antd/es/layout/layout";
+import React from "react";
-import { theme } from "antd";
+import { useNavigate, useSearchParams } from "react-router-dom";
 import SpoolQRCodePrintingDialog from "./spoolQrCodePrintingDialog";
 import SpoolSelectModal from "./spoolSelectModal";
-import { useNavigate, useSearchParams } from "react-router-dom";
-import { PageHeader } from "@refinedev/antd";
 
 dayjs.extend(utc);
 

client/src/pages/printing/printing.tsx

@@ -1,6 +1,6 @@
-import { ISpool } from "../spools/model";
-import { useGetSetting, useSetSetting } from "../../utils/querySettings";
 import { v4 as uuidv4 } from "uuid";
+import { useGetSetting, useSetSetting } from "../../utils/querySettings";
+import { ISpool } from "../spools/model";
 
 export interface PrintSettings {
   id: string;

client/src/pages/printing/printingDialog.tsx

@@ -1,23 +1,23 @@
-import React, { useRef } from "react";
+import { PrinterOutlined } from "@ant-design/icons";
+import { useTranslate } from "@refinedev/core";
 import {
-  Slider,
   Button,
-  Select,
-  Row,
   Col,
-  Form,
-  Divider,
-  RadioChangeEvent,
-  Radio,
-  InputNumber,
   Collapse,
+  Divider,
+  Form,
+  InputNumber,
+  Radio,
+  RadioChangeEvent,
+  Row,
+  Select,
+  Slider,
   Space,
 } from "antd";
+import React, { useRef } from "react";
 import ReactToPrint from "react-to-print";
 import { useSavedState } from "../../utils/saveload";
-import { useTranslate } from "@refinedev/core";
 import { PrintSettings } from "./printing";
-import { PrinterOutlined } from "@ant-design/icons";
 
 interface PrintingDialogProps {
   items: JSX.Element[];

client/src/pages/printing/qrCodePrintingDialog.tsx

@@ -1,7 +1,7 @@
-import { Col, Form, InputNumber, QRCode, Row, Slider, Switch } from "antd";
-import PrintingDialog from "./printingDialog";
 import { useTranslate } from "@refinedev/core";
+import { Col, Form, InputNumber, QRCode, Row, Slider, Switch } from "antd";
 import { QRCodePrintSettings } from "./printing";
+import PrintingDialog from "./printingDialog";
 
 interface QRCodeData {
   value: string;

client/src/pages/printing/spoolQrCodePrintingDialog.tsx

@@ -1,20 +1,20 @@
-import { Button, Flex, Form, Input, Modal, Popconfirm, Select, Table, Typography, message } from "antd";
+import { CopyOutlined, DeleteOutlined, PlusOutlined, SaveOutlined } from "@ant-design/icons";
-import { ISpool } from "../spools/model";
-import QRCodePrintingDialog from "./qrCodePrintingDialog";
-import { useSavedState } from "../../utils/saveload";
 import { useTranslate } from "@refinedev/core";
+import { Button, Flex, Form, Input, Modal, Popconfirm, Select, Table, Typography, message } from "antd";
+import TextArea from "antd/es/input/TextArea";
+import { useState } from "react";
+import { v4 as uuidv4 } from "uuid";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { useSavedState } from "../../utils/saveload";
+import { useGetSpoolsByIds } from "../spools/functions";
+import { ISpool } from "../spools/model";
 import {
   SpoolQRCodePrintSettings,
   renderLabelContents,
   useGetPrintSettings as useGetPrintPresets,
   useSetPrintSettings as useSetPrintPresets,
 } from "./printing";
-import { useState } from "react";
+import QRCodePrintingDialog from "./qrCodePrintingDialog";
-import { CopyOutlined, DeleteOutlined, PlusOutlined, SaveOutlined } from "@ant-design/icons";
-import { v4 as uuidv4 } from "uuid";
-import TextArea from "antd/es/input/TextArea";
-import { EntityType, useGetFields } from "../../utils/queryFields";
-import { useGetSpoolsByIds } from "../spools/functions";
 
 const { Text } = Typography;
 

client/src/pages/printing/spoolSelectModal.tsx

@@ -1,14 +1,14 @@
-import { useMemo, useState } from "react";
+import { RightOutlined } from "@ant-design/icons";
-import { Table, Checkbox, Space, Row, Col, message, Button } from "antd";
-import { ISpool } from "../spools/model";
-import { FilteredQueryColumn, SortedColumn, SpoolIconColumn } from "../../components/column";
-import { TableState } from "../../utils/saveload";
 import { useTable } from "@refinedev/antd";
+import { Button, Checkbox, Col, message, Row, Space, Table } from "antd";
 import { t } from "i18next";
+import { useMemo, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { FilteredQueryColumn, SortedColumn, SpoolIconColumn } from "../../components/column";
 import { useSpoolmanFilamentFilter, useSpoolmanMaterials } from "../../components/otherModels";
 import { removeUndefined } from "../../utils/filtering";
-import { useNavigate } from "react-router-dom";
+import { TableState } from "../../utils/saveload";
-import { RightOutlined } from "@ant-design/icons";
+import { ISpool } from "../spools/model";
 
 interface Props {
   description?: string;

client/src/pages/settings/extraFieldsSettings.tsx

@@ -1,3 +1,5 @@
+import { PlusOutlined } from "@ant-design/icons";
+import { useTranslate } from "@refinedev/core";
 import {
   Button,
   Checkbox,
@@ -12,20 +14,18 @@ import {
   Table,
   message,
 } from "antd";
-import { EntityType, Field, FieldType, useDeleteField, useGetFields, useSetField } from "../../utils/queryFields";
+import { FormItemProps, Rule } from "antd/es/form";
-import { useTranslate } from "@refinedev/core";
-import { useState } from "react";
 import { ColumnType } from "antd/es/table";
+import dayjs from "dayjs";
+import advancedFormat from "dayjs/plugin/advancedFormat";
+import timezone from "dayjs/plugin/timezone";
+import utc from "dayjs/plugin/utc";
+import { useState } from "react";
 import { Trans } from "react-i18next";
 import { useParams } from "react-router-dom";
-import { FormItemProps, Rule } from "antd/es/form";
-import { PlusOutlined } from "@ant-design/icons";
-import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
-import timezone from "dayjs/plugin/timezone";
-import advancedFormat from "dayjs/plugin/advancedFormat";
 import { DateTimePicker } from "../../components/dateTimePicker";
 import { InputNumberRange } from "../../components/inputNumberRange";
+import { EntityType, Field, FieldType, useDeleteField, useGetFields, useSetField } from "../../utils/queryFields";
 
 dayjs.extend(utc);
 dayjs.extend(timezone);

client/src/pages/settings/generalSettings.tsx

@@ -1,6 +1,6 @@
-import { useEffect } from "react";
 import { useTranslate } from "@refinedev/core";
 import { Button, Form, Input, message } from "antd";
+import { useEffect } from "react";
 import { useGetSettings, useSetSetting } from "../../utils/querySettings";
 
 export function GeneralSettings() {

client/src/pages/settings/index.tsx

@@ -1,13 +1,13 @@
-import React from "react";
+import { FileOutlined, HighlightOutlined, SolutionOutlined, ToolOutlined, UserOutlined } from "@ant-design/icons";
 import { IResourceComponentsProps, useTranslate } from "@refinedev/core";
+import { Menu, theme } from "antd";
+import { Content } from "antd/es/layout/layout";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { Content } from "antd/es/layout/layout";
+import React from "react";
-import { Menu, theme } from "antd";
-import { FileOutlined, HighlightOutlined, SolutionOutlined, ToolOutlined, UserOutlined } from "@ant-design/icons";
-import { GeneralSettings } from "./generalSettings";
-import { ExtraFieldsSettings } from "./extraFieldsSettings";
 import { Route, Routes, useNavigate } from "react-router-dom";
+import { ExtraFieldsSettings } from "./extraFieldsSettings";
+import { GeneralSettings } from "./generalSettings";
 
 dayjs.extend(utc);
 

client/src/pages/spools/create.tsx

@@ -1,21 +1,21 @@
-import { useEffect, useMemo, useState } from "react";
-import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
-import { Create, useForm } from "@refinedev/antd";
-import { Form, Input, DatePicker, Select, InputNumber, Radio, Divider, Button, Typography, Alert } from "antd";
-import dayjs from "dayjs";
-import TextArea from "antd/es/input/TextArea";
-import { ISpool, ISpoolParsedExtras, WeightToEnter } from "./model";
-import { numberFormatter, numberParser } from "../../utils/parsing";
-import { useSpoolmanLocations } from "../../components/otherModels";
 import { MinusOutlined, PlusOutlined } from "@ant-design/icons";
-import "../../utils/overrides.css";
+import { Create, useForm } from "@refinedev/antd";
-import { EntityType, useGetFields } from "../../utils/queryFields";
+import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
-import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
+import { Alert, Button, DatePicker, Divider, Form, Input, InputNumber, Radio, Select, Typography } from "antd";
+import TextArea from "antd/es/input/TextArea";
+import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
+import { useEffect, useMemo, useState } from "react";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
+import { useSpoolmanLocations } from "../../components/otherModels";
+import { searchMatches } from "../../utils/filtering";
+import "../../utils/overrides.css";
+import { numberFormatter, numberParser } from "../../utils/parsing";
+import { EntityType, useGetFields } from "../../utils/queryFields";
 import { getCurrencySymbol, useCurrency } from "../../utils/settings";
 import { createFilamentFromExternal } from "../filaments/functions";
 import { useGetFilamentSelectOptions } from "./functions";
-import { searchMatches } from "../../utils/filtering";
+import { ISpool, ISpoolParsedExtras, WeightToEnter } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/spools/edit.tsx

@@ -1,20 +1,19 @@
-import { useEffect, useMemo, useState } from "react";
-import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
 import { Edit, useForm } from "@refinedev/antd";
-import { Form, Input, DatePicker, Select, InputNumber, Radio, Divider, Alert, Typography } from "antd";
+import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
-import dayjs from "dayjs";
+import { Alert, DatePicker, Divider, Form, Input, InputNumber, Radio, Select, Typography } from "antd";
 import TextArea from "antd/es/input/TextArea";
-import { ISpool, ISpoolParsedExtras, WeightToEnter } from "./model";
-import { numberFormatter, numberParser } from "../../utils/parsing";
-import { useSpoolmanLocations } from "../../components/otherModels";
 import { message } from "antd/lib";
-import { EntityType, useGetFields } from "../../utils/queryFields";
+import dayjs from "dayjs";
-import { ExtraFieldFormItem, StringifiedExtras } from "../../components/extraFields";
+import { useEffect, useMemo, useState } from "react";
-import { ParsedExtras } from "../../components/extraFields";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
-import { getCurrencySymbol, useCurrency } from "../../utils/settings";
+import { useSpoolmanLocations } from "../../components/otherModels";
-import { useGetFilamentSelectOptions } from "./functions";
 import { searchMatches } from "../../utils/filtering";
+import { numberFormatter, numberParser } from "../../utils/parsing";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { getCurrencySymbol, useCurrency } from "../../utils/settings";
 import { createFilamentFromExternal } from "../filaments/functions";
+import { useGetFilamentSelectOptions } from "./functions";
+import { ISpool, ISpoolParsedExtras, WeightToEnter } from "./model";
 
 /*
 The API returns the extra fields as JSON values, but we need to parse them into their real types

client/src/pages/spools/functions.tsx

@@ -1,13 +1,13 @@
 import { useSelect, useTranslate } from "@refinedev/core";
-import { formatLength, formatWeight } from "../../utils/parsing";
-import { getAPIURL } from "../../utils/url";
-import { ISpool } from "./model";
-import { IFilament } from "../filaments/model";
-import { SpoolType, useGetExternalDBFilaments } from "../../utils/queryExternalDB";
-import { useCallback, useMemo, useState } from "react";
 import { useQueries } from "@tanstack/react-query";
-import { Button, Form, InputNumber, Modal, Radio } from "antd";
+import { Form, InputNumber, Modal, Radio } from "antd";
 import { useForm } from "antd/es/form/Form";
+import { useCallback, useMemo, useState } from "react";
+import { formatLength, formatWeight } from "../../utils/parsing";
+import { SpoolType, useGetExternalDBFilaments } from "../../utils/queryExternalDB";
+import { getAPIURL } from "../../utils/url";
+import { IFilament } from "../filaments/model";
+import { ISpool } from "./model";
 
 export async function setSpoolArchived(spool: ISpool, archived: boolean) {
   const init: RequestInit = {

client/src/pages/spools/list.tsx

@@ -1,11 +1,3 @@
-import { useCallback, useMemo, useState } from "react";
-import { IResourceComponentsProps, useInvalidate, useNavigation, useTranslate } from "@refinedev/core";
-import { useTable, List } from "@refinedev/antd";
-import { Table, Button, Dropdown, Modal } from "antd";
-import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
-import { ISpool } from "./model";
-import { TableState, useInitialTableState, useSavedState, useStoreInitialState } from "../../utils/saveload";
 import {
   EditOutlined,
   EyeOutlined,
@@ -16,29 +8,37 @@ import {
   ToolOutlined,
   ToTopOutlined,
 } from "@ant-design/icons";
+import { List, useTable } from "@refinedev/antd";
+import { IResourceComponentsProps, useInvalidate, useNavigation, useTranslate } from "@refinedev/core";
+import { Button, Dropdown, Modal, Table } from "antd";
+import dayjs from "dayjs";
+import utc from "dayjs/plugin/utc";
+import { useCallback, useMemo, useState } from "react";
+import { useNavigate } from "react-router-dom";
 import {
+  Action,
+  ActionsColumn,
+  CustomFieldColumn,
   DateColumn,
   FilteredQueryColumn,
   NumberColumn,
   RichColumn,
   SortedColumn,
   SpoolIconColumn,
-  Action,
-  ActionsColumn,
-  CustomFieldColumn,
 } from "../../components/column";
-import { setSpoolArchived, useSpoolAdjustModal } from "./functions";
+import { useLiveify } from "../../components/liveify";
 import {
   useSpoolmanFilamentFilter,
   useSpoolmanLocations,
   useSpoolmanLotNumbers,
   useSpoolmanMaterials,
 } from "../../components/otherModels";
-import { useLiveify } from "../../components/liveify";
 import { removeUndefined } from "../../utils/filtering";
 import { EntityType, useGetFields } from "../../utils/queryFields";
-import { useNavigate } from "react-router-dom";
+import { TableState, useInitialTableState, useSavedState, useStoreInitialState } from "../../utils/saveload";
 import { useCurrency } from "../../utils/settings";
+import { setSpoolArchived, useSpoolAdjustModal } from "./functions";
+import { ISpool } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/spools/show.tsx

@@ -1,18 +1,18 @@
-import React from "react";
+import { PrinterOutlined } from "@ant-design/icons";
+import { DateField, NumberField, Show, TextField } from "@refinedev/antd";
 import { IResourceComponentsProps, useShow, useTranslate } from "@refinedev/core";
-import { Show, NumberField, DateField, TextField } from "@refinedev/antd";
 import { Button, Typography } from "antd";
-import { NumberFieldUnit } from "../../components/numberField";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { ISpool } from "./model";
+import React from "react";
-import { enrichText } from "../../utils/parsing";
-import { IFilament } from "../filaments/model";
-import { EntityType, useGetFields } from "../../utils/queryFields";
 import { ExtraFieldDisplay } from "../../components/extraFields";
-import { useCurrency } from "../../utils/settings";
+import { NumberFieldUnit } from "../../components/numberField";
 import SpoolIcon from "../../components/spoolIcon";
-import { PrinterOutlined } from "@ant-design/icons";
+import { enrichText } from "../../utils/parsing";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { useCurrency } from "../../utils/settings";
+import { IFilament } from "../filaments/model";
+import { ISpool } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/vendors/create.tsx

@@ -1,13 +1,13 @@
-import { useEffect } from "react";
-import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
 import { Create, useForm } from "@refinedev/antd";
-import { Button, Form, Input, Typography, InputNumber } from "antd";
+import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
+import { Button, Form, Input, InputNumber, Typography } from "antd";
 import TextArea from "antd/es/input/TextArea";
-import { IVendor, IVendorParsedExtras } from "./model";
-import { EntityType, useGetFields } from "../../utils/queryFields";
-import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
+import { useEffect } from "react";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
+import { EntityType, useGetFields } from "../../utils/queryFields";
+import { IVendor, IVendorParsedExtras } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/vendors/edit.tsx

@@ -1,13 +1,12 @@
-import React, { useState } from "react";
-import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
 import { Edit, useForm } from "@refinedev/antd";
-import { Form, Input, DatePicker, message, Alert, Typography, InputNumber } from "antd";
+import { HttpError, IResourceComponentsProps, useTranslate } from "@refinedev/core";
-import dayjs from "dayjs";
+import { Alert, DatePicker, Form, Input, InputNumber, message, Typography } from "antd";
 import TextArea from "antd/es/input/TextArea";
-import { IVendor, IVendorParsedExtras } from "./model";
+import dayjs from "dayjs";
+import React, { useState } from "react";
+import { ExtraFieldFormItem, ParsedExtras, StringifiedExtras } from "../../components/extraFields";
 import { EntityType, useGetFields } from "../../utils/queryFields";
-import { ExtraFieldFormItem, StringifiedExtras } from "../../components/extraFields";
+import { IVendor, IVendorParsedExtras } from "./model";
-import { ParsedExtras } from "../../components/extraFields";
 
 /*
 The API returns the extra fields as JSON values, but we need to parse them into their real types

client/src/pages/vendors/list.tsx

@@ -1,24 +1,24 @@
-import { IResourceComponentsProps, useTranslate, useInvalidate, useNavigation } from "@refinedev/core";
+import { EditOutlined, EyeOutlined, FilterOutlined, PlusSquareOutlined } from "@ant-design/icons";
-import { useTable, List } from "@refinedev/antd";
+import { List, useTable } from "@refinedev/antd";
-import { Table, Button, Dropdown } from "antd";
+import { IResourceComponentsProps, useInvalidate, useNavigation, useTranslate } from "@refinedev/core";
+import { Button, Dropdown, Table } from "antd";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { IVendor } from "./model";
+import { useCallback, useMemo, useState } from "react";
-import { TableState, useInitialTableState, useStoreInitialState } from "../../utils/saveload";
+import { useNavigate } from "react-router-dom";
-import { EditOutlined, EyeOutlined, FilterOutlined, PlusSquareOutlined } from "@ant-design/icons";
 import {
-  DateColumn,
-  RichColumn,
-  SortedColumn,
   ActionsColumn,
   CustomFieldColumn,
+  DateColumn,
   NumberColumn,
+  RichColumn,
+  SortedColumn,
 } from "../../components/column";
 import { useLiveify } from "../../components/liveify";
 import { removeUndefined } from "../../utils/filtering";
 import { EntityType, useGetFields } from "../../utils/queryFields";
-import { useNavigate } from "react-router-dom";
+import { TableState, useInitialTableState, useStoreInitialState } from "../../utils/saveload";
-import { useCallback, useMemo, useState } from "react";
+import { IVendor } from "./model";
 
 dayjs.extend(utc);
 

client/src/pages/vendors/show.tsx

@@ -1,13 +1,13 @@
-import React from "react";
+import { DateField, NumberField, Show, TextField } from "@refinedev/antd";
 import { IResourceComponentsProps, useShow, useTranslate } from "@refinedev/core";
-import { Show, NumberField, DateField, TextField } from "@refinedev/antd";
 import { Typography } from "antd";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { IVendor } from "./model";
+import React from "react";
+import { ExtraFieldDisplay } from "../../components/extraFields";
 import { enrichText } from "../../utils/parsing";
 import { EntityType, useGetFields } from "../../utils/queryFields";
-import { ExtraFieldDisplay } from "../../components/extraFields";
+import { IVendor } from "./model";
 
 dayjs.extend(utc);
 

client/src/utils/queryExternalDB.ts

@@ -1,4 +1,4 @@
-import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import { getAPIURL } from "./url";
 
 export enum SpoolType {

client/src/utils/queryFields.ts

@@ -1,4 +1,4 @@
-import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import dayjs from "dayjs";
 import { getAPIURL } from "./url";
 

client/src/utils/querySettings.ts

@@ -1,4 +1,4 @@
-import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { getAPIURL } from "./url";
 
 interface SettingResponseValue {

client/src/utils/saveload.ts

@@ -1,6 +1,6 @@
 import { CrudFilter, CrudSort } from "@refinedev/core";
-import { isLocalStorageAvailable } from "./support";
 import { useEffect, useState } from "react";
+import { isLocalStorageAvailable } from "./support";
 interface Pagination {
   current: number;
   pageSize: number;