update in core

Change description to reflect that JWT is encrypted by default

.eslintignore

@@ -0,0 +1,70 @@
+.eslintrc.js
+.cache-loader
+.DS_Store
+.pnpm-debug.log
+.turbo
+.vscode/generated*
+/_work
+/actions-runner
+node_modules
+patches
+pnpm-lock.yaml
+.github/actions/issue-validator/index.mjs
+*.cjs
+*.js
+*.d.ts
+*.d.ts.map
+
+.svelte-kit
+.next
+.nuxt
+
+# --------------- Docs ---------------
+
+.docusaurus
+build
+docs/docs/reference/03-core
+docs/docs/reference/04-sveltekit
+static
+
+# --------------- Packages ---------------
+
+coverage
+dist
+
+# @auth/core
+packages/core/src/providers/oauth-types.ts
+packages/core/src/lib/pages/styles.ts
+
+# @auth/sveltekit
+packages/frameworks-sveltekit/package
+packages/frameworks-sveltekit/vite.config.{js,ts}.timestamp-*
+
+# next-auth
+packages/next-auth/src/providers/oauth-types.ts
+packages/next-auth/css/index.css
+
+
+# Adapters
+.branches
+db.sqlite
+dev.db
+dynamodblocal-bin
+firebase-debug.log
+firestore-debug.log
+migrations
+test.schema.gql
+
+# --------------- Apps ---------------
+
+
+# Examples should have their own Prettier config since they are templates too
+apps/example-sveltekit
+
+# Development app
+apps
+
+
+# --------------- Tests ---------------
+# TODO: these should be linted
+packages/**/*test*

.eslintrc.js

@@ -0,0 +1,75 @@
+// @ts-check
+
+/** @type {import("eslint").ESLint.ConfigData} */
+module.exports = {
+  env: { browser: true, es2022: true, node: true },
+  extends: ["eslint:recommended", "prettier"],
+  overrides: [
+    {
+      files: ["*.ts", "*.tsx"],
+      parser: "@typescript-eslint/parser",
+      parserOptions: {
+        project: ["./packages/**/tsconfig.json", "./apps/**/tsconfig.json"],
+      },
+      settings: { react: { version: "18" } },
+      extends: [
+        "plugin:react/recommended",
+        "plugin:react/jsx-runtime",
+        "standard-with-typescript",
+        "prettier",
+      ],
+      rules: {
+        "@typescript-eslint/explicit-function-return-type": "off",
+        "@typescript-eslint/method-signature-style": "off",
+        "@typescript-eslint/naming-convention": "off",
+        "@typescript-eslint/no-non-null-assertion": "off",
+        "@typescript-eslint/restrict-template-expressions": "off",
+        "@typescript-eslint/strict-boolean-expressions": "off",
+        "react/prop-types": "off",
+        "react/no-unescaped-entities": "off",
+      },
+    },
+    {
+      files: ["*.test.ts", "*.test.js"],
+      extends: ["plugin:jest/recommended"],
+      env: { jest: true },
+    },
+    {
+      files: ["docs/**"],
+      plugins: ["@docusaurus"],
+      extends: ["plugin:@docusaurus/recommended"],
+    },
+    {
+      // TODO: Expand to all packages
+      files: ["packages/{core,sveltekit}/*.ts"],
+      plugins: ["jsdoc"],
+      extends: ["plugin:jsdoc/recommended"],
+      rules: {
+        "jsdoc/require-param": "off",
+        "jsdoc/require-returns": "off",
+        "jsdoc/require-jsdoc": [
+          "warn",
+          { publicOnly: true, enableFixer: false },
+        ],
+        "jsdoc/no-multi-asterisks": ["warn", { allowWhitespace: true }],
+        "jsdoc/tag-lines": "off",
+      },
+    },
+    {
+      files: ["packages/frameworks-sveltekit"],
+      plugins: ["svelte3"],
+      overrides: [{ files: ["*.svelte"], processor: "svelte3/svelte3" }],
+      settings: {
+        "svelte3/typescript": () => require("typescript"),
+      },
+      parserOptions: { sourceType: "module", ecmaVersion: 2020 },
+      env: { browser: true, es2017: true, node: true },
+    },
+  ],
+  parserOptions: {
+    sourceType: "module",
+    ecmaVersion: "latest",
+    ecmaFeatures: { jsx: true },
+  },
+  root: true,
+}

.github/ISSUE_TEMPLATE/1_bug_framework.yml

@@ -30,7 +30,7 @@ body:
         Run this command in your project's root folder and paste the result:
 
         ```sh
-        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth,@auth/*"
+        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth"
         ```
         Alternatively, you can manually gather the version information from your package.json for these packages: "next", "react" and "next-auth". Please also mention your OS and Node.js version, as well as the browser you are using.
     validations:

.github/ISSUE_TEMPLATE/2_bug_provider.yml

@@ -25,14 +25,12 @@ body:
         - "Custom provider"
         - "42 School"
         - "Apple"
-        - "Asgardeo"
         - "Atlassian"
         - "Auth0"
         - "Authentik"
         - "Azure Active Directory"
         - "Azure Active Directory B2C"
         - "Battlenet"
-        - "Beyond Identity"
         - "Box"
         - "Bungie"
         - "Cognito"
@@ -59,7 +57,6 @@ body:
         - "Medium"
         - "Naver"
         - "Netlify"
-        - "Notion"
         - "Okta"
         - "OneLogin"
         - "Osso"
@@ -90,7 +87,7 @@ body:
         Run this command in your project's root folder and paste the result:
 
         ```sh
-        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth,@auth/*"
+        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth"
         ```
         Alternatively, you can manually gather the version information from your package.json for these packages: "next", "react" and "next-auth". Please also mention your OS and Node.js version, as well as the browser you are using.
     validations:

.github/ISSUE_TEMPLATE/3_bug_adapter.yml

@@ -44,7 +44,7 @@ body:
         Run this command in your project's root folder and paste the result:
 
         ```sh
-        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth,@auth/*" && npx envinfo --npmPackages "@next-auth/*"
+        npx envinfo --system --binaries --browsers --npmPackages "next,react,next-auth" && npx envinfo --npmPackages "@next-auth/*"
         ```
         Alternatively, if the above command did not work, we need the version of the following packages from your package.json: "next", "react", "next-auth" and your adapter. Please also mention your OS and Node.js version, as well as the browser you are using.
     validations:

.github/actions/issue-validator/repro.md

@@ -14,9 +14,9 @@ Ensure the link is pointing to a codebase that is accessible (e.g. not a private
 
 ### **What happens if I don't provide a sufficient minimal reproduction?**
 
-Issues with the `incomplete` label that receives no meaningful activity (e.g. new comments with a reproduction link) are closed after 7 days.
+Issues with the `incomplete` label that receives no meaningful activity (e.g. new comments with a reproduction link) are automatically closed and locked after 30 days.
 
-If your issue has _not_ been resolved in that time and it has been closed/locked, please open a new issue with the required reproduction. (It's less likely that we check back on already closed issues.)
+If your issue has _not_ been resolved in that time and it has been closed/locked, please open a new issue with the required reproduction.
 
 ### **I did not open this issue, but it is relevant to me, what can I do to help?**
 

.github/actions/issue-validator/src/index.mjs

@@ -41,7 +41,13 @@ async function run() {
       label: { name: newLabel },
     } = payload
 
-    if (pull_request || !issue?.body || !process.env.GITHUB_TOKEN) return
+    if (
+      pull_request ||
+      !issue?.body ||
+      !process.env.GITHUB_TOKEN ||
+      !process.env.GITHUB_ACTION_PATH
+    )
+      return
 
     const labels = issue.labels.map((l) => l.name)
     // const isBugReport =
@@ -72,9 +78,7 @@ async function run() {
         client.issues.createComment({
           ...issueCommon,
           body: readFileSync(
-            join(
-              "/home/runner/work/next-auth/next-auth/.github/actions/issue-validator/repro.md"
-            ),
+            join(process.env.GITHUB_ACTION_PATH, "repro.md"),
             "utf8"
           ),
         }),

.github/sync.yml

@@ -1,3 +1,5 @@
+# Note that nextauthjs/next-auth-example syncs from the v4 branch
+
 nextauthjs/sveltekit-auth-example:
   - source: apps/examples/sveltekit
     dest: .
@@ -5,23 +7,9 @@ nextauthjs/sveltekit-auth-example:
   - .github/FUNDING.yml
   - LICENSE
 
-nextauthjs/solid-start-auth-example:
-  - source: "apps/examples/solid-start"
-    dest: .
-    deleteOrphaned: true
-  - .github/FUNDING.yml
-  - LICENSE
-
 nextauthjs/next-auth-gatsby-example:
   - source: apps/playgrounds/gatsby
     dest: .
     deleteOrphaned: true
   - .github/FUNDING.yml
   - LICENSE
-
-nextauthjs/next-auth-example:
-  - source: apps/examples/nextjs
-    dest: .
-    deleteOrphaned: true
-  - .github/FUNDING.yml
-  - LICENSE

.github/workflows/issue-validator.yml

@@ -11,7 +11,7 @@ jobs:
       - uses: actions/setup-node@v3
         with:
           node-version: 18
-      - name: Run issue validator
+      - name: "Run issue validator"
         run: node /home/runner/work/next-auth/next-auth/.github/actions/issue-validator/index.mjs
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yml

@@ -3,10 +3,10 @@ name: Release
 on:
   push:
     branches:
-      - main
-      - beta
-      - next
-      - 3.x
+      - "main"
+      - "beta"
+      - "next"
+      - "3.x"
   pull_request:
 
 jobs:
@@ -24,6 +24,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: 18
+          cache: "pnpm"
       - name: Install dependencies
         run: pnpm install
       - name: Run tests
@@ -34,22 +35,6 @@ jobs:
           UPSTASH_REDIS_KEY: ${{ secrets.UPSTASH_REDIS_KEY }}
           TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
           TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-      # - name: Run E2E tests
-      #   if: github.repository == 'nextauthjs/next-auth'
-      #   run: pnpm e2e
-      #   timeout-minutes: 15
-      #   env:
-      #     AUTH0_USERNAME: ${{ secrets.AUTH0_USERNAME }}
-      #     AUTH0_PASSWORD: ${{ secrets.AUTH0_PASSWORD }}
-      #     TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
-      #     TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-      # - name: Upload E2E artifacts
-      #   if: github.repository == 'nextauthjs/next-auth'
-      #   uses: actions/upload-artifact@v3
-      #   with:
-      #     name: playwright-report
-      #     path: apps/dev/nextjs/playwright-report/
-      #     retention-days: 30
       # - name: Coverage
       #   uses: codecov/codecov-action@v1
       #   with:
@@ -73,6 +58,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: 18
+          cache: "pnpm"
       - name: Install dependencies
         run: pnpm install
       - name: Publish to npm and GitHub
@@ -97,6 +83,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: 18
+          cache: "pnpm"
       - name: Install dependencies
         run: pnpm install
       - name: Determine version

.github/workflows/sync-examples.yml

@@ -11,9 +11,9 @@ jobs:
       - name: Checkout Repository
         uses: actions/checkout@v3
       - name: Run GitHub File Sync
-        uses: balazsorban44/repo-file-sync-action@master
+        # Can update to v1 when https://github.com/BetaHuhn/repo-file-sync-action/issues/168 is resolved
+        uses: BetaHuhn/repo-file-sync-action@v1.16.5
         with:
-          GH_PAT: ${{ secrets.GH_PAT }}
-          IS_FINE_GRAINED: true
+          GH_PAT: ${{ secrets.GH_PAT_CLASSIC }}
           SKIP_PR: true
           ORIGINAL_MESSAGE: true

.gitignore

@@ -1,5 +1,6 @@
 # Misc
 .DS_Store
+.npmrc
 .eslintcache
 .env
 .env.local
@@ -11,9 +12,8 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 firebase-debug.log
-ui-debug.log
 .pnpm-debug.log
-.husky
+
 
 # Dependencies
 node_modules
@@ -26,16 +26,26 @@ dist
 # Generated files
 .docusaurus
 .cache-loader
-
-packages/*/*.js
-packages/*/*.d.ts
-packages/*/*.d.ts.map
+packages/next-auth/providers
+packages/next-auth/src/providers/oauth-types.ts
+packages/next-auth/client
+packages/next-auth/css
+packages/next-auth/utils
+packages/next-auth/core
+packages/next-auth/jwt
+packages/next-auth/react
+packages/next-auth/adapters.d.ts
+packages/next-auth/adapters.js
+packages/next-auth/index.d.ts
+packages/next-auth/index.js
+packages/next-auth/next
+packages/next-auth/middleware.d.ts
+packages/next-auth/middleware.js
 
 # Development app
 apps/dev/src/css
 apps/dev/prisma/migrations
 apps/dev/typeorm
-apps/dev/nextjs-2
 
 # VS
 /.vs/slnx.sqlite-journal
@@ -71,16 +81,15 @@ docs/.docusaurus
 docs/providers.json
 
 # Core
-packages/core/src/providers/oauth-types.ts
+packages/core/*.js
+packages/core/*.d.ts
+packages/core/*.d.ts.map
 packages/core/lib
 packages/core/providers
 packages/core/src/lib/pages/styles.ts
-docs/docs/reference/core
-docs/docs/reference/sveltekit
-docs/docs/reference/next-auth
+docs/docs/reference/03-core
+docs/docs/reference/04-sveltekit
 
-# Next.js
-packages/next-auth/lib
 
 # SvelteKit
 packages/frameworks-sveltekit/index.*
@@ -89,7 +98,3 @@ packages/frameworks-sveltekit/.svelte-kit
 packages/frameworks-sveltekit/package
 packages/frameworks-sveltekit/vite.config.js.timestamp-*
 packages/frameworks-sveltekit/vite.config.ts.timestamp-*
-
-# Adapters
-
-docs/docs/reference/adapter

.npmrc

@@ -1 +0,0 @@
-public-hoist-pattern[]=*prisma*

.prettierignore

@@ -20,8 +20,8 @@ pnpm-lock.yaml
 
 .docusaurus
 build
-docs/docs/reference/core
-docs/docs/reference/sveltekit
+docs/docs/reference/03-core
+docs/docs/reference/04-sveltekit
 static
 docs/providers.json
 
@@ -40,6 +40,10 @@ packages/core/src/lib/pages/styles.ts
 packages/frameworks-sveltekit/package
 packages/frameworks-sveltekit/vite.config.{js,ts}.timestamp-*
 
+# next-auth
+packages/next-auth/src/providers/oauth-types.ts
+packages/next-auth/css/index.css
+
 
 # Adapters
 .branches

.prettierrc.js

@@ -0,0 +1,22 @@
+// @ts-check
+
+/** @type {import("prettier").Config} */
+module.exports = {
+  semi: false,
+  singleQuote: false,
+  overrides: [
+    {
+      files: [
+        "apps/dev/pages/api/auth/[...nextauth].ts",
+        "docs/{sidebars,docusaurus.config}.js",
+      ],
+      options: { printWidth: 150 },
+    },
+    {
+      files: ["**/*package.json"],
+      options: {
+        trailingComma: "none",
+      },
+    },
+  ],
+}

.vscode/settings.json

@@ -1,8 +1,8 @@
 {
   "files.exclude": {
-    "packages/core/{lib,providers,*.js,*.d.ts*}": true,
-    "packages/next-auth/{lib,*.js,*.d.ts*}": true,
+    "packages/core/{lib,providers,*.js,*.d.ts,*.d.ts.map}": true,
+    "packages/next-auth/{client,core,css,jwt,next,providers,react,utils,*.js,*.d.ts}": true
   },
   "typescript.tsdk": "node_modules/typescript/lib",
   "openInGitHub.remote.branch": "main"
-}
+}

apps/dev/nextjs-v4/.env.local.example

@@ -1,58 +0,0 @@
-# Rename file to .env.local (or .env) and populate values
-# to be able to run the dev app
-
-NEXTAUTH_URL=http://localhost:3000
-
-# You can use `openssl rand -hex 32` or 
-# https://generate-secret.vercel.app/32 to generate a secret.
-# Note: Changing a secret may invalidate existing sessions
-# and/or verification tokens.
-NEXTAUTH_SECRET=secret
-
-AUTH0_ID=
-AUTH0_SECRET=
-AUTH0_ISSUER=
-
-KEYCLOAK_ID=
-KEYCLOAK_SECRET=
-KEYCLOAK_ISSUER=
-
-IDS4_ID=
-IDS4_SECRET=
-IDS4_ISSUER=
-
-GITHUB_ID=
-GITHUB_SECRET=
-
-TWITCH_ID=
-TWITCH_SECRET=
-
-TWITTER_ID=
-TWITTER_SECRET=
-
-LINE_ID=
-LINE_SECRET=
-
-TRAKT_ID=
-TRAKT_SECRET=
-
-# Example configuration for a Gmail account (will need SMTP enabled)
-EMAIL_SERVER=smtps://user@gmail.com:password@smtp.gmail.com:465
-EMAIL_FROM=user@gmail.com
-
-# Note: If using with Prisma adapter, you need to use a `.env`
-# file rather than a `.env.local` file to configure env vars.
-# Postgres: DATABASE_URL=postgres://nextauth:password@127.0.0.1:5432/nextauth?synchronize=true
-# MySQL:    DATABASE_URL=mysql://nextauth:password@127.0.0.1:3306/nextauth?synchronize=true
-# MongoDB:  DATABASE_URL=mongodb://nextauth:password@127.0.0.1:27017/nextauth?synchronize=true
-DATABASE_URL=
-
-WIKIMEDIA_ID=
-WIKIMEDIA_SECRET=
-
-# Supabase Example Configuration
-# Supabase Example Configuration
-# NEXT_PUBLIC_SUPABASE_URL=http://localhost:54321
-# SUPABASE_SERVICE_ROLE_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6InNlcnZpY2Vfcm9sZSJ9.vI9obAHOGyVVKa3pD--kJlyxp-Z2zV9UUMAhKpNLAcU
-# SUPABASE_JWT_SECRET=super-secret-jwt-token-with-at-least-32-characters-long
-# NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24ifQ.625_WdcF3KHqz5amU0x2X5WWHP-OEs_4qj0ssLNHzTs

apps/dev/nextjs-v4/.vscode/settings.json

@@ -1,4 +0,0 @@
-{
-  "typescript.tsdk": "../../node_modules/.pnpm/typescript@4.8.4/node_modules/typescript/lib",
-  "typescript.enablePromptUseWorkspaceTsdk": true
-}

apps/dev/nextjs-v4/README.md

@@ -1,6 +0,0 @@
-# NextAuth.js Development App
-
-This folder contains a Next.js app using NextAuth.js for local development. See the following section on how to start:
-
-[Setting up local environment
-](https://github.com/nextauthjs/next-auth/blob/main/CONTRIBUTING.md#setting-up-local-environment)

apps/dev/nextjs-v4/app/api/auth/[...nextauth]/route.ts

@@ -1,14 +0,0 @@
-import NextAuth, { type NextAuthOptions } from "next-auth"
-import GitHub from "next-auth/providers/github"
-
-export const authOptions: NextAuthOptions = {
-  providers: [
-    GitHub({
-      clientId: process.env.GITHUB_ID,
-      clientSecret: process.env.GITHUB_SECRET,
-    }),
-  ],
-}
-
-const handler = NextAuth(authOptions)
-export { handler as GET, handler as POST }

apps/dev/nextjs-v4/app/layout.tsx

@@ -1,12 +0,0 @@
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode
-}) {
-  return (
-    <html>
-      <head></head>
-      <body>{children}</body>
-    </html>
-  )
-}

apps/dev/nextjs-v4/app/server-component/page.tsx

@@ -1,6 +0,0 @@
-import { getServerSession } from "next-auth/next"
-
-export default async function Page() {
-  const session = await getServerSession()
-  return <pre>{JSON.stringify(session, null, 2)}</pre>
-}

apps/dev/nextjs-v4/components/access-denied.js

@@ -1,20 +0,0 @@
-import { signIn } from "next-auth/react"
-
-export default function AccessDenied() {
-  return (
-    <>
-      <h1>Access Denied</h1>
-      <p>
-        <a
-          href="/api/auth/signin"
-          onClick={(e) => {
-            e.preventDefault()
-            signIn()
-          }}
-        >
-          You must be signed in to view this page
-        </a>
-      </p>
-    </>
-  )
-}

apps/dev/nextjs-v4/components/footer.js

@@ -1,28 +0,0 @@
-import Link from "next/link"
-import styles from "./footer.module.css"
-import packageJSON from "package.json"
-
-export default function Footer() {
-  return (
-    <footer className={styles.footer}>
-      <hr />
-      <ul className={styles.navItems}>
-        <li className={styles.navItem}>
-          <a href="https://next-auth.js.org">Documentation</a>
-        </li>
-        <li className={styles.navItem}>
-          <a href="https://www.npmjs.com/package/next-auth">NPM</a>
-        </li>
-        <li className={styles.navItem}>
-          <a href="https://github.com/nextauthjs/next-auth-example">GitHub</a>
-        </li>
-        <li className={styles.navItem}>
-          <Link href="/policy">Policy</Link>
-        </li>
-        <li className={styles.navItem}>
-          <em>{packageJSON.version}</em>
-        </li>
-      </ul>
-    </footer>
-  )
-}

apps/dev/nextjs-v4/components/footer.module.css

@@ -1,14 +0,0 @@
-.footer {
-  margin-top: 2rem;
-}
-
-.navItems {
-  margin-bottom: 1rem;
-  padding: 0;
-  list-style: none;
-}
-
-.navItem {
-  display: inline-block;
-  margin-right: 1rem;
-}

apps/dev/nextjs-v4/components/header.js

@@ -1,103 +0,0 @@
-import Link from "next/link"
-import { signIn, signOut, useSession } from "next-auth/react"
-import styles from "./header.module.css"
-
-// The approach used in this component shows how to built a sign in and sign out
-// component that works on pages which support both client and server side
-// rendering, and avoids any flash incorrect content on initial page load.
-export default function Header() {
-  const { data: session, status } = useSession()
-
-  return (
-    <header>
-      <noscript>
-        <style>{".nojs-show { opacity: 1; top: 0; }"}</style>
-      </noscript>
-      <div className={styles.signedInStatus}>
-        <p
-          className={`nojs-show ${
-            !session && status === "loading" ? styles.loading : styles.loaded
-          }`}
-        >
-          {!session && (
-            <>
-              <span className={styles.notSignedInText}>
-                You are not signed in
-              </span>
-              <a
-                href="/api/auth/signin"
-                className={styles.buttonPrimary}
-                onClick={(e) => {
-                  e.preventDefault()
-                  signIn()
-                }}
-              >
-                Sign in
-              </a>
-            </>
-          )}
-          {session && (
-            <>
-              {session.user.image && (
-                <img src={session.user.image} className={styles.avatar} />
-              )}
-              <span className={styles.signedInText}>
-                <small>Signed in as</small>
-                <br />
-                <strong>{session.user.email} </strong>
-                {session.user.name ? `(${session.user.name})` : null}
-              </span>
-              <a
-                href="/api/auth/signout"
-                className={styles.button}
-                onClick={(e) => {
-                  e.preventDefault()
-                  signOut()
-                }}
-              >
-                Sign out
-              </a>
-            </>
-          )}
-        </p>
-      </div>
-      <nav>
-        <ul className={styles.navItems}>
-          <li className={styles.navItem}>
-            <Link href="/">Home</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/client">Client</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/server">Server</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/protected">Protected</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/protected-ssr">Protected(SSR)</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/api-example">API</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/credentials">Credentials</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/email">Email</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/middleware-protected">Middleware protected</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/supabase-client-rls">Supabase RLS</Link>
-          </li>
-          <li className={styles.navItem}>
-            <Link href="/supabase-ssr">Supabase RLS(SSR)</Link>
-          </li>
-        </ul>
-      </nav>
-    </header>
-  )
-}

apps/dev/nextjs-v4/components/header.module.css

@@ -1,92 +0,0 @@
-/* Set min-height to avoid page reflow while session loading */
-.signedInStatus {
-  display: block;
-  min-height: 4rem;
-  width: 100%;
-}
-
-.loading,
-.loaded {
-  position: relative;
-  top: 0;
-  opacity: 1;
-  overflow: hidden;
-  border-radius: 0 0 .6rem .6rem;
-  padding: .6rem 1rem;
-  margin: 0;
-  background-color: rgba(0,0,0,.05);
-  transition: all 0.2s ease-in;
-}
-
-.loading {
-  top: -2rem;
-  opacity: 0;
-}
-
-.signedInText,
-.notSignedInText {
-  position: absolute;
-  padding-top: .8rem;
-  left: 1rem;
-  right: 6.5rem;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  display: inherit;  
-  z-index: 1;
-  line-height: 1.3rem;
-}
-
-.signedInText {
-  padding-top: 0rem;
-  left: 4.6rem;
-}
-
-.avatar {
-  border-radius: 2rem;
-  float: left;
-  height: 2.8rem;
-  width: 2.8rem;
-  background-color: white;
-  background-size: cover;
-  background-repeat: no-repeat;
-}
-
-.button,
-.buttonPrimary {
-  float: right;
-  margin-right: -.4rem;
-  font-weight: 500;
-  border-radius: .3rem;
-  cursor: pointer;
-  font-size: 1rem;
-  line-height: 1.4rem;
-  padding: .7rem .8rem;
-  position: relative;
-  z-index: 10;
-  background-color: transparent;
-  color: #555;
-}
-
-.buttonPrimary {
-  background-color: #346df1;
-  border-color: #346df1;
-  color: #fff;
-  text-decoration: none;
-  padding: .7rem 1.4rem;
-}
-
-.buttonPrimary:hover {
-  box-shadow: inset 0 0 5rem rgba(0,0,0,0.2)
-}
-
-.navItems {
-  margin-bottom: 2rem;
-  padding: 0;
-  list-style: none;
-}
-
-.navItem {
-  display: inline-block;
-  margin-right: 1rem;
-}

apps/dev/nextjs-v4/components/layout.js

@@ -1,14 +0,0 @@
-import Header from 'components/header'
-import Footer from 'components/footer'
-
-export default function Layout ({ children }) {
-  return (
-    <>
-      <Header />
-      <main>
-        {children}
-      </main>
-      <Footer />
-    </>
-  )
-}

apps/dev/nextjs-v4/middleware.ts

@@ -1,45 +0,0 @@
-export { default } from "next-auth/middleware"
-
-export const config = { matcher: ["/middleware-protected"] }
-
-// Other ways to use this middleware
-
-// import withAuth from "next-auth/middleware"
-// import { withAuth } from "next-auth/middleware"
-
-// export function middleware(req, ev) {
-//   return withAuth(req)
-// }
-
-// export function middleware(req, ev) {
-//   return withAuth(req, ev)
-// }
-
-// export function middleware(req, ev) {
-//   return withAuth(req, {
-//     callbacks: {
-//       authorized: ({ token }) => !!token,
-//     },
-//   })
-// }
-
-// export default withAuth(function middleware(req, ev) {
-//   console.log(req.nextauth.token)
-// })
-
-// export default withAuth(
-//   function middleware(req, ev) {
-//     console.log(req, ev)
-//   },
-//   {
-//     callbacks: {
-//       authorized: ({ token }) => token.name === "Balázs Orbán",
-//     },
-//   }
-// )
-
-// export default withAuth({
-//   callbacks: {
-//     authorized: ({ token }) => !!token,
-//   },
-// })

apps/dev/nextjs-v4/next-env.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="next" />
-/// <reference types="next/image-types/global" />
-/// <reference types="next/navigation-types/compat/navigation" />
-
-// NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.

apps/dev/nextjs-v4/next.config.js

@@ -1,9 +0,0 @@
-/** @type {import("next").NextConfig} */
-module.exports = {
-  webpack(config) {
-    config.experiments = { ...config.experiments, topLevelAwait: true }
-    return config
-  },
-  experimental: { appDir: true },
-  typescript: { ignoreBuildErrors: true },
-}

apps/dev/nextjs-v4/package.json

@@ -1,40 +0,0 @@
-{
-  "name": "next-auth-app-v4",
-  "version": "1.0.0",
-  "description": "NextAuth.js Developer app",
-  "private": true,
-  "scripts": {
-    "clean": "rm -rf .next",
-    "dev": "next dev",
-    "lint": "next lint",
-    "build": "next build",
-    "start": "next start",
-    "email": "fake-smtp-server",
-    "start:email": "pnpm email"
-  },
-  "license": "ISC",
-  "dependencies": {
-    "@next-auth/fauna-adapter": "workspace:*",
-    "@next-auth/prisma-adapter": "workspace:*",
-    "@next-auth/supabase-adapter": "workspace:*",
-    "@next-auth/typeorm-legacy-adapter": "workspace:*",
-    "@prisma/client": "^3",
-    "@supabase/supabase-js": "^2.0.5",
-    "faunadb": "^4",
-    "next": "13.3.0",
-    "next-auth": "workspace:*",
-    "nodemailer": "^6",
-    "react": "^18",
-    "react-dom": "^18"
-  },
-  "devDependencies": {
-    "@types/jsonwebtoken": "^8.5.5",
-    "@types/react": "^18.0.37",
-    "@types/react-dom": "^18.0.6",
-    "fake-smtp-server": "^0.8.0",
-    "pg": "^8.7.3",
-    "prisma": "^3",
-    "sqlite3": "^5.0.8",
-    "typeorm": "0.3.7"
-  }
-}

apps/dev/nextjs-v4/pages/_app.js

@@ -1,10 +0,0 @@
-import { SessionProvider } from "next-auth/react"
-import "./styles.css"
-
-export default function App({ Component, pageProps }) {
-  return (
-    <SessionProvider session={pageProps.session}>
-      <Component {...pageProps} />
-    </SessionProvider>
-  )
-}

apps/dev/nextjs-v4/pages/api/auth-old/[...nextauth].ts

@@ -1,132 +0,0 @@
-import NextAuth, { NextAuthOptions } from "next-auth"
-
-// Providers
-import Apple from "next-auth/providers/apple"
-import Auth0 from "next-auth/providers/auth0"
-import AzureAD from "next-auth/providers/azure-ad"
-import AzureB2C from "next-auth/providers/azure-ad-b2c"
-import BoxyHQSAML from "next-auth/providers/boxyhq-saml"
-// import Cognito from "next-auth/providers/cognito"
-import Credentials from "next-auth/providers/credentials"
-import Discord from "next-auth/providers/discord"
-import DuendeIDS6 from "next-auth/providers/duende-identity-server6"
-// import Email from "next-auth/providers/email"
-import Facebook from "next-auth/providers/facebook"
-import Foursquare from "next-auth/providers/foursquare"
-import Freshbooks from "next-auth/providers/freshbooks"
-import GitHub from "next-auth/providers/github"
-import Gitlab from "next-auth/providers/gitlab"
-import Google from "next-auth/providers/google"
-// import IDS4 from "next-auth/providers/identity-server4"
-import Instagram from "next-auth/providers/instagram"
-// import Keycloak from "next-auth/providers/keycloak"
-import Line from "next-auth/providers/line"
-import LinkedIn from "next-auth/providers/linkedin"
-import Mailchimp from "next-auth/providers/mailchimp"
-// import Okta from "next-auth/providers/okta"
-import Osu from "next-auth/providers/osu"
-import Patreon from "next-auth/providers/patreon"
-import Slack from "next-auth/providers/slack"
-import Spotify from "next-auth/providers/spotify"
-import Trakt from "next-auth/providers/trakt"
-import Twitch from "next-auth/providers/twitch"
-import Twitter from "next-auth/providers/twitter"
-import Vk from "next-auth/providers/vk"
-import Wikimedia from "next-auth/providers/wikimedia"
-import WorkOS from "next-auth/providers/workos"
-
-// // Prisma
-// import { PrismaClient } from "@prisma/client"
-// import { PrismaAdapter } from "@next-auth/prisma-adapter"
-// const client = globalThis.prisma || new PrismaClient()
-// if (process.env.NODE_ENV !== "production") globalThis.prisma = client
-// const adapter = PrismaAdapter(client)
-
-// // Fauna
-// import { Client as FaunaClient } from "faunadb"
-// import { FaunaAdapter } from "@next-auth/fauna-adapter"
-// const opts = { secret: process.env.FAUNA_SECRET, domain: process.env.FAUNA_DOMAIN }
-// const client = globalThis.fauna || new FaunaClient(opts)
-// if (process.env.NODE_ENV !== "production") globalThis.fauna = client
-// const adapter = FaunaAdapter(client)
-
-// // TypeORM
-// import { TypeORMLegacyAdapter } from "@next-auth/typeorm-legacy-adapter"
-// const adapter = TypeORMLegacyAdapter({
-//   type: "sqlite",
-//   name: "next-auth-test-memory",
-//   database: "./typeorm/dev.db",
-//   synchronize: true,
-// })
-
-// // Supabase
-// import { SupabaseAdapter } from "@next-auth/supabase-adapter"
-// const adapter = SupabaseAdapter({
-//   url: process.env.NEXT_PUBLIC_SUPABASE_URL,
-//   secret: process.env.SUPABASE_SERVICE_ROLE_KEY,
-// })
-
-export const authOptions: NextAuthOptions = {
-  // adapter,
-  // debug: process.env.NODE_ENV !== "production",
-  theme: {
-    logo: "https://next-auth.js.org/img/logo/logo-sm.png",
-    brandColor: "#1786fb",
-  },
-  providers: [
-    Credentials({
-      credentials: { password: { label: "Password", type: "password" } },
-      async authorize(credentials) {
-        if (credentials.password !== "pw") return null
-        return { name: "Fill Murray", email: "bill@fillmurray.com", image: "https://www.fillmurray.com/64/64", id: "1", foo: "" }
-      },
-    }),
-    Apple({ clientId: process.env.APPLE_ID, clientSecret: process.env.APPLE_SECRET }),
-    Auth0({ clientId: process.env.AUTH0_ID, clientSecret: process.env.AUTH0_SECRET, issuer: process.env.AUTH0_ISSUER }),
-    AzureAD({
-      clientId: process.env.AZURE_AD_CLIENT_ID,
-      clientSecret: process.env.AZURE_AD_CLIENT_SECRET,
-      tenantId: process.env.AZURE_AD_TENANT_ID,
-    }),
-    AzureB2C({ clientId: process.env.AZURE_B2C_ID, clientSecret: process.env.AZURE_B2C_SECRET, issuer: process.env.AZURE_B2C_ISSUER }),
-    BoxyHQSAML({ issuer: "https://jackson-demo.boxyhq.com", clientId: "tenant=boxyhq.com&product=saml-demo.boxyhq.com", clientSecret: "dummy" }),
-    // Cognito({ clientId: process.env.COGNITO_ID, clientSecret: process.env.COGNITO_SECRET, issuer: process.env.COGNITO_ISSUER }),
-    Discord({ clientId: process.env.DISCORD_ID, clientSecret: process.env.DISCORD_SECRET }),
-    DuendeIDS6({ clientId: "interactive.confidential", clientSecret: "secret", issuer: "https://demo.duendesoftware.com" }),
-    Facebook({ clientId: process.env.FACEBOOK_ID, clientSecret: process.env.FACEBOOK_SECRET }),
-    Foursquare({ clientId: process.env.FOURSQUARE_ID, clientSecret: process.env.FOURSQUARE_SECRET }),
-    Freshbooks({ clientId: process.env.FRESHBOOKS_ID, clientSecret: process.env.FRESHBOOKS_SECRET }),
-    GitHub({ clientId: process.env.GITHUB_ID, clientSecret: process.env.GITHUB_SECRET }),
-    Gitlab({ clientId: process.env.GITLAB_ID, clientSecret: process.env.GITLAB_SECRET }),
-    Google({ clientId: process.env.GOOGLE_ID, clientSecret: process.env.GOOGLE_SECRET }),
-    // IDS4({ clientId: process.env.IDS4_ID, clientSecret: process.env.IDS4_SECRET, issuer: process.env.IDS4_ISSUER }),
-    Instagram({ clientId: process.env.INSTAGRAM_ID, clientSecret: process.env.INSTAGRAM_SECRET }),
-    // Keycloak({ clientId: process.env.KEYCLOAK_ID, clientSecret: process.env.KEYCLOAK_SECRET, issuer: process.env.KEYCLOAK_ISSUER }),
-    Line({ clientId: process.env.LINE_ID, clientSecret: process.env.LINE_SECRET }),
-    LinkedIn({ clientId: process.env.LINKEDIN_ID, clientSecret: process.env.LINKEDIN_SECRET }),
-    Mailchimp({ clientId: process.env.MAILCHIMP_ID, clientSecret: process.env.MAILCHIMP_SECRET }),
-    // Okta({ clientId: process.env.OKTA_ID, clientSecret: process.env.OKTA_SECRET, issuer: process.env.OKTA_ISSUER }),
-    Osu({ clientId: process.env.OSU_CLIENT_ID, clientSecret: process.env.OSU_CLIENT_SECRET }),
-    Patreon({ clientId: process.env.PATREON_ID, clientSecret: process.env.PATREON_SECRET }),
-    Slack({ clientId: process.env.SLACK_ID, clientSecret: process.env.SLACK_SECRET }),
-    Spotify({ clientId: process.env.SPOTIFY_ID, clientSecret: process.env.SPOTIFY_SECRET }),
-    Trakt({ clientId: process.env.TRAKT_ID, clientSecret: process.env.TRAKT_SECRET }),
-    Twitch({ clientId: process.env.TWITCH_ID, clientSecret: process.env.TWITCH_SECRET }),
-    Twitter({ clientId: process.env.TWITTER_ID, clientSecret: process.env.TWITTER_SECRET }),
-    // TwitterLegacy({ clientId: process.env.TWITTER_LEGACY_ID, clientSecret: process.env.TWITTER_LEGACY_SECRET }),
-    Vk({ clientId: process.env.VK_ID, clientSecret: process.env.VK_SECRET }),
-    Wikimedia({ clientId: process.env.WIKIMEDIA_ID, clientSecret: process.env.WIKIMEDIA_SECRET }),
-    WorkOS({ clientId: process.env.WORKOS_ID, clientSecret: process.env.WORKOS_SECRET }),
-  ],
-}
-
-if (authOptions.adapter) {
-  // TODO:
-  // authOptions.providers.unshift(
-  //   // NOTE: You can start a fake e-mail server with `pnpm email`
-  //   // and then go to `http://localhost:1080` in the browser
-  //   Email({ server: "smtp://127.0.0.1:1025?tls.rejectUnauthorized=false" })
-  // )
-}
-
-export default NextAuth(authOptions)

apps/dev/nextjs-v4/pages/api/examples/jwt.js

@@ -1,7 +0,0 @@
-// This is an example of how to read a JSON Web Token from an API route
-import { getToken } from "next-auth/jwt"
-
-export default async (req, res) => {
-  const token = await getToken({ req })
-  res.send(JSON.stringify(token, null, 2))
-}

apps/dev/nextjs-v4/pages/client.js

@@ -1,22 +0,0 @@
-import Layout from '../components/layout'
-
-export default function Page () {
-  return (
-    <Layout>
-      <h1>Client Side Rendering</h1>
-      <p>
-        This page uses the <strong>useSession()</strong> React Hook in the <strong>&lt;/Header&gt;</strong> component.
-      </p>
-      <p>
-        The <strong>useSession()</strong> React Hook easy to use and allows pages to render very quickly.
-      </p>
-      <p>
-        The advantage of this approach is that session state is shared between pages by using the <strong>Provider</strong> in <strong>_app.js</strong> so
-        that navigation between pages using <strong>useSession()</strong> is very fast.
-      </p>
-      <p>
-        The disadvantage of <strong>useSession()</strong> is that it requires client side JavaScript.
-      </p>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/credentials.js

@@ -1,67 +0,0 @@
-// eslint-disable-next-line no-use-before-define
-import * as React from "react"
-import { signIn, signOut, useSession } from "next-auth/react"
-import Layout from "components/layout"
-
-export default function Page() {
-  const [response, setResponse] = React.useState(null)
-  const handleLogin = (options) => async () => {
-    if (options.redirect) {
-      return signIn("credentials", options)
-    }
-    const response = await signIn("credentials", options)
-    setResponse(response)
-  }
-
-  const handleLogout = (options) => async () => {
-    if (options.redirect) {
-      return signOut(options)
-    }
-    const response = await signOut(options)
-    setResponse(response)
-  }
-
-  const { data: session } = useSession()
-
-  if (session) {
-    return (
-      <Layout>
-        <h1>Test different flows for Credentials logout</h1>
-        <span className="spacing">Default:</span>
-        <button onClick={handleLogout({ redirect: true })}>Logout</button>
-        <br />
-        <span className="spacing">No redirect:</span>
-        <button onClick={handleLogout({ redirect: false })}>Logout</button>
-        <br />
-        <p>Response:</p>
-        <pre style={{ background: "#eee", padding: 16 }}>
-          {JSON.stringify(response, null, 2)}
-        </pre>
-      </Layout>
-    )
-  }
-
-  return (
-    <Layout>
-      <h1>Test different flows for Credentials login</h1>
-      <span className="spacing">Default:</span>
-      <button onClick={handleLogin({ redirect: true, password: "password" })}>
-        Login
-      </button>
-      <br />
-      <span className="spacing">No redirect:</span>
-      <button onClick={handleLogin({ redirect: false, password: "password" })}>
-        Login
-      </button>
-      <br />
-      <span className="spacing">No redirect, wrong password:</span>
-      <button onClick={handleLogin({ redirect: false, password: "" })}>
-        Login
-      </button>
-      <p>Response:</p>
-      <pre style={{ background: "#eee", padding: 16 }}>
-        {JSON.stringify(response, null, 2)}
-      </pre>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/email.js

@@ -1,80 +0,0 @@
-// eslint-disable-next-line no-use-before-define
-import * as React from "react"
-import { signIn, signOut, useSession } from "next-auth/react"
-import Layout from "components/layout"
-
-export default function Page() {
-  const [response, setResponse] = React.useState(null)
-  const [email, setEmail] = React.useState("")
-
-  const handleChange = (event) => {
-    setEmail(event.target.value)
-  }
-
-  const handleLogin = (options) => async (event) => {
-    event.preventDefault()
-
-    if (options.redirect) {
-      return signIn("email", options)
-    }
-    const response = await signIn("email", options)
-    setResponse(response)
-  }
-
-  const handleLogout = (options) => async (event) => {
-    if (options.redirect) {
-      return signOut(options)
-    }
-    const response = await signOut(options)
-    setResponse(response)
-  }
-
-  const { data: session } = useSession()
-
-  if (session) {
-    return (
-      <Layout>
-        <h1>Test different flows for Email logout</h1>
-        <span className="spacing">Default:</span>
-        <button onClick={handleLogout({ redirect: true })}>Logout</button>
-        <br />
-        <span className="spacing">No redirect:</span>
-        <button onClick={handleLogout({ redirect: false })}>Logout</button>
-        <br />
-        <p>Response:</p>
-        <pre style={{ background: "#eee", padding: 16 }}>
-          {JSON.stringify(response, null, 2)}
-        </pre>
-      </Layout>
-    )
-  }
-
-  return (
-    <Layout>
-      <h1>Test different flows for Email login</h1>
-      <label className="spacing">
-        Email address:{" "}
-        <input
-          type="text"
-          id="email"
-          name="email"
-          value={email}
-          onChange={handleChange}
-        />
-      </label>
-      <br />
-      <form onSubmit={handleLogin({ redirect: true, email })}>
-        <span className="spacing">Default:</span>
-        <button type="submit">Sign in with Email</button>
-      </form>
-      <form onSubmit={handleLogin({ redirect: false, email })}>
-        <span className="spacing">No redirect:</span>
-        <button type="submit">Sign in with Email</button>
-      </form>
-      <p>Response:</p>
-      <pre style={{ background: "#eee", padding: 16 }}>
-        {JSON.stringify(response, null, 2)}
-      </pre>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/index.js

@@ -1,12 +0,0 @@
-import Layout from 'components/layout'
-
-export default function Page () {
-  return (
-    <Layout>
-      <h1>NextAuth.js Example</h1>
-      <p>
-        This is an example site to demonstrate how to use <a href='https://next-auth.js.org'>NextAuth.js</a> for authentication.
-      </p>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/middleware-protected/index.js

@@ -1,9 +0,0 @@
-import Layout from "components/layout"
-
-export default function Page() {
-  return (
-    <Layout>
-      <h1>Page protected by Middleware</h1>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/policy.js

@@ -1,30 +0,0 @@
-import Layout from '../components/layout'
-
-export default function Page () {
-  return (
-    <Layout>
-      <p>
-        This is an example site to demonstrate how to use <a href='https://next-auth.js.org'>NextAuth.js</a> for authentication.
-      </p>
-      <h2>Terms of Service</h2>
-      <p>
-        THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-        IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-        FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-        AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-        LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-        OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-        SOFTWARE.
-      </p>
-      <h2>Privacy Policy</h2>
-      <p>
-        This site uses JSON Web Tokens and an in-memory database which resets every ~2 hours.
-      </p>
-      <p>
-        Data provided to this site is exclusively used to support signing in
-        and is not passed to any third party services, other than via SMTP or OAuth for the
-        purposes of authentication.
-      </p>
-    </Layout>
-  )
-}

apps/dev/nextjs-v4/pages/protected-ssr.js

@@ -1,48 +0,0 @@
-// This is an example of how to protect content using server rendering
-import { getServerSession } from "next-auth/next"
-import { authOptions } from "./api/auth/[...nextauth]"
-import Layout from "../components/layout"
-import AccessDenied from "../components/access-denied"
-
-export default function Page({ content, session }) {
-  // If no session exists, display access denied message
-  if (!session) {
-    return (
-      <Layout>
-        <AccessDenied />
-      </Layout>
-    )
-  }
-
-  // If session exists, display content
-  return (
-    <Layout>
-      <h1>Protected Page</h1>
-      <p>
-        <strong>{content}</strong>
-      </p>
-    </Layout>
-  )
-}
-
-export async function getServerSideProps(context) {
-  const session = await getServerSession(context.req, context.res, authOptions)
-  let content = null
-
-  if (session) {
-    const hostname = process.env.NEXTAUTH_URL || "http://localhost:3000"
-    const options = { headers: { cookie: context.req.headers.cookie } }
-    const res = await fetch(`${hostname}/api/examples/protected`, options)
-    const json = await res.json()
-    if (json.content) {
-      content = json.content
-    }
-  }
-
-  return {
-    props: {
-      session,
-      content,
-    },
-  }
-}

apps/dev/nextjs-v4/pages/server.js

@@ -1,46 +0,0 @@
-import { getServerSession } from "next-auth/next"
-import Layout from "../components/layout"
-import { authOptions } from "./api/auth/[...nextauth]"
-
-export default function Page() {
-  // As this page uses Server Side Rendering, the `session` will be already
-  // populated on render without needing to go through a loading stage.
-  // This is possible because of the shared context configured in `_app.js` that
-  // is used by `useSession()`.
-
-  return (
-    <Layout>
-      <h1>Server Side Rendering</h1>
-      <p>
-        This page uses the <strong>getServerSession()</strong> method in{" "}
-        <strong>getServerSideProps()</strong>.
-      </p>
-      <p>
-        Using <strong>getServerSession()</strong> in{" "}
-        <strong>getServerSideProps()</strong> is currently the recommended
-        approach, although the API may still change, if you need to support
-        Server Side Rendering with authentication.
-      </p>
-      <p>
-        Using <strong>getSession()</strong> is still recommended on the client.
-      </p>
-      <p>
-        The advantage of Server Side Rendering is this page does not require
-        client side JavaScript.
-      </p>
-      <p>
-        The disadvantage of Server Side Rendering is that this page is slower to
-        render.
-      </p>
-    </Layout>
-  )
-}
-
-// Export the `session` prop to use sessions with Server Side Rendering
-export async function getServerSideProps(context) {
-  return {
-    props: {
-      session: await getServerSession(context.req, context.res, authOptions),
-    },
-  }
-}

apps/dev/nextjs-v4/pages/styles.css

@@ -1,32 +0,0 @@
-body {
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
-    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
-    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  padding: 0 1rem 1rem 1rem;
-  max-width: 680px;
-  margin: 0 auto;
-  background: #fff;
-  color: var(--color-text);
-}
-
-li,
-p {
-  line-height: 1.5rem;
-}
-
-a {
-  font-weight: 500;
-}
-
-hr {
-  border: 1px solid #ddd;
-}
-
-iframe {
-  background: #ccc;
-  border: 1px solid #ccc;
-  height: 10rem;
-  width: 100%;
-  border-radius: .5rem;
-  filter: invert(1);
-}

apps/dev/nextjs-v4/prisma/migrations/20230325081057_test/migration.sql

@@ -1,60 +0,0 @@
--- CreateTable
-CREATE TABLE "Account" (
-    "id" TEXT NOT NULL PRIMARY KEY,
-    "userId" TEXT NOT NULL,
-    "type" TEXT NOT NULL,
-    "provider" TEXT NOT NULL,
-    "providerAccountId" TEXT NOT NULL,
-    "refresh_token" TEXT,
-    "access_token" TEXT,
-    "expires_at" INTEGER,
-    "token_type" TEXT,
-    "scope" TEXT,
-    "id_token" TEXT,
-    "session_state" TEXT,
-    "oauth_token_secret" TEXT,
-    "oauth_token" TEXT,
-    "createdAt" DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
-    "updatedAt" DATETIME NOT NULL,
-    CONSTRAINT "Account_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User" ("id") ON DELETE RESTRICT ON UPDATE CASCADE
-);
-
--- CreateTable
-CREATE TABLE "Session" (
-    "id" TEXT NOT NULL PRIMARY KEY,
-    "sessionToken" TEXT NOT NULL,
-    "userId" TEXT NOT NULL,
-    "expires" DATETIME NOT NULL,
-    CONSTRAINT "Session_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User" ("id") ON DELETE RESTRICT ON UPDATE CASCADE
-);
-
--- CreateTable
-CREATE TABLE "User" (
-    "id" TEXT NOT NULL PRIMARY KEY,
-    "name" TEXT,
-    "email" TEXT,
-    "emailVerified" DATETIME,
-    "image" TEXT
-);
-
--- CreateTable
-CREATE TABLE "VerificationToken" (
-    "identifier" TEXT NOT NULL,
-    "token" TEXT NOT NULL,
-    "expires" DATETIME NOT NULL
-);
-
--- CreateIndex
-CREATE UNIQUE INDEX "Account_provider_providerAccountId_key" ON "Account"("provider", "providerAccountId");
-
--- CreateIndex
-CREATE UNIQUE INDEX "Session_sessionToken_key" ON "Session"("sessionToken");
-
--- CreateIndex
-CREATE UNIQUE INDEX "User_email_key" ON "User"("email");
-
--- CreateIndex
-CREATE UNIQUE INDEX "VerificationToken_token_key" ON "VerificationToken"("token");
-
--- CreateIndex
-CREATE UNIQUE INDEX "VerificationToken_identifier_token_key" ON "VerificationToken"("identifier", "token");

apps/dev/nextjs-v4/prisma/migrations/migration_lock.toml

@@ -1,3 +0,0 @@
-# Please do not edit this file manually
-# It should be added in your version-control system (i.e. Git)
-provider = "sqlite"

apps/dev/nextjs-v4/prisma/schema.prisma

@@ -1,57 +0,0 @@
-datasource db {
-  provider = "sqlite"
-  url      = "file:./dev.db"
-}
-
-generator client {
-  provider = "prisma-client-js"
-}
-
-model Account {
-  id                 String  @id @default(cuid())
-  userId             String
-  type               String
-  provider           String
-  providerAccountId  String
-  refresh_token      String?
-  access_token       String?
-  expires_at         Int?
-  token_type         String?
-  scope              String?
-  id_token           String?
-  session_state      String?
-  oauth_token_secret String?
-  oauth_token        String?
-
-  createdAt DateTime @default(now())
-  updatedAt DateTime @updatedAt
-  user      User     @relation(fields: [userId], references: [id])
-
-  @@unique([provider, providerAccountId])
-}
-
-model Session {
-  id           String   @id @default(cuid())
-  sessionToken String   @unique
-  userId       String
-  expires      DateTime
-  user         User     @relation(fields: [userId], references: [id])
-}
-
-model User {
-  id            String    @id @default(cuid())
-  name          String?
-  email         String?   @unique
-  emailVerified DateTime?
-  image         String?
-  accounts      Account[]
-  sessions      Session[]
-}
-
-model VerificationToken {
-  identifier String
-  token      String   @unique
-  expires    DateTime
-
-  @@unique([identifier, token])
-}

apps/dev/nextjs-v4/tsconfig.json

@@ -1,39 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": false,
-    "forceConsistentCasingInFileNames": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "incremental": true,
-    "jsx": "preserve",
-    "baseUrl": ".",
-    "plugins": [
-      {
-        "name": "next"
-      }
-    ],
-    "strictNullChecks": true
-  },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules",
-    "jest.config.js"
-  ]
-}

apps/dev/nextjs-v4/types/nextauth.d.ts

@@ -1,20 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import NextAuth from "next-auth"
-
-declare module "next-auth" {
-  /**
-   * Returned by `useSession`, `getSession` and received as a prop on the `SessionProvider` React Context
-   */
-  interface Session {
-    // A JWT which can be used as Authorization header with supabase-js for RLS.
-    supabaseAccessToken?: string
-    user: {
-      /** The user's postal address. */
-      address: string
-    } & User
-  }
-
-  interface User {
-    foo: string
-  }
-}

apps/dev/nextjs/.env.local.example

@@ -9,39 +9,20 @@ NEXTAUTH_URL=http://localhost:3000
 # and/or verification tokens.
 NEXTAUTH_SECRET=secret
 
-ASGARDEO_CLIENT_ID=
-ASGARDEO_CLIENT_SECRET=
-ASGARDEO_ISSUER=
-
 AUTH0_ID=
 AUTH0_SECRET=
 AUTH0_ISSUER=
 
-# Beyond Identity Provider
-BEYOND_IDENTITY_CLIENT_ID=
-BEYOND_IDENTITY_CLIENT_SECRET=
-BEYOND_IDENTITY_ISSUER=
-
-GITHUB_ID=
-GITHUB_SECRET=
-
-NOTION_ID=
-NOTION_SECRET=
-NOTION_REDIRECT_URI=
-
-IDS4_ID=
-IDS4_SECRET=
-IDS4_ISSUER=
-
 KEYCLOAK_ID=
 KEYCLOAK_SECRET=
 KEYCLOAK_ISSUER=
 
-LINE_ID=
-LINE_SECRET=
+IDS4_ID=
+IDS4_SECRET=
+IDS4_ISSUER=
 
-TRAKT_ID=
-TRAKT_SECRET=
+GITHUB_ID=
+GITHUB_SECRET=
 
 TWITCH_ID=
 TWITCH_SECRET=
@@ -49,12 +30,11 @@ TWITCH_SECRET=
 TWITTER_ID=
 TWITTER_SECRET=
 
-WIKIMEDIA_ID=
-WIKIMEDIA_SECRET=
+LINE_ID=
+LINE_SECRET=
 
-# Yandex OAuth. new app -> https://oauth.yandex.com/client/new/id
-YANDEX_ID=
-YANDEX_SECRET=
+TRAKT_ID=
+TRAKT_SECRET=
 
 # Example configuration for a Gmail account (will need SMTP enabled)
 EMAIL_SERVER=smtps://user@gmail.com:password@smtp.gmail.com:465
@@ -67,9 +47,12 @@ EMAIL_FROM=user@gmail.com
 # MongoDB:  DATABASE_URL=mongodb://nextauth:password@127.0.0.1:27017/nextauth?synchronize=true
 DATABASE_URL=
 
+WIKIMEDIA_ID=
+WIKIMEDIA_SECRET=
+
 # Supabase Example Configuration
 # Supabase Example Configuration
 # NEXT_PUBLIC_SUPABASE_URL=http://localhost:54321
 # SUPABASE_SERVICE_ROLE_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6InNlcnZpY2Vfcm9sZSJ9.vI9obAHOGyVVKa3pD--kJlyxp-Z2zV9UUMAhKpNLAcU
 # SUPABASE_JWT_SECRET=super-secret-jwt-token-with-at-least-32-characters-long
-# NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24ifQ.625_WdcF3KHqz5amU0x2X5WWHP-OEs_4qj0ssLNHzTs
+# NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24ifQ.625_WdcF3KHqz5amU0x2X5WWHP-OEs_4qj0ssLNHzTs

apps/dev/nextjs/.gitignore

@@ -1,4 +0,0 @@
-node_modules/
-/test-results/
-/playwright-report/
-/playwright/.cache/

apps/dev/nextjs/app/api/auth/[...nextauth]/route.ts

@@ -1,3 +0,0 @@
-import { handlers } from "auth"
-export const { GET, POST } = handlers
-export const runtime = "edge"

apps/dev/nextjs/app/api/protected/route.ts

@@ -1,10 +0,0 @@
-import { auth } from "auth"
-import { NextResponse } from "next/server"
-
-export const GET = auth(function GET(req) {
-  if (req.auth) {
-    return NextResponse.json(req.auth)
-  }
-
-  return NextResponse.json({ message: "Not authenticated" }, { status: 401 })
-})

apps/dev/nextjs/app/server-component/page.tsx

@@ -1,37 +1,6 @@
-import { auth } from "auth"
-import { cookies, headers } from "next/headers"
-
-function SignIn({ id, children }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action={`/api/auth/signin/${id}`} method="post">
-      <button type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
-
-function SignOut({ children }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action="/api/auth/signout" method="post">
-      <button type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
+import { unstable_getServerSession } from "next-auth/next"
 
 export default async function Page() {
-  const session = await auth(headers())
-  if (session) {
-    return (
-      <>
-        <pre>{JSON.stringify(session, null, 2)}</pre>
-        <SignOut>Sign out</SignOut>
-      </>
-    )
-  }
-  return <SignIn id="github">Sign in with github</SignIn>
+  const session = await unstable_getServerSession()
+  return <pre>{JSON.stringify(session, null, 2)}</pre>
 }

apps/dev/nextjs/auth.ts

@@ -1,21 +0,0 @@
-import { NextAuth } from "next-auth"
-import GitHub from "@auth/core/providers/github"
-
-export const { handlers, auth } = NextAuth({
-  providers: [GitHub],
-  callbacks: {
-    async authorized({ request, auth }) {
-      // if (request.method === "POST") {
-      // const [, token] = request.headers.get("Authorization")?.split(" ")
-      // const valid = validateToken(token)
-      // // If the request has a valid auth token, it is authorized
-      // if (valid) return true
-      // return NextResponse.json("Invalid auth token", { status: 401 })
-      // }
-
-      // Logged in users are authorized, otherwise, will redirect to login
-      // You could also return a custom redirect instead of the sign-in page
-      return !!auth
-    },
-  },
-})

apps/dev/nextjs/components/footer.js

@@ -1,6 +1,6 @@
 import Link from "next/link"
 import styles from "./footer.module.css"
-import packageJSON from "next-auth/package.json"
+import packageJSON from "package.json"
 
 export default function Footer() {
   return (

apps/dev/nextjs/components/header.js

@@ -1,5 +1,5 @@
 import Link from "next/link"
-import { useSession } from "next-auth/react"
+import { signIn, signOut, useSession } from "next-auth/react"
 import styles from "./header.module.css"
 
 // The approach used in this component shows how to built a sign in and sign out
@@ -24,7 +24,14 @@ export default function Header() {
               <span className={styles.notSignedInText}>
                 You are not signed in
               </span>
-              <a href="/api/auth/signin" className={styles.buttonPrimary}>
+              <a
+                href="/api/auth/signin"
+                className={styles.buttonPrimary}
+                onClick={(e) => {
+                  e.preventDefault()
+                  signIn()
+                }}
+              >
                 Sign in
               </a>
             </>
@@ -40,7 +47,14 @@ export default function Header() {
                 <strong>{session.user.email} </strong>
                 {session.user.name ? `(${session.user.name})` : null}
               </span>
-              <a href="/api/auth/signout" className={styles.button}>
+              <a
+                href="/api/auth/signout"
+                className={styles.button}
+                onClick={(e) => {
+                  e.preventDefault()
+                  signOut()
+                }}
+              >
                 Sign out
               </a>
             </>
@@ -76,6 +90,12 @@ export default function Header() {
           <li className={styles.navItem}>
             <Link href="/middleware-protected">Middleware protected</Link>
           </li>
+          <li className={styles.navItem}>
+            <Link href="/supabase-client-rls">Supabase RLS</Link>
+          </li>
+          <li className={styles.navItem}>
+            <Link href="/supabase-ssr">Supabase RLS(SSR)</Link>
+          </li>
         </ul>
       </nav>
     </header>

apps/dev/nextjs/middleware.ts

@@ -1,10 +1,45 @@
-// export { auth as default } from "auth"
-import { auth } from "auth"
-import { NextResponse } from "next/server"
-
-export default auth((req) => {
-  if (req.auth) return NextResponse.json(req.auth)
-  return NextResponse.json("Not authorized", { status: 401 })
-})
+export { default } from "next-auth/middleware"
 
 export const config = { matcher: ["/middleware-protected"] }
+
+// Other ways to use this middleware
+
+// import withAuth from "next-auth/middleware"
+// import { withAuth } from "next-auth/middleware"
+
+// export function middleware(req, ev) {
+//   return withAuth(req)
+// }
+
+// export function middleware(req, ev) {
+//   return withAuth(req, ev)
+// }
+
+// export function middleware(req, ev) {
+//   return withAuth(req, {
+//     callbacks: {
+//       authorized: ({ token }) => !!token,
+//     },
+//   })
+// }
+
+// export default withAuth(function middleware(req, ev) {
+//   console.log(req.nextauth.token)
+// })
+
+// export default withAuth(
+//   function middleware(req, ev) {
+//     console.log(req, ev)
+//   },
+//   {
+//     callbacks: {
+//       authorized: ({ token }) => token.name === "Balázs Orbán",
+//     },
+//   }
+// )
+
+// export default withAuth({
+//   callbacks: {
+//     authorized: ({ token }) => !!token,
+//   },
+// })

apps/dev/nextjs/next-env.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/basic-features/typescript for more information.

apps/dev/nextjs/package.json

@@ -9,13 +9,10 @@
     "build": "next build",
     "start": "next start",
     "email": "fake-smtp-server",
-    "start:email": "pnpm email",
-    "e2e": "pnpm dlx playwright test"
+    "start:email": "pnpm email"
   },
   "license": "ISC",
   "dependencies": {
-    "@auth/core": "workspace:*",
-    "next-auth": "workspace:*",
     "@next-auth/fauna-adapter": "workspace:*",
     "@next-auth/prisma-adapter": "workspace:*",
     "@next-auth/supabase-adapter": "workspace:*",
@@ -23,18 +20,17 @@
     "@prisma/client": "^3",
     "@supabase/supabase-js": "^2.0.5",
     "faunadb": "^4",
-    "next": "13.3.2-canary.12",
+    "next": "13.1.1",
     "next-auth": "workspace:*",
+    "@auth/core": "workspace:*",
     "nodemailer": "^6",
     "react": "^18",
     "react-dom": "^18"
   },
   "devDependencies": {
-    "@playwright/test": "1.29.2",
     "@types/jsonwebtoken": "^8.5.5",
-    "@types/react": "18.0.37",
+    "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
-    "dotenv": "^16.0.3",
     "fake-smtp-server": "^0.8.0",
     "pg": "^8.7.3",
     "prisma": "^3",

apps/dev/nextjs/pages/api/auth/[...nextauth].ts

@@ -2,11 +2,9 @@ import { Auth, type AuthConfig } from "@auth/core"
 
 // Providers
 import Apple from "@auth/core/providers/apple"
-import Asgardeo from "@auth/core/providers/asgardeo"
 import Auth0 from "@auth/core/providers/auth0"
 import AzureAD from "@auth/core/providers/azure-ad"
 import AzureB2C from "@auth/core/providers/azure-ad-b2c"
-import BeyondIdentity from "@auth/core/providers/beyondidentity"
 import BoxyHQSAML from "@auth/core/providers/boxyhq-saml"
 // import Cognito from "@auth/core/providers/cognito"
 import Credentials from "@auth/core/providers/credentials"
@@ -25,7 +23,6 @@ import Instagram from "@auth/core/providers/instagram"
 import Line from "@auth/core/providers/line"
 import LinkedIn from "@auth/core/providers/linkedin"
 import Mailchimp from "@auth/core/providers/mailchimp"
-import Notion from "@auth/core/providers/notion"
 // import Okta from "@auth/core/providers/okta"
 import Osu from "@auth/core/providers/osu"
 import Patreon from "@auth/core/providers/patreon"
@@ -34,7 +31,6 @@ import Spotify from "@auth/core/providers/spotify"
 import Trakt from "@auth/core/providers/trakt"
 import Twitch from "@auth/core/providers/twitch"
 import Twitter from "@auth/core/providers/twitter"
-import Yandex from "@auth/core/providers/yandex"
 import Vk from "@auth/core/providers/vk"
 import Wikimedia from "@auth/core/providers/wikimedia"
 import WorkOS from "@auth/core/providers/workos"
@@ -72,7 +68,7 @@ import WorkOS from "@auth/core/providers/workos"
 
 export const authConfig: AuthConfig = {
   // adapter,
-  debug: process.env.NODE_ENV !== "production",
+  // debug: process.env.NODE_ENV !== "production",
   theme: {
     logo: "https://next-auth.js.org/img/logo/logo-sm.png",
     brandColor: "#1786fb",
@@ -86,7 +82,6 @@ export const authConfig: AuthConfig = {
       },
     }),
     Apple({ clientId: process.env.APPLE_ID, clientSecret: process.env.APPLE_SECRET }),
-    Asgardeo({ clientId: process.env.ASGARDEO_CLIENT_ID, clientSecret: process.env.ASGARDEO_CLIENT_SECRET, issuer: process.env.ASGARDEO_ISSUER }),
     Auth0({ clientId: process.env.AUTH0_ID, clientSecret: process.env.AUTH0_SECRET, issuer: process.env.AUTH0_ISSUER }),
     AzureAD({
       clientId: process.env.AZURE_AD_CLIENT_ID,
@@ -94,11 +89,6 @@ export const authConfig: AuthConfig = {
       tenantId: process.env.AZURE_AD_TENANT_ID,
     }),
     AzureB2C({ clientId: process.env.AZURE_B2C_ID, clientSecret: process.env.AZURE_B2C_SECRET, issuer: process.env.AZURE_B2C_ISSUER }),
-    BeyondIdentity({
-      clientId: process.env.BEYOND_IDENTITY_CLIENT_ID,
-      clientSecret: process.env.BEYOND_IDENTITY_CLIENT_SECRET,
-      issuer: process.env.BEYOND_IDENTITY_ISSUER,
-    }),
     BoxyHQSAML({ issuer: "https://jackson-demo.boxyhq.com", clientId: "tenant=boxyhq.com&product=saml-demo.boxyhq.com", clientSecret: "dummy" }),
     // Cognito({ clientId: process.env.COGNITO_ID, clientSecret: process.env.COGNITO_SECRET, issuer: process.env.COGNITO_ISSUER }),
     Discord({ clientId: process.env.DISCORD_ID, clientSecret: process.env.DISCORD_SECRET }),
@@ -106,7 +96,7 @@ export const authConfig: AuthConfig = {
     Facebook({ clientId: process.env.FACEBOOK_ID, clientSecret: process.env.FACEBOOK_SECRET }),
     Foursquare({ clientId: process.env.FOURSQUARE_ID, clientSecret: process.env.FOURSQUARE_SECRET }),
     Freshbooks({ clientId: process.env.FRESHBOOKS_ID, clientSecret: process.env.FRESHBOOKS_SECRET }),
-    GitHub({ clientId: process.env.GITHUB_ID, clientSecret: process.env.GITHUB_SECRET, redirectProxy: process.env.AUTH_REDIRECT_PROXY_URL }),
+    GitHub({ clientId: process.env.GITHUB_ID, clientSecret: process.env.GITHUB_SECRET }),
     Gitlab({ clientId: process.env.GITLAB_ID, clientSecret: process.env.GITLAB_SECRET }),
     Google({ clientId: process.env.GOOGLE_ID, clientSecret: process.env.GOOGLE_SECRET }),
     // IDS4({ clientId: process.env.IDS4_ID, clientSecret: process.env.IDS4_SECRET, issuer: process.env.IDS4_ISSUER }),
@@ -115,7 +105,6 @@ export const authConfig: AuthConfig = {
     Line({ clientId: process.env.LINE_ID, clientSecret: process.env.LINE_SECRET }),
     LinkedIn({ clientId: process.env.LINKEDIN_ID, clientSecret: process.env.LINKEDIN_SECRET }),
     Mailchimp({ clientId: process.env.MAILCHIMP_ID, clientSecret: process.env.MAILCHIMP_SECRET }),
-    Notion({ clientId: process.env.NOTION_ID, clientSecret: process.env.NOTION_SECRET, redirectUri: process.env.NOTION_REDIRECT_URI }),
     // Okta({ clientId: process.env.OKTA_ID, clientSecret: process.env.OKTA_SECRET, issuer: process.env.OKTA_ISSUER }),
     Osu({ clientId: process.env.OSU_CLIENT_ID, clientSecret: process.env.OSU_CLIENT_SECRET }),
     Patreon({ clientId: process.env.PATREON_ID, clientSecret: process.env.PATREON_SECRET }),
@@ -125,7 +114,6 @@ export const authConfig: AuthConfig = {
     Twitch({ clientId: process.env.TWITCH_ID, clientSecret: process.env.TWITCH_SECRET }),
     Twitter({ clientId: process.env.TWITTER_ID, clientSecret: process.env.TWITTER_SECRET }),
     // TwitterLegacy({ clientId: process.env.TWITTER_LEGACY_ID, clientSecret: process.env.TWITTER_LEGACY_SECRET }),
-    Yandex({ clientId: process.env.YANDEX_ID, clientSecret: process.env.YANDEX_SECRET }),
     Vk({ clientId: process.env.VK_ID, clientSecret: process.env.VK_SECRET }),
     Wikimedia({ clientId: process.env.WIKIMEDIA_ID, clientSecret: process.env.WIKIMEDIA_SECRET }),
     WorkOS({ clientId: process.env.WORKOS_ID, clientSecret: process.env.WORKOS_SECRET }),
@@ -160,4 +148,4 @@ function AuthHandler(...args: any[]) {
 
 export default AuthHandler(authConfig)
 
-export const config = { runtime: "edge" }
+export const config = { runtime: "experimental-edge" }

apps/dev/nextjs/pages/api/examples/protected.js

@@ -1,9 +1,9 @@
 // This is an example of to protect an API route
-import { getServerSession } from "next-auth/next"
+import { unstable_getServerSession } from "next-auth/next"
 import { authOptions } from "../auth/[...nextauth]"
 
 export default async (req, res) => {
-  const session = await getServerSession(req, res, authOptions)
+  const session = await unstable_getServerSession(req, res, authOptions)
 
   if (session) {
     res.send({

apps/dev/nextjs/pages/api/examples/protected.ts

@@ -1,19 +0,0 @@
-// This is an example of to protect an API route
-import { authConfig } from "../auth-old/[...nextauth]"
-import { getServerSession } from "next-auth/next"
-
-export default async (req, res) => {
-  const session = await getServerSession(req, res, authConfig as any)
-
-  if (session) {
-    res.send({
-      content:
-        "This is protected content. You can access this content because you are signed in.",
-      session,
-    })
-  } else {
-    res.send({
-      error: "You must be sign in to view the protected content on this page.",
-    })
-  }
-}

apps/dev/nextjs/pages/api/examples/session.js

@@ -1,8 +1,8 @@
 // This is an example of how to access a session from an API route
-import { getServerSession } from "next-auth/next"
+import { unstable_getServerSession } from "next-auth/next"
 import { authOptions } from "../auth/[...nextauth]"
 
 export default async (req, res) => {
-  const session = await getServerSession(req, res, authOptions)
+  const session = await unstable_getServerSession(req, res, authOptions)
   res.json(session)
 }

apps/dev/nextjs/pages/api/examples/session.ts

@@ -1,8 +0,0 @@
-import { authConfig } from "../auth-old/[...nextauth]"
-// This is an example of how to access a session from an API route
-import { getServerSession } from "next-auth/next"
-
-export default async (req, res) => {
-  const session = await getServerSession(req, res, authConfig as any)
-  res.json(session)
-}

apps/dev/nextjs/pages/api/examples/supabase-rls.js

@@ -1,11 +1,11 @@
 // This is an example of how to query data from Supabase with RLS.
 // Learn more about Row Levele Security (RLS): https://supabase.com/docs/guides/auth/row-level-security
-import { getServerSession } from "next-auth/next"
+import { unstable_getServerSession } from "next-auth/next"
 import { authOptions } from "../auth/[...nextauth]"
 import { createClient } from "@supabase/supabase-js"
 
 export default async (req, res) => {
-  const session = await getServerSession(req, res, authOptions)
+  const session = await unstable_getServerSession(req, res, authOptions)
 
   if (!session)
     return res.send(JSON.stringify({ error: "No session!" }, null, 2))

apps/dev/nextjs/pages/protected-ssr.js

@@ -1,6 +1,6 @@
 // This is an example of how to protect content using server rendering
-import { getServerSession } from "next-auth/next"
-import { authConfig } from "./api/auth-old/[...nextauth]"
+import { unstable_getServerSession } from "next-auth/next"
+import { authOptions } from "./api/auth/[...nextauth]"
 import Layout from "../components/layout"
 import AccessDenied from "../components/access-denied"
 
@@ -26,7 +26,11 @@ export default function Page({ content, session }) {
 }
 
 export async function getServerSideProps(context) {
-  const session = await getServerSession(context.req, context.res, authConfig)
+  const session = await unstable_getServerSession(
+    context.req,
+    context.res,
+    authOptions
+  )
   let content = null
 
   if (session) {

apps/dev/nextjs/pages/server.js

@@ -1,6 +1,6 @@
-import { getServerSession } from "next-auth/next"
+import { unstable_getServerSession } from "next-auth/next"
 import Layout from "../components/layout"
-import { authConfig } from "./api/auth-old/[...nextauth]"
+import { authOptions } from "./api/auth/[...nextauth]"
 
 export default function Page() {
   // As this page uses Server Side Rendering, the `session` will be already
@@ -12,11 +12,11 @@ export default function Page() {
     <Layout>
       <h1>Server Side Rendering</h1>
       <p>
-        This page uses the <strong>getServerSession()</strong> method in{" "}
-        <strong>getServerSideProps()</strong>.
+        This page uses the <strong>unstable_getServerSession()</strong> method
+        in <strong>getServerSideProps()</strong>.
       </p>
       <p>
-        Using <strong>getServerSession()</strong> in{" "}
+        Using <strong>unstable_getServerSession()</strong> in{" "}
         <strong>getServerSideProps()</strong> is currently the recommended
         approach, although the API may still change, if you need to support
         Server Side Rendering with authentication.
@@ -40,7 +40,11 @@ export default function Page() {
 export async function getServerSideProps(context) {
   return {
     props: {
-      session: await getServerSession(context.req, context.res, authConfig),
+      session: await unstable_getServerSession(
+        context.req,
+        context.res,
+        authOptions
+      ),
     },
   }
 }

apps/dev/nextjs/pages/supabase-client-rls.js

@@ -9,7 +9,6 @@ export default function Page() {
 
   useEffect(() => {
     if (session) {
-      console.log(session)
       // User is logged in, let's fetch their data.
       const { supabaseAccessToken } = session
       const supabase = createClient(

apps/dev/nextjs/pages/supabase-ssr.js

@@ -1,6 +1,6 @@
 // This is an example of how to protect content using server rendering
 // and fetching data from Supabase with RLS enabled.
-import { getServerSession } from "next-auth/next"
+import { unstable_getServerSession } from "next-auth/next"
 import { authOptions } from "./api/auth/[...nextauth]"
 import { createClient } from "@supabase/supabase-js"
 import Layout from "../components/layout"
@@ -27,7 +27,11 @@ export default function Page({ data, session }) {
 }
 
 export async function getServerSideProps(context) {
-  const session = await getServerSession(context.req, context.res, authOptions)
+  const session = await unstable_getServerSession(
+    context.req,
+    context.res,
+    authOptions
+  )
 
   if (!session)
     return {

apps/dev/nextjs/playwright.config.ts

@@ -1,107 +0,0 @@
-import type { PlaywrightTestConfig } from '@playwright/test';
-import { devices } from '@playwright/test';
-
-/**
- * Read environment variables from file.
- * https://github.com/motdotla/dotenv
- */
-require('dotenv').config();
-
-/**
- * See https://playwright.dev/docs/test-configuration.
- */
-const config: PlaywrightTestConfig = {
-  testDir: './tests',
-  /* Maximum time one test can run for. */
-  timeout: 30 * 1000,
-  expect: {
-    /**
-     * Maximum time expect() should wait for the condition to be met.
-     * For example in `await expect(locator).toHaveText();`
-     */
-    timeout: 5000
-  },
-  /* Run tests in files in parallel */
-  fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
-  forbidOnly: !!process.env.CI,
-  /* Retry on CI only */
-  retries: process.env.CI ? 2 : 0,
-  /* Opt out of parallel tests on CI. */
-  workers: process.env.CI ? 1 : undefined,
-  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: 'html',
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
-  use: {
-    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
-    actionTimeout: 0,
-    /* Base URL to use in actions like `await page.goto('/')`. */
-    // baseURL: 'http://localhost:3000',
-
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
-  },
-
-  /* Configure projects for major browsers */
-  projects: [
-    {
-      name: 'chromium',
-      use: {
-        ...devices['Desktop Chrome'],
-      },
-    },
-
-    {
-      name: 'firefox',
-      use: {
-        ...devices['Desktop Firefox'],
-      },
-    },
-
-    {
-      name: 'webkit',
-      use: {
-        ...devices['Desktop Safari'],
-      },
-    },
-
-    /* Test against mobile viewports. */
-    // {
-    //   name: 'Mobile Chrome',
-    //   use: {
-    //     ...devices['Pixel 5'],
-    //   },
-    // },
-    // {
-    //   name: 'Mobile Safari',
-    //   use: {
-    //     ...devices['iPhone 12'],
-    //   },
-    // },
-
-    /* Test against branded browsers. */
-    // {
-    //   name: 'Microsoft Edge',
-    //   use: {
-    //     channel: 'msedge',
-    //   },
-    // },
-    // {
-    //   name: 'Google Chrome',
-    //   use: {
-    //     channel: 'chrome',
-    //   },
-    // },
-  ],
-
-  /* Folder for test artifacts such as screenshots, videos, traces, etc. */
-  // outputDir: 'test-results/',
-
-  /* Run your local dev server before starting the tests */
-  // webServer: {
-  //   command: 'npm run start',
-  //   port: 3000,
-  // },
-};
-
-export default config;

apps/dev/nextjs/tests/signin.spec.ts

@@ -1,39 +0,0 @@
-import { test, expect } from "@playwright/test"
-
-test("Sign in with Auth0", async ({ page }) => {
-  // Go to NextAuth example app
-  await page.goto("https://next-auth-example.vercel.app")
-
-  // Click 'Sign In'
-  await page.click("#__next > header > div > p > a")
-
-  // Auth0 Login Provider
-  await page.click('body > div > div form[action*="auth0"] > button')
-
-  // Enter Credentials (Username/Password Login) on Auth0 Widget
-  await page.type("#username", process.env.AUTH0_USERNAME!)
-  await page.type("#password", process.env.AUTH0_PASSWORD!)
-
-  // Snap a screenshot
-  // await page.screenshot({ path: "1-auth0-login.png", fullPage: true })
-
-  // Press submit on Auth0 form
-  await page.click('body > div > main > section > div button[type="submit"]')
-
-  // Wait for next-auth example page login status header to appear
-  await page.waitForTimeout(2000)
-
-  // Snap a screenshot
-  // await page.screenshot({
-  //   path: "2-next-auth-redirect-result.png",
-  //   fullPage: false,
-  // })
-
-  // Check session object after successful login
-  const response = await page.goto(
-    "https://next-auth-example.vercel.app/api/auth/session"
-  )
-  const session = await response?.json()
-  expect(session?.user?.email).toBe(process.env.AUTH0_USERNAME)
-  // TODO: Check whole object with .toEqual()
-})

apps/dev/nextjs/tsconfig.json

@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "esnext",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": false,
@@ -23,17 +19,8 @@
       {
         "name": "next"
       }
-    ],
-    "strictNullChecks": true
+    ]
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules",
-    "jest.config.js"
-  ]
-}
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules", "jest.config.js"]
+}

apps/dev/nextjs/types/nextauth.d.ts

@@ -18,12 +18,3 @@ declare module "next-auth" {
     foo: string
   }
 }
-
-
-declare global {
-  namespace NodeJS {
-    interface ProcessEnv {
-      [key: string]: string;
-    }
-  }
-}

apps/dev/sveltekit/package.json

@@ -19,8 +19,8 @@
     "vite": "4.0.1"
   },
   "dependencies": {
-    "@auth/core": "workspace:*",
-    "@auth/sveltekit": "workspace:*"
+    "@auth/core": "latest",
+    "@auth/sveltekit": "latest"
   },
   "type": "module"
 }

apps/examples/next.config.js

@@ -1,4 +0,0 @@
-/** @type {import("next").NextConfig} */
-module.exports = {
-  reactStrictMode: true,
-}

apps/examples/nextjs/.env.local.example

@@ -1,6 +1,10 @@
 NEXTAUTH_URL=http://localhost:3000
-NEXTAUTH_SECRET= # Linux: `openssl rand -hex 32` or go to https://generate-secret.vercel.app/32
+NEXTAUTH_SECRET= # Linux: `openssl rand -hex 32` or go to https://generate-secret.now.sh/32
 
+APPLE_ID=
+APPLE_TEAM_ID=
+APPLE_PRIVATE_KEY=
+APPLE_KEY_ID=
 
 AUTH0_ID=
 AUTH0_SECRET=
@@ -17,3 +21,8 @@ GOOGLE_SECRET=
 
 TWITTER_ID=
 TWITTER_SECRET=
+
+EMAIL_SERVER=smtp://username:password@smtp.example.com:587
+EMAIL_FROM=NextAuth <noreply@example.com>
+
+DATABASE_URL=sqlite://localhost/:memory:?synchronize=true

apps/examples/nextjs/README.md

@@ -1,14 +1,9 @@
-> The example repository is maintained from a [monorepo](https://github.com/nextauthjs/next-auth/tree/main/apps/examples/nextjs). Pull Requests should be opened against [`nextauthjs/next-auth`](https://github.com/nextauthjs/next-auth).
+> The example repository is maintained from a [monorepo](https://github.com/nextauthjs/next-auth/tree/main/apps/example-nextjs). Pull Requests should be opened against [`nextauthjs/next-auth`](https://github.com/nextauthjs/next-auth).
 
 <p align="center">
    <br/>
-   <a href="https://authjs.dev" target="_blank">
-   <img height="64" src="https://authjs.dev/img/logo/logo-sm.png" />
-   </a>
-   <a href="https://nextjs.org" target="_blank">
-   <img height="64" src="https://nextjs.org/static/favicon/android-chrome-192x192.png" />
-   </a>
-   <h3 align="center"><b>next-auth</b> - Example App</h3>
+   <a href="https://next-auth.js.org" target="_blank"><img width="150px" src="https://next-auth.js.org/img/logo/logo-sm.png" /></a>
+   <h3 align="center">NextAuth.js Example App</h3>
    <p align="center">
    Open Source. Full Stack. Own Your Data.
    </p>
@@ -30,13 +25,19 @@
 
 ## Overview
 
-NextAuth.js is a complete open-source authentication solution.
+NextAuth.js is a complete open source authentication solution.
 
 This is an example application that shows how `next-auth` is applied to a basic Next.js app.
 
 The deployed version can be found at [`next-auth-example.vercel.app`](https://next-auth-example.vercel.app)
 
-Go to [authjs.dev](https://authjs.dev) for more information and documentation.
+### About NextAuth.js
+
+NextAuth.js is an easy to implement, full-stack (client/server) open source authentication library originally designed for [Next.js](https://nextjs.org) and [Serverless](https://vercel.com). Our goal is to [support even more frameworks](https://github.com/nextauthjs/next-auth/issues/2294) in the future.
+
+Go to [next-auth.js.org](https://next-auth.js.org) for more information and documentation.
+
+> _NextAuth.js is not officially associated with Vercel or Next.js._
 
 ## Getting Started
 
@@ -66,7 +67,7 @@ You **can** skip configuring a database and come back to it later if you want.
 
 For more information about setting up a database, please check out the following links:
 
-- Docs: [authjs.dev/reference/adapters](https://authjs.dev/reference/adapters)
+- Docs: [next-auth.js.org/adapters/overview](https://next-auth.js.org/adapters/overview)
 
 ### 3. Configure Authentication Providers
 
@@ -76,7 +77,7 @@ For more information about setting up a database, please check out the following
 
 e.g. For Google OAuth you would use: `http://localhost:3000/api/auth/callback/google`
 
-A list of configured providers and their callback URLs is available from the endpoint `/api/auth/providers`. You can find more information at [authjs.dev/getting-started/oauth-tutorial](https://authjs.dev/getting-started/oauth-tutorial)
+A list of configured providers and their callback URLs is available from the endpoint `/api/auth/providers`. You can find more information at https://next-auth.js.org/configuration/providers/oauth
 
 3. You can also choose to specify an SMTP server for passwordless sign in via email.
 
@@ -97,13 +98,15 @@ npm run start
 
 ### 5. Preparing for Production
 
-Follow the [Deployment documentation](https://authjs.dev/guides/basics/deployment) or deploy the example instantly using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-auth-example)
-
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/nextauthjs/next-auth-example&project-name=next-auth-example&repository-name=next-auth-example)
+Follow the [Deployment documentation](https://next-auth.js.org/deployment)
 
 ## Acknowledgements
 
 <a href="https://vercel.com?utm_source=nextauthjs&utm_campaign=oss">
-<img width="170px" src="https://raw.githubusercontent.com/nextauthjs/next-auth/main/docs/static/img/powered-by-vercel.svg" alt="Powered By Vercel" />
+<img width="170px" src="https://raw.githubusercontent.com/nextauthjs/next-auth/canary/www/static/img/powered-by-vercel.svg" alt="Powered By Vercel" />
 </a>
-<p align="left">Thanks to Vercel sponsoring this project by allowing it to be deployed for free for the entire Auth.js Team</p>
+<p align="left">Thanks to Vercel sponsoring this project by allowing it to be deployed for free for the entire NextAuth.js Team</p>
+
+## License
+
+ISC

apps/examples/nextjs/app/api/auth/[...nextauth]/route.ts

@@ -1,3 +0,0 @@
-import { handlers } from "auth"
-export const { GET, POST } = handlers
-export const runtime = "edge"

apps/examples/nextjs/app/api/protected/route.ts

@@ -1,10 +0,0 @@
-import { auth } from "auth"
-import { NextResponse } from "next/server"
-
-export const GET = auth(function GET(req) {
-  if (req.auth) {
-    return NextResponse.json(req.auth)
-  }
-
-  return NextResponse.json({ message: "Not authenticated" }, { status: 401 })
-})

apps/examples/nextjs/app/layout.tsx

@@ -1,24 +0,0 @@
-import Header from "components/header"
-import Footer from "components/footer"
-import './styles.css'
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode
-}) {
-  return (
-    <html>
-      <head></head>
-      <body>
-        <Header />
-        <main>
-          {children}
-        </main>
-        <Footer />
-      </body>
-    </html>
-  )
-}
-
-export const runtime = "experimental-edge"

apps/examples/nextjs/app/page.tsx

@@ -1,13 +0,0 @@
-export default function Page() {
-  return (
-    <>
-      <h1>NextAuth.js Example</h1>
-      <p>
-        This is an example site to demonstrate how to use{" "}
-        <a href="https://authjs.dev">NextAuth.js</a> for authentication.
-      </p>
-    </>
-  )
-}
-
-export const runtime = "experimental-edge"

apps/examples/nextjs/app/server-component/page.tsx

@@ -1,39 +0,0 @@
-import { auth } from "auth"
-import { cookies, headers } from "next/headers"
-
-function SignIn({ id, children, className }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action={`/api/auth/signin/${id}`} method="post">
-      <button className={className} type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
-
-function SignOut({ children }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action="/api/auth/signout" method="post">
-      <button type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
-
-export default async function Page() {
-  const session = await auth(headers())
-  if (session) {
-    return (
-      <>
-        <pre>{JSON.stringify(session, null, 2)}</pre>
-        <SignOut>Sign out</SignOut>
-      </>
-    )
-  }
-  return <SignIn id="github">Sign in with github</SignIn>
-}
-
-export const runtime = "experimental-edge"

apps/examples/nextjs/auth.ts

@@ -1,21 +0,0 @@
-import NextAuth from "next-auth"
-import GitHub from "@auth/core/providers/github"
-
-export const { handlers, auth } = NextAuth({
-  providers: [GitHub],
-  callbacks: {
-    async authorized({ request, auth }) {
-      // if (request.method === "POST") {
-      // const [, token] = request.headers.get("Authorization")?.split(" ")
-      // const valid = validateToken(token)
-      // // If the request has a valid auth token, it is authorized
-      // if (valid) return true
-      // return NextResponse.json("Invalid auth token", { status: 401 })
-      // }
-
-      // Logged in users are authorized, otherwise, will redirect to login
-      // You could also return a custom redirect instead of the sign-in page
-      return !!auth
-    },
-  },
-})

apps/examples/nextjs/components/footer.tsx

@@ -1,6 +1,6 @@
 import Link from "next/link"
 import styles from "./footer.module.css"
-import packageJSON from "next-auth/package.json"
+import packageJSON from "../package.json"
 
 export default function Footer() {
   return (
@@ -8,10 +8,10 @@ export default function Footer() {
       <hr />
       <ul className={styles.navItems}>
         <li className={styles.navItem}>
-          <a href="https://authjs.dev">Documentation</a>
+          <a href="https://next-auth.js.org">Documentation</a>
         </li>
         <li className={styles.navItem}>
-          <a href="https://www.npmjs.com/package/@auth/core">NPM</a>
+          <a href="https://www.npmjs.com/package/next-auth">NPM</a>
         </li>
         <li className={styles.navItem}>
           <a href="https://github.com/nextauthjs/next-auth-example">GitHub</a>
@@ -20,7 +20,7 @@ export default function Footer() {
           <Link href="/policy">Policy</Link>
         </li>
         <li className={styles.navItem}>
-          <em>{packageJSON.version}</em>
+          <em>next-auth@{packageJSON.dependencies["next-auth"]}</em>
         </li>
       </ul>
     </footer>

apps/examples/nextjs/components/header.module.css

@@ -1,6 +1,5 @@
 /* Set min-height to avoid page reflow while session loading */
 .signedInStatus {
-  position: relative;
   display: block;
   min-height: 4rem;
   width: 100%;

apps/examples/nextjs/components/header.tsx

@@ -1,63 +1,65 @@
 import Link from "next/link"
-import { auth } from "auth"
-import { cookies, headers } from "next/headers"
+import { signIn, signOut, useSession } from "next-auth/react"
 import styles from "./header.module.css"
 
-function SignIn({ id, children, className }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action={`/api/auth/signin/${id}`} method="post">
-      <button className={className} type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
-
-function SignOut({ children, className }: any) {
-  const $cookies = cookies()
-  const csrfToken = $cookies.get("next-auth.csrf-token")?.value.split("|")[0]
-  return (
-    <form action="/api/auth/signout" method="post">
-      <button className={className} type="submit">{children}</button>
-      <input type="hidden" name="csrfToken" value={csrfToken} />
-    </form>
-  )
-}
-
-// The approach used in this component shows how to built a sign in and sign out
+// The approach used in this component shows how to build a sign in and sign out
 // component that works on pages which support both client and server side
 // rendering, and avoids any flash incorrect content on initial page load.
-export default async function Header() {
-  const session = await auth(headers())
+export default function Header() {
+  const { data: session, status } = useSession()
+  const loading = status === "loading"
 
   return (
     <header>
       <noscript>
-        <style>{".nojs-show { opacity: 1; top: 0; }"}</style>
+        <style>{`.nojs-show { opacity: 1; top: 0; }`}</style>
       </noscript>
       <div className={styles.signedInStatus}>
-        <p className={`nojs-show ${styles.loaded}`}>
+        <p
+          className={`nojs-show ${
+            !session && loading ? styles.loading : styles.loaded
+          }`}
+        >
           {!session && (
             <>
               <span className={styles.notSignedInText}>
                 You are not signed in
               </span>
-              <SignIn className={styles.buttonPrimary}>Sign In</SignIn>
+              <a
+                href={`/api/auth/signin`}
+                className={styles.buttonPrimary}
+                onClick={(e) => {
+                  e.preventDefault()
+                  signIn()
+                }}
+              >
+                Sign in
+              </a>
             </>
           )}
-          {session && (
+          {session?.user && (
             <>
               {session.user.image && (
-                <img src={session.user.image} className={styles.avatar} />
+                <span
+                  style={{ backgroundImage: `url('${session.user.image}')` }}
+                  className={styles.avatar}
+                />
               )}
               <span className={styles.signedInText}>
                 <small>Signed in as</small>
                 <br />
-                <strong>{session.user.email} </strong>
-                {session.user.name ? `(${session.user.name})` : null}
+                <strong>{session.user.email ?? session.user.name}</strong>
               </span>
-              <SignOut className={styles.button}>Sign Out</SignOut>
+              <a
+                href={`/api/auth/signout`}
+                className={styles.button}
+                onClick={(e) => {
+                  e.preventDefault()
+                  signOut()
+                }}
+              >
+                Sign out
+              </a>
             </>
           )}
         </p>
@@ -71,7 +73,7 @@ export default async function Header() {
             <Link href="/client">Client</Link>
           </li>
           <li className={styles.navItem}>
-            <Link href="/server-component">Server</Link>
+            <Link href="/server">Server</Link>
           </li>
           <li className={styles.navItem}>
             <Link href="/protected">Protected</Link>
@@ -80,12 +82,13 @@ export default async function Header() {
             <Link href="/api-example">API</Link>
           </li>
           <li className={styles.navItem}>
-            <Link href="/middleware-protected">Middleware protected</Link>
+            <Link href="/admin">Admin</Link>
+          </li>
+          <li className={styles.navItem}>
+            <Link href="/me">Me</Link>
           </li>
         </ul>
       </nav>
     </header>
   )
 }
-
-export const runtime = "experimental-edge"

apps/examples/nextjs/components/layout.tsx

@@ -0,0 +1,13 @@
+import Header from "./header"
+import Footer from "./footer"
+import type { ReactNode } from "react"
+
+export default function Layout({ children }: { children: ReactNode }) {
+  return (
+    <>
+      <Header />
+      <main>{children}</main>
+      <Footer />
+    </>
+  )
+}

apps/examples/nextjs/middleware.ts

@@ -1,10 +1,17 @@
-// export { auth as default } from "auth"
-import { auth } from "auth"
-import { NextResponse } from "next/server"
+import { withAuth } from "next-auth/middleware"
 
-export default auth((req) => {
-  if (req.auth) return NextResponse.json(req.auth)
-  return NextResponse.json("Not authorized", { status: 401 })
+// More on how NextAuth.js middleware works: https://next-auth.js.org/configuration/nextjs#middleware
+export default withAuth({
+  callbacks: {
+    authorized({ req, token }) {
+      // `/admin` requires admin role
+      if (req.nextUrl.pathname === "/admin") {
+        return token?.userRole === "admin"
+      }
+      // `/me` only requires the user to be logged in
+      return !!token
+    },
+  },
 })
 
-export const config = { matcher: ["/middleware-protected"] }
+export const config = { matcher: ["/admin", "/me"] }

apps/examples/nextjs/next-auth.d.ts

@@ -0,0 +1,10 @@
+import "next-auth/jwt"
+
+// Read more at: https://next-auth.js.org/getting-started/typescript#module-augmentation
+
+declare module "next-auth/jwt" {
+  interface JWT {
+    /** The user's role. */
+    userRole?: "admin"
+  }
+}

apps/examples/nextjs/next.config.js

@@ -1,9 +0,0 @@
-/** @type {import("next").NextConfig} */
-module.exports = {
-  webpack(config) {
-    config.experiments = { ...config.experiments, topLevelAwait: true }
-    return config
-  },
-  experimental: { appDir: true },
-  typescript: { ignoreBuildErrors: true },
-}

apps/examples/nextjs/package.json

@@ -1,6 +1,5 @@
 {
   "private": true,
-  "name": "nextjs-example-app",
   "description": "An example project for NextAuth.js with Next.js",
   "repository": "https://github.com/nextauthjs/next-auth-example.git",
   "bugs": {
@@ -19,15 +18,15 @@
     "Lluis Agusti <hi@llu.lu>"
   ],
   "dependencies": {
-    "@auth/core": "workspace:*",
     "next": "latest",
-    "next-auth": "workspace:*",
+    "next-auth": "latest",
+    "nodemailer": "^6",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@types/node": "^18.16.2",
-    "@types/react": "^18.2.0",
-    "typescript": "^5.0.4"
+    "@types/node": "^17",
+    "@types/react": "^18.0.15",
+    "typescript": "^4"
   }
 }

apps/examples/nextjs/pages/_app.tsx

@@ -0,0 +1,18 @@
+import { SessionProvider } from "next-auth/react"
+import "./styles.css"
+
+import type { AppProps } from "next/app"
+import type { Session } from "next-auth"
+
+// Use of the <SessionProvider> is mandatory to allow components that call
+// `useSession()` anywhere in your application to access the `session` object.
+export default function App({
+  Component,
+  pageProps: { session, ...pageProps },
+}: AppProps<{ session: Session }>) {
+  return (
+    <SessionProvider session={session}>
+      <Component {...pageProps} />
+    </SessionProvider>
+  )
+}

apps/examples/nextjs/pages/admin.tsx

@@ -0,0 +1,17 @@
+import Layout from "../components/layout"
+
+export default function Page() {
+  return (
+    <Layout>
+      <h1>This page is protected by Middleware</h1>
+      <p>Only admin users can see this page.</p>
+      <p>
+        To learn more about the NextAuth middleware see&nbsp;
+        <a href="https://docs-git-misc-docs-nextauthjs.vercel.app/configuration/nextjs#middleware">
+          the docs
+        </a>
+        .
+      </p>
+    </Layout>
+  )
+}

apps/examples/nextjs/pages/api-example.tsx

@@ -1,17 +1,19 @@
-import Layout from '../components/layout'
+import Layout from "../components/layout"
 
-export default function Page () {
+export default function ApiExamplePage() {
   return (
     <Layout>
       <h1>API Example</h1>
       <p>The examples below show responses from the example API endpoints.</p>
-      <p><em>You must be signed in to see responses.</em></p>
+      <p>
+        <em>You must be signed in to see responses.</em>
+      </p>
       <h2>Session</h2>
       <p>/api/examples/session</p>
-      <iframe src='/api/examples/session' />
+      <iframe src="/api/examples/session" />
       <h2>JSON Web Token</h2>
       <p>/api/examples/jwt</p>
-      <iframe src='/api/examples/jwt' />
+      <iframe src="/api/examples/jwt" />
     </Layout>
   )
 }

apps/examples/nextjs/pages/api/auth/[...nextauth].ts

@@ -0,0 +1,65 @@
+import NextAuth, { NextAuthOptions } from "next-auth"
+import GoogleProvider from "next-auth/providers/google"
+import FacebookProvider from "next-auth/providers/facebook"
+import GithubProvider from "next-auth/providers/github"
+import TwitterProvider from "next-auth/providers/twitter"
+import Auth0Provider from "next-auth/providers/auth0"
+// import AppleProvider from "next-auth/providers/apple"
+// import EmailProvider from "next-auth/providers/email"
+
+// For more information on each option (and a full list of options) go to
+// https://next-auth.js.org/configuration/options
+export const authOptions: NextAuthOptions = {
+  // https://next-auth.js.org/configuration/providers/oauth
+  providers: [
+    /* EmailProvider({
+         server: process.env.EMAIL_SERVER,
+         from: process.env.EMAIL_FROM,
+       }),
+    // Temporarily removing the Apple provider from the demo site as the
+    // callback URL for it needs updating due to Vercel changing domains
+
+    Providers.Apple({
+      clientId: process.env.APPLE_ID,
+      clientSecret: {
+        appleId: process.env.APPLE_ID,
+        teamId: process.env.APPLE_TEAM_ID,
+        privateKey: process.env.APPLE_PRIVATE_KEY,
+        keyId: process.env.APPLE_KEY_ID,
+      },
+    }),
+    */
+    FacebookProvider({
+      clientId: process.env.FACEBOOK_ID,
+      clientSecret: process.env.FACEBOOK_SECRET,
+    }),
+    GithubProvider({
+      clientId: process.env.GITHUB_ID,
+      clientSecret: process.env.GITHUB_SECRET,
+    }),
+    GoogleProvider({
+      clientId: process.env.GOOGLE_ID,
+      clientSecret: process.env.GOOGLE_SECRET,
+    }),
+    TwitterProvider({
+      clientId: process.env.TWITTER_ID,
+      clientSecret: process.env.TWITTER_SECRET,
+    }),
+    Auth0Provider({
+      clientId: process.env.AUTH0_ID,
+      clientSecret: process.env.AUTH0_SECRET,
+      issuer: process.env.AUTH0_ISSUER,
+    }),
+  ],
+  theme: {
+    colorScheme: "light",
+  },
+  callbacks: {
+    async jwt({ token }) {
+      token.userRole = "admin"
+      return token
+    },
+  },
+}
+
+export default NextAuth(authOptions)

apps/examples/nextjs/pages/api/examples/jwt.ts

@@ -0,0 +1,14 @@
+// This is an example of how to read a JSON Web Token from an API route
+import { getToken } from "next-auth/jwt"
+
+import type { NextApiRequest, NextApiResponse } from "next"
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  // If you don't have the NEXTAUTH_SECRET environment variable set,
+  // you will have to pass your secret as `secret` to `getToken`
+  const token = await getToken({ req })
+  res.send(JSON.stringify(token, null, 2))
+}

apps/examples/nextjs/pages/api/examples/protected.ts

@@ -0,0 +1,23 @@
+// This is an example of to protect an API route
+import { unstable_getServerSession } from "next-auth/next"
+import { authOptions } from "../auth/[...nextauth]"
+
+import type { NextApiRequest, NextApiResponse } from "next"
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  const session = await unstable_getServerSession(req, res, authOptions)
+
+  if (session) {
+    return res.send({
+      content:
+        "This is protected content. You can access this content because you are signed in.",
+    })
+  }
+
+  res.send({
+    error: "You must be signed in to view the protected content on this page.",
+  })
+}

apps/examples/nextjs/pages/api/examples/session.ts

@@ -0,0 +1,13 @@
+// This is an example of how to access a session from an API route
+import { unstable_getServerSession } from "next-auth"
+import { authOptions } from "../auth/[...nextauth]"
+
+import type { NextApiRequest, NextApiResponse } from "next"
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  const session = await unstable_getServerSession(req, res, authOptions)
+  res.send(JSON.stringify(session, null, 2))
+}