useCustomer and other hooks return undefined even though api returns data #131
Description
I'm having a problem using storefront hooks. After successful SSO login and having all the api endpoints on NextJS application for BigCommerce in place, the hooks return undefined result on the first page load, even though if I look into the Network tab of the browser, I can see SWR does successful requests to /api/bigcommerce/customers and this endpoint returns logged in user data.
Whats interesting, if I update a code and NextJS running in development mode will refresh the page in browser automatically, the hook returns data as expected. But then if I refresh the page manually again, it returns undefined.
const { data: customer } = useCustomer(); // It gets invoked in the component at least 2 times.
console.log(customer); // <--- is undefined on first page load, and returns data only if NextJS
// refreshes the page automatically after code change.
On the first call of useCustomer I can see api request in the Network tab to the /api/bigcommerce/customers endpoint, which returns expected data.
I have also tried to revalidate the cache, but it also doesn't help.
const { data: customer, revalidate } = useCustomer();
revalidate().then(() => {
console.log(customer);
});
The same problem with useCart hook.
It looks like hooks don't revalidate SWR cache properly. Does anyone experience the same issue? I have already read all issues/topics and debugged everything as much as possible.
Package versions:
- @bigcommerce/storefront-data-hooks@^1.7.0
- next@^12.3.1
- react@^18.1.0
- swr@^1.3.0