Get rid of useless RHF useForm wrapper (#2426)

change all useForm imports to real RHF one
oxidecomputer · Sep 10, 2024 · a8fcdab · a8fcdab
1 parent 8ecb36a
commit a8fcdab
Show file tree

Hide file tree

Showing 40 changed files with 73 additions and 69 deletions.
diff --git a/app/components/form/fields/TlsCertsField.tsx b/app/components/form/fields/TlsCertsField.tsx
@@ -6,13 +6,12 @@
  * Copyright Oxide Computer Company
  */
 import { useState } from 'react'
-import { useController, type Control } from 'react-hook-form'
+import { useController, useForm, type Control } from 'react-hook-form'
 import type { Merge } from 'type-fest'
 
 import type { CertificateCreate } from '@oxide/api'
 
 import type { SiloCreateFormValues } from '~/forms/silo-create'
-import { useForm } from '~/hooks'
 import { Button } from '~/ui/lib/Button'
 import { FieldLabel } from '~/ui/lib/FieldLabel'
 import * as MiniTable from '~/ui/lib/MiniTable'

diff --git a/app/forms/disk-attach.tsx b/app/forms/disk-attach.tsx
@@ -5,11 +5,13 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
+
 import { useApiQuery, type ApiError } from '@oxide/api'
 
 import { ComboboxField } from '~/components/form/fields/ComboboxField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 
 const defaultValues = { name: '' }
 

diff --git a/app/forms/disk-create.tsx b/app/forms/disk-create.tsx
@@ -7,7 +7,7 @@
  */
 import { filesize } from 'filesize'
 import { useMemo } from 'react'
-import { useController, type Control } from 'react-hook-form'
+import { useController, useForm, type Control } from 'react-hook-form'
 import { useNavigate, type NavigateFunction } from 'react-router-dom'
 
 import {
@@ -28,7 +28,7 @@ import { ListboxField } from '~/components/form/fields/ListboxField'
 import { NameField } from '~/components/form/fields/NameField'
 import { RadioField } from '~/components/form/fields/RadioField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { FormDivider } from '~/ui/lib/Divider'
 import { FieldLabel } from '~/ui/lib/FieldLabel'

diff --git a/app/forms/firewall-rules-common.tsx b/app/forms/firewall-rules-common.tsx
@@ -6,7 +6,12 @@
  * Copyright Oxide Computer Company
  */
 
-import { useController, type Control, type ControllerRenderProps } from 'react-hook-form'
+import {
+  useController,
+  useForm,
+  type Control,
+  type ControllerRenderProps,
+} from 'react-hook-form'
 
 import {
   usePrefetchedApiQuery,
@@ -27,7 +32,6 @@ import { NumberField } from '~/components/form/fields/NumberField'
 import { RadioField } from '~/components/form/fields/RadioField'
 import { TextField, TextFieldInner } from '~/components/form/fields/TextField'
 import { useVpcSelector } from '~/hooks'
-import { useForm } from '~/hooks/use-form'
 import { Badge } from '~/ui/lib/Badge'
 import { Button } from '~/ui/lib/Button'
 import { FormDivider } from '~/ui/lib/Divider'

diff --git a/app/forms/firewall-rules-create.tsx b/app/forms/firewall-rules-create.tsx
@@ -6,6 +6,7 @@
  * Copyright Oxide Computer Company
  */
 import { useMemo } from 'react'
+import { useForm } from 'react-hook-form'
 import { useNavigate, useParams, type LoaderFunctionArgs } from 'react-router-dom'
 import * as R from 'remeda'
 
@@ -19,7 +20,7 @@ import {
 } from '@oxide/api'
 
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { getVpcSelector, useForm, useVpcSelector } from '~/hooks'
+import { getVpcSelector, useVpcSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/firewall-rules-edit.tsx b/app/forms/firewall-rules-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import {
@@ -17,12 +18,7 @@ import {
 
 import { trigger404 } from '~/components/ErrorBoundary'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import {
-  getFirewallRuleSelector,
-  useFirewallRuleSelector,
-  useForm,
-  useVpcSelector,
-} from '~/hooks'
+import { getFirewallRuleSelector, useFirewallRuleSelector, useVpcSelector } from '~/hooks'
 import { invariant } from '~/util/invariant'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/floating-ip-create.tsx b/app/forms/floating-ip-create.tsx
@@ -7,6 +7,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 {
@@ -22,7 +23,7 @@ import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { ListboxField } from '~/components/form/fields/ListboxField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { Badge } from '~/ui/lib/Badge'
 import { Message } from '~/ui/lib/Message'

diff --git a/app/forms/floating-ip-edit.tsx b/app/forms/floating-ip-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import {
@@ -18,7 +19,7 @@ import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
 import { addToast } from '~/stores/toast'
-import { getFloatingIpSelector, useFloatingIpSelector, useForm } from 'app/hooks'
+import { getFloatingIpSelector, useFloatingIpSelector } from 'app/hooks'
 import { pb } from 'app/util/path-builder'
 
 EditFloatingIpSideModalForm.loader = async ({ params }: LoaderFunctionArgs) => {

diff --git a/app/forms/idp/create.tsx b/app/forms/idp/create.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate } from 'react-router-dom'
 
 import { useApiMutation, useApiQueryClient } from '@oxide/api'
@@ -14,7 +15,7 @@ import { FileField } from '~/components/form/fields/FileField'
 import { NameField } from '~/components/form/fields/NameField'
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useSiloSelector } from '~/hooks'
+import { useSiloSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { readBlobAsBase64 } from '~/util/file'
 import { pb } from '~/util/path-builder'

diff --git a/app/forms/idp/edit.tsx b/app/forms/idp/edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import { apiQueryClient, usePrefetchedApiQuery } from '@oxide/api'
@@ -14,7 +15,7 @@ import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { getIdpSelector, useForm, useIdpSelector } from '~/hooks'
+import { getIdpSelector, useIdpSelector } from '~/hooks'
 import { DateTime } from '~/ui/lib/DateTime'
 import { PropertiesTable } from '~/ui/lib/PropertiesTable'
 import { ResourceLabel } from '~/ui/lib/SideModal'

diff --git a/app/forms/image-edit.tsx b/app/forms/image-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import { apiQueryClient, usePrefetchedApiQuery, type Image } from '@oxide/api'
@@ -17,7 +18,6 @@ import { SideModalForm } from '~/components/form/SideModalForm'
 import {
   getProjectImageSelector,
   getSiloImageSelector,
-  useForm,
   useProjectImageSelector,
   useSiloImageSelector,
 } from '~/hooks'

diff --git a/app/forms/image-from-snapshot.tsx b/app/forms/image-from-snapshot.tsx
@@ -6,6 +6,7 @@
  * Copyright Oxide Computer Company
  */
 import { filesize } from 'filesize'
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import {
@@ -20,7 +21,7 @@ import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { getProjectSnapshotSelector, useForm, useProjectSnapshotSelector } from '~/hooks'
+import { getProjectSnapshotSelector, useProjectSnapshotSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { PropertiesTable } from '~/ui/lib/PropertiesTable'
 import { pb } from '~/util/path-builder'

diff --git a/app/forms/image-upload.tsx b/app/forms/image-upload.tsx
@@ -11,6 +11,7 @@ import { filesize } from 'filesize'
 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 {
@@ -34,7 +35,7 @@ import { NameField } from '~/components/form/fields/NameField'
 import { RadioField } from '~/components/form/fields/RadioField'
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 import { Message } from '~/ui/lib/Message'
 import { Modal } from '~/ui/lib/Modal'
 import { Progress } from '~/ui/lib/Progress'

diff --git a/app/forms/instance-create.tsx b/app/forms/instance-create.tsx
@@ -7,7 +7,7 @@
  */
 import * as Accordion from '@radix-ui/react-accordion'
 import { useEffect, useMemo, useState } from 'react'
-import { useController, useWatch, type Control } from 'react-hook-form'
+import { useController, useForm, useWatch, type Control } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 import type { SetRequired } from 'type-fest'
 
@@ -55,7 +55,7 @@ import { TextField } from '~/components/form/fields/TextField'
 import { Form } from '~/components/form/Form'
 import { FullPageForm } from '~/components/form/FullPageForm'
 import { HL } from '~/components/HL'
-import { getProjectSelector, useForm, useProjectSelector } from '~/hooks'
+import { getProjectSelector, useProjectSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { Badge } from '~/ui/lib/Badge'
 import { Button } from '~/ui/lib/Button'

diff --git a/app/forms/ip-pool-create.tsx b/app/forms/ip-pool-create.tsx
@@ -5,14 +5,14 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate } from 'react-router-dom'
 
 import { useApiMutation, useApiQueryClient, type IpPoolCreate } from '@oxide/api'
 
 import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/ip-pool-edit.tsx b/app/forms/ip-pool-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import {
@@ -17,7 +18,7 @@ import {
 import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { getIpPoolSelector, useForm, useIpPoolSelector } from '~/hooks'
+import { getIpPoolSelector, useIpPoolSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/ip-pool-range-add.tsx b/app/forms/ip-pool-range-add.tsx
@@ -5,14 +5,14 @@
  *
  * Copyright Oxide Computer Company
  */
-import { type FieldErrors } from 'react-hook-form'
+import { useForm, type FieldErrors } from 'react-hook-form'
 import { useNavigate } from 'react-router-dom'
 
 import { useApiMutation, useApiQueryClient, type IpRange } from '@oxide/api'
 
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useIpPoolSelector } from '~/hooks'
+import { useIpPoolSelector } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { Message } from '~/ui/lib/Message'
 import { pb } from '~/util/path-builder'

diff --git a/app/forms/network-interface-create.tsx b/app/forms/network-interface-create.tsx
@@ -6,6 +6,7 @@
  * Copyright Oxide Computer Company
  */
 import { useMemo } from 'react'
+import { useForm } from 'react-hook-form'
 
 import { useApiQuery, type ApiError, type InstanceNetworkInterfaceCreate } from '@oxide/api'
 
@@ -15,7 +16,7 @@ import { NameField } from '~/components/form/fields/NameField'
 import { SubnetListbox } from '~/components/form/fields/SubnetListbox'
 import { TextField } from '~/components/form/fields/TextField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 import { FormDivider } from '~/ui/lib/Divider'
 
 const defaultValues: InstanceNetworkInterfaceCreate = {

diff --git a/app/forms/network-interface-edit.tsx b/app/forms/network-interface-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import * as R from 'remeda'
 
 import {
@@ -17,7 +18,7 @@ import {
 import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useInstanceSelector } from '~/hooks'
+import { useInstanceSelector } from '~/hooks'
 
 type EditNetworkInterfaceFormProps = {
   editing: InstanceNetworkInterface

diff --git a/app/forms/project-access.tsx b/app/forms/project-access.tsx
@@ -5,6 +5,8 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
+
 import {
   updateRole,
   useActorsNotInPolicy,
@@ -14,7 +16,7 @@ import {
 
 import { ListboxField } from '~/components/form/fields/ListboxField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm, useProjectSelector } from '~/hooks'
+import { useProjectSelector } from '~/hooks'
 
 import {
   actorToItem,

diff --git a/app/forms/project-create.tsx b/app/forms/project-create.tsx
@@ -5,14 +5,14 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate } from 'react-router-dom'
 
 import { useApiMutation, useApiQueryClient, type ProjectCreate } from '@oxide/api'
 
 import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/project-edit.tsx b/app/forms/project-edit.tsx
@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
 import { useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import {
@@ -17,7 +18,6 @@ import {
 import { DescriptionField } from '~/components/form/fields/DescriptionField'
 import { NameField } from '~/components/form/fields/NameField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm } from '~/hooks'
 import { addToast } from '~/stores/toast'
 import { pb } from '~/util/path-builder'
 

diff --git a/app/forms/silo-access.tsx b/app/forms/silo-access.tsx
@@ -5,6 +5,8 @@
  *
  * Copyright Oxide Computer Company
  */
+import { useForm } from 'react-hook-form'
+
 import {
   updateRole,
   useActorsNotInPolicy,
@@ -14,7 +16,6 @@ import {
 
 import { ListboxField } from '~/components/form/fields/ListboxField'
 import { SideModalForm } from '~/components/form/SideModalForm'
-import { useForm } from '~/hooks'
 
 import {
   actorToItem,