Component-level Suspense for Solid Form

[oscartbeaumont]

Describe the bug

Depending on async data within defaultValues causes the Suspense above the component to trigger as opposed to a suspense wrapped around the fields/form.

Component-level suspense would be fine in React where it always is, but in Solid this is a pretty unexpected behavior.

This is probally being triggered by a useMemo wrapping the arguments. I'm not certain of what the expected behavior should be but I don't think this is it.

I'm fairly sure this can currently be worked around by doing something like:

const [default, setDefault] = createSignal({});

// `createComputed` over `createEffect` so that it runs straight away.
//
// by using `createComputed`/`createEffect` over memo we avoid the component-level suspense behavior
createComputed(() => {
    setDefault({
       firstName: somAsyncValue?.firstName,
    });
});

const form = createForm(() => ({ defaultValues: default() }));

but this is pretty annoying and for a newer user to Solid they would have no clue.

Your minimal, reproducible example

https://stackblitz.com/edit/tanstack-form-bxce9x?file=src%2Findex.tsx

Steps to reproduce

See that the page says "App suspense" not "Form suspense" while loading the async data (a 2 second timeout).

Expected behavior

I would expected either:

• The suspense to be triggered as a field level.
• A suspense not to be trigger and instead the data is just lazily populated. For a good UX this would probally need to be while the fields are disabled.
  • I don't know if this fits into Tanstack's Form's model but it's what I recon the ultimate DX is because dealing with per-field suspense would likely be more annoying than just having an disabled={form.isDefaultLoading} placeholder={form.isDefaultLoading ? "loading..." : ""}

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

Reproduced in Stackblitz on latest Tanstack Form.

TanStack Form adapter

solid-form

TanStack Form version

v0.29.1

TypeScript version

No response

Additional context

No response