Prevent data re-fetch on component re-render

[Shumayl]

https://stackoverflow.com/questions/58712833/react-how-to-prevent-re-fetching-data-when-component-re-renders

[Shumayl]

This can be done by moving all data fetches into a useEffect with an empty dependency array.

[Shumayl]

There may be nothing wrong with the useEffects after all. This is actually due to a react-query behaviour (via tRPC):

https://stackoverflow.com/questions/70337333/react-query-refetch-on-window-focus-but-not-otherwise