How to install and Use Rebackk's Pocketbase Adapter

A step-by-step guide on how to install and use Rebackk's Pocketbase Adapter with NextAuth.js.

Installation

You can install @rebackk/pocketbase-adapter using npm, yarn, or pnpm.

npm install @rebackk/pocketbase-adapter

or

yarn add @rebackk/pocketbase-adapter

or

pnpm add @rebackk/pocketbase-adapter

Setup

1: Setup Pocketbase Schema

First, you need to create a schema in Pocketbase that includes the following collections:

  1. Users: Custom PocketBase users collection for next-auth.
  2. Accounts: For linking users with their OAuth or credentials accounts.
  3. Sessions: To manage user sessions and tokens.
  4. Authenticators: To handle multi-factor authentication (MFA) flows.
  5. VerificationTokens: For managing email verification flows and password resets.

We are currently using this schema which is hardcoded in the adapter.

This schema implements auth with headers in pocketbase. You can customize the schema according to your needs. We are working on making this schema customizable.

For More Information On Schema Visit: Schema Definition

We are working on making this schema customizable.

2: Setup Pocketbase In Your Next.js App

Setup and admin instance of Pocketbase in your Next.js app or you can use headers to authenticate with Pocketbase.

import { PocketBase } from "pocketbase";

export const getPocketbase = () => {
  // Get Pocketbase environment variables
  const { PB_URL, PB_ADMIN_EMAIL, PB_ADMIN_PASS } = process.env;

  // Check if environment variables are set
  if (!PB_URL || !PB_ADMIN_EMAIL || !PB_ADMIN_PASS) {
    // Throw an error if any of the environment variables are missing
    throw new Error("Missing Pocketbase environment variables");
  }

  // Create a new Pocketbase client
  const client = new PocketBase(PB_URL);

  // Authenticate the client with the admin credentials
  // Optional if you are not using headers to authenticate
  client.admins.authWithPassword(PB_ADMIN_EMAIL, PB_ADMIN_PASS);

  // Return the client
  return client;
};

3: Setup NextAuth.js

Next you need to setup NextAuth in your Next.js app.

Follow their documentation to setup NextAuth in your app.

4: Setup Pocketbase Adapter

Now you can setup the Pocketbase adapter in your NextAuth configuration.

Add the following code to your NextAuth configuration.

import { AuthOptions } from "next-auth";
import { getPocketbase } from "@/lib/pb";
import { PocketBaseAdapter } from "@rebackk/pocketbase-adapter";

const authOptions : AuthOptions = {
  // Your NextAuth options
  // ...
  // Adding @ts-ignore to ignore TypeScript errors because we are using a custom adapter
  // @ts-ignore
  adapter: PocketBaseAdapter(getPocketbase()), // This is an old way of using the adapter. This will be deprecated in the future release.
  // New method of using the adapter with options
  // Example if you want to use headers to authenticate with Headers.
  /**
   * 
    adapter: PocketBaseAdapter({
      client : getPocketbase(),
      requiresAuth : true,
      headers: {
        name : "x_access_token",
        value : "test"
      }
    })
   *
   */
};

Now you can use NextAuth with Pocketbase in your Next.js app.