Hello,
I tried to make a simple RestAPI call in my NextJS application. In the dev version and the local build the app works perfectly, however in the Vercel build it doesn't work, it returns a 500 error when trying to fetch the DashboardNavbar (called on /dashboard) from the /api/profile page. Anyone might have encountered a similar error?

Local Next version: 15.1.6
Vercel Next version: 15.1.5

/components/dashboard-navbar.tsx

import { SidebarTrigger } from "@/components/ui/sidebar";
import Link from "next/link";
import { Badge } from "./ui/badge";
import {
  CalendarClockIcon,
  CircleGaugeIcon,
  CoinsIcon,
  TelescopeIcon,
  UserIcon,
} from "lucide-react";
import { Progress } from "./ui/progress";
import { ThemeSwitcher } from "./theme-switcher";
import { cookies } from "next/headers";

export default async function DashboardNavbar() {
  let protocol = process.env.NODE_ENV === "production" ? "https" : "http";
  const host = process.env.VERCEL_URL || "localhost:3000";
  if (host.startsWith("localhost")) {
    protocol = "http";
  }
  const cookieStore = await cookies();
  const response = await fetch(`${protocol}://${host}/api/profile`, {
    credentials: "include",
    headers: {
      Cookie: cookieStore.toString(),
      "Content-Type": "application/json",
      "X-Requested-With": "XMLHttpRequest",
    },
  });

  const data = await response.json();
  console.log(data.text);
  return (
...
{data.text}
...
);
}

/api/profile

import { NextRequest, NextResponse } from "next/server";

export async function GET(request: NextRequest) {
  return NextResponse.json({ text: "Hello" }, { status: 200 });
}