anki/ts/sveltelib/asyncReactive.ts
Henrik Giesel 30bbbaf00b
Use eslint for sorting our imports (#1637)
* Make eslint sort our imports

* fix missing deps in eslint rule (dae)

Caught on Linux due to the stricter sandboxing

* Remove exports-last eslint rule (for now?)

* Adjust browserslist settings

- We use ResizeObserver which is not supported in browsers like KaiOS,
  Baidu or Android UC

* Raise minimum iOS version 13.4

- It's the first version that supports ResizeObserver

* Apply new eslint rules to sort imports
2022-02-04 18:36:34 +10:00

53 lines
1.4 KiB
TypeScript

// Copyright: Ankitects Pty Ltd and contributors
// License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import { derived, Readable } from "svelte/store";
interface AsyncReactiveData<T, E> {
value: Readable<T | null>;
error: Readable<E | null>;
loading: Readable<boolean>;
}
function useAsyncReactive<T, E>(
asyncFunction: () => Promise<T>,
dependencies: [Readable<unknown>, ...Readable<unknown>[]],
): AsyncReactiveData<T, E> {
const promise = derived(
dependencies,
(_, set: (value: Promise<T> | null) => void): void => set(asyncFunction()),
// initialize with null to avoid duplicate fetch on init
null,
);
const value = derived(
promise,
($promise, set: (value: T) => void): void => {
$promise?.then((value: T) => set(value));
},
null,
);
const error = derived(
promise,
($promise, set: (error: E | null) => void): (() => void) => {
$promise?.catch((error: E) => set(error));
return (): void => set(null);
},
null,
);
const loading = derived(
promise,
($promise, set: (value: boolean) => void): (() => void) => {
$promise?.finally(() => set(false));
return (): void => set(true);
},
true,
);
return { value, error, loading };
}
export default useAsyncReactive;