`useField` returns an empty string on the first render for a newly added array item

[romancavry]

Description

After upgrading to newer versions of react-final-form/final-form, useField() returns an empty string on the first render for a newly added item inside an array value.

The form values already contain the correct object, but the field hook initially returns "" for the new nested field path. On the next render, it returns the correct value.

This is a regression compared to older versions, where useField('list.*') returned the actual value from form state immediately on the first render.

Steps to reproduce

https://codesandbox.io/p/sandbox/awesome-jepsen-dh35dp

• click add
• a new item is added to the array, item is mounted for list.0
• check the console output from useField("list.0")
• see first empty string, then actual value

final-form: '4.20.10,
react-final-form: '6.5.9',

Everything ok, the first render returns the value.

final-form: '5.0.1,
react-final-form: '7.0.1',

Not ok, the first render is empty.

Maybe related:
#1050

[Dozalex]

I debugged the useField hook and found that during state initialization, the variable
const existingFieldState = form.getFieldState(name as keyof FormValues) is undefined.

If I log both values:

console.log(existingFieldState, form.getState().values.list[0])

I get:

undefined { id: 0, title: 0 }

So the value actually exists in the form state, but form.getFieldState does not return it.

[romancavry]

Made a PR to this issue.

https://github.com/final-form/react-final-form/pull/1094/changes