Dr. Edo Paz on Nostr: Snippet: nostr:nevent1qqs8szskdrulg0wmfra5hz3yeeex8y9k4mee5w8c8kjexa8szaqpswspuae2m

Snippet:

quoting
nevent1q…ae2m

import { useEffect, useMemo, useRef, useState } from "react";
import { BehaviorSubject, Observable } from "rxjs";

/** Hook to subscribe to an RxJS Observable and get its current value */
export function useObservable(observable: BehaviorSubject): T;
export function useObservable(observable: Observable): T | undefined;
export function useObservable(observable: Observable): T | undefined {
const sync = useRef(Reflect.get(observable, "value"));

// Keep value state to trigger re-renders
const [_, setValue] = useState(Reflect.get(observable, "value"));

useEffect(() => {
const sub = observable.subscribe((v) => {
// Set ref so that sync values are supported
sync.current = v;
setValue(v);
});

return () => sub.unsubscribe();
}, [observable]);

return sync.current;
}

/** Subscribe to an observable with a creator function and dependencies */
export function useObservableMemo(
project: () => Observable,
deps: any[],
): T | undefined {
const observable = useMemo(() => project(), deps);
return useObservable(observable);
}