why is session undefined even tho i know it exists

import { Role } from "@prisma/client";
import Layout from "./Layout";
import type { GetServerSideProps } from "next/types";
import { getServerAuthSession } from "~/server/auth";
import type { Session } from "next-auth";

export default function Admin({ session }: { session: Session }) {
  console.log(session);
  if (!session || session.user.role !== Role.ADMIN) {
    return <div>Unauthorized.</div>;
  }
  return <Layout>hi</Layout>;
}

export const getServerSideProps: GetServerSideProps = async (ctx) => {
  const session = await getServerAuthSession(ctx);
  if (!session) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }

  return {
    props: {
      session,
    },
  };
};

import { Role } from "@prisma/client";
import Layout from "./Layout";
import type { GetServerSideProps } from "next/types";
import { getServerAuthSession } from "~/server/auth";
import type { Session } from "next-auth";

export default function Admin({ session }: { session: Session }) {
  console.log(session);
  if (!session || session.user.role !== Role.ADMIN) {
    return <div>Unauthorized.</div>;
  }
  return <Layout>hi</Layout>;
}

export const getServerSideProps: GetServerSideProps = async (ctx) => {
  const session = await getServerAuthSession(ctx);
  if (!session) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }

  return {
    props: {
      session,
    },
  };
};