How to cache by using fetch or let React Table to wait from the fetch before rendering on the page?

[KoichaDev]

I have a situation where I am fetching a huge amount of data. Every time I am visiting on the same page, it is fetching from the end-point all the time. I have tried to use the local forage dependency in order to cache the from the fetch.

The problem is that React Table doesn't get the chance to render the data from the local storage from the forage. React Table complains there is no data. I have multiple React components that are rendering first before they reach the local storage. The local storage will be "undefined" and then after maybe like 8 rendering from the component then it will reach the local storage.

Does anyone have a solution how to fix this?