Tanstack Query for data fetch
After we export and import our fetch function for data and other responses we can get that data using by useQuery
staleTime : This controls after which time React Query will send such a Behind the Scenes request to get updated data if it found data in your cache. And the default is zero, which means it will use data from the cache, but it will then always also send such a Behind the Scenes request to get updated data. If you set this to 5,000, for example, it will wait for 5,000 milliseconds before sending another request. So if this component was rendered and therefore this request was sent, and within five seconds this component is rendered again
gcTime : the Garbage Collection Time. This controls how long the data and the cache will be kept around. And the default here are five minutes. We could of course, also reduce this, for example, to half a minute, with 30,000 milliseconds. This would mean that the cached data would only be kept around for half a minute and thereafter, it would be discarded.