next-auth Module not found: Can't resolve 'preact-render-to-string' getServerSession()

i'm migrating my project to app/ directory in nextjs 13.4 and when i try to access session using getServerSession() in a server component :

import { authOptions } from "@/pages/api/auth/[...nextauth]";
import { getServerSession } from "next-auth";
import Link from "next/link";

export default async function Navbar() {
  const session = await getServerSession(authOptions);
  return (
    <div className="navbar  top-0">
      <div className="navbar-start">LOGO</div>
      <div className="navbar-center"></div>
      <div className="navbar-end">
        <ul className="menu menu-horizontal px-1">
          <li>
            <Link href={"/example"}>Avatar Studio</Link>
          </li>
          <li>
            <Link href={"/example"}>Calendar</Link>
          </li>
          <li>
            <Link href={"/example"}>Newsfeed</Link>
          </li>
          <li>
            <Link href={"/example"}>Profile</Link>
          </li>
        </ul>
      </div>
    </div>
  );
}

it throws :

./node_modules/next-auth/core/pages/index.js:10:51
Module not found: Can't resolve 'preact-render-to-string'

i solved it by changing the import from next-auth to next-auth/next and it still showed the error until i deleted node_modules and reinstalled