Authentication

Authentication for Cooper is managed by NextAuth.

All the authentication-related code logic is in the auth package. This package is responsible for managing the authentication flow, including sign-in, sign-out, and session management. This package is consumed by the API as well as the web app.

Package

For the web client, the auth packages provides a server-side function to get the current session information and two functions to sign in and sign out.

Authentication Showcase

import { auth, signIn, signOut } from "@cooper/auth";
import { Button } from "@cooper/ui/button";

export async function AuthShowcase() {
  const session = await auth();

  if (!session) {
    return (
      <form>
        <Button
          size="lg"
          formAction={async () => {
            "use server";
            await signIn("discord");
          }}
        >
          Sign in with Discord
        </Button>
      </form>
    );
  }

  return (
    <div className="flex flex-col items-center justify-center gap-4">
      <p className="text-center text-2xl">
        <span>Logged in as {session.user.name}</span>
      </p>

      <form>
        <Button
          size="lg"
          formAction={async () => {
            "use server";
            await signOut();
          }}
        >
          Sign out
        </Button>
      </form>
    </div>
  );
}

Server-Side Logic

The auth() function can only be run on the server side so we currently fetch the session information on the server side and pass it to the client side. In the above example, we make use of form actions to trigger the sign-in and sign-out functions.

note

We require users to sign in with their @husky.neu.edu email addresses, and if they try to sign in with something else, they are prompted to sign in again.

Session Type

The Session type has two properties:

• user: The user object that is returned by the authentication provider.
• expires: The expiration date of the session.

Authentication Proxy

auth-proxy is a simple proxy server that enables OAuth authentication for preview environments. Since the Vercel preview environment results in changing URLs, the OAuth flow is broken since we can't whitelist all the URLs (as redirect URLs) on GCP. Google also does not permit the use of wildcard characters in the redirect URLs.

The auth-proxy server is a Nitro-based route handler that acts as an intermediate authentication server. Since we use Vercel Egde function to host this, the production URL for the authentication server never changes.

In the past, we have used the CredentialProvider to handle the authentication flow. This proxy server ensures that we truly authenticate the user in the preview environment using OAuth, allowing the preview to be as close to the production environment as possible.