This is a React project with Mantine’s Notification System demo. It has a lot of function components using notification.

const A = () => {
  useEffect(() => {
    notifications.show({
        // config
    });
  }, []);

  return <></>;
};
const B = () => {
  useEffect(() => {
    notifications.show({
        // config
    });
  }, []);

  return <></>;
};
const C = () => {
  useEffect(() => {
    notifications.show({
        // config
    });
  }, []);

  return <></>;
};

Now, we have a global state named muteMode, if user enable the state, all notification disabled. So I have to change code as below

const A = () => {
  const { muteMode } = useGlobalState(state => state);
  
  useEffect(() => {
    if (muteMode) {
      notifications.show({
        // config
      });
    }
  }, [muteMode]);

  return <></>;
};
// The B、C function components are same as A

I think is not good code. Because I have modify all business about notifications. If I add more business about notification, I have to modify again. Does something like Notification Manager exist?