tooling: Fix HMR on firewall rules form

app/forms/firewall-rules-create.tsx

@@ -21,7 +21,6 @@ import {
   type VpcFirewallRule,
   type VpcFirewallRuleHostFilter,
   type VpcFirewallRuleTarget,
-  type VpcFirewallRuleUpdate,
 } from '@oxide/api'
 
 import { CheckboxField } from '~/components/form/fields/CheckboxField'
@@ -44,35 +43,7 @@ import { KEYS } from '~/ui/util/keys'
 import { links } from '~/util/links'
 import { pb } from '~/util/path-builder'
 
-export type FirewallRuleValues = {
-  enabled: boolean
-  priority: number
-  name: string
-  description: string
-  action: VpcFirewallRule['action']
-  direction: VpcFirewallRule['direction']
-
-  protocols: NonNullable<VpcFirewallRule['filters']['protocols']>
-
-  ports: NonNullable<VpcFirewallRule['filters']['ports']>
-  hosts: NonNullable<VpcFirewallRule['filters']['hosts']>
-  targets: VpcFirewallRuleTarget[]
-}
-
-export const valuesToRuleUpdate = (values: FirewallRuleValues): VpcFirewallRuleUpdate => ({
-  name: values.name,
-  status: values.enabled ? 'enabled' : 'disabled',
-  action: values.action,
-  description: values.description,
-  direction: values.direction,
-  filters: {
-    hosts: values.hosts,
-    ports: values.ports,
-    protocols: values.protocols,
-  },
-  priority: values.priority,
-  targets: values.targets,
-})
+import { valuesToRuleUpdate, type FirewallRuleValues } from './firewall-rules-util'
 
 /** convert in the opposite direction for when we're creating from existing rule */
 const ruleToValues = (rule: VpcFirewallRule): FirewallRuleValues => ({

app/forms/firewall-rules-edit.tsx

@@ -26,11 +26,8 @@ import {
 import { invariant } from '~/util/invariant'
 import { pb } from '~/util/path-builder'
 
-import {
-  CommonFields,
-  valuesToRuleUpdate,
-  type FirewallRuleValues,
-} from './firewall-rules-create'
+import { CommonFields } from './firewall-rules-create'
+import { valuesToRuleUpdate, type FirewallRuleValues } from './firewall-rules-util'
 
 EditFirewallRuleForm.loader = async ({ params }: LoaderFunctionArgs) => {
   const { project, vpc, rule } = getFirewallRuleSelector(params)

app/forms/firewall-rules-util.ts

@@ -0,0 +1,38 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, you can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * Copyright Oxide Computer Company
+ */
+import type { VpcFirewallRule, VpcFirewallRuleTarget, VpcFirewallRuleUpdate } from '~/api'
+
+export type FirewallRuleValues = {
+  enabled: boolean
+  priority: number
+  name: string
+  description: string
+  action: VpcFirewallRule['action']
+  direction: VpcFirewallRule['direction']
+
+  protocols: NonNullable<VpcFirewallRule['filters']['protocols']>
+
+  ports: NonNullable<VpcFirewallRule['filters']['ports']>
+  hosts: NonNullable<VpcFirewallRule['filters']['hosts']>
+  targets: VpcFirewallRuleTarget[]
+}
+
+export const valuesToRuleUpdate = (values: FirewallRuleValues): VpcFirewallRuleUpdate => ({
+  name: values.name,
+  status: values.enabled ? 'enabled' : 'disabled',
+  action: values.action,
+  description: values.description,
+  direction: values.direction,
+  filters: {
+    hosts: values.hosts,
+    ports: values.ports,
+    protocols: values.protocols,
+  },
+  priority: values.priority,
+  targets: values.targets,
+})