`React Example: Next Server Actions` does not work as expected

[hudus]

Describe the bug

The example code to use TanStack Form with Server Actions in Next has several deficiencies.

It seems that the form submission/calling the action is happening natively and completely skipping the TanStack Form. That means that:

1. the form can be cumitted even if it is not valid
2. formState.isSubmitting is never true
3. onSubmit function is never exectured, unless you add e.preventDefault() to <form onSubmit>
4. And all other things that are related to TanStack Form not being hooked on the Form sumission.

Your minimal, reproducible example

https://github.com/tanstack/form/tree/main/examples/react/next-server-actions

Steps to reproduce

1. Checkout the code from https://github.com/tanstack/form/tree/main/examples/react/next-server-actions and run it
2. Optionally add await new Promise(resolve => setTimeout(resolve, 2000)); to ./src/app /action.ts to be able to observe the behaviour easier
3. Submit the form. isSubmitting is never true, so the submit button always remains the same.

Expected behavior

The isSubmitting state should be changed when the form is being submitted.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: Windows 11
• Browser: Chrome

TanStack Form adapter

react-form

TanStack Form version

v1.27.7

TypeScript version

v5.9.3

Additional context

No response

[doyoonear]

Hi! I'd like to work on this issue. Is it available to be assigned to me?
@hudus @LeCarbonator @crutchcorn

[crutchcorn]

This issue is already resolved in this PR:

#1890

That needs some architectural review from other maintainers

[crutchcorn]

This issue is already resolved in this PR:

#1890

That needs some architectural review from other maintainers