I am using Material UI to build my user interface for the web. I have a question regarding material UI if it provides a way to detect the current screen resolution breakpoint, ex: [xs, sm, md, lg, xl] or [0px, 600px, 900px, 1200px, 1536px] in a way that I can read it.

For instance, I wanted to use the useEffect() for cleaning a state in my component, but I needed that to be when the component hides because of a screen resolution change, so maybe I can do it like:

useEffect(()=> setMenuList(null), [mui.currentScreenResolution] )

In other words, in case the current screen breakpoints changed from 'xs' to 'md', I want this useEffect hook to run.

Does MUI provide a way to read the currently used breakpoint by the app?

Update: Just to confirm my question; I don't want to detect every time the window size of the browser changes, I only want to detect when the screen resolution changes from one of the predefined screen resolution breakpoints by mui from one to another (ex: xs → md).