Merge pull request #3452 from quantified-uncertainty/next-15

Next.js 15 for Hub

package.json

@@ -18,6 +18,9 @@
   "pnpm": {
     "overrides": {
       "@headlessui/react": "^2.2.0"
+    },
+    "patchedDependencies": {
+      "react-select": "patches/react-select.patch"
     }
   },
   "version": "0.0.1-0",

packages/hub/package.json

@@ -9,7 +9,7 @@
     "db:migrate:dev": "PRISMA_HIDE_UPDATE_MESSAGE=1 prisma migrate dev",
     "db:migrate": "PRISMA_HIDE_UPDATE_MESSAGE=1 prisma migrate deploy",
     "db:reset": "PRISMA_HIDE_UPDATE_MESSAGE=1 prisma migrate reset",
-    "dev": "next dev -p 3001",
+    "dev": "next dev -p 3001 --turbo",
     "start": "__NEXT_PRIVATE_PREBUNDLED_REACT=next next start",
     "gen:prisma": "PRISMA_HIDE_UPDATE_MESSAGE=1 prisma generate --no-hints",
     "gen:relay": "relay-compiler",
@@ -26,7 +26,7 @@
     "build-last-revision": "pnpm build:esbuild && node ./dist/scripts/buildRecentModelRevision/main.mjs"
   },
   "dependencies": {
-    "@next-auth/prisma-adapter": "^1.0.7",
+    "@auth/prisma-adapter": "^2.7.4",
     "@pothos/core": "^3.41.1",
     "@pothos/plugin-errors": "^3.11.1",
     "@pothos/plugin-prisma": "^3.65.2",
@@ -51,8 +51,8 @@
     "immutable": "^4.3.6",
     "invariant": "^2.2.4",
     "lodash": "^4.17.21",
-    "next": "^14.2.15",
-    "next-auth": "^4.24.7",
+    "next": "^15.0.3",
+    "next-auth": "5.0.0-beta.25",
     "nodemailer": "^6.9.13",
     "pako": "^2.1.0",
     "react": "^18.2.0",

packages/hub/src/app/admin/layout.tsx

@@ -2,14 +2,14 @@ import { PropsWithChildren } from "react";
 
 import { LockIcon } from "@quri/ui";
 
+import { auth } from "@/auth";
 import { FullLayoutWithPadding } from "@/components/layout/FullLayoutWithPadding";
 import { NarrowPageLayout } from "@/components/layout/NarrowPageLayout";
 import { H1 } from "@/components/ui/Headers";
 import { isRootEmail } from "@/graphql/helpers/userHelpers";
-import { getServerSession } from "@/server/helpers";
 
 export default async function AdminLayout({ children }: PropsWithChildren) {
-  const session = await getServerSession();
+  const session = await auth();
 
   const email = session?.user.email;
 

packages/hub/src/app/ai/analytics/code-errors/page.tsx

@@ -13,11 +13,7 @@ const SIGNATURE_ERROR = "Signature errors (total)";
 const LONG_ERROR = "Long errors";
 const NOT_DEFINED_ERROR = "Undefined variable";
 
-export default async function ({
-  searchParams,
-}: {
-  searchParams: { [key: string]: string | string[] | undefined };
-}) {
+export default async function () {
   const errors = await getCodeErrors();
 
   // pre-initialized to follow the right key order

packages/hub/src/app/ai/api/create/route.ts

@@ -7,11 +7,11 @@ import {
   Workflow,
 } from "@quri/squiggle-ai/server";
 
+import { auth } from "@/auth";
 import { getSelf, isSignedIn } from "@/graphql/helpers/userHelpers";
 import { prisma } from "@/prisma";
 import { getAiCodec } from "@/server/ai/utils";
 import { V2WorkflowData } from "@/server/ai/v2_0";
-import { getServerSession } from "@/server/helpers";
 
 import { AiRequestBody, aiRequestBodySchema } from "../../utils";
 
@@ -122,7 +122,7 @@ function saveWorkflowToDbOnUpdates(
 }
 
 export async function POST(req: Request) {
-  const session = await getServerSession();
+  const session = await auth();
 
   if (!isSignedIn(session)) {
     return new Response("Unauthorized", { status: 401 });

packages/hub/src/app/ai/page.tsx

@@ -8,13 +8,13 @@ import { AiDashboard } from "./AiDashboard";
 export default async function SessionsPage({
   searchParams,
 }: {
-  searchParams: { [key: string]: string | string[] | undefined };
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
 }) {
   const { limit } = z
     .object({
       limit: numberInString.optional(),
     })
-    .parse(searchParams);
+    .parse(await searchParams);
 
   const { workflows, hasMore } = await loadWorkflows({ limit });
 

packages/hub/src/app/api/auth/[...nextauth]/route.ts

@@ -1,7 +1,3 @@
-import NextAuth from "next-auth";
+import { handlers } from "../../../../auth";
 
-import { authOptions } from "./authOptions";
-
-const handler = NextAuth(authOptions);
-
-export { handler as GET, handler as POST };
+export const { GET, POST } = handlers;

packages/hub/src/app/api/graphql/route.ts

@@ -1,8 +1,8 @@
 import { createYoga } from "graphql-yoga";
 import { NextRequest, NextResponse } from "next/server";
 
+import { auth } from "@/auth";
 import { schema } from "@/graphql/schema";
-import { getServerSession } from "@/server/helpers";
 
 const yoga = createYoga({
   graphqlEndpoint: "/api/graphql",
@@ -11,7 +11,7 @@ const yoga = createYoga({
     // There's some magic involved here;
     // getServerSession() obtains request data through Next.js cookies() and headers() functions
     // See also: https://github.com/nextauthjs/next-auth/issues/7355
-    const session = await getServerSession();
+    const session = await auth();
     return { session };
   },
 });

packages/hub/src/app/groups/[slug]/invite-link/page.tsx

@@ -7,12 +7,13 @@ import QueryNode, {
 } from "@/__generated__/AcceptGroupInvitePageQuery.graphql";
 
 type Props = {
-  params: { slug: string };
+  params: Promise<{ slug: string }>;
 };
 
 export default async function OuterAcceptGroupInvitePage({ params }: Props) {
+  const { slug } = await params;
   const query = await loadPageQuery<AcceptGroupInvitePageQuery>(QueryNode, {
-    slug: params.slug,
+    slug,
   });
 
   return <AcceptGroupInvitePage query={query} />;

packages/hub/src/app/groups/[slug]/layout.tsx

@@ -11,12 +11,13 @@ import QueryNode, {
 } from "@/__generated__/GroupLayoutQuery.graphql";
 
 type Props = PropsWithChildren<{
-  params: { slug: string };
+  params: Promise<{ slug: string }>;
 }>;
 
 export default async function OuterGroupLayout({ params, children }: Props) {
+  const { slug } = await params;
   const query = await loadPageQuery<GroupLayoutQuery>(QueryNode, {
-    slug: params.slug,
+    slug,
   });
 
   return (
@@ -26,6 +27,7 @@ export default async function OuterGroupLayout({ params, children }: Props) {
   );
 }
 
-export function generateMetadata({ params }: Props): Metadata {
-  return { title: params.slug };
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { slug } = await params;
+  return { title: slug };
 }

packages/hub/src/app/groups/[slug]/members/page.tsx

@@ -7,12 +7,13 @@ import QueryNode, {
 } from "@/__generated__/GroupMembersPageQuery.graphql";
 
 type Props = {
-  params: { slug: string };
+  params: Promise<{ slug: string }>;
 };
 
 export default async function OuterGroupMembersPage({ params }: Props) {
+  const { slug } = await params;
   const query = await loadPageQuery<GroupMembersPageQuery>(QueryNode, {
-    slug: params.slug,
+    slug,
   });
 
   return <GroupMembersPage query={query} />;

packages/hub/src/app/groups/[slug]/page.tsx

@@ -7,12 +7,13 @@ import QueryNode, {
 } from "@/__generated__/GroupPageQuery.graphql";
 
 type Props = {
-  params: { slug: string };
+  params: Promise<{ slug: string }>;
 };
 
 export default async function OuterGroupPage({ params }: Props) {
+  const { slug } = await params;
   const query = await loadPageQuery<GroupPageQuery>(QueryNode, {
-    slug: params.slug,
+    slug,
   });
 
   return <GroupPage query={query} />;

packages/hub/src/app/layout.tsx

@@ -6,14 +6,14 @@ import { Analytics } from "@vercel/analytics/react";
 import { Metadata } from "next";
 import { PropsWithChildren } from "react";
 
-import { getServerSession } from "@/server/helpers";
+import { auth } from "@/auth";
 
 import { RootLayout } from "./RootLayout";
 
 export default async function ServerRootLayout({
   children,
 }: PropsWithChildren) {
-  const session = await getServerSession();
+  const session = await auth();
 
   return (
     <html>

packages/hub/src/app/models/[owner]/[slug]/layout.tsx

@@ -1,5 +1,5 @@
 import { Metadata } from "next";
-import { ReactNode, Suspense } from "react";
+import { PropsWithChildren, Suspense } from "react";
 
 import { loadPageQuery } from "@/relay/loadPageQuery";
 
@@ -10,31 +10,29 @@ import ModelLayoutQueryNode, {
   ModelLayoutQuery,
 } from "@/__generated__/ModelLayoutQuery.graphql";
 
-type Props = {
-  params: { owner: string; slug: string };
-  children: ReactNode;
-};
+type Props = PropsWithChildren<{
+  params: Promise<{ owner: string; slug: string }>;
+}>;
 
 async function LoadedLayout({ params, children }: Props) {
+  const { owner, slug } = await params;
   const query = await loadPageQuery<ModelLayoutQuery>(ModelLayoutQueryNode, {
-    input: { owner: params.owner, slug: params.slug },
+    input: { owner, slug },
   });
 
   return <ModelLayout query={query}>{children}</ModelLayout>;
 }
 
-export default function Layout({ params, children }: Props) {
+export default async function Layout({ params, children }: Props) {
+  const { owner, slug } = await params;
   return (
-    <Suspense
-      fallback={
-        <FallbackModelLayout username={params.owner} slug={params.slug} />
-      }
-    >
+    <Suspense fallback={<FallbackModelLayout username={owner} slug={slug} />}>
       <LoadedLayout params={params}>{children}</LoadedLayout>
     </Suspense>
   );
 }
 
-export function generateMetadata({ params }: Props): Metadata {
-  return { title: `${params.owner}/${params.slug}` };
+export async function generateMetadata({ params }: Props): Promise<Metadata> {
+  const { owner, slug } = await params;
+  return { title: `${owner}/${slug}` };
 }

packages/hub/src/app/models/[owner]/[slug]/page.tsx

@@ -7,15 +7,13 @@ import QueryNode, {
 } from "@/__generated__/EditModelPageQuery.graphql";
 
 type Props = {
-  params: { owner: string; slug: string };
+  params: Promise<{ owner: string; slug: string }>;
 };
 
 export default async function Page({ params }: Props) {
+  const { owner, slug } = await params;
   const query = await loadPageQuery<EditModelPageQuery>(QueryNode, {
-    input: {
-      owner: params.owner,
-      slug: params.slug,
-    },
+    input: { owner, slug },
   });
 
   return (

packages/hub/src/app/models/[owner]/[slug]/relative-values/[variableName]/layout.tsx

@@ -12,20 +12,21 @@ export default async function Layout({
   params,
   children,
 }: PropsWithChildren<{
-  params: { owner: string; slug: string; variableName: string };
+  params: Promise<{ owner: string; slug: string; variableName: string }>;
 }>) {
+  const { owner, slug, variableName } = await params;
   const query = await loadPageQuery<RelativeValuesModelLayoutQuery>(QueryNode, {
     input: {
-      owner: params.owner,
-      slug: params.slug,
+      owner,
+      slug,
     },
     forRelativeValues: {
-      variableName: params.variableName,
+      variableName,
     },
   });
 
   return (
-    <RelativeValuesModelLayout query={query} variableName={params.variableName}>
+    <RelativeValuesModelLayout query={query} variableName={variableName}>
       {children}
     </RelativeValuesModelLayout>
   );

packages/hub/src/app/models/[owner]/[slug]/revisions/[revisionId]/page.tsx

@@ -9,11 +9,12 @@ import QueryNode, {
 export default async function ModelPage({
   params,
 }: {
-  params: { owner: string; slug: string; revisionId: string };
+  params: Promise<{ owner: string; slug: string; revisionId: string }>;
 }) {
+  const { owner, slug, revisionId } = await params;
   const query = await loadPageQuery<ModelRevisionViewQuery>(QueryNode, {
-    input: { owner: params.owner, slug: params.slug },
-    revisionId: params.revisionId,
+    input: { owner, slug },
+    revisionId,
   });
 
   return <ModelRevisionView query={query} />;

packages/hub/src/app/models/[owner]/[slug]/revisions/page.tsx

@@ -10,10 +10,11 @@ import QueryNode, {
 export default async function ModelPage({
   params,
 }: {
-  params: { owner: string; slug: string };
+  params: Promise<{ owner: string; slug: string }>;
 }) {
+  const { owner, slug } = await params;
   const query = await loadPageQuery<ModelRevisionsListQuery>(QueryNode, {
-    input: { owner: params.owner, slug: params.slug },
+    input: { owner, slug },
   });
 
   return (

packages/hub/src/app/models/[owner]/[slug]/variables/[variableName]/page.tsx

@@ -7,21 +7,22 @@ import QueryNode, {
 } from "@/__generated__/VariablePageQuery.graphql";
 
 type Props = {
-  params: { owner: string; slug: string; variableName: string };
+  params: Promise<{ owner: string; slug: string; variableName: string }>;
 };
 
 export default async function OuterVariablePage({ params }: Props) {
+  const { owner, slug, variableName } = await params;
   const query = await loadPageQuery<VariablePageQuery>(QueryNode, {
     input: {
-      owner: params.owner,
-      slug: params.slug,
-      variableName: params.variableName,
+      owner,
+      slug,
+      variableName,
     },
   });
 
   return (
     <div className="px-8 py-4">
-      <VariablePage query={query} params={params} />
+      <VariablePage query={query} params={await params} />
     </div>
   );
 }

packages/hub/src/app/models/[owner]/[slug]/view/page.tsx

@@ -7,12 +7,13 @@ import QueryNode, {
 } from "@/__generated__/ViewModelPageQuery.graphql";
 
 type Props = {
-  params: { owner: string; slug: string };
+  params: Promise<{ owner: string; slug: string }>;
 };
 
 export default async function OuterModelPage({ params }: Props) {
+  const { owner, slug } = await params;
   const query = await loadPageQuery<ViewModelPageQuery>(QueryNode, {
-    input: { owner: params.owner, slug: params.slug },
+    input: { owner, slug },
   });
 
   return (