unify form helpers

quiltdata · May 30, 2024 · 197100b · 197100b
1 parent 3e4b9bc
commit 197100b
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 63 deletions.
diff --git a/catalog/app/containers/Admin/Form.tsx b/catalog/app/containers/Admin/Form.tsx
@@ -2,12 +2,12 @@ import * as React from 'react'
 import type * as RF from 'react-final-form'
 import * as M from '@material-ui/core'
 
-export interface FieldProps {
+interface FieldOwnProps {
   errors: Record<string, React.ReactNode>
-  input: RF.FieldInputProps<string>
-  meta: RF.FieldMetaState<string>
 }
 
+export type FieldProps = FieldOwnProps & RF.FieldRenderProps<string> & M.TextFieldProps
+
 // TODO: re-use components/Form/TextField
 export function Field({
   input,
@@ -16,8 +16,9 @@ export function Field({
   helperText,
   InputLabelProps,
   ...rest
-}: FieldProps & M.TextFieldProps) {
-  const error = meta.submitFailed && (meta.error || meta.submitError)
+}: FieldProps) {
+  const error =
+    meta.submitFailed && (meta.error || (!meta.dirtySinceLastSubmit && meta.submitError))
   const props = {
     error: !!error,
     helperText: error ? errors[error] || error : helperText,
@@ -80,16 +81,12 @@ const useFormErrorStyles = M.makeStyles((t) => ({
   },
 }))
 
-interface FormErrorProps {
-  errors: Record<string, React.ReactNode>
+interface FormErrorProps extends M.TypographyProps {
   error?: string
+  errors: Record<string, React.ReactNode>
 }
 
-export function FormError({
-  error,
-  errors,
-  ...rest
-}: FormErrorProps & M.TypographyProps) {
+export function FormError({ error, errors, ...rest }: FormErrorProps) {
   const classes = useFormErrorStyles()
   if (!error) return null
   return (

diff --git a/catalog/app/containers/Admin/RFForm.tsx b/catalog/app/containers/Admin/RFForm.tsx
diff --git a/catalog/app/containers/Admin/RolesAndPolicies/Policies.tsx b/catalog/app/containers/Admin/RolesAndPolicies/Policies.tsx
@@ -15,7 +15,7 @@ import { mkFormError, mapInputErrors } from 'utils/formTools'
 import * as Types from 'utils/types'
 import validate, * as validators from 'utils/validators'
 
-import * as Form from '../RFForm'
+import * as Form from '../Form'
 import * as Table from '../Table'
 
 import AssociatedRoles from './AssociatedRoles'

diff --git a/catalog/app/containers/Admin/RolesAndPolicies/Roles.tsx b/catalog/app/containers/Admin/RolesAndPolicies/Roles.tsx
@@ -14,7 +14,7 @@ import assertNever from 'utils/assertNever'
 import * as Types from 'utils/types'
 import * as validators from 'utils/validators'
 
-import * as Form from '../RFForm'
+import * as Form from '../Form'
 import * as Table from '../Table'
 
 import AttachedPolicies from './AttachedPolicies'