I'm quite confused. What I know from the docs and [Learn Next.js Chapter 8](https://nextjs.org/learn/dashboard-app/static-and-dynamic-rendering) is that routes that are supposed to be statically rendered, they get rendered at build time and this result is what always gets served. Now I thought something like this would always return <h1>Hi</h1> since during build time, useSelector would return the initial state

export default function Page() {
  const router = useRouter();
  const user = useSelector((state: RootState) => state.user);

  if (Object.keys(user).length === 0) // If "user" is still the initial state
    return <h1>Hi</h1>;
  return <h1>{user.name}</h1>;

but that didn't happen. Once the state got mutated and the if condition isn't satisfied anymore the content of the page changed.

Another case though, in the learn nextjs project (right after chapter 9), there is this component that gets rendered in the dashboard page (attached as a screenshot). Any changes to the data after the project is deployed are not shown, even though if fetchCardData was executed at request time this wouldn't have been the case.

I'm very lost at this point I'm not even sure what static rendering does/should do anymore 💀 hopefully someone can point me in the right direction :)