[Bug]: useOnWindowResize causes Maximum update depth exceeded error

[AndriRafnR]

Tremor Raw Component Version

0.0.0

Link to minimal reproduction

N/A

Steps to reproduce

The useOnWindowResize hook is using the state value it is setting as part of the dependency array of the useEffect.

This is causing the effect to run on every resize tick causing a maximum update depth exceeded error.

What is expected?

Maximum update depth exceeded not happening on resizes.

What is actually happening?

Maximum update depth exceeded error on resizing the window.

What browsers are you seeing the problem on?

Other

Any additional comments?

Browsing though the documentation for Line Chart - Tremor Raw.

[AndriRafnR]

I've updated the hook locally to this:

// Tremor Raw useOnWindowResize [v0.0.0]

import * as React from "react";

export const useOnWindowResize = (handler: { (): void }) => {
  React.useEffect(() => {
    const handleResize = () => {
      handler();
    };
    handleResize();
    window.addEventListener("resize", handleResize);

    return () => window.removeEventListener("resize", handleResize);
  }, [handler]);
};

This works well with the Line Chart component.

[severinlandolt]

Oh! Thank you very much of opening this issue and sharing your solution. Will take a look at it asap!

[AndriRafnR]

Oh! Thank you very much of opening this issue and sharing your solution. Will take a look at it asap!

no problem! keep up the good work.