React warning Maximum update depth exceeded

properties is a Map, and when passed in dependency array to useEffect, it will be recreated on every render, and when compared, it will always be not equal to itself, since the map, same as other non-primitive types in JS are compared by reference and not by value. So this will cause the function inside the useEffect to be run on every re-render.

You'd need to wrap it into some kind of deep compare function: https://stackoverflow.com/a/54096391/4468021

Because you are creating the map objects inside of your component function they will be recreated on every render. Because of that your effect will set a new map as the new state which will in turn trigger another re-render and your effect being called again which leads to an infinite update loop.

You can move the definition of your map objects outside of your component to fix this.