From db8e52d543809c63b39ccfa0c8cf9c79c800ea6b Mon Sep 17 00:00:00 2001 From: David Crespo Date: Tue, 17 Dec 2024 16:39:53 -0600 Subject: [PATCH] convert all the imports, everything works but the scroll restore test --- app/components/ErrorBoundary.tsx | 2 +- app/components/ErrorPage.tsx | 2 +- app/components/QueryParamTabs.tsx | 2 +- app/components/RouteTabs.tsx | 2 +- app/components/Sidebar.tsx | 2 +- app/components/TopBar.tsx | 2 +- app/components/form/FullPageForm.tsx | 2 +- app/components/form/SideModalForm.tsx | 2 +- app/forms/disk-create.tsx | 2 +- app/forms/firewall-rules-create.tsx | 2 +- app/forms/firewall-rules-edit.tsx | 2 +- app/forms/floating-ip-create.tsx | 2 +- app/forms/floating-ip-edit.tsx | 2 +- app/forms/idp/create.tsx | 2 +- app/forms/idp/edit.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 | 2 +- app/forms/ip-pool-create.tsx | 2 +- app/forms/ip-pool-edit.tsx | 2 +- app/forms/ip-pool-range-add.tsx | 2 +- app/forms/project-create.tsx | 2 +- app/forms/project-edit.tsx | 2 +- app/forms/silo-create.tsx | 2 +- app/forms/snapshot-create.tsx | 2 +- app/forms/ssh-key-create.tsx | 2 +- app/forms/ssh-key-edit.tsx | 2 +- app/forms/subnet-create.tsx | 2 +- app/forms/subnet-edit.tsx | 2 +- app/forms/vpc-create.tsx | 2 +- app/forms/vpc-edit.tsx | 2 +- app/forms/vpc-router-create.tsx | 2 +- app/forms/vpc-router-edit.tsx | 2 +- app/forms/vpc-router-route-create.tsx | 2 +- app/forms/vpc-router-route-edit.tsx | 2 +- app/hooks/use-crumbs.ts | 2 +- app/hooks/use-is-active-path.ts | 4 ++-- app/hooks/use-params.ts | 2 +- app/hooks/use-quick-actions.tsx | 2 +- app/hooks/use-scroll-restoration.ts | 2 +- app/layouts/AuthLayout.tsx | 2 +- app/layouts/AuthenticatedLayout.tsx | 2 +- app/layouts/LoginLayout.tsx | 2 +- app/layouts/ProjectLayout.tsx | 2 +- app/layouts/RootLayout.tsx | 2 +- app/layouts/SettingsLayout.tsx | 2 +- app/layouts/SiloLayout.tsx | 2 +- app/layouts/SystemLayout.tsx | 2 +- app/layouts/helpers.tsx | 2 +- app/main.tsx | 22 ++++--------------- app/pages/DeviceAuthVerifyPage.tsx | 2 +- app/pages/LoginPage.tsx | 2 +- app/pages/LoginPageSaml.tsx | 2 +- app/pages/ProjectsPage.tsx | 2 +- app/pages/lookups.ts | 2 +- .../project/access/ProjectAccessPage.tsx | 2 +- app/pages/project/disks/DisksPage.tsx | 2 +- .../project/floating-ips/FloatingIpsPage.tsx | 2 +- app/pages/project/images/ImagesPage.tsx | 2 +- app/pages/project/instances/InstancesPage.tsx | 2 +- app/pages/project/instances/actions.tsx | 2 +- .../instances/instance/InstancePage.tsx | 2 +- .../instances/instance/SerialConsolePage.tsx | 2 +- .../instances/instance/tabs/ConnectTab.tsx | 2 +- .../instances/instance/tabs/MetricsTab.tsx | 2 +- .../instances/instance/tabs/NetworkingTab.tsx | 2 +- .../instances/instance/tabs/StorageTab.tsx | 2 +- app/pages/project/snapshots/SnapshotsPage.tsx | 2 +- app/pages/project/vpcs/RouterPage.tsx | 2 +- app/pages/project/vpcs/VpcPage/VpcPage.tsx | 2 +- .../vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx | 2 +- .../vpcs/VpcPage/tabs/VpcGatewaysTab.tsx | 2 +- .../vpcs/VpcPage/tabs/VpcRoutersTab.tsx | 2 +- .../vpcs/VpcPage/tabs/VpcSubnetsTab.tsx | 2 +- app/pages/project/vpcs/VpcsPage.tsx | 2 +- .../project/vpcs/internet-gateway-edit.tsx | 2 +- app/pages/settings/SSHKeysPage.tsx | 2 +- app/pages/system/SiloImagesPage.tsx | 2 +- .../inventory/sled/SledInstancesTab.tsx | 2 +- app/pages/system/inventory/sled/SledPage.tsx | 2 +- app/pages/system/networking/IpPoolPage.tsx | 2 +- app/pages/system/networking/IpPoolsPage.tsx | 2 +- app/pages/system/silos/SiloIdpsTab.tsx | 2 +- app/pages/system/silos/SiloPage.tsx | 2 +- app/pages/system/silos/SilosPage.tsx | 2 +- app/routes.tsx | 2 +- app/table/cells/LinkCell.tsx | 2 +- app/ui/lib/CreateButton.tsx | 2 +- app/ui/lib/DropdownMenu.tsx | 2 +- app/ui/lib/EmptyMessage.tsx | 2 +- app/ui/lib/Message.tsx | 2 +- app/ui/lib/Toast.tsx | 2 +- app/util/path-builder.spec.ts | 2 +- 94 files changed, 98 insertions(+), 112 deletions(-) diff --git a/app/components/ErrorBoundary.tsx b/app/components/ErrorBoundary.tsx index 181ceb5f3c..32baf81ded 100644 --- a/app/components/ErrorBoundary.tsx +++ b/app/components/ErrorBoundary.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { ErrorBoundary as BaseErrorBoundary } from 'react-error-boundary' -import { useRouteError } from 'react-router-dom' +import { useRouteError } from 'react-router' import { type ApiError } from '~/api/errors' diff --git a/app/components/ErrorPage.tsx b/app/components/ErrorPage.tsx index 85ad7bb06f..3e6b6522c1 100644 --- a/app/components/ErrorPage.tsx +++ b/app/components/ErrorPage.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import type { ReactNode } from 'react' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' import { Error12Icon, PrevArrow12Icon } from '@oxide/design-system/icons/react' diff --git a/app/components/QueryParamTabs.tsx b/app/components/QueryParamTabs.tsx index bfcb84ab56..0b3500b107 100644 --- a/app/components/QueryParamTabs.tsx +++ b/app/components/QueryParamTabs.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { useSearchParams } from 'react-router-dom' +import { useSearchParams } from 'react-router' import { Tabs, type TabsRootProps } from '~/ui/lib/Tabs' diff --git a/app/components/RouteTabs.tsx b/app/components/RouteTabs.tsx index 0ded896547..a35272539e 100644 --- a/app/components/RouteTabs.tsx +++ b/app/components/RouteTabs.tsx @@ -7,7 +7,7 @@ */ import cn from 'classnames' import type { ReactNode } from 'react' -import { Link, Outlet } from 'react-router-dom' +import { Link, Outlet } from 'react-router' import { useIsActivePath } from '~/hooks/use-is-active-path' import { KEYS } from '~/ui/util/keys' diff --git a/app/components/Sidebar.tsx b/app/components/Sidebar.tsx index 4b6f2db878..0206faee6d 100644 --- a/app/components/Sidebar.tsx +++ b/app/components/Sidebar.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import { NavLink, useLocation } from 'react-router-dom' +import { NavLink, useLocation } from 'react-router' import { Action16Icon, Document16Icon } from '@oxide/design-system/icons/react' diff --git a/app/components/TopBar.tsx b/app/components/TopBar.tsx index 0c3c745ad1..a0115ab386 100644 --- a/app/components/TopBar.tsx +++ b/app/components/TopBar.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' import { navToLogin, useApiMutation } from '@oxide/api' import { diff --git a/app/components/form/FullPageForm.tsx b/app/components/form/FullPageForm.tsx index fe422f5436..2be6f31b07 100644 --- a/app/components/form/FullPageForm.tsx +++ b/app/components/form/FullPageForm.tsx @@ -7,7 +7,7 @@ */ import { cloneElement, useEffect, type ReactNode } from 'react' import type { FieldValues, UseFormReturn } from 'react-hook-form' -import { useBlocker, type Blocker } from 'react-router-dom' +import { useBlocker, type Blocker } from 'react-router' import type { ApiError } from '@oxide/api' diff --git a/app/components/form/SideModalForm.tsx b/app/components/form/SideModalForm.tsx index 4aadd41152..4cc2a87787 100644 --- a/app/components/form/SideModalForm.tsx +++ b/app/components/form/SideModalForm.tsx @@ -8,7 +8,7 @@ import { useEffect, useId, useState, type ReactNode } from 'react' import type { FieldValues, UseFormReturn } from 'react-hook-form' -import { NavigationType, useNavigationType } from 'react-router-dom' +import { NavigationType, useNavigationType } from 'react-router' import type { ApiError } from '@oxide/api' diff --git a/app/forms/disk-create.tsx b/app/forms/disk-create.tsx index 37d1d47fa2..680115e268 100644 --- a/app/forms/disk-create.tsx +++ b/app/forms/disk-create.tsx @@ -8,7 +8,7 @@ import { filesize } from 'filesize' import { useMemo } from 'react' import { useController, useForm, type Control } from 'react-hook-form' -import { useNavigate, type NavigateFunction } from 'react-router-dom' +import { useNavigate, type NavigateFunction } from 'react-router' import { useApiMutation, diff --git a/app/forms/firewall-rules-create.tsx b/app/forms/firewall-rules-create.tsx index 01f14317b2..df1b74642e 100644 --- a/app/forms/firewall-rules-create.tsx +++ b/app/forms/firewall-rules-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, useParams, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, useParams, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/forms/firewall-rules-edit.tsx b/app/forms/firewall-rules-edit.tsx index b9bd16fa9d..89d4310a2f 100644 --- a/app/forms/firewall-rules-edit.tsx +++ b/app/forms/firewall-rules-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/forms/floating-ip-create.tsx b/app/forms/floating-ip-create.tsx index cab5b694e6..6ba7d385f3 100644 --- a/app/forms/floating-ip-create.tsx +++ b/app/forms/floating-ip-create.tsx @@ -8,7 +8,7 @@ import * as Accordion from '@radix-ui/react-accordion' import { useState } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, diff --git a/app/forms/floating-ip-edit.tsx b/app/forms/floating-ip-edit.tsx index 17469321e8..347cbc793e 100644 --- a/app/forms/floating-ip-edit.tsx +++ b/app/forms/floating-ip-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient, useApiMutation, usePrefetchedApiQuery } from '@oxide/api' diff --git a/app/forms/idp/create.tsx b/app/forms/idp/create.tsx index 63ce323b2c..806ff8cad1 100644 --- a/app/forms/idp/create.tsx +++ b/app/forms/idp/create.tsx @@ -7,7 +7,7 @@ */ import { useEffect, useState } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient } from '@oxide/api' diff --git a/app/forms/idp/edit.tsx b/app/forms/idp/edit.tsx index fa9e5a1491..5d4cf0f303 100644 --- a/app/forms/idp/edit.tsx +++ b/app/forms/idp/edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { Access16Icon } from '@oxide/design-system/icons/react' diff --git a/app/forms/image-edit.tsx b/app/forms/image-edit.tsx index 882bd93253..c74258a116 100644 --- a/app/forms/image-edit.tsx +++ b/app/forms/image-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, usePrefetchedApiQuery, type Image } from '@oxide/api' import { Images16Icon } from '@oxide/design-system/icons/react' diff --git a/app/forms/image-from-snapshot.tsx b/app/forms/image-from-snapshot.tsx index b6e7e2a55d..9be8aa0e59 100644 --- a/app/forms/image-from-snapshot.tsx +++ b/app/forms/image-from-snapshot.tsx @@ -7,7 +7,7 @@ */ import { filesize } from 'filesize' import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, diff --git a/app/forms/image-upload.tsx b/app/forms/image-upload.tsx index cd3ae824c7..0b85ba3361 100644 --- a/app/forms/image-upload.tsx +++ b/app/forms/image-upload.tsx @@ -12,7 +12,7 @@ import pMap from 'p-map' import pRetry from 'p-retry' import { useRef, useState } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, diff --git a/app/forms/instance-create.tsx b/app/forms/instance-create.tsx index 0b50ea38d5..108cf57c26 100644 --- a/app/forms/instance-create.tsx +++ b/app/forms/instance-create.tsx @@ -8,7 +8,7 @@ import * as Accordion from '@radix-ui/react-accordion' import { useEffect, useMemo, useState } from 'react' import { useController, useForm, useWatch, type Control } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import type { SetRequired } from 'type-fest' import { diff --git a/app/forms/ip-pool-create.tsx b/app/forms/ip-pool-create.tsx index 8afa803e9e..65fafaeca3 100644 --- a/app/forms/ip-pool-create.tsx +++ b/app/forms/ip-pool-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type IpPoolCreate } from '@oxide/api' diff --git a/app/forms/ip-pool-edit.tsx b/app/forms/ip-pool-edit.tsx index e917101996..3c92cd8c00 100644 --- a/app/forms/ip-pool-edit.tsx +++ b/app/forms/ip-pool-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/forms/ip-pool-range-add.tsx b/app/forms/ip-pool-range-add.tsx index 3183656262..2039cfaf2d 100644 --- a/app/forms/ip-pool-range-add.tsx +++ b/app/forms/ip-pool-range-add.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm, type FieldErrors } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type IpRange } from '@oxide/api' diff --git a/app/forms/project-create.tsx b/app/forms/project-create.tsx index 6616c641de..f7688b3f7d 100644 --- a/app/forms/project-create.tsx +++ b/app/forms/project-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type ProjectCreate } from '@oxide/api' diff --git a/app/forms/project-edit.tsx b/app/forms/project-edit.tsx index 45f05da9bc..a6ffd87b09 100644 --- a/app/forms/project-edit.tsx +++ b/app/forms/project-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient, useApiMutation, usePrefetchedQuery } from '@oxide/api' diff --git a/app/forms/silo-create.tsx b/app/forms/silo-create.tsx index ea6b82651e..474e640060 100644 --- a/app/forms/silo-create.tsx +++ b/app/forms/silo-create.tsx @@ -7,7 +7,7 @@ */ import { useEffect } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type SiloCreate } from '@oxide/api' diff --git a/app/forms/snapshot-create.tsx b/app/forms/snapshot-create.tsx index a886800709..7b15808547 100644 --- a/app/forms/snapshot-create.tsx +++ b/app/forms/snapshot-create.tsx @@ -7,7 +7,7 @@ */ import { useMemo } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { diskCan, diff --git a/app/forms/ssh-key-create.tsx b/app/forms/ssh-key-create.tsx index d3c0f68c95..0d328b681f 100644 --- a/app/forms/ssh-key-create.tsx +++ b/app/forms/ssh-key-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type SshKeyCreate } from '@oxide/api' diff --git a/app/forms/ssh-key-edit.tsx b/app/forms/ssh-key-edit.tsx index 609ec225ce..8790e929a9 100644 --- a/app/forms/ssh-key-edit.tsx +++ b/app/forms/ssh-key-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { Key16Icon } from '@oxide/design-system/icons/react' diff --git a/app/forms/subnet-create.tsx b/app/forms/subnet-create.tsx index e2bbb2666a..8728a2572c 100644 --- a/app/forms/subnet-create.tsx +++ b/app/forms/subnet-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type VpcSubnetCreate } from '@oxide/api' diff --git a/app/forms/subnet-edit.tsx b/app/forms/subnet-edit.tsx index 204767b38c..897c4c2302 100644 --- a/app/forms/subnet-edit.tsx +++ b/app/forms/subnet-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, diff --git a/app/forms/vpc-create.tsx b/app/forms/vpc-create.tsx index 43f8fa15a1..eda29adf6d 100644 --- a/app/forms/vpc-create.tsx +++ b/app/forms/vpc-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type VpcCreate } from '@oxide/api' diff --git a/app/forms/vpc-edit.tsx b/app/forms/vpc-edit.tsx index 473eedc649..248feec0b2 100644 --- a/app/forms/vpc-edit.tsx +++ b/app/forms/vpc-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient, useApiMutation, usePrefetchedQuery } from '@oxide/api' diff --git a/app/forms/vpc-router-create.tsx b/app/forms/vpc-router-create.tsx index 743685312c..ca14deb8ff 100644 --- a/app/forms/vpc-router-create.tsx +++ b/app/forms/vpc-router-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation, useApiQueryClient, type VpcRouterCreate } from '@oxide/api' diff --git a/app/forms/vpc-router-edit.tsx b/app/forms/vpc-router-edit.tsx index fb808b590a..37cbeb882d 100644 --- a/app/forms/vpc-router-edit.tsx +++ b/app/forms/vpc-router-edit.tsx @@ -10,7 +10,7 @@ import { useNavigate, type LoaderFunctionArgs, type NavigateFunction, -} from 'react-router-dom' +} from 'react-router' import { apiq, diff --git a/app/forms/vpc-router-route-create.tsx b/app/forms/vpc-router-route-create.tsx index 3f89dc8f7c..99c08bb75d 100644 --- a/app/forms/vpc-router-route-create.tsx +++ b/app/forms/vpc-router-route-create.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, useApiMutation, useApiQueryClient } from '@oxide/api' diff --git a/app/forms/vpc-router-route-edit.tsx b/app/forms/vpc-router-route-edit.tsx index 78a94f066c..e28211d3f8 100644 --- a/app/forms/vpc-router-route-edit.tsx +++ b/app/forms/vpc-router-route-edit.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useForm } from 'react-hook-form' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import * as R from 'remeda' import { diff --git a/app/hooks/use-crumbs.ts b/app/hooks/use-crumbs.ts index 519a614561..c8ecd6bc1b 100644 --- a/app/hooks/use-crumbs.ts +++ b/app/hooks/use-crumbs.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { useMatches, type Params, type UIMatch } from 'react-router-dom' +import { useMatches, type Params, type UIMatch } from 'react-router' import { invariant } from '~/util/invariant' diff --git a/app/hooks/use-is-active-path.ts b/app/hooks/use-is-active-path.ts index 6a94010632..712b8493e7 100644 --- a/app/hooks/use-is-active-path.ts +++ b/app/hooks/use-is-active-path.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { useLocation, useResolvedPath } from 'react-router-dom' +import { useLocation, useResolvedPath } from 'react-router' interface ActivePathOptions { to: string @@ -16,7 +16,7 @@ interface ActivePathOptions { * * This implementation is based on logic from React Router's NavLink component. * - * @see https://github.com/remix-run/react-router/blob/67f16e73603765158c63a27afb70d3a4b3e823d3/packages/react-router-dom/index.tsx#L448-L467 + * @see https://github.com/remix-run/react-router/blob/67f16e73603765158c63a27afb70d3a4b3e823d3/packages/react-router/index.tsx#L448-L467 * * @param to The path to check * @param options.end Ensure this path isn't matched as "active" when its descendant paths are matched. diff --git a/app/hooks/use-params.ts b/app/hooks/use-params.ts index e9bea342c3..a218615e51 100644 --- a/app/hooks/use-params.ts +++ b/app/hooks/use-params.ts @@ -7,7 +7,7 @@ */ import { hashKey } from '@tanstack/react-query' import { useMemo } from 'react' -import { useParams, type Params } from 'react-router-dom' +import { useParams, type Params } from 'react-router' import { invariant } from '~/util/invariant' diff --git a/app/hooks/use-quick-actions.tsx b/app/hooks/use-quick-actions.tsx index c249acacf0..303c4ec8b5 100644 --- a/app/hooks/use-quick-actions.tsx +++ b/app/hooks/use-quick-actions.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useEffect, useMemo } from 'react' -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { create } from 'zustand' import { useCurrentUser } from '~/layouts/AuthenticatedLayout' diff --git a/app/hooks/use-scroll-restoration.ts b/app/hooks/use-scroll-restoration.ts index 8dbd8a5848..66ede86457 100644 --- a/app/hooks/use-scroll-restoration.ts +++ b/app/hooks/use-scroll-restoration.ts @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useEffect } from 'react' -import { useLocation, useNavigation } from 'react-router-dom' +import { useLocation, useNavigation } from 'react-router' function getScrollPosition(key: string) { const pos = window.sessionStorage.getItem(key) diff --git a/app/layouts/AuthLayout.tsx b/app/layouts/AuthLayout.tsx index 0ea87d43dd..7a4f73b132 100644 --- a/app/layouts/AuthLayout.tsx +++ b/app/layouts/AuthLayout.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { OxideLogo } from '~/components/OxideLogo' diff --git a/app/layouts/AuthenticatedLayout.tsx b/app/layouts/AuthenticatedLayout.tsx index b4cbc16682..aec1399da2 100644 --- a/app/layouts/AuthenticatedLayout.tsx +++ b/app/layouts/AuthenticatedLayout.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { apiQueryClient, useApiQueryErrorsAllowed, usePrefetchedApiQuery } from '@oxide/api' diff --git a/app/layouts/LoginLayout.tsx b/app/layouts/LoginLayout.tsx index 0d30e8625b..a530dfcac8 100644 --- a/app/layouts/LoginLayout.tsx +++ b/app/layouts/LoginLayout.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import heroRackImg from '~/assets/oxide-hero-rack.webp' import { OxideLogo } from '~/components/OxideLogo' diff --git a/app/layouts/ProjectLayout.tsx b/app/layouts/ProjectLayout.tsx index 979ee2854a..4e365a8613 100644 --- a/app/layouts/ProjectLayout.tsx +++ b/app/layouts/ProjectLayout.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo, type ReactElement } from 'react' -import { useLocation, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useLocation, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient, usePrefetchedQuery } from '@oxide/api' import { diff --git a/app/layouts/RootLayout.tsx b/app/layouts/RootLayout.tsx index a7029149b6..d71348e0fe 100644 --- a/app/layouts/RootLayout.tsx +++ b/app/layouts/RootLayout.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useEffect, useRef } from 'react' -import { Outlet, useNavigation } from 'react-router-dom' +import { Outlet, useNavigation } from 'react-router' import { MswBanner } from '~/components/MswBanner' import { ToastStack } from '~/components/ToastStack' diff --git a/app/layouts/SettingsLayout.tsx b/app/layouts/SettingsLayout.tsx index 9b860c9bcb..d860ca26b4 100644 --- a/app/layouts/SettingsLayout.tsx +++ b/app/layouts/SettingsLayout.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { Folder16Icon, Key16Icon, Profile16Icon } from '@oxide/design-system/icons/react' diff --git a/app/layouts/SiloLayout.tsx b/app/layouts/SiloLayout.tsx index 9f9f3b550d..0a89115eac 100644 --- a/app/layouts/SiloLayout.tsx +++ b/app/layouts/SiloLayout.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { Access16Icon, diff --git a/app/layouts/SystemLayout.tsx b/app/layouts/SystemLayout.tsx index e58cb5cab8..65f61164f1 100644 --- a/app/layouts/SystemLayout.tsx +++ b/app/layouts/SystemLayout.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { apiQueryClient } from '@oxide/api' import { diff --git a/app/layouts/helpers.tsx b/app/layouts/helpers.tsx index d4769685d7..ae08a2e69d 100644 --- a/app/layouts/helpers.tsx +++ b/app/layouts/helpers.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useRef } from 'react' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { PageActionsTarget } from '~/components/PageActions' import { Pagination } from '~/components/Pagination' diff --git a/app/main.tsx b/app/main.tsx index 2a822ca65f..1db612059e 100644 --- a/app/main.tsx +++ b/app/main.tsx @@ -9,7 +9,8 @@ import { QueryClientProvider } from '@tanstack/react-query' // import { ReactQueryDevtools } from '@tanstack/react-query-devtools' import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' -import { createBrowserRouter, RouterProvider } from 'react-router-dom' +import { createBrowserRouter } from 'react-router' +import { RouterProvider } from 'react-router/dom' import { queryClient } from '@oxide/api' @@ -40,16 +41,7 @@ function render() { // matching. I asked about this on Discord and they said it's intentional. // This means RR is best thought of as an external store that runs // independently of the React render lifecycle. - const router = createBrowserRouter(routes, { - // https://reactrouter.com/en/6.24.0/upgrading/future - future: { - v7_fetcherPersist: true, - v7_normalizeFormMethod: true, - v7_partialHydration: true, - v7_relativeSplatPath: true, - v7_skipActionErrorRevalidation: true, - }, - }) + const router = createBrowserRouter(routes) root.render( @@ -58,13 +50,7 @@ function render() { - + {/* */} diff --git a/app/pages/DeviceAuthVerifyPage.tsx b/app/pages/DeviceAuthVerifyPage.tsx index 7ed82b97e6..6638deb2f4 100644 --- a/app/pages/DeviceAuthVerifyPage.tsx +++ b/app/pages/DeviceAuthVerifyPage.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useState } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { useApiMutation } from '@oxide/api' import { Warning12Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/LoginPage.tsx b/app/pages/LoginPage.tsx index 535e245903..3c08591371 100644 --- a/app/pages/LoginPage.tsx +++ b/app/pages/LoginPage.tsx @@ -7,7 +7,7 @@ */ import { useEffect } from 'react' import { useForm } from 'react-hook-form' -import { useNavigate, useSearchParams } from 'react-router-dom' +import { useNavigate, useSearchParams } from 'react-router' import { useApiMutation, type UsernamePasswordCredentials } from '@oxide/api' diff --git a/app/pages/LoginPageSaml.tsx b/app/pages/LoginPageSaml.tsx index d3c0a3bb30..6228788460 100644 --- a/app/pages/LoginPageSaml.tsx +++ b/app/pages/LoginPageSaml.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import cn from 'classnames' -import { useSearchParams } from 'react-router-dom' +import { useSearchParams } from 'react-router' import { useIdpSelector } from '~/hooks/use-params' import { buttonStyle } from '~/ui/lib/Button' diff --git a/app/pages/ProjectsPage.tsx b/app/pages/ProjectsPage.tsx index 3357a15744..9359e471f2 100644 --- a/app/pages/ProjectsPage.tsx +++ b/app/pages/ProjectsPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate } from 'react-router-dom' +import { Outlet, useNavigate } from 'react-router' import { apiq, getListQFn, queryClient, useApiMutation, type Project } from '@oxide/api' import { Folder16Icon, Folder24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/lookups.ts b/app/pages/lookups.ts index 9fa98cd2e3..dc042a586e 100644 --- a/app/pages/lookups.ts +++ b/app/pages/lookups.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { redirect, type LoaderFunctionArgs } from 'react-router-dom' +import { redirect, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient } from '@oxide/api' diff --git a/app/pages/project/access/ProjectAccessPage.tsx b/app/pages/project/access/ProjectAccessPage.tsx index e68d5497b7..0468d0ebfd 100644 --- a/app/pages/project/access/ProjectAccessPage.tsx +++ b/app/pages/project/access/ProjectAccessPage.tsx @@ -8,7 +8,7 @@ import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' import { useMemo, useState } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' +import type { LoaderFunctionArgs } from 'react-router' import * as R from 'remeda' import { diff --git a/app/pages/project/disks/DisksPage.tsx b/app/pages/project/disks/DisksPage.tsx index c1e480e7bb..7b51b36118 100644 --- a/app/pages/project/disks/DisksPage.tsx +++ b/app/pages/project/disks/DisksPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback } from 'react' -import { Outlet, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, type LoaderFunctionArgs } from 'react-router' import { apiq, diff --git a/app/pages/project/floating-ips/FloatingIpsPage.tsx b/app/pages/project/floating-ips/FloatingIpsPage.tsx index 39053df5ef..02c14ff2e1 100644 --- a/app/pages/project/floating-ips/FloatingIpsPage.tsx +++ b/app/pages/project/floating-ips/FloatingIpsPage.tsx @@ -8,7 +8,7 @@ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useState } from 'react' import { useForm } from 'react-hook-form' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, diff --git a/app/pages/project/images/ImagesPage.tsx b/app/pages/project/images/ImagesPage.tsx index 0f461f328c..fb450c96e9 100644 --- a/app/pages/project/images/ImagesPage.tsx +++ b/app/pages/project/images/ImagesPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo, useState } from 'react' -import { Outlet, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, type LoaderFunctionArgs } from 'react-router' import { getListQFn, queryClient, useApiMutation, type Image } from '@oxide/api' import { Images16Icon, Images24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/project/instances/InstancesPage.tsx b/app/pages/project/instances/InstancesPage.tsx index ddab3938e0..c527b507a7 100644 --- a/app/pages/project/instances/InstancesPage.tsx +++ b/app/pages/project/instances/InstancesPage.tsx @@ -9,7 +9,7 @@ import { type UseQueryOptions } from '@tanstack/react-query' import { createColumnHelper } from '@tanstack/react-table' import { filesize } from 'filesize' import { useMemo, useRef, useState } from 'react' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/instances/actions.tsx b/app/pages/project/instances/actions.tsx index 488ea52516..748a46eb3f 100644 --- a/app/pages/project/instances/actions.tsx +++ b/app/pages/project/instances/actions.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useCallback } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { instanceCan, useApiMutation, type Instance } from '@oxide/api' diff --git a/app/pages/project/instances/instance/InstancePage.tsx b/app/pages/project/instances/instance/InstancePage.tsx index 46d1397bda..04fe93cdff 100644 --- a/app/pages/project/instances/instance/InstancePage.tsx +++ b/app/pages/project/instances/instance/InstancePage.tsx @@ -8,7 +8,7 @@ import { filesize } from 'filesize' import { useId, useMemo, useState } from 'react' import { useForm } from 'react-hook-form' -import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/instances/instance/SerialConsolePage.tsx b/app/pages/project/instances/instance/SerialConsolePage.tsx index 08940ef6a5..323f87d787 100644 --- a/app/pages/project/instances/instance/SerialConsolePage.tsx +++ b/app/pages/project/instances/instance/SerialConsolePage.tsx @@ -7,7 +7,7 @@ */ import cn from 'classnames' import { lazy, Suspense, useEffect, useRef, useState } from 'react' -import { Link, type LoaderFunctionArgs } from 'react-router-dom' +import { Link, type LoaderFunctionArgs } from 'react-router' import { api, diff --git a/app/pages/project/instances/instance/tabs/ConnectTab.tsx b/app/pages/project/instances/instance/tabs/ConnectTab.tsx index b57d924182..aca98be654 100644 --- a/app/pages/project/instances/instance/tabs/ConnectTab.tsx +++ b/app/pages/project/instances/instance/tabs/ConnectTab.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ -import { Link, type LoaderFunctionArgs } from 'react-router-dom' +import { Link, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, usePrefetchedApiQuery } from '~/api' import { EquivalentCliCommand } from '~/components/EquivalentCliCommand' diff --git a/app/pages/project/instances/instance/tabs/MetricsTab.tsx b/app/pages/project/instances/instance/tabs/MetricsTab.tsx index 35120a1d3e..0e2304fda7 100644 --- a/app/pages/project/instances/instance/tabs/MetricsTab.tsx +++ b/app/pages/project/instances/instance/tabs/MetricsTab.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import React, { Suspense, useMemo, useState } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' +import type { LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx b/app/pages/project/instances/instance/tabs/NetworkingTab.tsx index c6fc3796ea..43e99b472f 100644 --- a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx +++ b/app/pages/project/instances/instance/tabs/NetworkingTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' import { useCallback, useMemo, useState } from 'react' -import { type LoaderFunctionArgs } from 'react-router-dom' +import { type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/instances/instance/tabs/StorageTab.tsx b/app/pages/project/instances/instance/tabs/StorageTab.tsx index 3b6ccee25a..b53c167080 100644 --- a/app/pages/project/instances/instance/tabs/StorageTab.tsx +++ b/app/pages/project/instances/instance/tabs/StorageTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' import { useCallback, useMemo, useState } from 'react' -import type { LoaderFunctionArgs } from 'react-router-dom' +import type { LoaderFunctionArgs } from 'react-router' import * as R from 'remeda' import { diff --git a/app/pages/project/snapshots/SnapshotsPage.tsx b/app/pages/project/snapshots/SnapshotsPage.tsx index 6fec0a23fd..f72f21ff33 100644 --- a/app/pages/project/snapshots/SnapshotsPage.tsx +++ b/app/pages/project/snapshots/SnapshotsPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/vpcs/RouterPage.tsx b/app/pages/project/vpcs/RouterPage.tsx index 54304780eb..4dfe34972f 100644 --- a/app/pages/project/vpcs/RouterPage.tsx +++ b/app/pages/project/vpcs/RouterPage.tsx @@ -8,7 +8,7 @@ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { Networking16Icon, Networking24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/project/vpcs/VpcPage/VpcPage.tsx b/app/pages/project/vpcs/VpcPage/VpcPage.tsx index 87993db96c..8c34978ace 100644 --- a/app/pages/project/vpcs/VpcPage/VpcPage.tsx +++ b/app/pages/project/vpcs/VpcPage/VpcPage.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { useMemo } from 'react' -import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, queryClient, useApiMutation, usePrefetchedQuery } from '@oxide/api' import { Networking24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx index b4cbe0d2e2..7528344d44 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table' import { useMemo } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import * as R from 'remeda' import { diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcGatewaysTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcGatewaysTab.tsx index 0fd50179df..c99ffa9c0d 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcGatewaysTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcGatewaysTab.tsx @@ -9,7 +9,7 @@ import { useQuery } from '@tanstack/react-query' import { createColumnHelper } from '@tanstack/react-table' import { useMemo } from 'react' -import { Outlet, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, type LoaderFunctionArgs } from 'react-router' import { apiq, getListQFn, queryClient, type InternetGateway } from '~/api' import { getVpcSelector, useVpcSelector } from '~/hooks/use-params' diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx index a7486521ee..62288118af 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx index f3111bb605..b5ea965998 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { getListQFn, diff --git a/app/pages/project/vpcs/VpcsPage.tsx b/app/pages/project/vpcs/VpcsPage.tsx index 6f23956f65..72406192f2 100644 --- a/app/pages/project/vpcs/VpcsPage.tsx +++ b/app/pages/project/vpcs/VpcsPage.tsx @@ -8,7 +8,7 @@ import { useQuery } from '@tanstack/react-query' import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, getListQFn, queryClient, useApiMutation, type Vpc } from '@oxide/api' import { Networking16Icon, Networking24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/project/vpcs/internet-gateway-edit.tsx b/app/pages/project/vpcs/internet-gateway-edit.tsx index 7a72d8240c..40bd054cd6 100644 --- a/app/pages/project/vpcs/internet-gateway-edit.tsx +++ b/app/pages/project/vpcs/internet-gateway-edit.tsx @@ -8,7 +8,7 @@ import { useQuery } from '@tanstack/react-query' import { useForm } from 'react-hook-form' -import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router' import { Gateway16Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/settings/SSHKeysPage.tsx b/app/pages/settings/SSHKeysPage.tsx index f52b5499c6..b3a89545c1 100644 --- a/app/pages/settings/SSHKeysPage.tsx +++ b/app/pages/settings/SSHKeysPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Link, Outlet, useNavigate } from 'react-router-dom' +import { Link, Outlet, useNavigate } from 'react-router' import { getListQFn, diff --git a/app/pages/system/SiloImagesPage.tsx b/app/pages/system/SiloImagesPage.tsx index beb0e7743b..977131244a 100644 --- a/app/pages/system/SiloImagesPage.tsx +++ b/app/pages/system/SiloImagesPage.tsx @@ -8,7 +8,7 @@ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo, useState } from 'react' import { useForm, type FieldValues } from 'react-hook-form' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { getListQFn, diff --git a/app/pages/system/inventory/sled/SledInstancesTab.tsx b/app/pages/system/inventory/sled/SledInstancesTab.tsx index 290cc86feb..59c80b724d 100644 --- a/app/pages/system/inventory/sled/SledInstancesTab.tsx +++ b/app/pages/system/inventory/sled/SledInstancesTab.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { createColumnHelper } from '@tanstack/react-table' -import type { LoaderFunctionArgs } from 'react-router-dom' +import type { LoaderFunctionArgs } from 'react-router' import * as R from 'remeda' import { getListQFn, queryClient, type SledInstance } from '@oxide/api' diff --git a/app/pages/system/inventory/sled/SledPage.tsx b/app/pages/system/inventory/sled/SledPage.tsx index 80240e4fc6..4119b67e3c 100644 --- a/app/pages/system/inventory/sled/SledPage.tsx +++ b/app/pages/system/inventory/sled/SledPage.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import { filesize } from 'filesize' -import type { LoaderFunctionArgs } from 'react-router-dom' +import type { LoaderFunctionArgs } from 'react-router' import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api' import { Servers24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/system/networking/IpPoolPage.tsx b/app/pages/system/networking/IpPoolPage.tsx index 2b01977ede..dd05e1855f 100644 --- a/app/pages/system/networking/IpPoolPage.tsx +++ b/app/pages/system/networking/IpPoolPage.tsx @@ -9,7 +9,7 @@ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo, useState } from 'react' import { useForm } from 'react-hook-form' -import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router-dom' +import { Outlet, useNavigate, type LoaderFunctionArgs } from 'react-router' import { apiq, diff --git a/app/pages/system/networking/IpPoolsPage.tsx b/app/pages/system/networking/IpPoolsPage.tsx index a90c3bd268..f112eb3e49 100644 --- a/app/pages/system/networking/IpPoolsPage.tsx +++ b/app/pages/system/networking/IpPoolsPage.tsx @@ -8,7 +8,7 @@ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate } from 'react-router-dom' +import { Outlet, useNavigate } from 'react-router' import { apiQueryClient, diff --git a/app/pages/system/silos/SiloIdpsTab.tsx b/app/pages/system/silos/SiloIdpsTab.tsx index 2bd2e3bdc8..d457c66d71 100644 --- a/app/pages/system/silos/SiloIdpsTab.tsx +++ b/app/pages/system/silos/SiloIdpsTab.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useMemo } from 'react' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { Cloud24Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/system/silos/SiloPage.tsx b/app/pages/system/silos/SiloPage.tsx index 558df43dce..5a77496248 100644 --- a/app/pages/system/silos/SiloPage.tsx +++ b/app/pages/system/silos/SiloPage.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { type LoaderFunctionArgs } from 'react-router-dom' +import { type LoaderFunctionArgs } from 'react-router' import { apiQueryClient, queryClient, usePrefetchedApiQuery } from '@oxide/api' import { Cloud16Icon, Cloud24Icon, NextArrow12Icon } from '@oxide/design-system/icons/react' diff --git a/app/pages/system/silos/SilosPage.tsx b/app/pages/system/silos/SilosPage.tsx index 4cd655b264..62f2dbaa0b 100644 --- a/app/pages/system/silos/SilosPage.tsx +++ b/app/pages/system/silos/SilosPage.tsx @@ -7,7 +7,7 @@ */ import { createColumnHelper } from '@tanstack/react-table' import { useCallback, useMemo } from 'react' -import { Outlet, useNavigate } from 'react-router-dom' +import { Outlet, useNavigate } from 'react-router' import { getListQFn, diff --git a/app/routes.tsx b/app/routes.tsx index 95915564b7..780e603b5c 100644 --- a/app/routes.tsx +++ b/app/routes.tsx @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { createRoutesFromElements, Navigate, Route } from 'react-router-dom' +import { createRoutesFromElements, Navigate, Route } from 'react-router' import { RouterDataErrorBoundary } from './components/ErrorBoundary' import { NotFound } from './components/ErrorPage' diff --git a/app/table/cells/LinkCell.tsx b/app/table/cells/LinkCell.tsx index 5e2b74227c..f28d8f7517 100644 --- a/app/table/cells/LinkCell.tsx +++ b/app/table/cells/LinkCell.tsx @@ -6,7 +6,7 @@ * Copyright Oxide Computer Company */ import type { CellContext } from '@tanstack/react-table' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' import { classed } from '~/util/classed' diff --git a/app/ui/lib/CreateButton.tsx b/app/ui/lib/CreateButton.tsx index 7f6e9431cf..e8b9dd9b94 100644 --- a/app/ui/lib/CreateButton.tsx +++ b/app/ui/lib/CreateButton.tsx @@ -7,7 +7,7 @@ */ import cn from 'classnames' -import { Link, type LinkProps } from 'react-router-dom' +import { Link, type LinkProps } from 'react-router' import { AddRoundel12Icon } from '@oxide/design-system/icons/react' diff --git a/app/ui/lib/DropdownMenu.tsx b/app/ui/lib/DropdownMenu.tsx index d37d46afda..a6cf724d3c 100644 --- a/app/ui/lib/DropdownMenu.tsx +++ b/app/ui/lib/DropdownMenu.tsx @@ -15,7 +15,7 @@ import { } from '@headlessui/react' import cn from 'classnames' import { forwardRef, type ForwardedRef, type ReactNode } from 'react' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' export const Root = Menu diff --git a/app/ui/lib/EmptyMessage.tsx b/app/ui/lib/EmptyMessage.tsx index dcc7f64897..5673cc799a 100644 --- a/app/ui/lib/EmptyMessage.tsx +++ b/app/ui/lib/EmptyMessage.tsx @@ -7,7 +7,7 @@ */ import cn from 'classnames' import type { ReactElement, ReactNode } from 'react' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' import { classed } from '~/util/classed' diff --git a/app/ui/lib/Message.tsx b/app/ui/lib/Message.tsx index 493990a7a0..d28641410f 100644 --- a/app/ui/lib/Message.tsx +++ b/app/ui/lib/Message.tsx @@ -7,7 +7,7 @@ */ import cn from 'classnames' import type { ReactElement, ReactNode } from 'react' -import { Link, type To } from 'react-router-dom' +import { Link, type To } from 'react-router' import { Error12Icon, diff --git a/app/ui/lib/Toast.tsx b/app/ui/lib/Toast.tsx index 05d3cd8dbd..62ea00a43a 100644 --- a/app/ui/lib/Toast.tsx +++ b/app/ui/lib/Toast.tsx @@ -8,7 +8,7 @@ import { announce } from '@react-aria/live-announcer' import cn from 'classnames' import { useEffect, type ReactElement, type ReactNode } from 'react' -import { Link, type To } from 'react-router-dom' +import { Link, type To } from 'react-router' import { Close12Icon, diff --git a/app/util/path-builder.spec.ts b/app/util/path-builder.spec.ts index 4464c4bd7a..e81423bb4f 100644 --- a/app/util/path-builder.spec.ts +++ b/app/util/path-builder.spec.ts @@ -5,7 +5,7 @@ * * Copyright Oxide Computer Company */ -import { matchRoutes } from 'react-router-dom' +import { matchRoutes } from 'react-router' import * as R from 'remeda' import { expect, test } from 'vitest'