useSWR in Astro only refetches when refocussing page

I want to make sure I always get the latest data from an API endpoint, but currently I only get the latest data when I refocus my page

The endpoint I’m requesting contains the following header: "Cache-Control": "public, s-maxage=60, stale-while-revalidate=30"

Inside my React component I have:

export function SpotifyTrackList() {
  const { data } = useSWR<APIResponse>("/api/spotify", fetcher);

Which I import in my Astro component:

<SpotifyTrackList client:only="react" />

I only see a refetch happening when I refocus my page however. I would expect it to respect the header’s timeout so a refetch would happen without me necessarily having to refocus the page