Help with building forms with dynamic fields

const formFields = [
{
    "fieldName": "transfer.fee",
    "description": "Transfer Fee"
    "currentValue": "0.01"
},
{
    "fieldName": "threshold",
    "description": "Threshold"
    "currentValue": "20"
},
// e.t.c
]

const form = useForm({
    defaultValues: {
      summary: '', // field that always exists
      ...formFields.reduce((acc, field) => {
        acc[field.fieldName] = field.currentValue
        return acc
      }, {} as Record<string, string>)
    }
    onSubmit: async ({ value }) => {
      // value here contains the dynamic fields but checking the type just shows summary.
      console.log('Form submitted:', value)
    },

  })

// .... 

{formFields.map((fieldConfig) => (
  <form.Field
    key={fieldConfig.fieldName}
    name={fieldConfig.fieldName} // Type 'string' is not assignable to type '"summary"'.
    children={(field) => (
      <div>
        <label>
          {fieldConfig.description}
        </label>
        <input
          name={field.name}
          value={field.state.value}
          onBlur={field.handleBlur}
          onChange={(e) => field.handleChange(e.target.value)}
        />
      </div>
    )}
  />
))}