Add easy async component.
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

This commit is contained in:
Madeorsk 2024-07-19 22:11:33 +02:00
parent 70a2887d76
commit c1d9036d4c
Signed by: Madeorsk
SSH key fingerprint: SHA256:J9G0ofIOLKf7kyS2IfrMqtMaPdfsk1W02+oGueZzDDU

View file

@ -118,3 +118,27 @@ export function Await<T>({ async, children, fallback }: {
// Promise is fulfilled, rendering the children with result data.
return children(async.data);
}
/**
* Easy async component with fallback and fulfilled children render.
* @param promise The promise.
* @param children Renderer function of the children, takes promised data as argument.
* @param fallback Content shown when the promise is not fulfilled yet.
* @constructor
*/
export function Async<T>({promise, fallback, children}: {
promise: Promisable<T>|PromiseFn<T>;
children: (async: T) => React.ReactElement;
fallback?: React.ReactElement;
})
{
// Get async data from given promise.
const async = useAsync(promise, [promise]);
return (
// Wait for promised data.
<Await async={async} fallback={fallback ?? undefined}>
{children}
</Await>
)
}