Hi everyone, I’m embedding my dashboards into a Next.js 15 web app and running into an issue with fetching data. I keep getting the error: “Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.” I’m trying to keep the code as simple as possible, but no matter what approach I try, I can’t seem to fix it. Would someone be able to take a look with me, please? I’d really appreciate the help! Thanks in advance

Hi Otila, this is a React error that typically occurs when a component triggers an update that causes it to re-render in a loop. In your case, you are embedding dashboards or insights into your Next.js 15 app, the most likely cause is that one or more of the props being passed to your component (such as

InsightView

or

useExecutionDataView

) is being re-created on every render, which causes the component to repeatedly trigger a new data fetch and update. Wrap any computed or constructed props (like filters or execution definitions) in

useMemo

to ensure they remain stable across renders. This ensures that unless

dependencies

change, the

filters

array remains the same and does not trigger unnecessary re-renders. Also please chedck you’re not calling

setState

inside

useEffect

without a properly configured dependency array. Please also see the following article which I hope you’ll find useful: https://typeofnan.dev/fix-the-maximum-update-depth-exceeded-error-in-react/