Suspense overlay

Hi, I'm currently working on an application where we're performing multiple requests via resources in nested components and using

Suspense

Suspense

Suspense

Suspense as a catch all to show a loading indicator would make a lot of sense. The issue is that we do want to show the children of

Suspense

Suspense

Suspense

Suspense and the indicator at the same time.

I skimmed through the

Suspense

Suspense

Suspense

Suspense source and it doesn't seem possible to hook into the existing system since

SuspenseContext

SuspenseContext

SuspenseContext

SuspenseContext/

getSuspenseContext

getSuspenseContext

getSuspenseContext

getSuspenseContext is not exported to create a separate component.

Is it feasible to do this with the current state of

Suspense

Suspense

Suspense

Suspense? Something like an

overlay

overlay

overlay

overlay prop on

Suspense

Suspense

Suspense

Suspense would be ideal eg.

<Suspense fallback={<div>Loading...</div>} overlay={true}>
    <AsyncFooBar />
</Suspense>

<Suspense fallback={<div>Loading...</div>} overlay={true}>
    <AsyncFooBar />
</Suspense>

<Suspense fallback={<div>Loading...</div>} overlay={true}>
    <AsyncFooBar />
</Suspense>

<Suspense fallback={<div>Loading...</div>} overlay={true}>
    <AsyncFooBar />
</Suspense>