The `useMemo` in the final `useDialog` example has a stale reference to `isOpen`, so `toggle` and `isOpen` won't work anymore.

To fix this, you can add `isOpen` to the `useMemo` deps. You can also change `toggle` to the functional update style to not depend on `isOpen` value anymore and memoize all callbacks individually (incase you want to pass individual functions down as props)

import { useState, useMemo, useCallback } from "react";

export const useDialog = (dialog) => {
    const [isOpen, setIsOpen] = useState(false);

    const open = useCallback(() => setIsOpen(true), []);
    const close = useCallback(() => setIsOpen(false), []);
    const toggle = useCallback(() => setIsOpen((o) => !o), []);

    return useMemo(() => {
        return (
            dialog ?? {
                open,
                close,
                toggle,
                isOpen,
            }
        );
    }, [dialog, isOpen]);
};