No fetching/revalidation on page refresh

[Jerryhu1]

Hi,

I'm trying to let SWR get fresh data on a page refresh. I've disabled most of the revalidation configuration since I do not want it to revalidate when users are modifying data in the component. However, when I refresh the page, the data is returned as undefined and is not revalidated. I would expect it to do a new fetch since the cache was cleared during the refresh.
Enabling revalidateIfStale works, but this will also revalidate my component on mount, which is not what I want.

export const useReviewsForBookId = (id: string) => {
  const { data, error, mutate } = useSWR(
    `/v1/reviews?bookId=${id}`,
    () => useReviewsForBookId(id).then(res => res.data),
    {
      revalidateOnFocus: false,
      revalidateOnMount: false,
      revalidateIfStale: false,
    }
  );

  return {
    reviews: data ?? [],
    error: error,
    loading: !error && !data,
    mutate: mutate,
  };
};

How can I make sure the data is fetched properly after a page refresh?