useToastState wrapUpdate memo breaks my toasts

[oreqizer]

Hey, I cherry picked this commit that passes wrapUpdate to the queue inside useToastState here.

However, putting the function inside the useMemo dependency array causes the value to never be memoized, breaking my toast implementation.

This is my toast implementation:

const context = React.createContext<ToastState<Toast> | null>(null);

const { Provider } = context;

export function useToasts(): ToastState<Toast> {
  const state = React.useContext(context);
  if (state === null) {
    throw new Error('❌ ToastProvider not mounted');
  }
  return state;
}

export interface Toast {
  message: string;
  type: Type;
}

export function ToastProvider({
  children,
  ...props
}: AriaToastRegionProps & {
  children: React.ReactNode;
}): React.JSX.Element {
  const state = useToastState<Toast>({
    maxVisibleToasts: 5,
    wrapUpdate(fn) {
      if ('startViewTransition' in document) {
        document.startViewTransition(() => {
          flushSync(fn);
        });
      } else {
        // CSS view transitions not supported
        fn();
      }
    },
  });

  return (
    <Provider value={state}>
      {children}

      {state.visibleToasts.length > 0 && (
        <ToastRegion {...props} state={state} />
      )}
    </Provider>
  );
}

Am I doing something wrong, or is this a regression? 🤔

Note: it only happens if wrapUpdate isn't memoized via useCallback.