From fdf07099bab682dbd817d58f5c027ddadcda80d5 Mon Sep 17 00:00:00 2001 From: David Crespo Date: Tue, 31 Oct 2023 13:36:00 -0500 Subject: [PATCH 1/2] switch import sorter to one that groups imports from the same package --- .prettierrc.js | 15 +++-- app/components/MswBanner.tsx | 2 +- app/components/RefetchIntervalPicker.tsx | 2 +- app/components/TopBar.tsx | 2 +- app/components/form/Form.tsx | 2 +- app/components/form/FullPageForm.tsx | 2 +- app/components/form/fields/RadioField.tsx | 3 +- app/components/form/fields/TextField.tsx | 3 +- app/forms/disk-create.tsx | 3 +- app/forms/idp/shared.tsx | 2 +- app/forms/image-edit.tsx | 2 +- app/forms/image-from-snapshot.tsx | 2 +- app/forms/image-upload.tsx | 2 +- app/forms/instance-create.tsx | 11 ++-- app/forms/snapshot-create.tsx | 3 +- app/hooks/use-form.ts | 2 +- app/hooks/use-key.ts | 2 + app/main.tsx | 2 +- app/pages/LoginPage.tsx | 2 + app/pages/LoginPageSaml.tsx | 2 +- app/pages/ProjectsPage.tsx | 5 +- app/pages/SiloAccessPage.tsx | 5 +- app/pages/SiloUtilizationPage.tsx | 2 +- .../project/access/ProjectAccessPage.tsx | 3 +- app/pages/project/disks/DisksPage.tsx | 7 +- app/pages/project/images/ImagesPage.tsx | 9 ++- app/pages/project/instances/InstancesPage.tsx | 2 +- app/pages/project/instances/actions.tsx | 2 +- .../instances/instance/SerialConsolePage.tsx | 5 +- .../instances/instance/tabs/StorageTab.tsx | 2 +- .../VpcPage/tabs/VpcFirewallRulesTab.tsx | 4 +- app/pages/project/networking/VpcsPage.tsx | 7 +- app/pages/project/snapshots/SnapshotsPage.tsx | 2 +- app/pages/settings/ProfilePage.tsx | 2 +- app/pages/settings/SSHKeysPage.tsx | 6 +- app/pages/system/SiloImagesPage.tsx | 4 +- app/pages/system/SiloPage.tsx | 7 +- app/pages/system/SilosPage.tsx | 7 +- app/pages/system/UtilizationPage.tsx | 4 +- app/routes.tsx | 22 +++---- app/test/e2e/scroll-restore.e2e.ts | 2 +- app/test/unit/setup.ts | 1 + libs/api-mocks/msw/db.ts | 2 +- libs/api-mocks/msw/handlers.ts | 4 +- libs/api-mocks/msw/util.ts | 2 +- libs/api/__generated__/msw-handlers.ts | 10 +-- libs/api/__generated__/validate.ts | 2 +- libs/api/hooks.ts | 2 +- libs/api/roles.spec.ts | 2 +- libs/table/QueryTable.tsx | 6 +- libs/ui/index.ts | 1 + libs/ui/lib/date-picker/DatePicker.tsx | 3 +- libs/ui/lib/date-picker/DateRangePicker.tsx | 3 +- libs/ui/lib/dropdown-menu/DropdownMenu.tsx | 2 +- libs/ui/lib/listbox/Listbox.tsx | 2 +- libs/ui/lib/mini-table/MiniTable.tsx | 1 + libs/ui/lib/modal/Modal.stories.tsx | 2 +- libs/ui/lib/number-input/NumberInput.tsx | 4 +- .../lib/properties-table/PropertiesTable.tsx | 1 + libs/ui/lib/settings-group/SettingsGroup.tsx | 2 +- libs/ui/lib/side-modal/SideModal.stories.tsx | 2 +- libs/ui/lib/side-modal/SideModal.tsx | 2 +- libs/ui/lib/table/Table.tsx | 1 + .../timeout-indicator/TimeoutIndicator.tsx | 3 +- libs/ui/lib/tooltip/Tooltip.tsx | 4 +- package-lock.json | 65 +++++++++++++++++-- package.json | 2 +- vite.config.ts | 2 +- 68 files changed, 181 insertions(+), 127 deletions(-) diff --git a/.prettierrc.js b/.prettierrc.js index 829b894b62..1869b3c0d9 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -8,13 +8,18 @@ module.exports = { // note: it seems like tailwind has to be last for it to work - plugins: ['@trivago/prettier-plugin-sort-imports', 'prettier-plugin-tailwindcss'], + plugins: ['@ianvs/prettier-plugin-sort-imports', 'prettier-plugin-tailwindcss'], printWidth: 92, singleQuote: true, semi: false, trailingComma: 'es5', // default changed to all in prettier 3, wanted to minimize diff - importOrder: ['', '^@oxide/(.*)$', '^app/(.*)$', '^[./]'], - importOrderGroupNamespaceSpecifiers: true, - importOrderSeparation: true, - importOrderSortSpecifiers: true, + importOrder: [ + '', + '', + '^@oxide/(.*)$', + '', + '^app/(.*)$', + '', + '^[./]', + ], } diff --git a/app/components/MswBanner.tsx b/app/components/MswBanner.tsx index f94bbaaf6c..a23dd71c6a 100644 --- a/app/components/MswBanner.tsx +++ b/app/components/MswBanner.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { type ReactNode, useState } from 'react' +import { useState, type ReactNode } from 'react' import { Button, diff --git a/app/components/RefetchIntervalPicker.tsx b/app/components/RefetchIntervalPicker.tsx index f6fa3b107f..e22b025690 100644 --- a/app/components/RefetchIntervalPicker.tsx +++ b/app/components/RefetchIntervalPicker.tsx @@ -11,11 +11,11 @@ import { useEffect, useState } from 'react' import { Listbox, - type ListboxItem, Refresh16Icon, SpinnerLoader, Time16Icon, useInterval, + type ListboxItem, } from '@oxide/ui' const intervalPresets = { diff --git a/app/components/TopBar.tsx b/app/components/TopBar.tsx index 332b080991..8a261a088a 100644 --- a/app/components/TopBar.tsx +++ b/app/components/TopBar.tsx @@ -11,11 +11,11 @@ import { useNavigate } from 'react-router-dom' import { navToLogin, useApiMutation } from '@oxide/api' import { Button, + buttonStyle, DirectionDownIcon, DropdownMenu, Info16Icon, Profile16Icon, - buttonStyle, } from '@oxide/ui' import { useCurrentUser } from 'app/layouts/AuthenticatedLayout' diff --git a/app/components/form/Form.tsx b/app/components/form/Form.tsx index 80b56dabfe..876c2a704c 100644 --- a/app/components/form/Form.tsx +++ b/app/components/form/Form.tsx @@ -8,7 +8,7 @@ import cn from 'classnames' import { cloneElement } from 'react' -import { Button, type ButtonProps, Error12Icon } from '@oxide/ui' +import { Button, Error12Icon, type ButtonProps } from '@oxide/ui' import { classed, flattenChildren, invariant, isOneOf, pluckFirstOfType } from '@oxide/util' import './form.css' diff --git a/app/components/form/FullPageForm.tsx b/app/components/form/FullPageForm.tsx index 2448b9104f..6fbe7298d6 100644 --- a/app/components/form/FullPageForm.tsx +++ b/app/components/form/FullPageForm.tsx @@ -15,8 +15,8 @@ import type { ApiError } from '@oxide/api' import { Modal, PageHeader, PageTitle } from '@oxide/ui' import { classed, flattenChildren, pluckFirstOfType } from '@oxide/util' -import { PageActions } from '../PageActions' import { Form } from '../form/Form' +import { PageActions } from '../PageActions' interface FullPageFormProps { id: string diff --git a/app/components/form/fields/RadioField.tsx b/app/components/form/fields/RadioField.tsx index f70e09e561..0c5aa19baf 100644 --- a/app/components/form/fields/RadioField.tsx +++ b/app/components/form/fields/RadioField.tsx @@ -11,8 +11,7 @@ import type { Control, FieldPath, FieldValues, PathValue } from 'react-hook-form import { Controller } from 'react-hook-form' import type { RadioGroupProps } from '@oxide/ui' -import { Radio } from '@oxide/ui' -import { FieldLabel, RadioGroup, TextInputHint } from '@oxide/ui' +import { FieldLabel, Radio, RadioGroup, TextInputHint } from '@oxide/ui' import { capitalize } from '@oxide/util' export type RadioFieldProps< diff --git a/app/components/form/fields/TextField.tsx b/app/components/form/fields/TextField.tsx index e46e907df7..3e198c5b80 100644 --- a/app/components/form/fields/TextField.tsx +++ b/app/components/form/fields/TextField.tsx @@ -20,8 +20,7 @@ import type { TextAreaProps as UITextAreaProps, TextInputBaseProps as UITextFieldProps, } from '@oxide/ui' -import { TextInputHint } from '@oxide/ui' -import { FieldLabel, TextInput as UITextField } from '@oxide/ui' +import { FieldLabel, TextInputHint, TextInput as UITextField } from '@oxide/ui' import { capitalize } from '@oxide/util' import { ErrorMessage } from './ErrorMessage' diff --git a/app/forms/disk-create.tsx b/app/forms/disk-create.tsx index f47858e890..acf1669982 100644 --- a/app/forms/disk-create.tsx +++ b/app/forms/disk-create.tsx @@ -13,8 +13,7 @@ import { useNavigate } from 'react-router-dom' import type { BlockSize, Disk, DiskCreate, DiskSource } from '@oxide/api' import { useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' -import { FormDivider } from '@oxide/ui' -import { FieldLabel, Radio, RadioGroup } from '@oxide/ui' +import { FieldLabel, FormDivider, Radio, RadioGroup } from '@oxide/ui' import { GiB } from '@oxide/util' import { diff --git a/app/forms/idp/shared.tsx b/app/forms/idp/shared.tsx index 4e1744112c..4ba93cd5fb 100644 --- a/app/forms/idp/shared.tsx +++ b/app/forms/idp/shared.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { type Control, useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import type { Merge } from 'type-fest' import type { IdpMetadataSource, SamlIdentityProviderCreate } from '@oxide/api' diff --git a/app/forms/image-edit.tsx b/app/forms/image-edit.tsx index d846776ee4..f0cd7f06fa 100644 --- a/app/forms/image-edit.tsx +++ b/app/forms/image-edit.tsx @@ -8,7 +8,7 @@ import type { LoaderFunctionArgs } from 'react-router-dom' import { useNavigate } from 'react-router-dom' -import { type Image, apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' +import { apiQueryClient, usePrefetchedApiQuery, type Image } from '@oxide/api' import { Images16Icon, PropertiesTable, ResourceLabel, Truncate } from '@oxide/ui' import { bytesToGiB, formatDateTime } from '@oxide/util' diff --git a/app/forms/image-from-snapshot.tsx b/app/forms/image-from-snapshot.tsx index ed19bd4188..30c9545225 100644 --- a/app/forms/image-from-snapshot.tsx +++ b/app/forms/image-from-snapshot.tsx @@ -10,11 +10,11 @@ import type { LoaderFunctionArgs } from 'react-router-dom' import { useNavigate } from 'react-router-dom' import { - type ImageCreate, apiQueryClient, useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type ImageCreate, } from '@oxide/api' import { PropertiesTable } from '@oxide/ui' diff --git a/app/forms/image-upload.tsx b/app/forms/image-upload.tsx index 950cc662ce..f99e327b7f 100644 --- a/app/forms/image-upload.tsx +++ b/app/forms/image-upload.tsx @@ -23,7 +23,7 @@ import { Success12Icon, Unauthorized12Icon, } from '@oxide/ui' -import { GiB, KiB, invariant } from '@oxide/util' +import { GiB, invariant, KiB } from '@oxide/util' import { DescriptionField, diff --git a/app/forms/instance-create.tsx b/app/forms/instance-create.tsx index eb7e2b5666..ba9797ac4c 100644 --- a/app/forms/instance-create.tsx +++ b/app/forms/instance-create.tsx @@ -12,11 +12,11 @@ import type { SetRequired } from 'type-fest' import type { InstanceCreate } from '@oxide/api' import { + apiQueryClient, + genName, INSTANCE_MAX_CPU, INSTANCE_MAX_RAM_GiB, MAX_DISK_SIZE_GiB, - apiQueryClient, - genName, useApiMutation, useApiQueryClient, usePrefetchedApiQuery, @@ -35,21 +35,22 @@ import { TextInputHint, Truncate, } from '@oxide/ui' -import { GiB, formatDateTime, invariant } from '@oxide/util' +import { formatDateTime, GiB, invariant } from '@oxide/util' -import { Form, FullPageForm } from 'app/components/form' -import type { DiskTableItem } from 'app/components/form' import { CheckboxField, DescriptionField, DiskSizeField, DisksTableField, + Form, + FullPageForm, ImageSelectField, NameField, NetworkInterfaceField, RadioFieldDyn, TextField, } from 'app/components/form' +import type { DiskTableItem } from 'app/components/form' import { getProjectSelector, useForm, useProjectSelector, useToast } from 'app/hooks' import { pb } from 'app/util/path-builder' diff --git a/app/forms/snapshot-create.tsx b/app/forms/snapshot-create.tsx index bb93caa7c8..874f848a30 100644 --- a/app/forms/snapshot-create.tsx +++ b/app/forms/snapshot-create.tsx @@ -8,8 +8,7 @@ import { useNavigate } from 'react-router-dom' import type { PathParams as PP, SnapshotCreate } from '@oxide/api' -import { diskCan } from '@oxide/api' -import { useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' +import { diskCan, useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' import { DescriptionField, diff --git a/app/hooks/use-form.ts b/app/hooks/use-form.ts index 75f6085050..9768ee3370 100644 --- a/app/hooks/use-form.ts +++ b/app/hooks/use-form.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { type FieldValues, type UseFormProps, useForm as _useForm } from 'react-hook-form' +import { useForm as _useForm, type FieldValues, type UseFormProps } from 'react-hook-form' /** * Same as built-in `useForm` except we can hard-code some props and prevent the diff --git a/app/hooks/use-key.ts b/app/hooks/use-key.ts index a438e11ffa..35f9f7c23d 100644 --- a/app/hooks/use-key.ts +++ b/app/hooks/use-key.ts @@ -6,7 +6,9 @@ * Copyright Oxide Computer Company */ import Mousetrap from 'mousetrap' + import 'mousetrap/plugins/global-bind/mousetrap-global-bind' + import { useEffect, useRef } from 'react' type Key = Parameters[0] diff --git a/app/main.tsx b/app/main.tsx index fe8b5ad4aa..e933841355 100644 --- a/app/main.tsx +++ b/app/main.tsx @@ -9,7 +9,7 @@ import { QueryClientProvider } from '@tanstack/react-query' // import { ReactQueryDevtools } from '@tanstack/react-query-devtools' import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' -import { RouterProvider, createBrowserRouter } from 'react-router-dom' +import { createBrowserRouter, RouterProvider } from 'react-router-dom' import { queryClient } from '@oxide/api' import { SkipLink } from '@oxide/ui' diff --git a/app/pages/LoginPage.tsx b/app/pages/LoginPage.tsx index 76e2f69a48..2600505929 100644 --- a/app/pages/LoginPage.tsx +++ b/app/pages/LoginPage.tsx @@ -13,7 +13,9 @@ import { useApiMutation } from '@oxide/api' import { Button, Identicon } from '@oxide/ui' import { TextFieldInner } from 'app/components/form' + import 'app/components/login-page.css' + import { useForm } from 'app/hooks' import { pb } from 'app/util/path-builder' diff --git a/app/pages/LoginPageSaml.tsx b/app/pages/LoginPageSaml.tsx index f75be1d181..cf408f506e 100644 --- a/app/pages/LoginPageSaml.tsx +++ b/app/pages/LoginPageSaml.tsx @@ -8,7 +8,7 @@ import cn from 'classnames' import { useSearchParams } from 'react-router-dom' -import { Identicon, buttonStyle } from '@oxide/ui' +import { buttonStyle, Identicon } from '@oxide/ui' import 'app/components/login-page.css' diff --git a/app/pages/ProjectsPage.tsx b/app/pages/ProjectsPage.tsx index c2f1f1322d..72b80da33b 100644 --- a/app/pages/ProjectsPage.tsx +++ b/app/pages/ProjectsPage.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import { Outlet } from 'react-router-dom' -import { Link, useNavigate } from 'react-router-dom' +import { Link, Outlet, useNavigate } from 'react-router-dom' import type { Project } from '@oxide/api' import { @@ -19,12 +18,12 @@ import { import type { MenuAction } from '@oxide/table' import { DateCell, linkCell, useQueryTable } from '@oxide/table' import { + buttonStyle, EmptyMessage, Folder24Icon, PageHeader, PageTitle, TableActions, - buttonStyle, } from '@oxide/ui' import { confirmDelete } from 'app/stores/confirm-delete' diff --git a/app/pages/SiloAccessPage.tsx b/app/pages/SiloAccessPage.tsx index fff8b3dd65..7e6e1b5acf 100644 --- a/app/pages/SiloAccessPage.tsx +++ b/app/pages/SiloAccessPage.tsx @@ -8,16 +8,17 @@ import { useMemo, useState } from 'react' import type { IdentityType, RoleKey } from '@oxide/api' -import { deleteRole, usePrefetchedApiQuery } from '@oxide/api' import { apiQueryClient, byGroupThenName, + deleteRole, getEffectiveRole, useApiMutation, useApiQueryClient, + usePrefetchedApiQuery, useUserRows, } from '@oxide/api' -import { Table, createColumnHelper, getActionsCol, useReactTable } from '@oxide/table' +import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table' import { Access24Icon, Button, diff --git a/app/pages/SiloUtilizationPage.tsx b/app/pages/SiloUtilizationPage.tsx index 1d3bc6cd93..191900a87e 100644 --- a/app/pages/SiloUtilizationPage.tsx +++ b/app/pages/SiloUtilizationPage.tsx @@ -13,9 +13,9 @@ import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { Divider, Listbox, Metrics24Icon, PageHeader, PageTitle } from '@oxide/ui' import { bytesToGiB, bytesToTiB } from '@oxide/util' +import { useDateTimeRangePicker } from 'app/components/form' import { useIntervalPicker } from 'app/components/RefetchIntervalPicker' import { SiloMetric } from 'app/components/SystemMetric' -import { useDateTimeRangePicker } from 'app/components/form' import { useCurrentUser } from 'app/layouts/AuthenticatedLayout' const toListboxItem = (x: { name: string; id: string }) => ({ label: x.name, value: x.id }) diff --git a/app/pages/project/access/ProjectAccessPage.tsx b/app/pages/project/access/ProjectAccessPage.tsx index 5bca864b07..72014f8ecc 100644 --- a/app/pages/project/access/ProjectAccessPage.tsx +++ b/app/pages/project/access/ProjectAccessPage.tsx @@ -6,6 +6,7 @@ * Copyright Oxide Computer Company */ import '@tanstack/react-table' + import { useMemo, useState } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' @@ -20,7 +21,7 @@ import { usePrefetchedApiQuery, useUserRows, } from '@oxide/api' -import { Table, createColumnHelper, getActionsCol, useReactTable } from '@oxide/table' +import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table' import { Access24Icon, Button, diff --git a/app/pages/project/disks/DisksPage.tsx b/app/pages/project/disks/DisksPage.tsx index 23e238ae2f..b8d17e6908 100644 --- a/app/pages/project/disks/DisksPage.tsx +++ b/app/pages/project/disks/DisksPage.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import type { LoaderFunctionArgs } from 'react-router-dom' -import { Outlet } from 'react-router-dom' -import { Link } from 'react-router-dom' +import { Link, Outlet } from 'react-router-dom' import type { Disk } from '@oxide/api' import { @@ -18,14 +17,14 @@ import { useApiQuery, useApiQueryClient, } from '@oxide/api' -import { DateCell, type MenuAction, SizeCell, useQueryTable } from '@oxide/table' +import { DateCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { + buttonStyle, EmptyMessage, PageHeader, PageTitle, Storage24Icon, TableActions, - buttonStyle, } from '@oxide/ui' import { DiskStatusBadge } from 'app/components/StatusBadge' diff --git a/app/pages/project/images/ImagesPage.tsx b/app/pages/project/images/ImagesPage.tsx index 60b9cca28d..dfa199c64f 100644 --- a/app/pages/project/images/ImagesPage.tsx +++ b/app/pages/project/images/ImagesPage.tsx @@ -7,12 +7,12 @@ */ import { useState } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' -import { Outlet } from 'react-router-dom' -import { Link } from 'react-router-dom' +import { Link, Outlet } from 'react-router-dom' -import { type Image, apiQueryClient, useApiMutation, useApiQueryClient } from '@oxide/api' -import { DateCell, type MenuAction, SizeCell, linkCell, useQueryTable } from '@oxide/table' +import { apiQueryClient, useApiMutation, useApiQueryClient, type Image } from '@oxide/api' +import { DateCell, linkCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { + buttonStyle, EmptyMessage, Images24Icon, Message, @@ -20,7 +20,6 @@ import { PageHeader, PageTitle, TableActions, - buttonStyle, } from '@oxide/ui' import { getProjectSelector, useProjectSelector, useToast } from 'app/hooks' diff --git a/app/pages/project/instances/InstancesPage.tsx b/app/pages/project/instances/InstancesPage.tsx index 16b683175b..7c0c0c68de 100644 --- a/app/pages/project/instances/InstancesPage.tsx +++ b/app/pages/project/instances/InstancesPage.tsx @@ -19,13 +19,13 @@ import { } from '@oxide/table' import { Button, + buttonStyle, EmptyMessage, Instances24Icon, PageHeader, PageTitle, Refresh16Icon, TableActions, - buttonStyle, } from '@oxide/ui' import { getProjectSelector, useProjectSelector, useQuickActions } from 'app/hooks' diff --git a/app/pages/project/instances/actions.tsx b/app/pages/project/instances/actions.tsx index b25893b5a2..c2ee1d3ab1 100644 --- a/app/pages/project/instances/actions.tsx +++ b/app/pages/project/instances/actions.tsx @@ -8,7 +8,7 @@ import { useCallback } from 'react' import { useNavigate } from 'react-router-dom' -import { type Instance, instanceCan, useApiMutation } from '@oxide/api' +import { instanceCan, useApiMutation, type Instance } from '@oxide/api' import type { MakeActions } from '@oxide/table' import { confirmDelete } from 'app/stores/confirm-delete' diff --git a/app/pages/project/instances/instance/SerialConsolePage.tsx b/app/pages/project/instances/instance/SerialConsolePage.tsx index 6b31bc16a4..cf23d11677 100644 --- a/app/pages/project/instances/instance/SerialConsolePage.tsx +++ b/app/pages/project/instances/instance/SerialConsolePage.tsx @@ -5,13 +5,12 @@ * * Copyright Oxide Computer Company */ -import { Suspense, lazy, useEffect, useRef, useState } from 'react' +import { lazy, Suspense, useEffect, useRef, useState } from 'react' import { Link } from 'react-router-dom' import { api } from '@oxide/api' import type { BadgeColor } from '@oxide/ui' -import { Badge } from '@oxide/ui' -import { PrevArrow12Icon, Spinner } from '@oxide/ui' +import { Badge, PrevArrow12Icon, Spinner } from '@oxide/ui' import EquivalentCliCommand from 'app/components/EquivalentCliCommand' import { useInstanceSelector } from 'app/hooks' diff --git a/app/pages/project/instances/instance/tabs/StorageTab.tsx b/app/pages/project/instances/instance/tabs/StorageTab.tsx index 64d3eff51c..e12ed2faa0 100644 --- a/app/pages/project/instances/instance/tabs/StorageTab.tsx +++ b/app/pages/project/instances/instance/tabs/StorageTab.tsx @@ -9,7 +9,6 @@ import { useCallback, useMemo, useState } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' import { - type Disk, apiQueryClient, diskCan, genName, @@ -17,6 +16,7 @@ import { useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type Disk, } from '@oxide/api' import type { MenuAction } from '@oxide/table' import { DateCell, SizeCell, useQueryTable } from '@oxide/table' diff --git a/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx b/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx index 57b7574f8d..a9d507ffd9 100644 --- a/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx +++ b/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx @@ -10,13 +10,13 @@ import { useMemo, useState } from 'react' import type { VpcFirewallRule } from '@oxide/api' import { useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' import { + createColumnHelper, DateCell, EnabledCell, FirewallFilterCell, + getActionsCol, Table, TypeValueListCell, - createColumnHelper, - getActionsCol, useReactTable, } from '@oxide/table' import { Button, EmptyMessage, TableEmptyBox } from '@oxide/ui' diff --git a/app/pages/project/networking/VpcsPage.tsx b/app/pages/project/networking/VpcsPage.tsx index 241c01f2ad..8e20afc8bc 100644 --- a/app/pages/project/networking/VpcsPage.tsx +++ b/app/pages/project/networking/VpcsPage.tsx @@ -7,8 +7,7 @@ */ import { useMemo } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' -import { Outlet } from 'react-router-dom' -import { Link, useNavigate } from 'react-router-dom' +import { Link, Outlet, useNavigate } from 'react-router-dom' import type { Vpc } from '@oxide/api' import { @@ -17,14 +16,14 @@ import { useApiQueryClient, usePrefetchedApiQuery, } from '@oxide/api' -import { DateCell, type MenuAction, linkCell, useQueryTable } from '@oxide/table' +import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table' import { + buttonStyle, EmptyMessage, Networking24Icon, PageHeader, PageTitle, TableActions, - buttonStyle, } from '@oxide/ui' import { getProjectSelector, useProjectSelector, useQuickActions } from 'app/hooks' diff --git a/app/pages/project/snapshots/SnapshotsPage.tsx b/app/pages/project/snapshots/SnapshotsPage.tsx index 4ca23cbbc1..2b64fc294d 100644 --- a/app/pages/project/snapshots/SnapshotsPage.tsx +++ b/app/pages/project/snapshots/SnapshotsPage.tsx @@ -19,13 +19,13 @@ import type { MenuAction } from '@oxide/table' import { DateCell, SizeCell, useQueryTable } from '@oxide/table' import { Badge, + buttonStyle, EmptyMessage, PageHeader, PageTitle, Snapshots24Icon, Spinner, TableActions, - buttonStyle, } from '@oxide/ui' import { SnapshotStatusBadge } from 'app/components/StatusBadge' diff --git a/app/pages/settings/ProfilePage.tsx b/app/pages/settings/ProfilePage.tsx index c253f49e7d..effdf7ddde 100644 --- a/app/pages/settings/ProfilePage.tsx +++ b/app/pages/settings/ProfilePage.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import type { Group } from '@oxide/api' -import { Table, createColumnHelper, useReactTable } from '@oxide/table' +import { createColumnHelper, Table, useReactTable } from '@oxide/table' import { Settings24Icon } from '@oxide/ui' import { FullPageForm, TextField } from 'app/components/form' diff --git a/app/pages/settings/SSHKeysPage.tsx b/app/pages/settings/SSHKeysPage.tsx index 9fd4d3afd9..b614a1bc42 100644 --- a/app/pages/settings/SSHKeysPage.tsx +++ b/app/pages/settings/SSHKeysPage.tsx @@ -8,19 +8,17 @@ import { Link, Outlet, useNavigate } from 'react-router-dom' import type { SshKey } from '@oxide/api' -import { apiQueryClient } from '@oxide/api' -import { useApiQueryClient } from '@oxide/api' -import { useApiMutation } from '@oxide/api' +import { apiQueryClient, useApiMutation, useApiQueryClient } from '@oxide/api' import type { MenuAction } from '@oxide/table' import { DateCell, useQueryTable } from '@oxide/table' import { + buttonStyle, EmptyMessage, Key16Icon, Key24Icon, PageHeader, PageTitle, TableActions, - buttonStyle, } from '@oxide/ui' import { confirmDelete } from 'app/stores/confirm-delete' diff --git a/app/pages/system/SiloImagesPage.tsx b/app/pages/system/SiloImagesPage.tsx index adefbd5f8c..c7ee42e2f5 100644 --- a/app/pages/system/SiloImagesPage.tsx +++ b/app/pages/system/SiloImagesPage.tsx @@ -10,13 +10,13 @@ import { type FieldValues } from 'react-hook-form' import { Outlet } from 'react-router-dom' import { - type Image, apiQueryClient, useApiMutation, useApiQuery, useApiQueryClient, + type Image, } from '@oxide/api' -import { DateCell, type MenuAction, SizeCell, linkCell, useQueryTable } from '@oxide/table' +import { DateCell, linkCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { Button, EmptyMessage, diff --git a/app/pages/system/SiloPage.tsx b/app/pages/system/SiloPage.tsx index f2e1a6ae9b..28be2ee60b 100644 --- a/app/pages/system/SiloPage.tsx +++ b/app/pages/system/SiloPage.tsx @@ -6,13 +6,13 @@ * Copyright Oxide Computer Company */ import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link } from 'react-router-dom' -import { Outlet } from 'react-router-dom' +import { Link, Outlet } from 'react-router-dom' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' -import { DateCell, DefaultCell, TruncateCell, linkCell, useQueryTable } from '@oxide/table' +import { DateCell, DefaultCell, linkCell, TruncateCell, useQueryTable } from '@oxide/table' import { Badge, + buttonStyle, Cloud16Icon, Cloud24Icon, Divider, @@ -23,7 +23,6 @@ import { Question12Icon, TableActions, Tooltip, - buttonStyle, } from '@oxide/ui' import { getSiloSelector, useSiloSelector } from 'app/hooks' diff --git a/app/pages/system/SilosPage.tsx b/app/pages/system/SilosPage.tsx index 70fdae455b..67ab35d03b 100644 --- a/app/pages/system/SilosPage.tsx +++ b/app/pages/system/SilosPage.tsx @@ -16,18 +16,15 @@ import { usePrefetchedApiQuery, } from '@oxide/api' import type { MenuAction } from '@oxide/table' -import { linkCell } from '@oxide/table' -import { BooleanCell } from '@oxide/table' -import { DateCell } from '@oxide/table' -import { useQueryTable } from '@oxide/table' +import { BooleanCell, DateCell, linkCell, useQueryTable } from '@oxide/table' import { Badge, + buttonStyle, Cloud24Icon, EmptyMessage, PageHeader, PageTitle, TableActions, - buttonStyle, } from '@oxide/ui' import { useQuickActions } from 'app/hooks/use-quick-actions' diff --git a/app/pages/system/UtilizationPage.tsx b/app/pages/system/UtilizationPage.tsx index c1224eb6a3..40a98f5f5d 100644 --- a/app/pages/system/UtilizationPage.tsx +++ b/app/pages/system/UtilizationPage.tsx @@ -11,8 +11,8 @@ import { useMemo, useState } from 'react' import type { SiloResultsPage } from '@oxide/api' import { - FLEET_ID, apiQueryClient, + FLEET_ID, totalCapacity, useApiQueries, usePrefetchedApiQuery, @@ -32,10 +32,10 @@ import { import { bytesToGiB, bytesToTiB } from '@oxide/util' import { CapacityMetric, capacityQueryParams } from 'app/components/CapacityMetric' +import { useDateTimeRangePicker } from 'app/components/form' import { QueryParamTabs } from 'app/components/QueryParamTabs' import { useIntervalPicker } from 'app/components/RefetchIntervalPicker' import { SystemMetric } from 'app/components/SystemMetric' -import { useDateTimeRangePicker } from 'app/components/form' import { tabularizeSiloMetrics } from './metrics-util' diff --git a/app/routes.tsx b/app/routes.tsx index 9e61961382..62e347d570 100644 --- a/app/routes.tsx +++ b/app/routes.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { Navigate, Route, createRoutesFromElements } from 'react-router-dom' +import { createRoutesFromElements, Navigate, Route } from 'react-router-dom' import { RouterDataErrorBoundary } from './components/ErrorBoundary' import { NotFound } from './components/ErrorPage' @@ -27,22 +27,19 @@ import { CreateSSHKeySideModalForm } from './forms/ssh-key-create' import { CreateVpcSideModalForm } from './forms/vpc-create' import { EditVpcSideModalForm } from './forms/vpc-edit' import type { CrumbFunc } from './hooks/use-crumbs' -import AuthLayout from './layouts/AuthLayout' import { AuthenticatedLayout } from './layouts/AuthenticatedLayout' +import AuthLayout from './layouts/AuthLayout' +import { SerialConsoleContentPane } from './layouts/helpers' import { LoginLayout } from './layouts/LoginLayout' import ProjectLayout from './layouts/ProjectLayout' import RootLayout from './layouts/RootLayout' import SettingsLayout from './layouts/SettingsLayout' import { SiloLayout } from './layouts/SiloLayout' import SystemLayout from './layouts/SystemLayout' -import { SerialConsoleContentPane } from './layouts/helpers' import DeviceAuthSuccessPage from './pages/DeviceAuthSuccessPage' import DeviceAuthVerifyPage from './pages/DeviceAuthVerifyPage' import { LoginPage } from './pages/LoginPage' import { LoginPageSaml } from './pages/LoginPageSaml' -import ProjectsPage from './pages/ProjectsPage' -import { SiloAccessPage } from './pages/SiloAccessPage' -import { SiloUtilizationPage } from './pages/SiloUtilizationPage' import { DisksPage, ImagesPage, @@ -58,17 +55,20 @@ import { ConnectTab } from './pages/project/instances/instance/tabs/ConnectTab' import { MetricsTab } from './pages/project/instances/instance/tabs/MetricsTab' import { NetworkingTab } from './pages/project/instances/instance/tabs/NetworkingTab' import { StorageTab } from './pages/project/instances/instance/tabs/StorageTab' +import ProjectsPage from './pages/ProjectsPage' import { ProfilePage } from './pages/settings/ProfilePage' import { SSHKeysPage } from './pages/settings/SSHKeysPage' -import { SiloImagesPage } from './pages/system/SiloImagesPage' -import { SiloPage } from './pages/system/SiloPage' -import SilosPage from './pages/system/SilosPage' -import { SystemUtilizationPage } from './pages/system/UtilizationPage' +import { SiloAccessPage } from './pages/SiloAccessPage' +import { SiloUtilizationPage } from './pages/SiloUtilizationPage' import { DisksTab } from './pages/system/inventory/DisksTab' import { InventoryPage } from './pages/system/inventory/InventoryPage' -import { SledsTab } from './pages/system/inventory/SledsTab' import { SledInstancesTab } from './pages/system/inventory/sled/SledInstancesTab' import { SledPage } from './pages/system/inventory/sled/SledPage' +import { SledsTab } from './pages/system/inventory/SledsTab' +import { SiloImagesPage } from './pages/system/SiloImagesPage' +import { SiloPage } from './pages/system/SiloPage' +import SilosPage from './pages/system/SilosPage' +import { SystemUtilizationPage } from './pages/system/UtilizationPage' import { pb } from './util/path-builder' const projectCrumb: CrumbFunc = (m) => m.params.project! diff --git a/app/test/e2e/scroll-restore.e2e.ts b/app/test/e2e/scroll-restore.e2e.ts index 7b05dbc6b4..318b2e8a59 100644 --- a/app/test/e2e/scroll-restore.e2e.ts +++ b/app/test/e2e/scroll-restore.e2e.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { type Page, expect, test } from './utils' +import { expect, test, type Page } from './utils' async function expectScrollTop(page: Page, expected: number) { const container = page.getByTestId('scroll-container') diff --git a/app/test/unit/setup.ts b/app/test/unit/setup.ts index a6c4db1f44..eb58d4d43b 100644 --- a/app/test/unit/setup.ts +++ b/app/test/unit/setup.ts @@ -11,6 +11,7 @@ * in this file does _not_ impact end-to-end tests. */ import '@testing-library/jest-dom/vitest' + import { cleanup } from '@testing-library/react' import { afterAll, afterEach, beforeAll } from 'vitest' diff --git a/libs/api-mocks/msw/db.ts b/libs/api-mocks/msw/db.ts index 259a313fa0..818e2b839f 100644 --- a/libs/api-mocks/msw/db.ts +++ b/libs/api-mocks/msw/db.ts @@ -9,8 +9,8 @@ // only be checking for v4 import { validate as isUuid } from 'uuid' -import * as mock from '@oxide/api-mocks' import type { ApiTypes as Api, PathParams as PP } from '@oxide/api' +import * as mock from '@oxide/api-mocks' import { user1 } from '@oxide/api-mocks' import type { Json } from '../json-type' diff --git a/libs/api-mocks/msw/handlers.ts b/libs/api-mocks/msw/handlers.ts index 9bf5b3f978..4cc5a61377 100644 --- a/libs/api-mocks/msw/handlers.ts +++ b/libs/api-mocks/msw/handlers.ts @@ -9,12 +9,12 @@ import { v4 as uuid } from 'uuid' import type { ApiTypes as Api, SamlIdentityProvider } from '@oxide/api' import { + diskCan, FLEET_ID, INSTANCE_MAX_CPU, INSTANCE_MAX_RAM_GiB, INSTANCE_MIN_RAM_GiB, MAX_NICS_PER_INSTANCE, - diskCan, } from '@oxide/api' import type { Json } from '@oxide/gen/msw-handlers' import { json, makeHandlers } from '@oxide/gen/msw-handlers' @@ -25,13 +25,13 @@ import { serial } from '../serial' import { defaultSilo, toIdp } from '../silo' import { db, lookup, lookupById, notFoundErr } from './db' import { - NotImplemented, currentUser, errIfExists, errIfInvalidDiskSize, getStartAndEndTime, getTimestamps, handleMetrics, + NotImplemented, paginated, requireFleetViewer, requireRole, diff --git a/libs/api-mocks/msw/util.ts b/libs/api-mocks/msw/util.ts index 510096a011..c13a6518dd 100644 --- a/libs/api-mocks/msw/util.ts +++ b/libs/api-mocks/msw/util.ts @@ -19,7 +19,7 @@ import type { import { FLEET_ID, MAX_DISK_SIZE_GiB, MIN_DISK_SIZE_GiB, totalCapacity } from '@oxide/api' import type { Json } from '@oxide/gen/msw-handlers' import { json } from '@oxide/gen/msw-handlers' -import { GiB, TiB, isTruthy } from '@oxide/util' +import { GiB, isTruthy, TiB } from '@oxide/util' import type { DbRoleAssignmentResourceType } from '..' import { genI64Data } from '../metrics' diff --git a/libs/api/__generated__/msw-handlers.ts b/libs/api/__generated__/msw-handlers.ts index 6d8d401090..9e2260ef26 100644 --- a/libs/api/__generated__/msw-handlers.ts +++ b/libs/api/__generated__/msw-handlers.ts @@ -8,21 +8,21 @@ * Copyright Oxide Computer Company */ import { + compose, + context, ResponseComposition, ResponseTransformer, + rest, RestContext, RestHandler, RestRequest, - compose, - context, - rest, } from 'msw' import type { SnakeCasedPropertiesDeep as Snakify } from 'type-fest' -import { ZodSchema, z } from 'zod' +import { z, ZodSchema } from 'zod' import type * as Api from './Api' -import * as schema from './validate' import { snakeify } from './util' +import * as schema from './validate' type HandlerResult = Json | ResponseTransformer> type StatusCode = number diff --git a/libs/api/__generated__/validate.ts b/libs/api/__generated__/validate.ts index 313d79fd2b..6bb4188d8a 100644 --- a/libs/api/__generated__/validate.ts +++ b/libs/api/__generated__/validate.ts @@ -7,7 +7,7 @@ * * Copyright Oxide Computer Company */ -import { ZodType, z } from 'zod' +import { z, ZodType } from 'zod' import { processResponseBody, uniqueItems } from './util' diff --git a/libs/api/hooks.ts b/libs/api/hooks.ts index 929d28f9e2..cb9092492f 100644 --- a/libs/api/hooks.ts +++ b/libs/api/hooks.ts @@ -19,7 +19,7 @@ import { useMutation, useQueries, useQuery, useQueryClient } from '@tanstack/rea import { invariant } from '@oxide/util' import type { ApiResult } from './__generated__/Api' -import { type ApiError, processServerError } from './errors' +import { processServerError, type ApiError } from './errors' import { navToLogin } from './nav-to-login' /* eslint-disable @typescript-eslint/no-explicit-any */ diff --git a/libs/api/roles.spec.ts b/libs/api/roles.spec.ts index 715328e2ab..984d76d240 100644 --- a/libs/api/roles.spec.ts +++ b/libs/api/roles.spec.ts @@ -8,13 +8,13 @@ import { describe, expect, it, test } from 'vitest' import { - type Policy, byGroupThenName, deleteRole, getEffectiveRole, roleOrder, updateRole, userRoleFromPolicies, + type Policy, } from './roles' describe('getEffectiveRole', () => { diff --git a/libs/table/QueryTable.tsx b/libs/table/QueryTable.tsx index 8d6afd7a60..2655c677da 100644 --- a/libs/table/QueryTable.tsx +++ b/libs/table/QueryTable.tsx @@ -11,9 +11,7 @@ import type { UseQueryOptions } from '@tanstack/react-query' import { hashKey } from '@tanstack/react-query' import type { AccessorFn, DeepKeys } from '@tanstack/react-table' import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' -import React, { useEffect } from 'react' -import { useCallback } from 'react' -import { useMemo } from 'react' +import React, { useCallback, useEffect, useMemo } from 'react' import type { ComponentType, ReactElement } from 'react' import { useApiQuery } from '@oxide/api' @@ -22,10 +20,10 @@ import { Pagination, usePagination } from '@oxide/pagination' import { EmptyMessage, TableEmptyBox } from '@oxide/ui' import { invariant, isOneOf } from '@oxide/util' -import { Table } from './Table' import { DefaultCell } from './cells' import { getActionsCol, getMultiSelectCol, getSelectCol } from './columns' import type { MakeActions } from './columns' +import { Table } from './Table' interface UseQueryTableResult> { Table: ComponentType> diff --git a/libs/ui/index.ts b/libs/ui/index.ts index cddccb4e47..19e4235329 100644 --- a/libs/ui/index.ts +++ b/libs/ui/index.ts @@ -7,6 +7,7 @@ */ import useInterval from './lib/hooks/use-interval' import useTimeout from './lib/hooks/use-timeout' + import './styles/index.css' export { useInterval, useTimeout } diff --git a/libs/ui/lib/date-picker/DatePicker.tsx b/libs/ui/lib/date-picker/DatePicker.tsx index 7fc7f8a106..18da826731 100644 --- a/libs/ui/lib/date-picker/DatePicker.tsx +++ b/libs/ui/lib/date-picker/DatePicker.tsx @@ -10,8 +10,7 @@ import type { DateValue } from '@internationalized/date' import type { TimeValue } from '@react-types/datepicker' import cn from 'classnames' import { useMemo, useRef } from 'react' -import { useButton, useDatePicker } from 'react-aria' -import { useDateFormatter } from 'react-aria' +import { useButton, useDateFormatter, useDatePicker } from 'react-aria' import { useDatePickerState } from 'react-stately' import type { DatePickerStateOptions } from 'react-stately' diff --git a/libs/ui/lib/date-picker/DateRangePicker.tsx b/libs/ui/lib/date-picker/DateRangePicker.tsx index e32955f9b2..2c470f5b34 100644 --- a/libs/ui/lib/date-picker/DateRangePicker.tsx +++ b/libs/ui/lib/date-picker/DateRangePicker.tsx @@ -9,8 +9,7 @@ import { getLocalTimeZone } from '@internationalized/date' import type { TimeValue } from '@react-types/datepicker' import cn from 'classnames' import { useMemo, useRef } from 'react' -import { useButton, useDateRangePicker } from 'react-aria' -import { useDateFormatter } from 'react-aria' +import { useButton, useDateFormatter, useDateRangePicker } from 'react-aria' import { useDateRangePickerState } from 'react-stately' import type { DateRangePickerStateOptions } from 'react-stately' diff --git a/libs/ui/lib/dropdown-menu/DropdownMenu.tsx b/libs/ui/lib/dropdown-menu/DropdownMenu.tsx index 04aa49f98e..15ad434b58 100644 --- a/libs/ui/lib/dropdown-menu/DropdownMenu.tsx +++ b/libs/ui/lib/dropdown-menu/DropdownMenu.tsx @@ -11,7 +11,7 @@ import type { } from '@radix-ui/react-dropdown-menu' import { Content, Item, Portal, Root, Trigger } from '@radix-ui/react-dropdown-menu' import cn from 'classnames' -import { type ForwardedRef, forwardRef } from 'react' +import { forwardRef, type ForwardedRef } from 'react' type DivRef = ForwardedRef diff --git a/libs/ui/lib/listbox/Listbox.tsx b/libs/ui/lib/listbox/Listbox.tsx index 1cd309d3ec..284f14e021 100644 --- a/libs/ui/lib/listbox/Listbox.tsx +++ b/libs/ui/lib/listbox/Listbox.tsx @@ -6,9 +6,9 @@ * Copyright Oxide Computer Company */ import { - FloatingPortal, autoUpdate, flip, + FloatingPortal, offset, size, useFloating, diff --git a/libs/ui/lib/mini-table/MiniTable.tsx b/libs/ui/lib/mini-table/MiniTable.tsx index 8286eb7e51..0cbdc79bbe 100644 --- a/libs/ui/lib/mini-table/MiniTable.tsx +++ b/libs/ui/lib/mini-table/MiniTable.tsx @@ -8,6 +8,7 @@ import { classed } from '@oxide/util' import { Table as BigTable } from '../table/Table' + import './mini-table.css' type Children = { children: React.ReactNode } diff --git a/libs/ui/lib/modal/Modal.stories.tsx b/libs/ui/lib/modal/Modal.stories.tsx index 283f6bafd7..72562e1006 100644 --- a/libs/ui/lib/modal/Modal.stories.tsx +++ b/libs/ui/lib/modal/Modal.stories.tsx @@ -7,9 +7,9 @@ */ import { useState } from 'react' -import { ModalLink, ModalLinks } from '../ModalLinks' import { Button } from '../button/Button' import { FieldLabel } from '../field-label/FieldLabel' +import { ModalLink, ModalLinks } from '../ModalLinks' import { TextInput, TextInputHint } from '../text-input/TextInput' import { Modal } from './Modal' diff --git a/libs/ui/lib/number-input/NumberInput.tsx b/libs/ui/lib/number-input/NumberInput.tsx index 6366ee0aeb..a1c0bc356a 100644 --- a/libs/ui/lib/number-input/NumberInput.tsx +++ b/libs/ui/lib/number-input/NumberInput.tsx @@ -8,11 +8,11 @@ import cn from 'classnames' import React, { useRef } from 'react' import { - type AriaButtonProps, - type AriaNumberFieldProps, useButton, useLocale, useNumberField, + type AriaButtonProps, + type AriaNumberFieldProps, } from 'react-aria' import { mergeRefs } from 'react-merge-refs' import { useNumberFieldState } from 'react-stately' diff --git a/libs/ui/lib/properties-table/PropertiesTable.tsx b/libs/ui/lib/properties-table/PropertiesTable.tsx index eac65588ae..26233b4b53 100644 --- a/libs/ui/lib/properties-table/PropertiesTable.tsx +++ b/libs/ui/lib/properties-table/PropertiesTable.tsx @@ -11,6 +11,7 @@ import type { ReactNode } from 'react' import { invariant, isOneOf } from '@oxide/util' import { Badge } from '../badge/Badge' + import './properties-table.css' export interface PropertiesTableProps { diff --git a/libs/ui/lib/settings-group/SettingsGroup.tsx b/libs/ui/lib/settings-group/SettingsGroup.tsx index d318ed6a69..e4cbaa0ca3 100644 --- a/libs/ui/lib/settings-group/SettingsGroup.tsx +++ b/libs/ui/lib/settings-group/SettingsGroup.tsx @@ -7,7 +7,7 @@ */ import { Link } from 'react-router-dom' -import { Button, OpenLink12Icon, buttonStyle } from '@oxide/ui' +import { Button, buttonStyle, OpenLink12Icon } from '@oxide/ui' type Props = { title: string diff --git a/libs/ui/lib/side-modal/SideModal.stories.tsx b/libs/ui/lib/side-modal/SideModal.stories.tsx index 1b06bb4416..b52b7f5a39 100644 --- a/libs/ui/lib/side-modal/SideModal.stories.tsx +++ b/libs/ui/lib/side-modal/SideModal.stories.tsx @@ -7,8 +7,8 @@ */ import { useState } from 'react' -import { ModalLink, ModalLinks } from '../ModalLinks' import { Button } from '../button/Button' +import { ModalLink, ModalLinks } from '../ModalLinks' import { SideModal } from './SideModal' // TODO: styling on modal mostly doesn't work diff --git a/libs/ui/lib/side-modal/SideModal.tsx b/libs/ui/lib/side-modal/SideModal.tsx index 640f3c68fc..4e43162de8 100644 --- a/libs/ui/lib/side-modal/SideModal.tsx +++ b/libs/ui/lib/side-modal/SideModal.tsx @@ -8,7 +8,7 @@ import * as Dialog from '@radix-ui/react-dialog' import { animated, useTransition } from '@react-spring/web' import cn from 'classnames' -import React, { type ReactNode, createContext, useContext, useRef } from 'react' +import React, { createContext, useContext, useRef, type ReactNode } from 'react' import { Close12Icon, Error12Icon } from '@oxide/design-system/icons/react' import { Message } from '@oxide/ui' diff --git a/libs/ui/lib/table/Table.tsx b/libs/ui/lib/table/Table.tsx index 2c6f874a79..8fa2767f02 100644 --- a/libs/ui/lib/table/Table.tsx +++ b/libs/ui/lib/table/Table.tsx @@ -9,6 +9,7 @@ import cn from 'classnames' import type { ReactElement } from 'react' import React, { useRef } from 'react' import SimpleBar from 'simplebar-react' + import 'simplebar-react/dist/simplebar.min.css' import { classed } from '@oxide/util' diff --git a/libs/ui/lib/timeout-indicator/TimeoutIndicator.tsx b/libs/ui/lib/timeout-indicator/TimeoutIndicator.tsx index c56ad106f0..38ffc6278b 100644 --- a/libs/ui/lib/timeout-indicator/TimeoutIndicator.tsx +++ b/libs/ui/lib/timeout-indicator/TimeoutIndicator.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import { animated, useTransition } from '@react-spring/web' -import { Globals } from '@react-spring/web' +import { animated, Globals, useTransition } from '@react-spring/web' import cn from 'classnames' import useTimeout from '../hooks/use-timeout' diff --git a/libs/ui/lib/tooltip/Tooltip.tsx b/libs/ui/lib/tooltip/Tooltip.tsx index b6bae9423e..8541d13d75 100644 --- a/libs/ui/lib/tooltip/Tooltip.tsx +++ b/libs/ui/lib/tooltip/Tooltip.tsx @@ -6,12 +6,12 @@ * Copyright Oxide Computer Company */ import { - FloatingArrow, - FloatingPortal, arrow, autoPlacement, autoUpdate, flip, + FloatingArrow, + FloatingPortal, offset, useDismiss, useFloating, diff --git a/package-lock.json b/package-lock.json index c539684e06..4513ade5a1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -53,13 +53,13 @@ "zustand": "^4.4.3" }, "devDependencies": { + "@ianvs/prettier-plugin-sort-imports": "^4.1.1", "@ladle/react": "^3.2.1", "@mswjs/http-middleware": "^0.8.0", "@playwright/test": "^1.39.0", "@testing-library/dom": "^9.3.3", "@testing-library/jest-dom": "^6.1.4", "@testing-library/react": "^14.0.0", - "@trivago/prettier-plugin-sort-imports": "4.2.1", "@types/lodash.throttle": "^4.1.7", "@types/mousetrap": "^1.6.12", "@types/node": "^18.18.5", @@ -1205,6 +1205,29 @@ "integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==", "dev": true }, + "node_modules/@ianvs/prettier-plugin-sort-imports": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/@ianvs/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.1.1.tgz", + "integrity": "sha512-kJhXq63ngpTQ2dxgf5GasbPJWsJA3LgoOdd7WGhpUSzLgLgI4IsIzYkbJf9kmpOHe7Vdm/o3PcRA3jmizXUuAQ==", + "dev": true, + "dependencies": { + "@babel/core": "^7.21.8", + "@babel/generator": "^7.21.5", + "@babel/parser": "^7.21.8", + "@babel/traverse": "^7.21.5", + "@babel/types": "^7.21.5", + "semver": "^7.5.2" + }, + "peerDependencies": { + "@vue/compiler-sfc": ">=3.0.0", + "prettier": "2 || 3" + }, + "peerDependenciesMeta": { + "@vue/compiler-sfc": { + "optional": true + } + } + }, "node_modules/@internationalized/date": { "version": "3.5.0", "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.5.0.tgz", @@ -5459,6 +5482,8 @@ "resolved": "https://registry.npmjs.org/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.2.1.tgz", "integrity": "sha512-iuy2MPVURGdxILTchHr15VAioItuYBejKfcTmQFlxIuqA7jeaT6ngr5aUIG6S6U096d6a6lJCgaOwlRrPLlOPg==", "dev": true, + "optional": true, + "peer": true, "dependencies": { "@babel/generator": "7.17.7", "@babel/parser": "^7.20.5", @@ -5482,6 +5507,8 @@ "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.17.7.tgz", "integrity": "sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==", "dev": true, + "optional": true, + "peer": true, "dependencies": { "@babel/types": "^7.17.0", "jsesc": "^2.5.1", @@ -5496,6 +5523,8 @@ "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.17.0.tgz", "integrity": "sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==", "dev": true, + "optional": true, + "peer": true, "dependencies": { "@babel/helper-validator-identifier": "^7.16.7", "to-fast-properties": "^2.0.0" @@ -5509,6 +5538,8 @@ "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", "dev": true, + "optional": true, + "peer": true, "engines": { "node": ">=0.10.0" } @@ -12440,7 +12471,9 @@ "version": "0.7.1", "resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz", "integrity": "sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==", - "dev": true + "dev": true, + "optional": true, + "peer": true }, "node_modules/jest-diff": { "version": "29.2.1", @@ -21022,6 +21055,20 @@ "integrity": "sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==", "dev": true }, + "@ianvs/prettier-plugin-sort-imports": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/@ianvs/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.1.1.tgz", + "integrity": "sha512-kJhXq63ngpTQ2dxgf5GasbPJWsJA3LgoOdd7WGhpUSzLgLgI4IsIzYkbJf9kmpOHe7Vdm/o3PcRA3jmizXUuAQ==", + "dev": true, + "requires": { + "@babel/core": "^7.21.8", + "@babel/generator": "^7.21.5", + "@babel/parser": "^7.21.8", + "@babel/traverse": "^7.21.5", + "@babel/types": "^7.21.5", + "semver": "^7.5.2" + } + }, "@internationalized/date": { "version": "3.5.0", "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.5.0.tgz", @@ -24321,6 +24368,8 @@ "resolved": "https://registry.npmjs.org/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.2.1.tgz", "integrity": "sha512-iuy2MPVURGdxILTchHr15VAioItuYBejKfcTmQFlxIuqA7jeaT6ngr5aUIG6S6U096d6a6lJCgaOwlRrPLlOPg==", "dev": true, + "optional": true, + "peer": true, "requires": { "@babel/generator": "7.17.7", "@babel/parser": "^7.20.5", @@ -24335,6 +24384,8 @@ "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.17.7.tgz", "integrity": "sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==", "dev": true, + "optional": true, + "peer": true, "requires": { "@babel/types": "^7.17.0", "jsesc": "^2.5.1", @@ -24346,6 +24397,8 @@ "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.17.0.tgz", "integrity": "sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==", "dev": true, + "optional": true, + "peer": true, "requires": { "@babel/helper-validator-identifier": "^7.16.7", "to-fast-properties": "^2.0.0" @@ -24355,7 +24408,9 @@ "version": "0.5.7", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", - "dev": true + "dev": true, + "optional": true, + "peer": true } } }, @@ -29409,7 +29464,9 @@ "version": "0.7.1", "resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz", "integrity": "sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==", - "dev": true + "dev": true, + "optional": true, + "peer": true }, "jest-diff": { "version": "29.2.1", diff --git a/package.json b/package.json index e9ef563b19..deba5abd10 100644 --- a/package.json +++ b/package.json @@ -73,13 +73,13 @@ "zustand": "^4.4.3" }, "devDependencies": { + "@ianvs/prettier-plugin-sort-imports": "^4.1.1", "@ladle/react": "^3.2.1", "@mswjs/http-middleware": "^0.8.0", "@playwright/test": "^1.39.0", "@testing-library/dom": "^9.3.3", "@testing-library/jest-dom": "^6.1.4", "@testing-library/react": "^14.0.0", - "@trivago/prettier-plugin-sort-imports": "4.2.1", "@types/lodash.throttle": "^4.1.7", "@types/mousetrap": "^1.6.12", "@types/node": "^18.18.5", diff --git a/vite.config.ts b/vite.config.ts index 38be72b7ce..08add8a7c3 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -5,9 +5,9 @@ * * Copyright Oxide Computer Company */ +import { resolve } from 'path' import basicSsl from '@vitejs/plugin-basic-ssl' import react from '@vitejs/plugin-react-swc' -import { resolve } from 'path' import { defineConfig } from 'vite' import { createHtmlPlugin } from 'vite-plugin-html' import { z } from 'zod' From 214320e4d108cd9bbacbffd0f7a14e25746b049d Mon Sep 17 00:00:00 2001 From: David Crespo Date: Tue, 31 Oct 2023 14:13:47 -0500 Subject: [PATCH 2/2] combine all type and non-type imports into one statement! --- .prettierrc.js | 1 + app/components/CapacityMetric.tsx | 3 +- app/components/StatusBadge.tsx | 3 +- app/components/SystemMetric.tsx | 8 +++-- app/components/Terminal.tsx | 3 +- app/components/TopBarPicker.tsx | 3 +- app/components/form/FullPageForm.tsx | 9 ++--- app/components/form/SideModalForm.tsx | 3 +- app/components/form/fields/CheckboxField.tsx | 6 ++-- .../form/fields/DateTimeRangePicker.spec.tsx | 3 +- .../form/fields/DateTimeRangePicker.tsx | 3 +- .../form/fields/DescriptionField.tsx | 3 +- .../form/fields/DisksTableField.tsx | 3 +- app/components/form/fields/FileField.tsx | 3 +- .../form/fields/ImageSelectField.tsx | 3 +- app/components/form/fields/ListboxField.tsx | 6 ++-- app/components/form/fields/NameField.tsx | 3 +- .../form/fields/NetworkInterfaceField.tsx | 3 +- app/components/form/fields/NumberField.tsx | 3 +- app/components/form/fields/RadioField.tsx | 18 +++++++--- app/components/form/fields/SubnetListbox.tsx | 6 ++-- app/components/form/fields/TextField.tsx | 24 +++++++------ app/components/form/fields/TlsCertsField.tsx | 3 +- app/forms/access-util.tsx | 12 ++++--- app/forms/disk-attach.tsx | 3 +- app/forms/disk-create.tsx | 17 +++++---- app/forms/firewall-rules-create.tsx | 15 ++++---- app/forms/firewall-rules-edit.tsx | 15 +++++--- app/forms/idp/create.tsx | 3 +- app/forms/idp/edit.tsx | 3 +- app/forms/image-edit.tsx | 3 +- app/forms/image-from-snapshot.tsx | 3 +- app/forms/image-upload.tsx | 10 ++++-- app/forms/instance-create.tsx | 7 ++-- app/forms/network-interface-create.tsx | 3 +- app/forms/network-interface-edit.tsx | 7 ++-- app/forms/project-access.tsx | 9 +++-- app/forms/project-create.tsx | 3 +- app/forms/project-edit.tsx | 3 +- app/forms/silo-access.tsx | 9 +++-- app/forms/silo-create.tsx | 3 +- app/forms/snapshot-create.tsx | 10 ++++-- app/forms/ssh-key-create.tsx | 3 +- app/forms/subnet-create.tsx | 3 +- app/forms/subnet-edit.tsx | 3 +- app/forms/vpc-create.tsx | 3 +- app/forms/vpc-edit.tsx | 3 +- app/forms/vpc-router-create.tsx | 3 +- app/forms/vpc-router-edit.tsx | 3 +- app/hooks/use-is-overflow.ts | 3 +- app/hooks/use-params.ts | 3 +- app/layouts/ProjectLayout.tsx | 11 +++--- app/pages/LoginPage.tsx | 3 +- app/pages/ProjectsPage.tsx | 5 ++- app/pages/SiloAccessPage.tsx | 3 +- .../project/access/ProjectAccessPage.tsx | 3 +- app/pages/project/disks/DisksPage.tsx | 5 ++- app/pages/project/images/ImagesPage.tsx | 3 +- app/pages/project/instances/InstancesPage.tsx | 3 +- .../instances/instance/InstancePage.tsx | 3 +- .../instances/instance/SerialConsolePage.tsx | 3 +- .../instances/instance/tabs/MetricsTab.tsx | 9 +++-- .../instances/instance/tabs/NetworkingTab.tsx | 8 ++--- .../instances/instance/tabs/StorageTab.tsx | 3 +- .../VpcPage/tabs/VpcFirewallRulesTab.tsx | 8 +++-- .../networking/VpcPage/tabs/VpcRoutersTab.tsx | 3 +- .../networking/VpcPage/tabs/VpcSubnetsTab.tsx | 6 ++-- app/pages/project/networking/VpcsPage.tsx | 5 ++- app/pages/project/snapshots/SnapshotsPage.tsx | 8 ++--- app/pages/settings/SSHKeysPage.tsx | 6 ++-- app/pages/system/SiloPage.tsx | 3 +- app/pages/system/SilosPage.tsx | 11 ++++-- app/pages/system/UtilizationPage.tsx | 2 +- .../inventory/sled/SledInstancesTab.tsx | 8 +++-- app/pages/system/metrics-util.spec.ts | 3 +- app/test/e2e/image-upload.e2e.ts | 3 +- app/test/e2e/utils.ts | 3 +- libs/api-mocks/msw/handlers.ts | 6 ++-- libs/api-mocks/msw/util.ts | 22 ++++++------ libs/api/__generated__/Api.ts | 3 +- libs/api/hooks.ts | 21 ++++++----- libs/pagination/Pagination.tsx | 6 ++-- libs/table/QueryTable.tsx | 36 +++++++++++++------ libs/table/Table.tsx | 3 +- libs/table/cells/FirewallFilterCell.tsx | 3 +- libs/table/cells/TypeValueListCell.tsx | 3 +- libs/table/react-table.ts | 4 ++- libs/ui/lib/avatar-stack/AvatarStack.tsx | 3 +- libs/ui/lib/badge/Badge.stories.tsx | 3 +- .../lib/bulk-action-menu/BulkActionMenu.tsx | 3 +- libs/ui/lib/button/Button.tsx | 3 +- libs/ui/lib/date-picker/Calendar.tsx | 6 ++-- libs/ui/lib/date-picker/CalendarCell.tsx | 9 +++-- libs/ui/lib/date-picker/CalendarGrid.tsx | 3 +- libs/ui/lib/date-picker/DateField.tsx | 21 +++++++---- libs/ui/lib/date-picker/DatePicker.tsx | 6 ++-- libs/ui/lib/date-picker/DateRangePicker.tsx | 3 +- libs/ui/lib/date-picker/Dialog.tsx | 6 ++-- libs/ui/lib/date-picker/Popover.tsx | 11 +++--- libs/ui/lib/date-picker/RangeCalendar.tsx | 21 ++++++----- libs/ui/lib/dropdown-menu/DropdownMenu.tsx | 12 ++++--- libs/ui/lib/file-input/FileInput.tsx | 10 ++++-- libs/ui/lib/hooks/use-stepped-scroll.ts | 3 +- libs/ui/lib/progress/Progress.tsx | 3 +- libs/ui/lib/spinner/Spinner.tsx | 3 +- libs/ui/lib/table/Table.tsx | 3 +- libs/ui/lib/tabs/Tabs.tsx | 15 ++++---- libs/ui/lib/tag/Tag.stories.tsx | 3 +- libs/ui/lib/toast/Toast.tsx | 3 +- libs/ui/lib/tooltip/Tooltip.tsx | 12 +++++-- libs/ui/util/wrap.tsx | 3 +- libs/util/children.tsx | 3 +- playwright.config.ts | 3 +- 113 files changed, 378 insertions(+), 322 deletions(-) diff --git a/.prettierrc.js b/.prettierrc.js index 1869b3c0d9..084e2c2257 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -22,4 +22,5 @@ module.exports = { '', '^[./]', ], + importOrderTypeScriptVersion: '5.2.2', } diff --git a/app/components/CapacityMetric.tsx b/app/components/CapacityMetric.tsx index 3e0a78c5a8..f26f055c83 100644 --- a/app/components/CapacityMetric.tsx +++ b/app/components/CapacityMetric.tsx @@ -7,8 +7,7 @@ */ import { useMemo } from 'react' -import type { SystemMetricName } from '@oxide/api' -import { useApiQuery } from '@oxide/api' +import { useApiQuery, type SystemMetricName } from '@oxide/api' import { splitDecimal } from '@oxide/util' import RoundedSector from 'app/components/RoundedSector' diff --git a/app/components/StatusBadge.tsx b/app/components/StatusBadge.tsx index 5c12f3c309..c5c6d8c3f9 100644 --- a/app/components/StatusBadge.tsx +++ b/app/components/StatusBadge.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import type { DiskState, InstanceState, SnapshotState } from '@oxide/api' -import type { BadgeColor, BadgeProps } from '@oxide/ui' -import { Badge } from '@oxide/ui' +import { Badge, type BadgeColor, type BadgeProps } from '@oxide/ui' const INSTANCE_COLORS: Record> = { creating: { color: 'purple', variant: 'solid' }, diff --git a/app/components/SystemMetric.tsx b/app/components/SystemMetric.tsx index 1c4ab7ac66..9384a01c99 100644 --- a/app/components/SystemMetric.tsx +++ b/app/components/SystemMetric.tsx @@ -7,8 +7,12 @@ */ import React, { Suspense, useMemo, useRef } from 'react' -import type { ChartDatum, SystemMetricName } from '@oxide/api' -import { synthesizeData, useApiQuery } from '@oxide/api' +import { + synthesizeData, + useApiQuery, + type ChartDatum, + type SystemMetricName, +} from '@oxide/api' import { Badge, DirectionDownIcon, DirectionUpIcon, Spinner } from '@oxide/ui' import { splitDecimal } from '@oxide/util' diff --git a/app/components/Terminal.tsx b/app/components/Terminal.tsx index 52eb8b98a3..6faab744cb 100644 --- a/app/components/Terminal.tsx +++ b/app/components/Terminal.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useEffect, useRef, useState } from 'react' -import type { ITerminalOptions } from 'xterm' -import { Terminal as XTerm } from 'xterm' +import { Terminal as XTerm, type ITerminalOptions } from 'xterm' import { FitAddon } from 'xterm-addon-fit' import { DirectionDownIcon, DirectionUpIcon } from '@oxide/ui' diff --git a/app/components/TopBarPicker.tsx b/app/components/TopBarPicker.tsx index 9a3189eb58..41dc345ca6 100644 --- a/app/components/TopBarPicker.tsx +++ b/app/components/TopBarPicker.tsx @@ -8,8 +8,7 @@ import cn from 'classnames' import { Link } from 'react-router-dom' -import type { Project } from '@oxide/api' -import { useApiQuery } from '@oxide/api' +import { useApiQuery, type Project } from '@oxide/api' import { Button, DropdownMenu, diff --git a/app/components/form/FullPageForm.tsx b/app/components/form/FullPageForm.tsx index 6fbe7298d6..7c2ad0a69c 100644 --- a/app/components/form/FullPageForm.tsx +++ b/app/components/form/FullPageForm.tsx @@ -5,11 +5,12 @@ * * Copyright Oxide Computer Company */ -import type { ReactElement, ReactNode } from 'react' -import { cloneElement, useEffect } from 'react' +import { cloneElement, useEffect, type ReactElement, type ReactNode } from 'react' import type { FieldValues, UseFormReturn } from 'react-hook-form' -import type { unstable_Blocker as Blocker } from 'react-router-dom' -import { unstable_useBlocker as useBlocker } from 'react-router-dom' +import { + unstable_useBlocker as useBlocker, + type unstable_Blocker as Blocker, +} from 'react-router-dom' import type { ApiError } from '@oxide/api' import { Modal, PageHeader, PageTitle } from '@oxide/ui' diff --git a/app/components/form/SideModalForm.tsx b/app/components/form/SideModalForm.tsx index 770f7fdc12..d7d8ddecc6 100644 --- a/app/components/form/SideModalForm.tsx +++ b/app/components/form/SideModalForm.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { ReactNode } from 'react' -import { useEffect } from 'react' +import { useEffect, type ReactNode } from 'react' import type { FieldValues, UseFormReturn } from 'react-hook-form' import { useNavigationType } from 'react-router-dom' diff --git a/app/components/form/fields/CheckboxField.tsx b/app/components/form/fields/CheckboxField.tsx index 41f05a4c6c..9705595e2e 100644 --- a/app/components/form/fields/CheckboxField.tsx +++ b/app/components/form/fields/CheckboxField.tsx @@ -5,11 +5,9 @@ * * Copyright Oxide Computer Company */ -import type { Control, FieldPath, FieldValues } from 'react-hook-form' -import { Controller } from 'react-hook-form' +import { Controller, type Control, type FieldPath, type FieldValues } from 'react-hook-form' -import type { CheckboxProps } from '@oxide/ui' -import { Checkbox } from '@oxide/ui' +import { Checkbox, type CheckboxProps } from '@oxide/ui' type CheckboxFieldProps< TFieldValues extends FieldValues, diff --git a/app/components/form/fields/DateTimeRangePicker.spec.tsx b/app/components/form/fields/DateTimeRangePicker.spec.tsx index 660530256a..155a41827c 100644 --- a/app/components/form/fields/DateTimeRangePicker.spec.tsx +++ b/app/components/form/fields/DateTimeRangePicker.spec.tsx @@ -12,8 +12,7 @@ import { beforeAll, describe, expect, it, vi } from 'vitest' import { clickByRole } from 'app/test/unit' -import type { RangeKey } from './DateTimeRangePicker' -import { DateTimeRangePicker } from './DateTimeRangePicker' +import { DateTimeRangePicker, type RangeKey } from './DateTimeRangePicker' const now = getNow(getLocalTimeZone()) diff --git a/app/components/form/fields/DateTimeRangePicker.tsx b/app/components/form/fields/DateTimeRangePicker.tsx index 30154e4a63..38a31a1bda 100644 --- a/app/components/form/fields/DateTimeRangePicker.tsx +++ b/app/components/form/fields/DateTimeRangePicker.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { DateValue } from '@internationalized/date' -import { getLocalTimeZone, now as getNow } from '@internationalized/date' +import { getLocalTimeZone, now as getNow, type DateValue } from '@internationalized/date' import { useMemo, useState } from 'react' import { DateRangePicker, Listbox } from '@oxide/ui' diff --git a/app/components/form/fields/DescriptionField.tsx b/app/components/form/fields/DescriptionField.tsx index 4c9ab590bc..51b2b4ed36 100644 --- a/app/components/form/fields/DescriptionField.tsx +++ b/app/components/form/fields/DescriptionField.tsx @@ -7,8 +7,7 @@ */ import type { FieldPath, FieldValues } from 'react-hook-form' -import type { TextFieldProps } from './TextField' -import { TextField } from './TextField' +import { TextField, type TextFieldProps } from './TextField' // TODO: Pull this from generated types const MAX_LEN = 512 diff --git a/app/components/form/fields/DisksTableField.tsx b/app/components/form/fields/DisksTableField.tsx index c5acc865c6..ae3f341963 100644 --- a/app/components/form/fields/DisksTableField.tsx +++ b/app/components/form/fields/DisksTableField.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import type { DiskCreate } from '@oxide/api' import { Badge, Button, Error16Icon, FieldLabel, MiniTable } from '@oxide/ui' diff --git a/app/components/form/fields/FileField.tsx b/app/components/form/fields/FileField.tsx index a6976df147..8c746a00b2 100644 --- a/app/components/form/fields/FileField.tsx +++ b/app/components/form/fields/FileField.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Control, FieldPath, FieldValues } from 'react-hook-form' -import { Controller } from 'react-hook-form' +import { Controller, type Control, type FieldPath, type FieldValues } from 'react-hook-form' import { FieldLabel, FileInput, TextInputHint } from '@oxide/ui' diff --git a/app/components/form/fields/ImageSelectField.tsx b/app/components/form/fields/ImageSelectField.tsx index 266515d11d..db2ff1f559 100644 --- a/app/components/form/fields/ImageSelectField.tsx +++ b/app/components/form/fields/ImageSelectField.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import type { Image } from '@oxide/api' import type { ListboxItem } from '@oxide/ui' diff --git a/app/components/form/fields/ListboxField.tsx b/app/components/form/fields/ListboxField.tsx index eb98d7e2d4..177aaa4e69 100644 --- a/app/components/form/fields/ListboxField.tsx +++ b/app/components/form/fields/ListboxField.tsx @@ -6,11 +6,9 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import type { Control, FieldPath, FieldValues } from 'react-hook-form' -import { Controller } from 'react-hook-form' +import { Controller, type Control, type FieldPath, type FieldValues } from 'react-hook-form' -import type { ListboxItem } from '@oxide/ui' -import { Listbox } from '@oxide/ui' +import { Listbox, type ListboxItem } from '@oxide/ui' import { capitalize } from '@oxide/util' import { ErrorMessage } from './ErrorMessage' diff --git a/app/components/form/fields/NameField.tsx b/app/components/form/fields/NameField.tsx index 036ea9a8a0..fa2e71b0a9 100644 --- a/app/components/form/fields/NameField.tsx +++ b/app/components/form/fields/NameField.tsx @@ -9,8 +9,7 @@ import type { FieldPath, FieldValues } from 'react-hook-form' import { capitalize } from '@oxide/util' -import type { TextFieldProps } from './TextField' -import { TextField } from './TextField' +import { TextField, type TextFieldProps } from './TextField' export function NameField< TFieldValues extends FieldValues, diff --git a/app/components/form/fields/NetworkInterfaceField.tsx b/app/components/form/fields/NetworkInterfaceField.tsx index aa8d90ebac..7e33fc3795 100644 --- a/app/components/form/fields/NetworkInterfaceField.tsx +++ b/app/components/form/fields/NetworkInterfaceField.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import type { InstanceNetworkInterfaceAttachment, diff --git a/app/components/form/fields/NumberField.tsx b/app/components/form/fields/NumberField.tsx index c202696aea..238e88b119 100644 --- a/app/components/form/fields/NumberField.tsx +++ b/app/components/form/fields/NumberField.tsx @@ -7,8 +7,7 @@ */ import cn from 'classnames' import { useId } from 'react' -import type { FieldPathByValue, FieldValues } from 'react-hook-form' -import { Controller } from 'react-hook-form' +import { Controller, type FieldPathByValue, type FieldValues } from 'react-hook-form' import { FieldLabel, TextInputHint, NumberInput as UINumberField } from '@oxide/ui' import { capitalize } from '@oxide/util' diff --git a/app/components/form/fields/RadioField.tsx b/app/components/form/fields/RadioField.tsx index 0c5aa19baf..60c76f8e4b 100644 --- a/app/components/form/fields/RadioField.tsx +++ b/app/components/form/fields/RadioField.tsx @@ -7,11 +7,21 @@ */ import cn from 'classnames' import React, { useId } from 'react' -import type { Control, FieldPath, FieldValues, PathValue } from 'react-hook-form' -import { Controller } from 'react-hook-form' +import { + Controller, + type Control, + type FieldPath, + type FieldValues, + type PathValue, +} from 'react-hook-form' -import type { RadioGroupProps } from '@oxide/ui' -import { FieldLabel, Radio, RadioGroup, TextInputHint } from '@oxide/ui' +import { + FieldLabel, + Radio, + RadioGroup, + TextInputHint, + type RadioGroupProps, +} from '@oxide/ui' import { capitalize } from '@oxide/util' export type RadioFieldProps< diff --git a/app/components/form/fields/SubnetListbox.tsx b/app/components/form/fields/SubnetListbox.tsx index 06068eb8b2..057e194f72 100644 --- a/app/components/form/fields/SubnetListbox.tsx +++ b/app/components/form/fields/SubnetListbox.tsx @@ -5,15 +5,13 @@ * * Copyright Oxide Computer Company */ -import type { FieldPath, FieldValues } from 'react-hook-form' -import { useWatch } from 'react-hook-form' +import { useWatch, type FieldPath, type FieldValues } from 'react-hook-form' import { useApiQuery } from '@oxide/api' import { useProjectSelector } from 'app/hooks' -import type { ListboxFieldProps } from './ListboxField' -import { ListboxField } from './ListboxField' +import { ListboxField, type ListboxFieldProps } from './ListboxField' type SubnetListboxProps< TFieldValues extends FieldValues, diff --git a/app/components/form/fields/TextField.tsx b/app/components/form/fields/TextField.tsx index 3e198c5b80..dc53ff6f3c 100644 --- a/app/components/form/fields/TextField.tsx +++ b/app/components/form/fields/TextField.tsx @@ -7,20 +7,22 @@ */ import cn from 'classnames' import { useId } from 'react' -import type { - Control, - FieldPath, - FieldPathValue, - FieldValues, - Validate, +import { + Controller, + type Control, + type FieldPath, + type FieldPathValue, + type FieldValues, + type Validate, } from 'react-hook-form' -import { Controller } from 'react-hook-form' -import type { - TextAreaProps as UITextAreaProps, - TextInputBaseProps as UITextFieldProps, +import { + FieldLabel, + TextInputHint, + TextInput as UITextField, + type TextAreaProps as UITextAreaProps, + type TextInputBaseProps as UITextFieldProps, } from '@oxide/ui' -import { FieldLabel, TextInputHint, TextInput as UITextField } from '@oxide/ui' import { capitalize } from '@oxide/util' import { ErrorMessage } from './ErrorMessage' diff --git a/app/components/form/fields/TlsCertsField.tsx b/app/components/form/fields/TlsCertsField.tsx index c19a0d143b..504e4e7896 100644 --- a/app/components/form/fields/TlsCertsField.tsx +++ b/app/components/form/fields/TlsCertsField.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import type { Merge } from 'type-fest' import type { CertificateCreate } from '@oxide/api' diff --git a/app/forms/access-util.tsx b/app/forms/access-util.tsx index 4c2581d13c..feea69fd90 100644 --- a/app/forms/access-util.tsx +++ b/app/forms/access-util.tsx @@ -5,10 +5,14 @@ * * Copyright Oxide Computer Company */ -import type { Actor, IdentityType, Policy, RoleKey } from '@oxide/api' -import { allRoles } from '@oxide/api' -import type { ListboxItem } from '@oxide/ui' -import { Badge } from '@oxide/ui' +import { + allRoles, + type Actor, + type IdentityType, + type Policy, + type RoleKey, +} from '@oxide/api' +import { Badge, type ListboxItem } from '@oxide/ui' import { capitalize } from '@oxide/util' type AddUserValues = { diff --git a/app/forms/disk-attach.tsx b/app/forms/disk-attach.tsx index 7e0bc224fd..74ac546c1a 100644 --- a/app/forms/disk-attach.tsx +++ b/app/forms/disk-attach.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { ApiError } from '@oxide/api' -import { useApiQuery } from '@oxide/api' +import { useApiQuery, type ApiError } from '@oxide/api' import { ListboxField, SideModalForm } from 'app/components/form' import { useForm, useProjectSelector } from 'app/hooks' diff --git a/app/forms/disk-create.tsx b/app/forms/disk-create.tsx index acf1669982..2f231d835c 100644 --- a/app/forms/disk-create.tsx +++ b/app/forms/disk-create.tsx @@ -6,13 +6,18 @@ * Copyright Oxide Computer Company */ import { format } from 'date-fns' -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' -import type { NavigateFunction } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useController, type Control } from 'react-hook-form' +import { useNavigate, type NavigateFunction } from 'react-router-dom' -import type { BlockSize, Disk, DiskCreate, DiskSource } from '@oxide/api' -import { useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' +import { + useApiMutation, + useApiQuery, + useApiQueryClient, + type BlockSize, + type Disk, + type DiskCreate, + type DiskSource, +} from '@oxide/api' import { FieldLabel, FormDivider, Radio, RadioGroup } from '@oxide/ui' import { GiB } from '@oxide/util' diff --git a/app/forms/firewall-rules-create.tsx b/app/forms/firewall-rules-create.tsx index a0002ad798..59a0b4631f 100644 --- a/app/forms/firewall-rules-create.tsx +++ b/app/forms/firewall-rules-create.tsx @@ -5,21 +5,18 @@ * * Copyright Oxide Computer Company */ -import type { Control } from 'react-hook-form' -import { useController } from 'react-hook-form' +import { useController, type Control } from 'react-hook-form' import { firewallRuleGetToPut, parsePortRange, useApiMutation, useApiQueryClient, -} from '@oxide/api' -import type { - ApiError, - VpcFirewallRule, - VpcFirewallRuleHostFilter, - VpcFirewallRuleTarget, - VpcFirewallRuleUpdate, + type ApiError, + type VpcFirewallRule, + type VpcFirewallRuleHostFilter, + type VpcFirewallRuleTarget, + type VpcFirewallRuleUpdate, } from '@oxide/api' import { Button, Close12Icon, FormDivider, Table } from '@oxide/ui' diff --git a/app/forms/firewall-rules-edit.tsx b/app/forms/firewall-rules-edit.tsx index 7cce82b2e2..a523397433 100644 --- a/app/forms/firewall-rules-edit.tsx +++ b/app/forms/firewall-rules-edit.tsx @@ -5,14 +5,21 @@ * * Copyright Oxide Computer Company */ -import type { VpcFirewallRule } from '@oxide/api' -import { firewallRuleGetToPut, useApiMutation, useApiQueryClient } from '@oxide/api' +import { + firewallRuleGetToPut, + useApiMutation, + useApiQueryClient, + type VpcFirewallRule, +} from '@oxide/api' import { SideModalForm } from 'app/components/form' import { useForm, useVpcSelector } from 'app/hooks' -import { CommonFields, valuesToRuleUpdate } from './firewall-rules-create' -import type { FirewallRuleValues } from './firewall-rules-create' +import { + CommonFields, + valuesToRuleUpdate, + type FirewallRuleValues, +} from './firewall-rules-create' type EditFirewallRuleFormProps = { onDismiss: () => void diff --git a/app/forms/idp/create.tsx b/app/forms/idp/create.tsx index 8fb0f7f964..7bfecbe07a 100644 --- a/app/forms/idp/create.tsx +++ b/app/forms/idp/create.tsx @@ -20,8 +20,7 @@ import { useForm, useSiloSelector, useToast } from 'app/hooks' import { readBlobAsBase64 } from 'app/util/file' import { pb } from 'app/util/path-builder' -import type { IdpCreateFormValues } from './shared' -import { MetadataSourceField } from './shared' +import { MetadataSourceField, type IdpCreateFormValues } from './shared' const defaultValues: IdpCreateFormValues = { type: 'saml', diff --git a/app/forms/idp/edit.tsx b/app/forms/idp/edit.tsx index 8f23fcec83..91c1c1202a 100644 --- a/app/forms/idp/edit.tsx +++ b/app/forms/idp/edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { Access16Icon, PropertiesTable, ResourceLabel, Truncate } from '@oxide/ui' diff --git a/app/forms/image-edit.tsx b/app/forms/image-edit.tsx index f0cd7f06fa..383a5370dc 100644 --- a/app/forms/image-edit.tsx +++ b/app/forms/image-edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, usePrefetchedApiQuery, type Image } from '@oxide/api' import { Images16Icon, PropertiesTable, ResourceLabel, Truncate } from '@oxide/ui' diff --git a/app/forms/image-from-snapshot.tsx b/app/forms/image-from-snapshot.tsx index 30c9545225..072ff76343 100644 --- a/app/forms/image-from-snapshot.tsx +++ b/app/forms/image-from-snapshot.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import fileSize from 'filesize' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, diff --git a/app/forms/image-upload.tsx b/app/forms/image-upload.tsx index f99e327b7f..ade0919a7a 100644 --- a/app/forms/image-upload.tsx +++ b/app/forms/image-upload.tsx @@ -12,8 +12,14 @@ import pRetry from 'p-retry' import { useRef, useState } from 'react' import { useNavigate } from 'react-router-dom' -import type { ApiError, BlockSize, Disk, Snapshot } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { + useApiMutation, + useApiQueryClient, + type ApiError, + type BlockSize, + type Disk, + type Snapshot, +} from '@oxide/api' import { Error12Icon, Message, diff --git a/app/forms/instance-create.tsx b/app/forms/instance-create.tsx index ba9797ac4c..18c837e135 100644 --- a/app/forms/instance-create.tsx +++ b/app/forms/instance-create.tsx @@ -6,11 +6,9 @@ * Copyright Oxide Computer Company */ import { useWatch } from 'react-hook-form' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import type { SetRequired } from 'type-fest' -import type { InstanceCreate } from '@oxide/api' import { apiQueryClient, genName, @@ -20,6 +18,7 @@ import { useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type InstanceCreate, } from '@oxide/api' import { EmptyMessage, @@ -49,8 +48,8 @@ import { NetworkInterfaceField, RadioFieldDyn, TextField, + type DiskTableItem, } from 'app/components/form' -import type { DiskTableItem } from 'app/components/form' import { getProjectSelector, useForm, useProjectSelector, useToast } from 'app/hooks' import { pb } from 'app/util/path-builder' diff --git a/app/forms/network-interface-create.tsx b/app/forms/network-interface-create.tsx index 67c5a55561..45e1f0003b 100644 --- a/app/forms/network-interface-create.tsx +++ b/app/forms/network-interface-create.tsx @@ -7,8 +7,7 @@ */ import { useMemo } from 'react' -import type { ApiError, InstanceNetworkInterfaceCreate } from '@oxide/api' -import { useApiQuery } from '@oxide/api' +import { useApiQuery, type ApiError, type InstanceNetworkInterfaceCreate } from '@oxide/api' import { FormDivider } from '@oxide/ui' import { diff --git a/app/forms/network-interface-edit.tsx b/app/forms/network-interface-edit.tsx index 5befe8975b..da037192e7 100644 --- a/app/forms/network-interface-edit.tsx +++ b/app/forms/network-interface-edit.tsx @@ -5,8 +5,11 @@ * * Copyright Oxide Computer Company */ -import type { InstanceNetworkInterface } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { + useApiMutation, + useApiQueryClient, + type InstanceNetworkInterface, +} from '@oxide/api' import { pick } from '@oxide/util' import { DescriptionField, NameField, SideModalForm } from 'app/components/form' diff --git a/app/forms/project-access.tsx b/app/forms/project-access.tsx index 2ad3826d5e..06ac70b5a0 100644 --- a/app/forms/project-access.tsx +++ b/app/forms/project-access.tsx @@ -15,8 +15,13 @@ import { import { ListboxField, SideModalForm } from 'app/components/form' import { useForm, useProjectSelector } from 'app/hooks' -import type { AddRoleModalProps, EditRoleModalProps } from './access-util' -import { actorToItem, defaultValues, roleItems } from './access-util' +import { + actorToItem, + defaultValues, + roleItems, + type AddRoleModalProps, + type EditRoleModalProps, +} from './access-util' export function ProjectAccessAddUserSideModal({ onDismiss, policy }: AddRoleModalProps) { const { project } = useProjectSelector() diff --git a/app/forms/project-create.tsx b/app/forms/project-create.tsx index 5180c650a7..c63f4355a1 100644 --- a/app/forms/project-create.tsx +++ b/app/forms/project-create.tsx @@ -7,8 +7,7 @@ */ import { useNavigate } from 'react-router-dom' -import type { ProjectCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type ProjectCreate } from '@oxide/api' import { DescriptionField, NameField, SideModalForm } from 'app/components/form' import { useForm } from 'app/hooks' diff --git a/app/forms/project-edit.tsx b/app/forms/project-edit.tsx index 0919db63b5..641de38a67 100644 --- a/app/forms/project-edit.tsx +++ b/app/forms/project-edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, diff --git a/app/forms/silo-access.tsx b/app/forms/silo-access.tsx index 1f0630b2a3..cb509389f7 100644 --- a/app/forms/silo-access.tsx +++ b/app/forms/silo-access.tsx @@ -15,8 +15,13 @@ import { import { ListboxField, SideModalForm } from 'app/components/form' import { useForm } from 'app/hooks' -import { actorToItem, defaultValues, roleItems } from './access-util' -import type { AddRoleModalProps, EditRoleModalProps } from './access-util' +import { + actorToItem, + defaultValues, + roleItems, + type AddRoleModalProps, + type EditRoleModalProps, +} from './access-util' export function SiloAccessAddUserSideModal({ onDismiss, policy }: AddRoleModalProps) { const actors = useActorsNotInPolicy(policy) diff --git a/app/forms/silo-create.tsx b/app/forms/silo-create.tsx index f4d2b58130..29dccc64d5 100644 --- a/app/forms/silo-create.tsx +++ b/app/forms/silo-create.tsx @@ -7,8 +7,7 @@ */ import { useNavigate } from 'react-router-dom' -import type { SiloCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type SiloCreate } from '@oxide/api' import { FormDivider } from '@oxide/ui' import { diff --git a/app/forms/snapshot-create.tsx b/app/forms/snapshot-create.tsx index 874f848a30..3c3d6f2220 100644 --- a/app/forms/snapshot-create.tsx +++ b/app/forms/snapshot-create.tsx @@ -7,8 +7,14 @@ */ import { useNavigate } from 'react-router-dom' -import type { PathParams as PP, SnapshotCreate } from '@oxide/api' -import { diskCan, useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' +import { + diskCan, + useApiMutation, + useApiQuery, + useApiQueryClient, + type PathParams as PP, + type SnapshotCreate, +} from '@oxide/api' import { DescriptionField, diff --git a/app/forms/ssh-key-create.tsx b/app/forms/ssh-key-create.tsx index 7063acacf8..41259b17c7 100644 --- a/app/forms/ssh-key-create.tsx +++ b/app/forms/ssh-key-create.tsx @@ -7,8 +7,7 @@ */ import { useNavigate } from 'react-router-dom' -import type { SshKeyCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type SshKeyCreate } from '@oxide/api' import { DescriptionField, NameField, SideModalForm, TextField } from 'app/components/form' import { useForm } from 'app/hooks' diff --git a/app/forms/subnet-create.tsx b/app/forms/subnet-create.tsx index 97fca5b0ea..59c3a972ca 100644 --- a/app/forms/subnet-create.tsx +++ b/app/forms/subnet-create.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { VpcSubnetCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type VpcSubnetCreate } from '@oxide/api' import { FormDivider } from '@oxide/ui' import { DescriptionField, NameField, SideModalForm, TextField } from 'app/components/form' diff --git a/app/forms/subnet-edit.tsx b/app/forms/subnet-edit.tsx index 3c6cb45a69..25762e1d48 100644 --- a/app/forms/subnet-edit.tsx +++ b/app/forms/subnet-edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { VpcSubnet } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type VpcSubnet } from '@oxide/api' import { pick } from '@oxide/util' import { DescriptionField, NameField, SideModalForm } from 'app/components/form' diff --git a/app/forms/vpc-create.tsx b/app/forms/vpc-create.tsx index 50de6d34a0..64362dd26f 100644 --- a/app/forms/vpc-create.tsx +++ b/app/forms/vpc-create.tsx @@ -7,8 +7,7 @@ */ import { useNavigate } from 'react-router-dom' -import type { VpcCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type VpcCreate } from '@oxide/api' import { DescriptionField, NameField, SideModalForm, TextField } from 'app/components/form' import { useForm, useProjectSelector, useToast } from 'app/hooks' diff --git a/app/forms/vpc-edit.tsx b/app/forms/vpc-edit.tsx index 3b9a5138f8..d2e61abead 100644 --- a/app/forms/vpc-edit.tsx +++ b/app/forms/vpc-edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, diff --git a/app/forms/vpc-router-create.tsx b/app/forms/vpc-router-create.tsx index f77bad4e09..df28acbe3b 100644 --- a/app/forms/vpc-router-create.tsx +++ b/app/forms/vpc-router-create.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { VpcRouterCreate } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type VpcRouterCreate } from '@oxide/api' import { DescriptionField, NameField, SideModalForm } from 'app/components/form' import { useForm, useToast, useVpcSelector } from 'app/hooks' diff --git a/app/forms/vpc-router-edit.tsx b/app/forms/vpc-router-edit.tsx index b8438438b9..589d76d450 100644 --- a/app/forms/vpc-router-edit.tsx +++ b/app/forms/vpc-router-edit.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { VpcRouter } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' +import { useApiMutation, useApiQueryClient, type VpcRouter } from '@oxide/api' import { pick } from '@oxide/util' import { DescriptionField, NameField, SideModalForm } from 'app/components/form' diff --git a/app/hooks/use-is-overflow.ts b/app/hooks/use-is-overflow.ts index fd334b34b1..19519297fe 100644 --- a/app/hooks/use-is-overflow.ts +++ b/app/hooks/use-is-overflow.ts @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import throttle from 'lodash.throttle' -import type { MutableRefObject } from 'react' -import { useLayoutEffect, useState } from 'react' +import { useLayoutEffect, useState, type MutableRefObject } from 'react' export const useIsOverflow = ( ref: MutableRefObject, diff --git a/app/hooks/use-params.ts b/app/hooks/use-params.ts index 3171922d36..21fb0da773 100644 --- a/app/hooks/use-params.ts +++ b/app/hooks/use-params.ts @@ -7,8 +7,7 @@ */ import { hashKey } from '@tanstack/react-query' import { useMemo } from 'react' -import type { Params } from 'react-router-dom' -import { useParams } from 'react-router-dom' +import { useParams, type Params } from 'react-router-dom' import { invariant } from '@oxide/util' diff --git a/app/layouts/ProjectLayout.tsx b/app/layouts/ProjectLayout.tsx index f02aad0672..046ff29f22 100644 --- a/app/layouts/ProjectLayout.tsx +++ b/app/layouts/ProjectLayout.tsx @@ -5,10 +5,13 @@ * * Copyright Oxide Computer Company */ -import type { ReactElement } from 'react' -import { useMemo } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useLocation, useNavigate, useParams } from 'react-router-dom' +import { useMemo, type ReactElement } from 'react' +import { + useLocation, + useNavigate, + useParams, + type LoaderFunctionArgs, +} from 'react-router-dom' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { diff --git a/app/pages/LoginPage.tsx b/app/pages/LoginPage.tsx index 2600505929..59bfc5c2d7 100644 --- a/app/pages/LoginPage.tsx +++ b/app/pages/LoginPage.tsx @@ -8,8 +8,7 @@ import { useEffect } from 'react' import { useNavigate, useSearchParams } from 'react-router-dom' -import type { UsernamePasswordCredentials } from '@oxide/api' -import { useApiMutation } from '@oxide/api' +import { useApiMutation, type UsernamePasswordCredentials } from '@oxide/api' import { Button, Identicon } from '@oxide/ui' import { TextFieldInner } from 'app/components/form' diff --git a/app/pages/ProjectsPage.tsx b/app/pages/ProjectsPage.tsx index 72b80da33b..ae406eca32 100644 --- a/app/pages/ProjectsPage.tsx +++ b/app/pages/ProjectsPage.tsx @@ -8,15 +8,14 @@ import { useMemo } from 'react' import { Link, Outlet, useNavigate } from 'react-router-dom' -import type { Project } from '@oxide/api' import { apiQueryClient, useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type Project, } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, linkCell, useQueryTable } from '@oxide/table' +import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table' import { buttonStyle, EmptyMessage, diff --git a/app/pages/SiloAccessPage.tsx b/app/pages/SiloAccessPage.tsx index 7e6e1b5acf..5ae95a1d3f 100644 --- a/app/pages/SiloAccessPage.tsx +++ b/app/pages/SiloAccessPage.tsx @@ -7,7 +7,6 @@ */ import { useMemo, useState } from 'react' -import type { IdentityType, RoleKey } from '@oxide/api' import { apiQueryClient, byGroupThenName, @@ -17,6 +16,8 @@ import { useApiQueryClient, usePrefetchedApiQuery, useUserRows, + type IdentityType, + type RoleKey, } from '@oxide/api' import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table' import { diff --git a/app/pages/project/access/ProjectAccessPage.tsx b/app/pages/project/access/ProjectAccessPage.tsx index 72014f8ecc..07a9d99292 100644 --- a/app/pages/project/access/ProjectAccessPage.tsx +++ b/app/pages/project/access/ProjectAccessPage.tsx @@ -10,7 +10,6 @@ import '@tanstack/react-table' import { useMemo, useState } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' -import type { IdentityType, RoleKey } from '@oxide/api' import { apiQueryClient, byGroupThenName, @@ -20,6 +19,8 @@ import { useApiQueryClient, usePrefetchedApiQuery, useUserRows, + type IdentityType, + type RoleKey, } from '@oxide/api' import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table' import { diff --git a/app/pages/project/disks/DisksPage.tsx b/app/pages/project/disks/DisksPage.tsx index b8d17e6908..2f91796387 100644 --- a/app/pages/project/disks/DisksPage.tsx +++ b/app/pages/project/disks/DisksPage.tsx @@ -5,10 +5,8 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, Outlet } from 'react-router-dom' +import { Link, Outlet, type LoaderFunctionArgs } from 'react-router-dom' -import type { Disk } from '@oxide/api' import { apiQueryClient, diskCan, @@ -16,6 +14,7 @@ import { useApiMutation, useApiQuery, useApiQueryClient, + type Disk, } from '@oxide/api' import { DateCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { diff --git a/app/pages/project/images/ImagesPage.tsx b/app/pages/project/images/ImagesPage.tsx index dfa199c64f..fd9527fb39 100644 --- a/app/pages/project/images/ImagesPage.tsx +++ b/app/pages/project/images/ImagesPage.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, Outlet } from 'react-router-dom' +import { Link, Outlet, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, useApiMutation, useApiQueryClient, type Image } from '@oxide/api' import { DateCell, linkCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' diff --git a/app/pages/project/instances/InstancesPage.tsx b/app/pages/project/instances/InstancesPage.tsx index 7c0c0c68de..6af4bbb81a 100644 --- a/app/pages/project/instances/InstancesPage.tsx +++ b/app/pages/project/instances/InstancesPage.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, useNavigate } from 'react-router-dom' +import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, useApiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { diff --git a/app/pages/project/instances/instance/InstancePage.tsx b/app/pages/project/instances/instance/InstancePage.tsx index f80b88e509..5a446332c4 100644 --- a/app/pages/project/instances/instance/InstancePage.tsx +++ b/app/pages/project/instances/instance/InstancePage.tsx @@ -8,8 +8,7 @@ import { format } from 'date-fns' import filesize from 'filesize' import { useMemo } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { useNavigate } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, useApiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { diff --git a/app/pages/project/instances/instance/SerialConsolePage.tsx b/app/pages/project/instances/instance/SerialConsolePage.tsx index cf23d11677..1d669972df 100644 --- a/app/pages/project/instances/instance/SerialConsolePage.tsx +++ b/app/pages/project/instances/instance/SerialConsolePage.tsx @@ -9,8 +9,7 @@ import { lazy, Suspense, useEffect, useRef, useState } from 'react' import { Link } from 'react-router-dom' import { api } from '@oxide/api' -import type { BadgeColor } from '@oxide/ui' -import { Badge, PrevArrow12Icon, Spinner } from '@oxide/ui' +import { Badge, PrevArrow12Icon, Spinner, type BadgeColor } from '@oxide/ui' import EquivalentCliCommand from 'app/components/EquivalentCliCommand' import { useInstanceSelector } from 'app/hooks' diff --git a/app/pages/project/instances/instance/tabs/MetricsTab.tsx b/app/pages/project/instances/instance/tabs/MetricsTab.tsx index 622e2c7e4c..67170bb721 100644 --- a/app/pages/project/instances/instance/tabs/MetricsTab.tsx +++ b/app/pages/project/instances/instance/tabs/MetricsTab.tsx @@ -8,8 +8,13 @@ import React, { Suspense, useMemo, useState } from 'react' import type { LoaderFunctionArgs } from 'react-router-dom' -import type { Cumulativeint64, DiskMetricName } from '@oxide/api' -import { apiQueryClient, useApiQuery, usePrefetchedApiQuery } from '@oxide/api' +import { + apiQueryClient, + useApiQuery, + usePrefetchedApiQuery, + type Cumulativeint64, + type DiskMetricName, +} from '@oxide/api' import { EmptyMessage, Listbox, Spinner, Storage24Icon, TableEmptyBox } from '@oxide/ui' import { useDateTimeRangePicker } from 'app/components/form' diff --git a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx b/app/pages/project/instances/instance/tabs/NetworkingTab.tsx index 23d19bfe9c..218502e1a4 100644 --- a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx +++ b/app/pages/project/instances/instance/tabs/NetworkingTab.tsx @@ -6,10 +6,8 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link } from 'react-router-dom' +import { Link, type LoaderFunctionArgs } from 'react-router-dom' -import type { InstanceNetworkInterface } from '@oxide/api' import { apiQueryClient, instanceCan, @@ -17,9 +15,9 @@ import { useApiQuery, useApiQueryClient, usePrefetchedApiQuery, + type InstanceNetworkInterface, } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { useQueryTable } from '@oxide/table' +import { useQueryTable, type MenuAction } from '@oxide/table' import { Badge, Button, diff --git a/app/pages/project/instances/instance/tabs/StorageTab.tsx b/app/pages/project/instances/instance/tabs/StorageTab.tsx index e12ed2faa0..4815147779 100644 --- a/app/pages/project/instances/instance/tabs/StorageTab.tsx +++ b/app/pages/project/instances/instance/tabs/StorageTab.tsx @@ -18,8 +18,7 @@ import { usePrefetchedApiQuery, type Disk, } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, SizeCell, useQueryTable } from '@oxide/table' +import { DateCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { Button, EmptyMessage, Storage24Icon } from '@oxide/ui' import { DiskStatusBadge } from 'app/components/StatusBadge' diff --git a/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx b/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx index a9d507ffd9..6682bbc99d 100644 --- a/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx +++ b/app/pages/project/networking/VpcPage/tabs/VpcFirewallRulesTab.tsx @@ -7,8 +7,12 @@ */ import { useMemo, useState } from 'react' -import type { VpcFirewallRule } from '@oxide/api' -import { useApiMutation, useApiQuery, useApiQueryClient } from '@oxide/api' +import { + useApiMutation, + useApiQuery, + useApiQueryClient, + type VpcFirewallRule, +} from '@oxide/api' import { createColumnHelper, DateCell, diff --git a/app/pages/project/networking/VpcPage/tabs/VpcRoutersTab.tsx b/app/pages/project/networking/VpcPage/tabs/VpcRoutersTab.tsx index 3c51b44c14..81b41ea8d7 100644 --- a/app/pages/project/networking/VpcPage/tabs/VpcRoutersTab.tsx +++ b/app/pages/project/networking/VpcPage/tabs/VpcRoutersTab.tsx @@ -8,8 +8,7 @@ import { useState } from 'react' import type { VpcRouter } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, LabelCell, useQueryTable } from '@oxide/table' +import { DateCell, LabelCell, useQueryTable, type MenuAction } from '@oxide/table' import { Button, EmptyMessage } from '@oxide/ui' import { CreateVpcRouterForm } from 'app/forms/vpc-router-create' diff --git a/app/pages/project/networking/VpcPage/tabs/VpcSubnetsTab.tsx b/app/pages/project/networking/VpcPage/tabs/VpcSubnetsTab.tsx index a3a91099f5..fb2dc5e89d 100644 --- a/app/pages/project/networking/VpcPage/tabs/VpcSubnetsTab.tsx +++ b/app/pages/project/networking/VpcPage/tabs/VpcSubnetsTab.tsx @@ -7,10 +7,8 @@ */ import { useState } from 'react' -import type { VpcSubnet } from '@oxide/api' -import { useApiMutation, useApiQueryClient } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, TwoLineCell, useQueryTable } from '@oxide/table' +import { useApiMutation, useApiQueryClient, type VpcSubnet } from '@oxide/api' +import { DateCell, TwoLineCell, useQueryTable, type MenuAction } from '@oxide/table' import { Button, EmptyMessage } from '@oxide/ui' import { CreateSubnetForm } from 'app/forms/subnet-create' diff --git a/app/pages/project/networking/VpcsPage.tsx b/app/pages/project/networking/VpcsPage.tsx index 8e20afc8bc..1711f27627 100644 --- a/app/pages/project/networking/VpcsPage.tsx +++ b/app/pages/project/networking/VpcsPage.tsx @@ -6,15 +6,14 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, Outlet, useNavigate } from 'react-router-dom' +import { Link, Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' -import type { Vpc } from '@oxide/api' import { apiQueryClient, useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type Vpc, } from '@oxide/api' import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table' import { diff --git a/app/pages/project/snapshots/SnapshotsPage.tsx b/app/pages/project/snapshots/SnapshotsPage.tsx index 2b64fc294d..006303ecbd 100644 --- a/app/pages/project/snapshots/SnapshotsPage.tsx +++ b/app/pages/project/snapshots/SnapshotsPage.tsx @@ -5,18 +5,16 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, Outlet, useNavigate } from 'react-router-dom' +import { Link, Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' -import type { Snapshot } from '@oxide/api' import { apiQueryClient, useApiMutation, useApiQueryClient, useApiQueryErrorsAllowed, + type Snapshot, } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, SizeCell, useQueryTable } from '@oxide/table' +import { DateCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { Badge, buttonStyle, diff --git a/app/pages/settings/SSHKeysPage.tsx b/app/pages/settings/SSHKeysPage.tsx index b614a1bc42..75924c6e92 100644 --- a/app/pages/settings/SSHKeysPage.tsx +++ b/app/pages/settings/SSHKeysPage.tsx @@ -7,10 +7,8 @@ */ import { Link, Outlet, useNavigate } from 'react-router-dom' -import type { SshKey } from '@oxide/api' -import { apiQueryClient, useApiMutation, useApiQueryClient } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, useQueryTable } from '@oxide/table' +import { apiQueryClient, useApiMutation, useApiQueryClient, type SshKey } from '@oxide/api' +import { DateCell, useQueryTable, type MenuAction } from '@oxide/table' import { buttonStyle, EmptyMessage, diff --git a/app/pages/system/SiloPage.tsx b/app/pages/system/SiloPage.tsx index 28be2ee60b..12f4c63d08 100644 --- a/app/pages/system/SiloPage.tsx +++ b/app/pages/system/SiloPage.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { LoaderFunctionArgs } from 'react-router-dom' -import { Link, Outlet } from 'react-router-dom' +import { Link, Outlet, type LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { DateCell, DefaultCell, linkCell, TruncateCell, useQueryTable } from '@oxide/table' diff --git a/app/pages/system/SilosPage.tsx b/app/pages/system/SilosPage.tsx index 67ab35d03b..738662c003 100644 --- a/app/pages/system/SilosPage.tsx +++ b/app/pages/system/SilosPage.tsx @@ -8,15 +8,20 @@ import { useMemo } from 'react' import { Link, Outlet, useNavigate } from 'react-router-dom' -import type { Silo } from '@oxide/api' import { apiQueryClient, useApiMutation, useApiQueryClient, usePrefetchedApiQuery, + type Silo, } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { BooleanCell, DateCell, linkCell, useQueryTable } from '@oxide/table' +import { + BooleanCell, + DateCell, + linkCell, + useQueryTable, + type MenuAction, +} from '@oxide/table' import { Badge, buttonStyle, diff --git a/app/pages/system/UtilizationPage.tsx b/app/pages/system/UtilizationPage.tsx index 40a98f5f5d..4b2b8ce214 100644 --- a/app/pages/system/UtilizationPage.tsx +++ b/app/pages/system/UtilizationPage.tsx @@ -9,13 +9,13 @@ import { getLocalTimeZone, now } from '@internationalized/date' import { useIsFetching } from '@tanstack/react-query' import { useMemo, useState } from 'react' -import type { SiloResultsPage } from '@oxide/api' import { apiQueryClient, FLEET_ID, totalCapacity, useApiQueries, usePrefetchedApiQuery, + type SiloResultsPage, } from '@oxide/api' import { Cpu16Icon, diff --git a/app/pages/system/inventory/sled/SledInstancesTab.tsx b/app/pages/system/inventory/sled/SledInstancesTab.tsx index 678ba46990..e189e98eb8 100644 --- a/app/pages/system/inventory/sled/SledInstancesTab.tsx +++ b/app/pages/system/inventory/sled/SledInstancesTab.tsx @@ -8,8 +8,12 @@ import type { LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient } from '@oxide/api' -import type { MenuAction } from '@oxide/table' -import { DateCell, InstanceResourceCell, useQueryTable } from '@oxide/table' +import { + DateCell, + InstanceResourceCell, + useQueryTable, + type MenuAction, +} from '@oxide/table' import { EmptyMessage, Instances24Icon } from '@oxide/ui' import { pick } from '@oxide/util' diff --git a/app/pages/system/metrics-util.spec.ts b/app/pages/system/metrics-util.spec.ts index a2e0bfbc4d..f51bcfe8e6 100644 --- a/app/pages/system/metrics-util.spec.ts +++ b/app/pages/system/metrics-util.spec.ts @@ -9,8 +9,7 @@ import { describe, expect, it } from 'vitest' import type { SystemMetricName } from '@oxide/api' -import type { MetricsResult } from './metrics-util' -import { tabularizeSiloMetrics } from './metrics-util' +import { tabularizeSiloMetrics, type MetricsResult } from './metrics-util' function makeResult( silo: string, diff --git a/app/test/e2e/image-upload.e2e.ts b/app/test/e2e/image-upload.e2e.ts index fe7490919a..c1a51923a7 100644 --- a/app/test/e2e/image-upload.e2e.ts +++ b/app/test/e2e/image-upload.e2e.ts @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Page } from '@playwright/test' -import { expect, test } from '@playwright/test' +import { expect, test, type Page } from '@playwright/test' import { chooseFile, diff --git a/app/test/e2e/utils.ts b/app/test/e2e/utils.ts index 7eae9198bb..b3a261d72d 100644 --- a/app/test/e2e/utils.ts +++ b/app/test/e2e/utils.ts @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Browser, Locator, Page } from '@playwright/test' -import { expect } from '@playwright/test' +import { expect, type Browser, type Locator, type Page } from '@playwright/test' import { MSW_USER_COOKIE } from '@oxide/api-mocks' import { MiB } from '@oxide/util' diff --git a/libs/api-mocks/msw/handlers.ts b/libs/api-mocks/msw/handlers.ts index 4cc5a61377..59c7649204 100644 --- a/libs/api-mocks/msw/handlers.ts +++ b/libs/api-mocks/msw/handlers.ts @@ -7,7 +7,6 @@ */ import { v4 as uuid } from 'uuid' -import type { ApiTypes as Api, SamlIdentityProvider } from '@oxide/api' import { diskCan, FLEET_ID, @@ -15,9 +14,10 @@ import { INSTANCE_MAX_RAM_GiB, INSTANCE_MIN_RAM_GiB, MAX_NICS_PER_INSTANCE, + type ApiTypes as Api, + type SamlIdentityProvider, } from '@oxide/api' -import type { Json } from '@oxide/gen/msw-handlers' -import { json, makeHandlers } from '@oxide/gen/msw-handlers' +import { json, makeHandlers, type Json } from '@oxide/gen/msw-handlers' import { GiB, pick, sortBy } from '@oxide/util' import { genCumulativeI64Data } from '../metrics' diff --git a/libs/api-mocks/msw/util.ts b/libs/api-mocks/msw/util.ts index c13a6518dd..16d628a7c7 100644 --- a/libs/api-mocks/msw/util.ts +++ b/libs/api-mocks/msw/util.ts @@ -8,17 +8,19 @@ import { differenceInSeconds, subHours } from 'date-fns' import type { RestRequest } from 'msw' -import type { - DiskCreate, - RoleKey, - Sled, - SystemMetricName, - SystemMetricQueryParams, - User, +import { + FLEET_ID, + MAX_DISK_SIZE_GiB, + MIN_DISK_SIZE_GiB, + totalCapacity, + type DiskCreate, + type RoleKey, + type Sled, + type SystemMetricName, + type SystemMetricQueryParams, + type User, } from '@oxide/api' -import { FLEET_ID, MAX_DISK_SIZE_GiB, MIN_DISK_SIZE_GiB, totalCapacity } from '@oxide/api' -import type { Json } from '@oxide/gen/msw-handlers' -import { json } from '@oxide/gen/msw-handlers' +import { json, type Json } from '@oxide/gen/msw-handlers' import { GiB, isTruthy, TiB } from '@oxide/util' import type { DbRoleAssignmentResourceType } from '..' diff --git a/libs/api/__generated__/Api.ts b/libs/api/__generated__/Api.ts index 12de490a64..9e42d4fb92 100644 --- a/libs/api/__generated__/Api.ts +++ b/libs/api/__generated__/Api.ts @@ -7,8 +7,7 @@ * * Copyright Oxide Computer Company */ -import type { FetchParams } from './http-client' -import { HttpClient, toQueryString } from './http-client' +import { HttpClient, toQueryString, type FetchParams } from './http-client' export type { ApiConfig, ApiResult, ErrorBody, ErrorResult } from './http-client' diff --git a/libs/api/hooks.ts b/libs/api/hooks.ts index cb9092492f..9bb0166280 100644 --- a/libs/api/hooks.ts +++ b/libs/api/hooks.ts @@ -5,16 +5,19 @@ * * Copyright Oxide Computer Company */ -import type { - DefaultError, - FetchQueryOptions, - InvalidateQueryFilters, - QueryClient, - UndefinedInitialDataOptions, - UseMutationOptions, - UseQueryOptions, +import { + useMutation, + useQueries, + useQuery, + useQueryClient, + type DefaultError, + type FetchQueryOptions, + type InvalidateQueryFilters, + type QueryClient, + type UndefinedInitialDataOptions, + type UseMutationOptions, + type UseQueryOptions, } from '@tanstack/react-query' -import { useMutation, useQueries, useQuery, useQueryClient } from '@tanstack/react-query' import { invariant } from '@oxide/util' diff --git a/libs/pagination/Pagination.tsx b/libs/pagination/Pagination.tsx index 905beeb588..c0392ba304 100644 --- a/libs/pagination/Pagination.tsx +++ b/libs/pagination/Pagination.tsx @@ -7,8 +7,10 @@ */ import tunnel from 'tunnel-rat' -import type { PaginationProps as UIPaginationProps } from '@oxide/ui' -import { Pagination as UIPagination } from '@oxide/ui' +import { + Pagination as UIPagination, + type PaginationProps as UIPaginationProps, +} from '@oxide/ui' const Tunnel = tunnel('pagination') diff --git a/libs/table/QueryTable.tsx b/libs/table/QueryTable.tsx index 2655c677da..f00429f07e 100644 --- a/libs/table/QueryTable.tsx +++ b/libs/table/QueryTable.tsx @@ -7,22 +7,36 @@ */ /* eslint-disable @typescript-eslint/no-explicit-any */ -import type { UseQueryOptions } from '@tanstack/react-query' -import { hashKey } from '@tanstack/react-query' -import type { AccessorFn, DeepKeys } from '@tanstack/react-table' -import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' -import React, { useCallback, useEffect, useMemo } from 'react' -import type { ComponentType, ReactElement } from 'react' - -import { useApiQuery } from '@oxide/api' -import type { ApiError, ApiListMethods, Params, Result, ResultItem } from '@oxide/api' +import { hashKey, type UseQueryOptions } from '@tanstack/react-query' +import { + createColumnHelper, + getCoreRowModel, + useReactTable, + type AccessorFn, + type DeepKeys, +} from '@tanstack/react-table' +import React, { + useCallback, + useEffect, + useMemo, + type ComponentType, + type ReactElement, +} from 'react' + +import { + useApiQuery, + type ApiError, + type ApiListMethods, + type Params, + type Result, + type ResultItem, +} from '@oxide/api' import { Pagination, usePagination } from '@oxide/pagination' import { EmptyMessage, TableEmptyBox } from '@oxide/ui' import { invariant, isOneOf } from '@oxide/util' import { DefaultCell } from './cells' -import { getActionsCol, getMultiSelectCol, getSelectCol } from './columns' -import type { MakeActions } from './columns' +import { getActionsCol, getMultiSelectCol, getSelectCol, type MakeActions } from './columns' import { Table } from './Table' interface UseQueryTableResult> { diff --git a/libs/table/Table.tsx b/libs/table/Table.tsx index 70f9ad7090..b15b3265f6 100644 --- a/libs/table/Table.tsx +++ b/libs/table/Table.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Table as TableInstance } from '@tanstack/react-table' -import { flexRender } from '@tanstack/react-table' +import { flexRender, type Table as TableInstance } from '@tanstack/react-table' import cn from 'classnames' import { Table as UITable } from '@oxide/ui' diff --git a/libs/table/cells/FirewallFilterCell.tsx b/libs/table/cells/FirewallFilterCell.tsx index 4822468010..21b813b6f2 100644 --- a/libs/table/cells/FirewallFilterCell.tsx +++ b/libs/table/cells/FirewallFilterCell.tsx @@ -8,8 +8,7 @@ import type { VpcFirewallRuleFilter } from '@oxide/api' import { Badge } from '@oxide/ui' -import type { Cell } from '.' -import { TypeValueCell } from '.' +import { TypeValueCell, type Cell } from '.' export const FirewallFilterCell = ({ value: { hosts, ports, protocols }, diff --git a/libs/table/cells/TypeValueListCell.tsx b/libs/table/cells/TypeValueListCell.tsx index d66bc77a23..7141366554 100644 --- a/libs/table/cells/TypeValueListCell.tsx +++ b/libs/table/cells/TypeValueListCell.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { Cell, TypeValue } from '.' -import { TypeValueCell } from '.' +import { TypeValueCell, type Cell, type TypeValue } from '.' export const TypeValueListCell = ({ value }: Cell) => (
diff --git a/libs/table/react-table.ts b/libs/table/react-table.ts index 61ff98e739..4cafd21b9d 100644 --- a/libs/table/react-table.ts +++ b/libs/table/react-table.ts @@ -5,11 +5,13 @@ * * Copyright Oxide Computer Company */ -import type { CellContext, RowData, TableOptions } from '@tanstack/react-table' import { createColumnHelper, getCoreRowModel, useReactTable as useReactTableOrig, + type CellContext, + type RowData, + type TableOptions, } from '@tanstack/react-table' /** diff --git a/libs/ui/lib/avatar-stack/AvatarStack.tsx b/libs/ui/lib/avatar-stack/AvatarStack.tsx index 405517de21..c24030d41e 100644 --- a/libs/ui/lib/avatar-stack/AvatarStack.tsx +++ b/libs/ui/lib/avatar-stack/AvatarStack.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { AvatarProps, AvatarSize } from '../avatar/Avatar' -import { Avatar } from '../avatar/Avatar' +import { Avatar, type AvatarProps, type AvatarSize } from '../avatar/Avatar' export interface AvatarStackProps { data: Array diff --git a/libs/ui/lib/badge/Badge.stories.tsx b/libs/ui/lib/badge/Badge.stories.tsx index 5bf55243f6..bbeb241f40 100644 --- a/libs/ui/lib/badge/Badge.stories.tsx +++ b/libs/ui/lib/badge/Badge.stories.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { Section } from '../../util/story-section' -import { Badge, badgeColors } from './Badge' -import type { BadgeColor, BadgeVariant } from './Badge' +import { Badge, badgeColors, type BadgeColor, type BadgeVariant } from './Badge' export const All = () => { return ( diff --git a/libs/ui/lib/bulk-action-menu/BulkActionMenu.tsx b/libs/ui/lib/bulk-action-menu/BulkActionMenu.tsx index 21a2f5499f..a6e7add18d 100644 --- a/libs/ui/lib/bulk-action-menu/BulkActionMenu.tsx +++ b/libs/ui/lib/bulk-action-menu/BulkActionMenu.tsx @@ -7,8 +7,7 @@ */ import { flattenChildren } from '@oxide/util' -import type { ButtonProps } from '../button/Button' -import { Button } from '../button/Button' +import { Button, type ButtonProps } from '../button/Button' export interface BulkActionMenuProps { selectedCount: number diff --git a/libs/ui/lib/button/Button.tsx b/libs/ui/lib/button/Button.tsx index 888de69ca7..dd3c7eb0ad 100644 --- a/libs/ui/lib/button/Button.tsx +++ b/libs/ui/lib/button/Button.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import type { MouseEventHandler, ReactNode } from 'react' -import { forwardRef } from 'react' +import { forwardRef, type MouseEventHandler, type ReactNode } from 'react' import { Spinner, Tooltip, Wrap } from '@oxide/ui' diff --git a/libs/ui/lib/date-picker/Calendar.tsx b/libs/ui/lib/date-picker/Calendar.tsx index ddee018d0f..5cef964eea 100644 --- a/libs/ui/lib/date-picker/Calendar.tsx +++ b/libs/ui/lib/date-picker/Calendar.tsx @@ -5,10 +5,8 @@ * * Copyright Oxide Computer Company */ -import type { DateValue } from '@internationalized/date' -import { createCalendar } from '@internationalized/date' -import type { CalendarProps } from 'react-aria' -import { useCalendar, useLocale } from 'react-aria' +import { createCalendar, type DateValue } from '@internationalized/date' +import { useCalendar, useLocale, type CalendarProps } from 'react-aria' import { useCalendarState } from 'react-stately' import { CalendarGrid } from './CalendarGrid' diff --git a/libs/ui/lib/date-picker/CalendarCell.tsx b/libs/ui/lib/date-picker/CalendarCell.tsx index 01b5805a43..4e7a6ea2fd 100644 --- a/libs/ui/lib/date-picker/CalendarCell.tsx +++ b/libs/ui/lib/date-picker/CalendarCell.tsx @@ -5,8 +5,13 @@ * * Copyright Oxide Computer Company */ -import type { CalendarDate } from '@internationalized/date' -import { getDayOfWeek, getLocalTimeZone, isSameDay, isToday } from '@internationalized/date' +import { + getDayOfWeek, + getLocalTimeZone, + isSameDay, + isToday, + type CalendarDate, +} from '@internationalized/date' import cn from 'classnames' import { useRef } from 'react' import { mergeProps, useCalendarCell, useFocusRing, useLocale } from 'react-aria' diff --git a/libs/ui/lib/date-picker/CalendarGrid.tsx b/libs/ui/lib/date-picker/CalendarGrid.tsx index 2e71e8c3a8..8d11d5d294 100644 --- a/libs/ui/lib/date-picker/CalendarGrid.tsx +++ b/libs/ui/lib/date-picker/CalendarGrid.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { getWeeksInMonth } from '@internationalized/date' -import { useCalendarGrid, useLocale } from 'react-aria' -import type { AriaCalendarGridProps } from 'react-aria' +import { useCalendarGrid, useLocale, type AriaCalendarGridProps } from 'react-aria' import type { CalendarState, RangeCalendarState } from 'react-stately' import { CalendarCell } from './CalendarCell' diff --git a/libs/ui/lib/date-picker/DateField.tsx b/libs/ui/lib/date-picker/DateField.tsx index 642dce2c10..4f048f201b 100644 --- a/libs/ui/lib/date-picker/DateField.tsx +++ b/libs/ui/lib/date-picker/DateField.tsx @@ -5,15 +5,24 @@ * * Copyright Oxide Computer Company */ -import type { DateValue } from '@internationalized/date' -import { createCalendar } from '@internationalized/date' +import { createCalendar, type DateValue } from '@internationalized/date' import type { TimeValue } from '@react-types/datepicker' import cn from 'classnames' import { useRef } from 'react' -import { useDateField, useDateSegment, useLocale, useTimeField } from 'react-aria' -import type { AriaDateFieldProps, AriaTimeFieldProps } from 'react-aria' -import { useDateFieldState, useTimeFieldState } from 'react-stately' -import type { DateFieldState, DateSegment as DateSegmentType } from 'react-stately' +import { + useDateField, + useDateSegment, + useLocale, + useTimeField, + type AriaDateFieldProps, + type AriaTimeFieldProps, +} from 'react-aria' +import { + useDateFieldState, + useTimeFieldState, + type DateFieldState, + type DateSegment as DateSegmentType, +} from 'react-stately' const dateTimeFieldStyles = 'flex items-center rounded border p-2' diff --git a/libs/ui/lib/date-picker/DatePicker.tsx b/libs/ui/lib/date-picker/DatePicker.tsx index 18da826731..4271113423 100644 --- a/libs/ui/lib/date-picker/DatePicker.tsx +++ b/libs/ui/lib/date-picker/DatePicker.tsx @@ -5,14 +5,12 @@ * * Copyright Oxide Computer Company */ -import { getLocalTimeZone } from '@internationalized/date' -import type { DateValue } from '@internationalized/date' +import { getLocalTimeZone, type DateValue } from '@internationalized/date' import type { TimeValue } from '@react-types/datepicker' import cn from 'classnames' import { useMemo, useRef } from 'react' import { useButton, useDateFormatter, useDatePicker } from 'react-aria' -import { useDatePickerState } from 'react-stately' -import type { DatePickerStateOptions } from 'react-stately' +import { useDatePickerState, type DatePickerStateOptions } from 'react-stately' import { Calendar16Icon, Error12Icon } from '@oxide/design-system/icons/react' diff --git a/libs/ui/lib/date-picker/DateRangePicker.tsx b/libs/ui/lib/date-picker/DateRangePicker.tsx index 2c470f5b34..930ed77e8e 100644 --- a/libs/ui/lib/date-picker/DateRangePicker.tsx +++ b/libs/ui/lib/date-picker/DateRangePicker.tsx @@ -10,8 +10,7 @@ import type { TimeValue } from '@react-types/datepicker' import cn from 'classnames' import { useMemo, useRef } from 'react' import { useButton, useDateFormatter, useDateRangePicker } from 'react-aria' -import { useDateRangePickerState } from 'react-stately' -import type { DateRangePickerStateOptions } from 'react-stately' +import { useDateRangePickerState, type DateRangePickerStateOptions } from 'react-stately' import { Calendar16Icon, Error12Icon } from '@oxide/design-system/icons/react' diff --git a/libs/ui/lib/date-picker/Dialog.tsx b/libs/ui/lib/date-picker/Dialog.tsx index 42abbbd76f..9236512a70 100644 --- a/libs/ui/lib/date-picker/Dialog.tsx +++ b/libs/ui/lib/date-picker/Dialog.tsx @@ -5,10 +5,8 @@ * * Copyright Oxide Computer Company */ -import { useRef } from 'react' -import type { ReactNode } from 'react' -import { useDialog } from 'react-aria' -import type { AriaDialogProps } from 'react-aria' +import { useRef, type ReactNode } from 'react' +import { useDialog, type AriaDialogProps } from 'react-aria' interface DialogProps extends AriaDialogProps { children: ReactNode diff --git a/libs/ui/lib/date-picker/Popover.tsx b/libs/ui/lib/date-picker/Popover.tsx index bd361cdb31..c46c48be4f 100644 --- a/libs/ui/lib/date-picker/Popover.tsx +++ b/libs/ui/lib/date-picker/Popover.tsx @@ -5,10 +5,13 @@ * * Copyright Oxide Computer Company */ -import { DismissButton, Overlay, usePopover } from '@react-aria/overlays' -import type { AriaPopoverProps } from '@react-aria/overlays' -import { useRef } from 'react' -import type { ReactNode } from 'react' +import { + DismissButton, + Overlay, + usePopover, + type AriaPopoverProps, +} from '@react-aria/overlays' +import { useRef, type ReactNode } from 'react' import type { OverlayTriggerState } from 'react-stately' interface PopoverProps extends Omit { diff --git a/libs/ui/lib/date-picker/RangeCalendar.tsx b/libs/ui/lib/date-picker/RangeCalendar.tsx index 1729211828..12d491a941 100644 --- a/libs/ui/lib/date-picker/RangeCalendar.tsx +++ b/libs/ui/lib/date-picker/RangeCalendar.tsx @@ -5,15 +5,20 @@ * * Copyright Oxide Computer Company */ -import type { DateValue } from '@internationalized/date' -import { createCalendar } from '@internationalized/date' +import { createCalendar, type DateValue } from '@internationalized/date' import cn from 'classnames' -import { useRef } from 'react' -import type { ReactNode } from 'react' -import type { AriaButtonProps, RangeCalendarProps } from 'react-aria' -import { useLocale, useRangeCalendar } from 'react-aria' -import { useRangeCalendarState } from 'react-stately' -import type { CalendarState, RangeCalendarState } from 'react-stately' +import { useRef, type ReactNode } from 'react' +import { + useLocale, + useRangeCalendar, + type AriaButtonProps, + type RangeCalendarProps, +} from 'react-aria' +import { + useRangeCalendarState, + type CalendarState, + type RangeCalendarState, +} from 'react-stately' import { DirectionLeftIcon, DirectionRightIcon } from '@oxide/design-system/icons/react' diff --git a/libs/ui/lib/dropdown-menu/DropdownMenu.tsx b/libs/ui/lib/dropdown-menu/DropdownMenu.tsx index 15ad434b58..ddebab55a4 100644 --- a/libs/ui/lib/dropdown-menu/DropdownMenu.tsx +++ b/libs/ui/lib/dropdown-menu/DropdownMenu.tsx @@ -5,11 +5,15 @@ * * Copyright Oxide Computer Company */ -import type { - DropdownMenuContentProps, - DropdownMenuItemProps, +import { + Content, + Item, + Portal, + Root, + Trigger, + type DropdownMenuContentProps, + type DropdownMenuItemProps, } from '@radix-ui/react-dropdown-menu' -import { Content, Item, Portal, Root, Trigger } from '@radix-ui/react-dropdown-menu' import cn from 'classnames' import { forwardRef, type ForwardedRef } from 'react' diff --git a/libs/ui/lib/file-input/FileInput.tsx b/libs/ui/lib/file-input/FileInput.tsx index de54768c9e..3c188b44cc 100644 --- a/libs/ui/lib/file-input/FileInput.tsx +++ b/libs/ui/lib/file-input/FileInput.tsx @@ -7,8 +7,14 @@ */ import cn from 'classnames' import filesize from 'filesize' -import type { ChangeEvent, ComponentProps, MouseEvent } from 'react' -import { forwardRef, useRef, useState } from 'react' +import { + forwardRef, + useRef, + useState, + type ChangeEvent, + type ComponentProps, + type MouseEvent, +} from 'react' import { mergeRefs } from 'react-merge-refs' import { Document16Icon, Error16Icon, Truncate } from '@oxide/ui' diff --git a/libs/ui/lib/hooks/use-stepped-scroll.ts b/libs/ui/lib/hooks/use-stepped-scroll.ts index 7bb4f0218c..4d9d1a2f90 100644 --- a/libs/ui/lib/hooks/use-stepped-scroll.ts +++ b/libs/ui/lib/hooks/use-stepped-scroll.ts @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { RefObject } from 'react' -import { useEffect } from 'react' +import { useEffect, type RefObject } from 'react' // appreciate this. I suffered diff --git a/libs/ui/lib/progress/Progress.tsx b/libs/ui/lib/progress/Progress.tsx index 5335a68671..31cac6539b 100644 --- a/libs/ui/lib/progress/Progress.tsx +++ b/libs/ui/lib/progress/Progress.tsx @@ -7,8 +7,7 @@ */ import cn from 'classnames' -import type { AriaLabel } from '../../util/aria' -import { ariaLabel } from '../../util/aria' +import { ariaLabel, type AriaLabel } from '../../util/aria' export type ProgressProps = { value: number // always out of 100 diff --git a/libs/ui/lib/spinner/Spinner.tsx b/libs/ui/lib/spinner/Spinner.tsx index 8d569c6103..28a044e05c 100644 --- a/libs/ui/lib/spinner/Spinner.tsx +++ b/libs/ui/lib/spinner/Spinner.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import type { ReactNode } from 'react' -import { useEffect, useRef, useState } from 'react' +import { useEffect, useRef, useState, type ReactNode } from 'react' import './spinner.css' diff --git a/libs/ui/lib/table/Table.tsx b/libs/ui/lib/table/Table.tsx index 8fa2767f02..1471922999 100644 --- a/libs/ui/lib/table/Table.tsx +++ b/libs/ui/lib/table/Table.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import type { ReactElement } from 'react' -import React, { useRef } from 'react' +import React, { useRef, type ReactElement } from 'react' import SimpleBar from 'simplebar-react' import 'simplebar-react/dist/simplebar.min.css' diff --git a/libs/ui/lib/tabs/Tabs.tsx b/libs/ui/lib/tabs/Tabs.tsx index 81bc838bb7..8e873b11bf 100644 --- a/libs/ui/lib/tabs/Tabs.tsx +++ b/libs/ui/lib/tabs/Tabs.tsx @@ -5,13 +5,16 @@ * * Copyright Oxide Computer Company */ -import type { - TabsContentProps, - TabsListProps, - TabsProps, - TabsTriggerProps, +import { + Content, + List, + Root, + Trigger, + type TabsContentProps, + type TabsListProps, + type TabsProps, + type TabsTriggerProps, } from '@radix-ui/react-tabs' -import { Content, List, Root, Trigger } from '@radix-ui/react-tabs' import cn from 'classnames' import type { SetRequired } from 'type-fest' diff --git a/libs/ui/lib/tag/Tag.stories.tsx b/libs/ui/lib/tag/Tag.stories.tsx index 7b5490deb8..dd55be05b9 100644 --- a/libs/ui/lib/tag/Tag.stories.tsx +++ b/libs/ui/lib/tag/Tag.stories.tsx @@ -6,8 +6,7 @@ * Copyright Oxide Computer Company */ import { Section } from '../../util/story-section' -import type { TagColor, TagVariant } from './Tag' -import { Tag, tagColors } from './Tag' +import { Tag, tagColors, type TagColor, type TagVariant } from './Tag' export const Default = () => { return ( diff --git a/libs/ui/lib/toast/Toast.tsx b/libs/ui/lib/toast/Toast.tsx index 2d1992ecd7..2d013ba1c6 100644 --- a/libs/ui/lib/toast/Toast.tsx +++ b/libs/ui/lib/toast/Toast.tsx @@ -7,8 +7,7 @@ */ import { announce } from '@react-aria/live-announcer' import cn from 'classnames' -import type { ReactElement } from 'react' -import { useEffect } from 'react' +import { useEffect, type ReactElement } from 'react' import { Link, type To } from 'react-router-dom' import { diff --git a/libs/ui/lib/tooltip/Tooltip.tsx b/libs/ui/lib/tooltip/Tooltip.tsx index 8541d13d75..9b1dcaa5be 100644 --- a/libs/ui/lib/tooltip/Tooltip.tsx +++ b/libs/ui/lib/tooltip/Tooltip.tsx @@ -19,11 +19,17 @@ import { useHover, useInteractions, useRole, + type Placement, } from '@floating-ui/react' -import type { Placement } from '@floating-ui/react' import cn from 'classnames' -import type { ReactElement } from 'react' -import { Children, cloneElement, forwardRef, useRef, useState } from 'react' +import { + Children, + cloneElement, + forwardRef, + useRef, + useState, + type ReactElement, +} from 'react' import { mergeRefs } from 'react-merge-refs' import './tooltip.css' diff --git a/libs/ui/util/wrap.tsx b/libs/ui/util/wrap.tsx index ab075eb0dc..798d4d984d 100644 --- a/libs/ui/util/wrap.tsx +++ b/libs/ui/util/wrap.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import React from 'react' -import type { ReactElement, ReactNode } from 'react' +import React, { type ReactElement, type ReactNode } from 'react' interface WrapProps { when: unknown diff --git a/libs/util/children.tsx b/libs/util/children.tsx index 76bcd0ec2c..a9801bafd7 100644 --- a/libs/util/children.tsx +++ b/libs/util/children.tsx @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { ComponentType, ReactElement, ReactNode } from 'react' -import React from 'react' +import React, { type ComponentType, type ReactElement, type ReactNode } from 'react' type ReactChildren = typeof React.Children diff --git a/playwright.config.ts b/playwright.config.ts index 045735b71f..b6902f1b75 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -5,8 +5,7 @@ * * Copyright Oxide Computer Company */ -import type { PlaywrightTestConfig } from '@playwright/test' -import { devices } from '@playwright/test' +import { devices, type PlaywrightTestConfig } from '@playwright/test' /** * See https://playwright.dev/docs/test-configuration.