How to add postgres adapter?

[Pavel-Demidyuk]

Hi!

First of all, thank you for the amazing repository! The demo looks perfect.

I'd like to add a PostgreSQL adapter to store user data in the database but I'm unsure how to accomplish this. Directly adding the adapter to authConfig doesn't seem to work, as it appears to be rendered on the client side from what I understand. Here is the current config that isn’t working, located in auth.config.ts:

import { NextAuthConfig } from 'next-auth';
import CredentialProvider from 'next-auth/providers/credentials';
import GithubProvider from 'next-auth/providers/github';

import PostgresAdapter from "@auth/pg-adapter";
import { Pool } from "pg";

const pool = new Pool({
  host: process.env.DATABASE_HOST,
  user: process.env.DATABASE_USER,
  password: process.env.DATABASE_PASSWORD,
  database: process.env.DATABASE_NAME,
  max: 20,
  idleTimeoutMillis: 30000,
  connectionTimeoutMillis: 2000,
});

const authConfig: NextAuthConfig = {
  trustHost: true,
  secret: process.env.AUTH_SECRET, // Used to sign the session cookie for verifying by AuthJS
  session: {
    strategy: "jwt",
    maxAge: 30 * 24 * 60 * 60, // 30 days in seconds (also the default value)
  },
  adapter: PostgresAdapter(pool),
  providers: [
    GithubProvider({
      clientId: process.env.GITHUB_ID ?? '',
      clientSecret: process.env.GITHUB_SECRET ?? ''
    }),
    CredentialProvider({
      credentials: {
        email: { type: 'email' },
        password: { type: 'password' }
      },
      async authorize(credentials, req) {
        const user = {
          id: '1',
          name: 'John',
          email: credentials?.email ?? ''
        };
        return user || null;
      }
    })
  ],
  pages: {
    signIn: '/' // Sign-in page
  }
};

export default authConfig;

Here is the error I'm receiving:

> nextshcdndashboardstarter@0.1.0 dev
> next dev

  ▲ Next.js 14.2.3
  - Local:        http://localhost:3000
  - Environments: .env.local

 ✓ Starting...
 ✓ Ready in 3.6s
 ○ Compiling /middleware ...
 ⚠ ./node_modules/pg/lib/native/client.js
Module not found: Can't resolve 'pg-native' in '/Users/PD/projects/prjctmeter/next-shadcn-dashboard-starter/node_modules/pg/lib/native'

Import trace for requested module:
./node_modules/pg/lib/native/client.js
./node_modules/pg/lib/native/index.js
./node_modules/pg/lib/index.js
./auth.config.ts
 ⨯ Error: The edge runtime does not support Node.js 'crypto' module.
Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime
    at <unknown> (webpack-internal:///(middleware)/./node_modules/next/dist/esm/server/web/globals.js:34)
    at Object.get (webpack-internal:///(middleware)/./node_modules/next/dist/esm/server/web/globals.js:34:19)
    at eval (webpack-internal:///(middleware)/./node_modules/pg/lib/crypto/utils-webcrypto.js:22:32)
    at (middleware)/./node_modules/pg/lib/crypto/utils-webcrypto.js (file:///Users/PD/projects/prjctmeter/next-shadcn-dashboard-starter/.next/server/middleware.js:1186:1)
    at __webpack_require__ (file:///Users/PD/projects/prjctmeter/next-shadcn-dashboard-starter/.next/server/edge-runtime-webpack.js:37:33)
...
 GET /dashboard 404 in 33ms
 ⨯ Error repeated several more times ...

[Kiranism]

Could you please provide the version of your PostgreSQL? I recommend trying to downgrade to "postgres": "^3.3.5" as I came across this solution somewhere.

[Pavel-Demidyuk]

Could you please provide the version of your PostgreSQL? I recommend trying to downgrade to "postgres": "^3.3.5" as I came across this solution somewhere.

@Kiranism, thank you for the suggestion. Here is the version of PostgreSQL that I had specified in my package.json:

"pg": "^8.12.0"

Following your recommendation, I downgraded it to 3.3.5. I encountered some conflicts with the @auth/pg-adapter module during the downgrade, which I resolved by using the --force option. Unfortunately, I'm still facing the same issue; the error remains unchanged.

[Kiranism]

Following your recommendation, I downgraded it to 3.3.5. I encountered some conflicts with the @auth/pg-adapter module during the downgrade, which I resolved by using the --force option. Unfortunately, I'm still facing the same issue; the error remains unchanged.

Oh, that's unfortunate. Kindly revert back then. Another way is to try using Vercel/Postgres.

https://www.npmjs.com/package/@vercel/postgres

[Kiranism]

I hope you went through this doc. https://authjs.dev/getting-started/adapters/pg

[Pavel-Demidyuk]

I hope you went through this doc. https://authjs.dev/getting-started/adapters/pg

got it, will try, thanks @Kiranism!

[Pavel-Demidyuk]

Ok, I think I found it. The issue is that middleware.ts can't use any database staff, since it's running on the client side. It needs to be refactored, and one of the possible ways is described here.

[Kiranism]

Ok, I think I found it. The issue is that middleware.ts can't use any database staff, since it's running on the client side. It needs to be refactored, and one of the possible ways is described here.

Oh okay, lemme know how it goes.