@mittwald/react-use-promise/dist/esm/observable-value/useWatchObservableValue.js

Simple and declarative use of Promises in your React components. Observe their state and refresh them in various advanced ways.

import { useEffect, useRef, useState } from "react";
export const useWatchObservableValue = (observable) => {
    const watchedObservable = useRef(observable);
    const [watchedValue, setWatchedValue] = useState(observable.value);
    useEffect(() => {
        watchedObservable.current = observable;
        setWatchedValue(observable.value);
        return observable.observe(setWatchedValue);
    }, [observable]);
    const observableHasChanged = watchedObservable.current !== observable;
    return observableHasChanged ? observable.value : watchedValue;
};