Upgrade to next 15

.eslintrc.cjs

@@ -1,5 +1,3 @@
-const path = require('path');
-
 /** @type {import("eslint").Linter.Config} */
 const config = {
   overrides: [
@@ -10,13 +8,13 @@ const config = {
       ],
       files: ['*.ts', '*.tsx'],
       parserOptions: {
-        project: path.join(__dirname, 'tsconfig.json'),
+        project: true, // This tells ESLint to automatically detect the tsconfig
       },
     },
   ],
   parser: '@typescript-eslint/parser',
   parserOptions: {
-    project: path.join(__dirname, 'tsconfig.json'),
+    project: true, // This tells ESLint to automatically detect the tsconfig
   },
   plugins: ['@typescript-eslint'],
   extends: [

.github/workflows/build.yml

@@ -18,10 +18,10 @@ jobs:
       - name: Enable Corepack
         run: corepack enable
 
-      - name: Use Node 20.x
+      - name: Use Node 22.x
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.x
           cache: 'pnpm'
 
       - name: Install dependencies

actions/activityFeed.ts

@@ -1,4 +1,4 @@
-'use sever';
+'use server';
 
 import { safeRevalidateTag } from '~/lib/cache';
 import type { Activity, ActivityType } from '~/lib/data-table/types';

actions/auth.ts

@@ -1,12 +1,12 @@
 'use server';
 
 import { revalidatePath } from 'next/cache';
-import { cookies } from 'next/headers';
 import { redirect } from 'next/navigation';
 import { createUserFormDataSchema, loginSchema } from '~/schemas/auth';
-import { auth, getServerSession } from '~/utils/auth';
+import { getServerSession } from '~/utils/auth';
 import { prisma } from '~/utils/db';
 
+// eslint-disable-next-line @typescript-eslint/require-await
 export async function signup(formData: unknown) {
   const parsedFormData = createUserFormDataSchema.safeParse(formData);
 
@@ -18,41 +18,6 @@ export async function signup(formData: unknown) {
   }
 
   try {
-    const { username, password } = parsedFormData.data;
-
-    const user = await auth.createUser({
-      key: {
-        providerId: 'username', // auth method
-        providerUserId: username, // unique id when using "username" auth method
-        password, // hashed by Lucia
-      },
-      attributes: {
-        username,
-      },
-    });
-
-    const session = await auth.createSession({
-      userId: user.userId,
-      attributes: {},
-    });
-
-    if (!session) {
-      return {
-        success: false,
-        error: 'Failed to create session',
-      };
-    }
-
-    // set session cookie
-
-    const sessionCookie = auth.createSessionCookie(session);
-
-    cookies().set(
-      sessionCookie.name,
-      sessionCookie.value,
-      sessionCookie.attributes,
-    );
-
     redirect('/setup?step=2');
   } catch (error) {
     // db error, email taken, etc
@@ -84,7 +49,7 @@ export const login = async (
     };
   }
 
-  const { username, password } = parsedFormData.data;
+  const { username } = parsedFormData.data;
 
   // get user by userId
   const existingUser = await prisma.user.findFirst({
@@ -111,28 +76,6 @@ export const login = async (
     };
   }
 
-  let key;
-  try {
-    key = await auth.useKey('username', username, password);
-  } catch (e) {
-    return {
-      success: false,
-      formErrors: ['Incorrect username or password'],
-    };
-  }
-
-  const session = await auth.createSession({
-    userId: key.userId,
-    attributes: {},
-  });
-
-  const sessionCookie = auth.createSessionCookie(session);
-  cookies().set(
-    sessionCookie.name,
-    sessionCookie.value,
-    sessionCookie.attributes,
-  );
-
   return {
     success: true,
   };
@@ -146,7 +89,5 @@ export async function logout() {
     };
   }
 
-  await auth.invalidateSession(session.sessionId);
-
   revalidatePath('/');
 }

actions/interviews.ts

@@ -305,7 +305,7 @@ export async function finishInterview(interviewId: Interview['id']) {
       },
     });
 
-    cookies().set(updatedInterview.protocolId, 'completed');
+    (await cookies()).set(updatedInterview.protocolId, 'completed');
 
     safeRevalidateTag('getInterviews');
     safeRevalidateTag('summaryStatistics');

app/(blobs)/expired/page.tsx

@@ -23,8 +23,8 @@ export default async function Page() {
         Please redeploy a new instance of Fresco to continue using the software.
       </p>
       {env.NODE_ENV === 'development' && (
-        <form action={resetAppSettings}>
-          <SubmitButton className="mt-6 max-w-[20rem]" type="submit">
+        <form action={void resetAppSettings}>
+          <SubmitButton className="mt-6 max-w-[20rem]">
             Dev mode: Reset Configuration
           </SubmitButton>
         </form>

app/(interview)/interview/[interviewId]/page.tsx

@@ -3,22 +3,23 @@ import { notFound, redirect } from 'next/navigation';
 import { syncInterview } from '~/actions/interviews';
 import FeedbackBanner from '~/components/Feedback/FeedbackBanner';
 import { getAppSetting } from '~/queries/appSettings';
-import { getInterviewById } from '~/queries/interviews';
+import { TESTING_getInterviewById } from '~/queries/interviews';
 import { getServerSession } from '~/utils/auth';
 import InterviewShell from '../_components/InterviewShell';
 
-export default async function Page({
-  params,
-}: {
-  params: { interviewId: string };
-}) {
+export default async function Page(
+  props: {
+    params: Promise<{ interviewId: string }>;
+  }
+) {
+  const params = await props.params;
   const { interviewId } = params;
 
   if (!interviewId) {
     return 'No interview id found';
   }
 
-  const interview = await getInterviewById(interviewId);
+  const interview = await TESTING_getInterviewById(interviewId);
   const session = await getServerSession();
 
   // If the interview is not found, redirect to the 404 page
@@ -31,7 +32,7 @@ export default async function Page({
   // and redirect to finished page
   const limitInterviews = await getAppSetting('limitInterviews');
 
-  if (limitInterviews && cookies().get(interview?.protocol?.id ?? '')) {
+  if (limitInterviews && (await cookies()).get(interview?.protocol?.id ?? '')) {
     redirect('/interview/finished');
   }
 

app/(interview)/onboard/[protocolId]/route.ts

@@ -9,9 +9,9 @@ export const dynamic = 'force-dynamic';
 
 const handler = async (
   req: NextRequest,
-  { params }: { params: { protocolId: string } },
+  { params }: { params: Promise<{ protocolId: string }> },
 ) => {
-  const protocolId = params.protocolId; // From route segment
+  const protocolId = (await params).protocolId; // From route segment
 
   // when deployed via docker `req.url` and `req.nextUrl`
   // shows Docker Container ID instead of real host
@@ -30,7 +30,7 @@ const handler = async (
   // if limitInterviews is enabled
   // Check cookies for interview already completed for this user for this protocol
   // and redirect to finished page
-  if (limitInterviews && cookies().get(protocolId)) {
+  if (limitInterviews && (await cookies()).get(protocolId)) {
     url.pathname = '/interview/finished';
     return NextResponse.redirect(url);
   }

app/dashboard/_components/UserMenu.tsx

@@ -3,7 +3,7 @@ import SubmitButton from '~/components/ui/SubmitButton';
 
 const UserMenu = () => {
   return (
-    <form action={() => logout()}>
+    <form action={void logout}>
       <SubmitButton variant="secondary" size="sm" type="submit">
         Sign out
       </SubmitButton>

app/dashboard/page.tsx

@@ -12,11 +12,12 @@ import SummaryStatistics from './_components/SummaryStatistics/SummaryStatistics
 import UpdateUploadThingTokenAlert from './_components/UpdateUploadThingTokenAlert';
 import AnonymousRecruitmentWarning from './protocols/_components/AnonymousRecruitmentWarning';
 
-export default async function Home({
-  searchParams,
-}: {
-  searchParams: Record<string, string | string[] | undefined>;
-}) {
+export default async function Home(
+  props: {
+    searchParams: Promise<Record<string, string | string[] | undefined>>;
+  }
+) {
+  const searchParams = await props.searchParams;
   await requireAppNotExpired();
   await requirePageAuth();
 

components/Feedback/SignOutModal.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { type Dispatch, type SetStateAction } from 'react';
+import { logout } from '~/actions/auth';
 import {
   AlertDialog,
   AlertDialogAction,
@@ -11,7 +12,6 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
 } from '../ui/AlertDialog';
-import { logout } from '~/actions/auth';
 
 type SignOutModalProps = {
   openSignOutModal: boolean;
@@ -39,7 +39,7 @@ const SignOutModal = ({
           <AlertDialogCancel onClick={() => setOpenSignOutModal(false)}>
             Cancel
           </AlertDialogCancel>
-          <AlertDialogAction onClick={() => void logout()}>
+          <AlertDialogAction onClick={logout}>
             Sign Out and Hide Banner
           </AlertDialogAction>
         </AlertDialogFooter>

env.js

@@ -20,6 +20,7 @@ export const env = createEnv({
     POSTGRES_PRISMA_URL: z.string(),
     POSTGRES_URL_NON_POOLING: z.string(),
     PUBLIC_URL: z.string().url().optional(),
+    SIMULATE_DELAY: strictBooleanSchema.optional(),
   },
 
   /**
@@ -53,6 +54,7 @@ export const env = createEnv({
     SANDBOX_MODE: process.env.SANDBOX_MODE,
     APP_VERSION: process.env.APP_VERSION,
     COMMIT_HASH: process.env.COMMIT_HASH,
+    SIMULATE_DELAY: process.env.SIMULATE_DELAY,
   },
   /**
    * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially

hooks/useCanvas.ts

@@ -2,7 +2,7 @@ import { useRef, useEffect } from 'react';
 
 const resizeCanvas = (
   context: CanvasRenderingContext2D,
-  canvasRef: React.RefObject<HTMLCanvasElement>,
+  canvasRef: React.RefObject<HTMLCanvasElement | null>,
 ) => {
   if (!canvasRef?.current) {
     return false;
@@ -29,7 +29,7 @@ const resizeCanvas = (
 type DrawFunction = (
   ctx: CanvasRenderingContext2D,
   time: number,
-  canvasRef: React.RefObject<HTMLCanvasElement>,
+  canvasRef: React.RefObject<HTMLCanvasElement | null>,
 ) => void;
 
 const defaultPredraw: DrawFunction = (context: CanvasRenderingContext2D) => {

hooks/usePrevious.ts

@@ -1,7 +1,7 @@
 import { useEffect, useRef } from 'react';
 
 export default function usePrevious(value: unknown) {
-  const ref = useRef<unknown>();
+  const ref = useRef<unknown>(undefined);
   useEffect(() => {
     ref.current = value;
   });

hooks/useProtocolImport.tsx

@@ -87,7 +87,7 @@ export const useProtocolImport = () => {
         return;
       }
 
-      const { validateProtocol } = await import('@codaco/protocol-validation');
+      const { validateProtocol } = await import('~/lib/protocol-validation');
 
       const validationResult = await validateProtocol(protocolJson);
 
@@ -130,7 +130,7 @@ export const useProtocolImport = () => {
                       ...validationResult.logicErrors,
                     ].map((validationError, i) => (
                       <li className="flex capitalize" key={i}>
-                        <XCircle className="mr-2 h-4 w-4 text-destructive" />
+                        <XCircle className="text-destructive mr-2 h-4 w-4" />
                         <span>
                           {validationError.message}{' '}
                           <span className="text-xs italic">

hooks/useResizeObserver.ts

@@ -2,7 +2,7 @@ import { type RefObject, useEffect } from 'react';
 
 const useResizeObserver = <T extends HTMLElement>(
   callback: ResizeObserverCallback,
-  elementRef: RefObject<T>,
+  elementRef: RefObject<T | null>,
   options?: ResizeObserverOptions,
 ) => {
   useEffect(() => {

knip.json

@@ -8,7 +8,16 @@
     "lib/interviewer/hooks/forceSimulation.worker.js",
     "lib/ui/components/Sprites/ExportSprite.js",
     "utils/auth.ts",
-    "load-test.js"
+    "load-test.js",
+    "lib/protocol-validation/schemas/compiled/index.js",
+    "lib/protocol-validation/schemas/compiled/1.js",
+    "lib/protocol-validation/schemas/compiled/2.js",
+    "lib/protocol-validation/schemas/compiled/3.js",
+    "lib/protocol-validation/schemas/compiled/4.js",
+    "lib/protocol-validation/schemas/compiled/5.js",
+    "lib/protocol-validation/schemas/compiled/6.js",
+    "lib/protocol-validation/schemas/compiled/7.js",
+    "lib/protocol-validation/schemas/compiled/8.js"
   ],
   "ignoreDependencies": [
     "server-only",