How to use arePropsEqual in useDrop to increase performance?

How can I use arePropsEqual in useDrop? The documentation just says that we can use that inside options. So I added it like this:

const [, drop] = useDrop<TimelineDragObject, void, {}>({
  accept,
  drop: item => {
    ...
  },
  options: {
    arePropsEqual: (props: any, otherProps: any) => {
      console.log('Are props equal');
    },
  },
});
return (
  <DropAreaWrapper
    ref={drop}
    style={{
      left: leftOffset,
      width: rightOffset - leftOffset,
    }}
  />
);

It’s not even running the console log I have added there. Any idea why? I have thousands of drop areas rendered in one component. When I drag one draggable item, all the drop areas get re-rendered.

[tuval10]

also looking for a solution! every drop I’m doing is re-rendering all the items in my list

[demoreno]

Same problem here