fix(ui): use color text var for input color (#1260)

Co-authored-by: Archit Khode <archit.khode@gmail.com>

.github/workflows/labeler.yml

@@ -9,4 +9,3 @@ jobs:
     - uses: actions/labeler@main
       with:
         repo-token: "${{ secrets.GITHUB_TOKEN }}"
-        sync-labels: true

components/access-denied.js

@@ -5,11 +5,14 @@ export default function AccessDenied () {
     <>
       <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>
+        <a
+          href='/api/auth/signin'
+          onClick={(e) => {
+            e.preventDefault()
+            signIn()
+          }}
+        >You must be signed in to view this page
+        </a>
       </p>
     </>
   )

components/header.js

@@ -1,6 +1,5 @@
 import Link from 'next/link'
 import { signIn, signOut, useSession } from 'next-auth/client'
-import * as client from 'next-auth/client'
 import styles from './header.module.css'
 
 // The approach used in this component shows how to built a sign in and sign out
@@ -26,7 +25,7 @@ export default function Header () {
                 You are not signed in
               </span>
               <a
-                href="/api/auth/signin"
+                href='/api/auth/signin'
                 className={styles.buttonPrimary}
                 onClick={(e) => {
                   e.preventDefault()
@@ -51,7 +50,7 @@ export default function Header () {
                 <strong>{session.user.email || session.user.name}</strong>
               </span>
               <a
-                href="/api/auth/signout"
+                href='/api/auth/signout'
                 className={styles.button}
                 onClick={(e) => {
                   e.preventDefault()
@@ -96,6 +95,11 @@ export default function Header () {
               <a>API</a>
             </Link>
           </li>
+          <li className={styles.navItem}>
+            <Link href='/credentials'>
+              <a>Credentials</a>
+            </Link>
+          </li>
         </ul>
       </nav>
     </header>

jsconfig.json

@@ -1,12 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": ".",
-    "paths": {
-      "next-auth": ["./src/server"],
-      "next-auth/adapters": ["./src/adapters"],
-      "next-auth/client": ["./src/client"],
-      "next-auth/jwt": ["./src/lib/jwt"],
-      "next-auth/providers": ["./src/providers"]
-    }
-  }
-}

next-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />

package.json

@@ -29,8 +29,8 @@
     "prepublishOnly": "npm run build",
     "publish:beta": "npm publish --tag beta",
     "publish:canary": "npm publish --tag canary",
-    "lint": "standard",
-    "lint:fix": "standard --fix"
+    "lint": "ts-standard",
+    "lint:fix": "ts-standard --fix"
   },
   "files": [
     "dist",
@@ -74,11 +74,13 @@
     "@semantic-release/github": "^7.2.0",
     "@semantic-release/npm": "7.0.8",
     "@semantic-release/release-notes-generator": "^9.0.1",
+    "@types/react": "^17.0.0",
     "autoprefixer": "^9.7.6",
     "babel-preset-preact": "^2.0.0",
     "conventional-changelog-conventionalcommits": "4.4.0",
     "cssnano": "^4.1.10",
     "dotenv": "^8.2.0",
+    "eslint": "^7.19.0",
     "mocha": "^8.1.3",
     "mongodb": "^3.5.9",
     "mssql": "^6.2.1",
@@ -92,13 +94,17 @@
     "puppeteer-extra-plugin-stealth": "^2.6.1",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
-    "standard": "^16.0.3"
+    "ts-standard": "^10.0.0",
+    "typescript": "^4.1.3"
   },
-  "standard": {
+  "ts-standard": {
+    "project": "./tsconfig.json",
     "ignore": [
       "test/",
-      "pages/",
-      "components/"
+      "next-env.d.ts"
+    ],
+    "globals": [
+      "fetch"
     ]
   }
 }

pages/api-example.js

@@ -8,10 +8,10 @@ export default function Page () {
       <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>
   )
-}
+}

pages/api/auth/[...nextauth].js

@@ -1,92 +1,43 @@
-import NextAuth from "next-auth"
-import Providers from "next-auth/providers"
+import NextAuth from 'next-auth'
+import Providers from 'next-auth/providers'
 
 export default NextAuth({
-  // https://next-auth.js.org/configuration/providers
   providers: [
     Providers.GitHub({
       clientId: process.env.GITHUB_ID,
-      clientSecret: process.env.GITHUB_SECRET,
+      clientSecret: process.env.GITHUB_SECRET
     }),
     Providers.Auth0({
       clientId: process.env.AUTH0_ID,
       clientSecret: process.env.AUTH0_SECRET,
       domain: process.env.AUTH0_DOMAIN,
-      protection: "pkce"
+      protection: 'pkce'
     }),
     Providers.Twitter({
       clientId: process.env.TWITTER_ID,
-      clientSecret: process.env.TWITTER_SECRET,
+      clientSecret: process.env.TWITTER_SECRET
     }),
+    Providers.Credentials({
+      name: 'Credentials',
+      credentials: {
+        password: { label: 'Password', type: 'password' }
+      },
+      async authorize (credentials) {
+        if (credentials.password === 'password') {
+          return {
+            id: 1,
+            name: 'Fill Murray',
+            email: 'bill@fillmurray.com',
+            image: 'https://www.fillmurray.com/64/64'
+          }
+        }
+        return null
+      }
+    })
   ],
-  // Database optional. MySQL, Maria DB, Postgres and MongoDB are supported.
-  // https://next-auth.js.org/configuration/databases
-  //
-  // Notes:
-  // * You must to install an appropriate node_module for your database
-  // * The Email provider requires a database (OAuth providers do not)
-
-  // The secret should be set to a reasonably long random string.
-  // It is used to sign cookies and to sign and encrypt JSON Web Tokens, unless
-  // a separate secret is defined explicitly for encrypting the JWT.
-
-  session: {
-    // Use JSON Web Tokens for session instead of database sessions.
-    // This option can be used with or without a database for users/accounts.
-    // Note: `jwt` is automatically set to `true` if no database is specified.
-    jwt: true,
-
-    // Seconds - How long until an idle session expires and is no longer valid.
-    // maxAge: 30 * 24 * 60 * 60, // 30 days
-
-    // Seconds - Throttle how frequently to write to database to extend a session.
-    // Use it to limit write operations. Set to 0 to always update the database.
-    // Note: This option is ignored if using JSON Web Tokens
-    // updateAge: 24 * 60 * 60, // 24 hours
-  },
-
-  // JSON Web tokens are only used for sessions if the `jwt: true` session
-  // option is set - or by default if no database is specified.
-  // https://next-auth.js.org/configuration/options#jwt
   jwt: {
     encryption: true,
-    secret: process.env.SECRET,
-    // A secret to use for key generation (you should set this explicitly)
-    // secret: 'INp8IvdIyeMcoGAgFGoA61DdBglwwSqnXJZkgz8PSnw',
-    // Set to true to use encryption (default: false)
-    // encryption: true,
-    // You can define your own encode/decode functions for signing and encryption
-    // if you want to override the default behaviour.
-    // encode: async ({ secret, token, maxAge }) => {},
-    // decode: async ({ secret, token, maxAge }) => {},
+    secret: process.env.SECRET
   },
-
-  // You can define custom pages to override the built-in pages.
-  // The routes shown here are the default URLs that will be used when a custom
-  // pages is not specified for that route.
-  // https://next-auth.js.org/configuration/pages
-  pages: {
-    // signIn: '/api/auth/signin',  // Displays signin buttons
-    // signOut: '/api/auth/signout', // Displays form with sign out button
-    // error: '/api/auth/error', // Error code passed in query string as ?error=
-    // verifyRequest: '/api/auth/verify-request', // Used for check email page
-    // newUser: null // If set, new users will be directed here on first sign in
-  },
-
-  // Callbacks are asynchronous functions you can use to control what happens
-  // when an action is performed.
-  // https://next-auth.js.org/configuration/callbacks
-  callbacks: {
-    // signIn: async (user, account, profile) => { return Promise.resolve(true) },
-    // redirect: async (url, baseUrl) => { return Promise.resolve(baseUrl) },
-    // session: async (session, user) => { return Promise.resolve(session) },
-    // jwt: async (token, user, account, profile, isNewUser) => { return Promise.resolve(token) }
-  },
-
-  // Events are useful for logging
-  // https://next-auth.js.org/configuration/events
-  events: {},
-
-  // Enable debug messages in the console if you are having problems
-  debug: false,
+  debug: false
 })

pages/api/examples/jwt.js

@@ -1,5 +1,5 @@
 // This is an example of how to read a JSON Web Token from an API route
-import jwt from "next-auth/jwt"
+import jwt from 'next-auth/jwt'
 
 const secret = process.env.SECRET
 

pages/api/examples/protected.js

@@ -9,4 +9,4 @@ export default async (req, res) => {
   } else {
     res.send({ error: 'You must be sign in to view the protected content on this page.' })
   }
-}
+}

pages/api/examples/session.js

@@ -4,4 +4,4 @@ import { getSession } from 'next-auth/client'
 export default async (req, res) => {
   const session = await getSession({ req })
   res.send(JSON.stringify(session, null, 2))
-}
+}

pages/client.js

@@ -19,4 +19,4 @@ export default function Page () {
       </p>
     </Layout>
   )
-}
+}

pages/credentials.js

@@ -0,0 +1,60 @@
+import * as React from 'react'
+import { signIn, signOut, useSession } from 'next-auth/client'
+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)
+    if (response.ok) {
+      window.alert('Manually refreshing to update session, if login was successful')
+      window.location.reload()
+    }
+  }
+
+  const handleLogout = (options) => async () => {
+    if (options.redirect) {
+      return signOut(options)
+    }
+    const response = await signOut(options)
+    setResponse(response)
+    if (response.ok) {
+      window.alert('Manually refreshing to update session, if logout was successful')
+      window.location.reload()
+    }
+  }
+
+  const [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>
+  )
+}

pages/policy.js

@@ -4,7 +4,7 @@ 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.
+        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>
@@ -27,4 +27,4 @@ export default function Page () {
       </p>
     </Layout>
   )
-}
+}

pages/protected-ssr.js

@@ -5,7 +5,7 @@ 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) { return <Layout><AccessDenied /></Layout> }
 
   // If session exists, display content
   return (
@@ -16,7 +16,7 @@ export default function Page ({ content, session }) {
   )
 }
 
-export async function getServerSideProps(context) {
+export async function getServerSideProps (context) {
   const session = await getSession(context)
   let content = null
 

pages/protected.js

@@ -4,24 +4,24 @@ import Layout from '../components/layout'
 import AccessDenied from '../components/access-denied'
 
 export default function Page () {
-  const [ session, loading ] = useSession()
-  const [ content , setContent ] = useState()
+  const [session, loading] = useSession()
+  const [content, setContent] = useState()
 
   // Fetch content from protected route
-  useEffect(()=>{
+  useEffect(() => {
     const fetchData = async () => {
       const res = await fetch('/api/examples/protected')
       const json = await res.json()
       if (json.content) { setContent(json.content) }
     }
     fetchData()
-  },[session])
+  }, [session])
 
   // When rendering client side don't display anything until loading is complete
   if (typeof window !== 'undefined' && loading) return null
 
   // If no session exists, display access denied message
-  if (!session) { return  <Layout><AccessDenied/></Layout> }
+  if (!session) { return <Layout><AccessDenied /></Layout> }
 
   // If session exists, display content
   return (
@@ -30,4 +30,4 @@ export default function Page () {
       <p><strong>{content}</strong></p>
     </Layout>
   )
-}
+}

pages/server.js

@@ -1,4 +1,4 @@
-import { useSession, getSession } from 'next-auth/client'
+import { getSession } from 'next-auth/client'
 import Layout from '../components/layout'
 
 export default function Page () {
@@ -6,7 +6,6 @@ export default function Page () {
   // 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()`.
-  const [ session, loading ] = useSession()
 
   return (
     <Layout>
@@ -29,7 +28,7 @@ export default function Page () {
 }
 
 // Export the `session` prop to use sessions with Server Side Rendering
-export async function getServerSideProps(context) {
+export async function getServerSideProps (context) {
   return {
     props: {
       session: await getSession(context)

src/client/index.js

@@ -10,7 +10,6 @@
 //
 // We use HTTP POST requests with CSRF Tokens to protect against CSRF attacks.
 
-/* global fetch:false */
 import { useState, useEffect, useContext, createContext, createElement } from 'react'
 import logger from '../lib/logger'
 import parseUrl from '../lib/parse-url'
@@ -233,62 +232,101 @@ const _useSessionHook = (session) => {
   return [data, loading]
 }
 
-// Client side method
-export const signIn = async (provider, args = {}, authorizationParams = {}) => {
+/**
+ * Client-side method to initiate a signin flow
+ * or send the user to the signin page listing all possible providers.
+ * (Automatically adds the CSRF token to the request)
+ * @see https://next-auth.js.org/getting-started/client#signin
+ * @param {string} [provider]
+ * @param {SignInOptions} [options]
+ * @param {object} [authorizationParams]
+ * @return {Promise<SignInResponse | undefined>}
+ * @typedef {{callbackUrl?: string; redirect?: boolean}} SignInOptions
+ * @typedef {{error: string | null; status: number; ok: boolean}} SignInResponse
+ */
+export async function signIn (provider, options = {}, authorizationParams = {}) {
+  const {
+    callbackUrl = window.location,
+    redirect = true
+  } = options
+
   const baseUrl = _apiBaseUrl()
-  const callbackUrl = args?.callbackUrl ?? window.location
   const providers = await getProviders()
 
   // Redirect to sign in page if no valid provider specified
   if (!(provider in providers)) {
     // If Provider not recognized, redirect to sign in page
     window.location = `${baseUrl}/signin?callbackUrl=${encodeURIComponent(callbackUrl)}`
-  } else {
-    const signInUrl = (providers[provider].type === 'credentials')
-      ? `${baseUrl}/callback/${provider}`
-      : `${baseUrl}/signin/${provider}`
+    return
+  }
+  const isCredentials = providers[provider].type === 'credentials'
+  const signInUrl = isCredentials
+    ? `${baseUrl}/callback/${provider}`
+    : `${baseUrl}/signin/${provider}`
 
-    // If is any other provider type, POST to provider URL with CSRF Token,
-    // callback URL and any other parameters supplied.
-    const fetchOptions = {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/x-www-form-urlencoded'
-      },
-      body: _encodedForm({
-        ...args,
-        csrfToken: await getCsrfToken(),
-        callbackUrl: callbackUrl,
-        json: true
-      })
-    }
-    const _signInUrl = `${signInUrl}?${_encodedForm(authorizationParams)}`
-    const res = await fetch(_signInUrl, fetchOptions)
-    const data = await res.json()
+  // If is any other provider type, POST to provider URL with CSRF Token,
+  // callback URL and any other parameters supplied.
+  const fetchOptions = {
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded'
+    },
+    body: new URLSearchParams({
+      ...options,
+      csrfToken: await getCsrfToken(),
+      callbackUrl,
+      json: true
+    })
+  }
+  const _signInUrl = `${signInUrl}?${new URLSearchParams(authorizationParams)}`
+  const res = await fetch(_signInUrl, fetchOptions)
+  const data = await res.json()
+  if (redirect || !isCredentials) {
     window.location = data.url ?? callbackUrl
+    return
+  }
+
+  const error = new URL(data.url).searchParams.get('error')
+  return {
+    error,
+    status: res.status,
+    ok: res.ok
   }
 }
 
-// Client side method
-export const signOut = async (args = {}) => {
-  const callbackUrl = args.callbackUrl ?? window.location
-
+/**
+ * Signs the user out, by removing the session cookie.
+ * (Automatically adds the CSRF token to the request)
+ * @param {SignOutOptions} [options]
+ * @returns {Promise<{url?: string} | undefined>}
+ * @typedef {{callbackUrl?: string; redirect?: boolean;}} SignOutOptions
+ */
+export async function signOut (options = {}) {
+  const {
+    callbackUrl = window.location,
+    redirect = true
+  } = options
   const baseUrl = _apiBaseUrl()
   const fetchOptions = {
     method: 'post',
     headers: {
       'Content-Type': 'application/x-www-form-urlencoded'
     },
-    body: _encodedForm({
+    body: new URLSearchParams({
       csrfToken: await getCsrfToken(),
-      callbackUrl: callbackUrl,
+      callbackUrl,
       json: true
     })
   }
   const res = await fetch(`${baseUrl}/signout`, fetchOptions)
   const data = await res.json()
   _sendMessage({ event: 'session', data: { trigger: 'signout' } })
-  window.location = data.url ?? callbackUrl
+  if (redirect) {
+    window.location = data.url ?? callbackUrl
+    return
+  }
+
+  return data
 }
 
 // Provider to wrap the app in to make session data available globally
@@ -321,12 +359,6 @@ const _apiBaseUrl = () => {
   }
 }
 
-const _encodedForm = (formData) => {
-  return Object.keys(formData).map((key) => {
-    return encodeURIComponent(key) + '=' + encodeURIComponent(formData[key])
-  }).join('&')
-}
-
 const _sendMessage = (message) => {
   if (typeof localStorage !== 'undefined') {
     const timestamp = Math.floor(new Date().getTime() / 1000)

src/css/index.css

@@ -80,6 +80,7 @@ input[type] {
   font-size: 1rem;
   border-radius: var(--border-radius);
   box-shadow: inset 0 .1rem .2rem rgba(0, 0, 0, .2);
+  color: var(--color-text);
 
   &:focus {
     box-shadow: none;

src/providers/eveonline.js

@@ -0,0 +1,21 @@
+export default (options) => {
+  return {
+    id: 'eveonline',
+    name: 'EVE Online',
+    type: 'oauth',
+    version: '2.0',
+    params: { grant_type: 'authorization_code' },
+    accessTokenUrl: 'https://login.eveonline.com/oauth/token',
+    authorizationUrl: 'https://login.eveonline.com/oauth/authorize?response_type=code',
+    profileUrl: 'https://login.eveonline.com/oauth/verify',
+    profile: (profile) => {
+      return {
+        id: profile.CharacterID,
+        name: profile.CharacterName,
+        image: `https://image.eveonline.com/Character/${profile.CharacterID}_128.jpg`,
+        email: null
+      }
+    },
+    ...options
+  }
+}

src/providers/index.js

@@ -10,6 +10,7 @@ import Cognito from './cognito'
 import Credentials from './credentials'
 import Discord from './discord'
 import Email from './email'
+import EVEOnline from './eveonline'
 import Facebook from './facebook'
 import Foursquare from './foursquare'
 import FusionAuth from './fusionauth'
@@ -46,6 +47,7 @@ export default {
   Credentials,
   Discord,
   Email,
+  EVEOnline,
   Facebook,
   Foursquare,
   FusionAuth,

src/server/index.d.ts

@@ -0,0 +1,91 @@
+import { NextApiHandler, NextApiRequest, NextApiResponse } from 'next'
+import { CallbacksOptions } from './lib/callbacks'
+import { CookiesOptions } from './lib/cookie'
+import { EventsOptions } from './lib/events'
+
+export interface Provider {
+  id: string
+  name: string
+  type: string
+  version: string
+  params: Record<string, unknown>
+  scope: string
+  accessTokenUrl: string
+  authorizationUrl: string
+  profileUrl?: string
+  grant_type?: string
+  profile?: (profile: any) => Promise<any>
+}
+
+/** @docs https://next-auth.js.org/configuration/options */
+export interface NextAuthOptions {
+  /** @docs https://next-auth.js.org/configuration/options#theme */
+  theme?: 'auto' | 'dark' | 'light'
+  /** @docs https://next-auth.js.org/configuration/options#providers */
+  providers: Provider[]
+  /** @docs https://next-auth.js.org/configuration/options#database */
+  database?: any
+  /** @docs https://next-auth.js.org/configuration/options#secret */
+  secret?: any
+  /** @docs https://next-auth.js.org/configuration/options#session */
+  session?: any
+  /** @docs https://next-auth.js.org/configuration/options#jwt */
+  jwt?: any
+  /** @docs https://next-auth.js.org/configuration/options#pages */
+  pages?: {
+    signIn?: string
+    signOut?: string
+    /** Error code passed in query string as ?error= */
+    error?: string
+    verifyRequest?: string
+    /** If set, new users will be directed here on first sign in */
+    newUser?: string
+  }
+  /**
+   * Callbacks are asynchronous functions you can use to control what happens when an action is performed.
+   * Callbacks are extremely powerful, especially in scenarios involving JSON Web Tokens as
+   * they allow you to implement access controls without a database and
+   * to integrate with external databases or APIs.
+   * @docs https://next-auth.js.org/configuration/options#callbacks
+   */
+  callbacks?: CallbacksOptions
+  /** @docs https://next-auth.js.org/configuration/options#events */
+  events?: EventsOptions
+  /** @docs https://next-auth.js.org/configuration/options#adapter */
+  adapter?: any
+  /** @docs https://next-auth.js.org/configuration/options#debug */
+  debug?: boolean
+  /** @docs https://next-auth.js.org/configuration/options#usesecurecookies */
+  useSecureCookies?: boolean
+  /** @docs https://next-auth.js.org/configuration/options#cookies */
+  cookies?: CookiesOptions
+}
+
+/** Options that are the same both in internal and user provided options. */
+export type NextAuthSharedOptions = 'pages' | 'jwt' | 'events' | 'callbacks' | 'cookies' | 'secret' | 'adapter' | 'theme' | 'debug'
+
+export interface NextAuthInternalOptions extends Pick<NextAuthOptions, NextAuthSharedOptions> {
+  pkce?: {
+    code_verifier?: string
+    /**
+     * Could be `"plain"`, but not recommended.
+     * We ignore it for now.
+     * @spec https://tools.ietf.org/html/rfc7636#section-4.2.
+     */
+    code_challenge_method?: 'S256'
+  }
+  provider?: Provider
+  baseUrl?: string
+  basePath?: string
+  action?: string
+  csrfToken?: string
+}
+
+export interface NextAuthRequest extends NextApiRequest {
+  options: NextAuthInternalOptions
+}
+
+export interface NextAuthResponse extends NextApiResponse {}
+
+export declare function NextAuthHandler (req: NextAuthRequest, res: NextAuthResponse, options: NextAuthOptions): ReturnType<NextApiHandler>
+export declare function NextAuthHandler (options: NextAuthOptions): ReturnType<NextApiHandler>

src/server/index.js

@@ -21,6 +21,11 @@ if (!process.env.NEXTAUTH_URL) {
   logger.warn('NEXTAUTH_URL', 'NEXTAUTH_URL environment variable not set')
 }
 
+/**
+ * @param {import("next").NextApiRequest} req
+ * @param {import("next").NextApiResponse} res
+ * @param {import(".").NextAuthOptions} userOptions
+ */
 async function NextAuthHandler (req, res, userOptions) {
   // If debug enabled, set ENV VAR so that logger logs debug messages
   if (userOptions.debug) {

src/server/lib/callbacks.d.ts

@@ -0,0 +1,7 @@
+
+export interface CallbacksOptions {
+  signIn?: (user: any, account: any, profile: any) => Promise<never | string>
+  jwt?: (token: any, user: any, account: any, profile: any, isNewUser?: boolean) => Promise<any>
+  session?: (session: any, userOrToken: any) => Promise<any>
+  redirect?: (url: string, baseUrl: string) => Promise<string>
+}

src/server/lib/cookie.d.ts

@@ -0,0 +1,16 @@
+export interface CookieOption {
+  name: string
+  options: {
+    httpOnly: boolean
+    sameSite: string
+    path?: string
+    secure: boolean
+  }
+}
+
+export interface CookiesOptions {
+  sessionToken: CookieOption
+  callbackUrl: CookieOption
+  csrfToken: CookieOption
+  pkceCodeVerifier: CookieOption
+}

src/server/lib/cookie.js

@@ -110,6 +110,7 @@ function _serialize (name, val, options) {
  * For more on prefixes see https://googlechrome.github.io/samples/cookie-prefixes/
  *
  * @TODO Review cookie settings (names, options)
+ * @return {import("./cookie").CookiesOptions}
  */
 export function defaultCookies (useSecureCookies) {
   const cookiePrefix = useSecureCookies ? '__Secure-' : ''

src/server/lib/events.d.ts

@@ -0,0 +1,12 @@
+export type EventType=
+  | 'signIn'
+  | 'signOut'
+  | 'createUser'
+  | 'updateUser'
+  | 'linkAccount'
+  | 'session'
+  | 'error'
+
+export type EventCallback = (message: any) => Promise<void>
+
+export type EventsOptions = Partial<Record<EventType, EventCallback>>

src/server/lib/oauth/callback.js

@@ -3,6 +3,7 @@ import oAuthClient from './client'
 import logger from '../../../lib/logger'
 import { OAuthCallbackError } from '../../../lib/errors'
 
+/** @param {import("../..").NextAuthRequest} req */
 export default async function oAuthCallback (req) {
   const { provider, pkce } = req.options
   const client = oAuthClient(provider)
@@ -89,7 +90,7 @@ export default async function oAuthCallback (req) {
  *     refresh_token?: string
  *     id_token?: string
  *   }
- *   provider: object
+ *   provider: import("../..").Provider
  *   user?: object
  * }} profileParams
  */

src/server/lib/oauth/client.js

@@ -7,6 +7,7 @@ import { sign as jwtSign } from 'jsonwebtoken'
  * @TODO Refactor to remove dependancy on 'oauth' package
  * It is already quite monkey patched, we don't use all the features and and it
  * would be easier to maintain if all the code was native to next-auth.
+ * @param {import("../..").Provider} provider
  */
 export default function oAuthClient (provider) {
   if (provider.version?.startsWith('2.')) {
@@ -86,6 +87,9 @@ export default function oAuthClient (provider) {
 
 /**
  * Ported from https://github.com/ciaranj/node-oauth/blob/a7f8a1e21c362eb4ed2039431fb9ac2ae749f26a/lib/oauth2.js
+ * @param {string} code
+ * @param {import("../..").Provider} provider
+ * @param {string | undefined} codeVerifier
  */
 async function getOAuth2AccessToken (code, provider, codeVerifier) {
   const url = provider.accessTokenUrl
@@ -128,7 +132,7 @@ async function getOAuth2AccessToken (code, provider, codeVerifier) {
     headers.Authorization = 'Basic ' + Buffer.from((provider.clientId + ':' + provider.clientSecret)).toString('base64')
   }
 
-  if ((provider.id === 'okta' || provider.id === 'identity-server4') && !headers.Authorization) {
+  if (provider.id === 'identity-server4' && !headers.Authorization) {
     headers.Authorization = `Bearer ${code}`
   }
 
@@ -184,6 +188,9 @@ async function getOAuth2AccessToken (code, provider, codeVerifier) {
  *
  * 18/08/2020 @robertcraigie added results parameter to pass data to an optional request preparer.
  * e.g. see providers/bungie
+ * @param {import("../..").Provider} provider
+ * @param {string} accessToken
+ * @param {any} results
  */
 async function getOAuth2 (provider, accessToken, results) {
   let url = provider.profileUrl

src/server/lib/oauth/pkce-handler.js

@@ -8,7 +8,11 @@ const PKCE_LENGTH = 64
 const PKCE_CODE_CHALLENGE_METHOD = 'S256' // can be 'plain', not recommended https://tools.ietf.org/html/rfc7636#section-4.2
 const PKCE_MAX_AGE = 60 * 15 // 15 minutes in seconds
 
-/** Adds `code_verifier` to `req.options.pkce`, and removes the corresponding cookie */
+/**
+ * Adds `code_verifier` to `req.options.pkce`, and removes the corresponding cookie
+ * @param {import("../..").NextAuthRequest} req
+ * @param {import("../..").NextAuthResponse} res
+ */
 export async function handleCallback (req, res) {
   const { cookies, provider, baseUrl, basePath } = req.options
   try {
@@ -38,7 +42,11 @@ export async function handleCallback (req, res) {
   }
 }
 
-/** Adds `code_challenge` and `code_challenge_method` to `req.options.pkce`. */
+/**
+ * Adds `code_challenge` and `code_challenge_method` to `req.options.pkce`.
+ * @param {import("../..").NextAuthRequest} req
+ * @param {import("../..").NextAuthResponse} res
+ */
 export async function handleSignin (req, res) {
   const { cookies, provider, baseUrl, basePath } = req.options
   try {

src/server/lib/oauth/state-handler.js

@@ -6,6 +6,8 @@ import { OAuthCallbackError } from '../../../lib/errors'
  * For OAuth 2.0 flows, if the provider supports state,
  * check if state matches the one sent on signin
  * (a hash of the NextAuth.js CSRF token).
+ * @param {import("../..").NextAuthRequest} req
+ * @param {import("../..").NextAuthResponse} res
  */
 export async function handleCallback (req, res) {
   const { csrfToken, provider, baseUrl, basePath } = req.options
@@ -31,7 +33,11 @@ export async function handleCallback (req, res) {
   }
 }
 
-/** Adds CSRF token to the authorizationParams. */
+/**
+ * Adds CSRF token to the authorizationParams.
+ * @param {import("../..").NextAuthRequest} req
+ * @param {import("../..").NextAuthResponse} res
+ */
 export async function handleSignin (req, res) {
   const { provider, baseUrl, basePath, csrfToken } = req.options
   try {

src/server/lib/signin/oauth.js

@@ -1,6 +1,7 @@
 import oAuthClient from '../oauth/client'
 import logger from '../../../lib/logger'
 
+/** @param {import("../..").NextAuthRequest} req */
 export default async function getAuthorizationUrl (req) {
   const { provider } = req.options
 

src/server/routes/callback.js

@@ -4,7 +4,11 @@ import * as cookie from '../lib/cookie'
 import logger from '../../lib/logger'
 import dispatchEvent from '../lib/dispatch-event'
 
-/** Handle callbacks from login services */
+/**
+ * Handle callbacks from login services
+ * @param {import("..").NextAuthRequest} req
+ * @param {import("..").NextAuthResponse} res
+ */
 export default async function callback (req, res) {
   const {
     provider,
@@ -217,12 +221,12 @@ export default async function callback (req, res) {
   } else if (provider.type === 'credentials' && req.method === 'POST') {
     if (!useJwtSession) {
       logger.error('CALLBACK_CREDENTIALS_JWT_ERROR', 'Signin in with credentials is only supported if JSON Web Tokens are enabled')
-      return res.redirect(`${baseUrl}${basePath}/error?error=Configuration`)
+      return res.status(500).redirect(`${baseUrl}${basePath}/error?error=Configuration`)
     }
 
     if (!provider.authorize) {
       logger.error('CALLBACK_CREDENTIALS_HANDLER_ERROR', 'Must define an authorize() handler to use credentials authentication provider')
-      return res.redirect(`${baseUrl}${basePath}/error?error=Configuration`)
+      return res.status(500).redirect(`${baseUrl}${basePath}/error?error=Configuration`)
     }
 
     const credentials = req.body
@@ -231,7 +235,7 @@ export default async function callback (req, res) {
     try {
       userObjectReturnedFromAuthorizeHandler = await provider.authorize(credentials)
       if (!userObjectReturnedFromAuthorizeHandler) {
-        return res.redirect(`${baseUrl}${basePath}/error?error=CredentialsSignin&provider=${encodeURIComponent(provider.id)}`)
+        return res.status(401).redirect(`${baseUrl}${basePath}/error?error=CredentialsSignin&provider=${encodeURIComponent(provider.id)}`)
       }
     } catch (error) {
       if (error instanceof Error) {
@@ -246,7 +250,7 @@ export default async function callback (req, res) {
     try {
       const signInCallbackResponse = await callbacks.signIn(user, account, credentials)
       if (signInCallbackResponse === false) {
-        return res.redirect(`${baseUrl}${basePath}/error?error=AccessDenied`)
+        return res.status(403).redirect(`${baseUrl}${basePath}/error?error=AccessDenied`)
       }
     } catch (error) {
       if (error instanceof Error) {

src/server/routes/providers.js

@@ -2,6 +2,8 @@
  * Return a JSON object with a list of all OAuth providers currently configured
  * and their signin and callback URLs. This makes it possible to automatically
  * generate buttons for all providers when rendering client side.
+ * @param {import("..").NextAuthRequest} req
+ * @param {import("..").NextAuthResponse} res
  */
 export default function providers (req, res) {
   const { providers } = req.options

src/server/routes/signin.js

@@ -44,7 +44,7 @@ export default async function signin (req, res) {
 
     // Check if user is allowed to sign in
     try {
-      const signInCallbackResponse = await callbacks.signIn(profile, account, { email })
+      const signInCallbackResponse = await callbacks.signIn(profile, account, { email, verificationRequest: true })
       if (signInCallbackResponse === false) {
         return res.redirect(`${baseUrl}${basePath}/error?error=AccessDenied`)
       } else if (typeof signInCallbackResponse === 'string') {

tsconfig.json

@@ -0,0 +1,48 @@
+{
+  "compilerOptions": {
+    "strictNullChecks": true,
+    "baseUrl": ".",
+    "paths": {
+      "next-auth": [
+        "./src/server"
+      ],
+      "next-auth/adapters": [
+        "./src/adapters"
+      ],
+      "next-auth/client": [
+        "./src/client"
+      ],
+      "next-auth/jwt": [
+        "./src/lib/jwt"
+      ],
+      "next-auth/providers": [
+        "./src/providers"
+      ]
+    },
+    "target": "es5",
+    "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,
+    "jsx": "preserve"
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

www/docs/configuration/pages.md

@@ -118,3 +118,7 @@ You can also use the `signIn()` function which will handle obtaining the CSRF to
 ```js
 signIn('credentials', { username: 'jsmith', password: '1234' })
 ```
+
+:::tip
+Remember to put any custom pages in a folder outside **/pages/api** which is reserved for API code. As per the examples above, a location convention suggestion is `pages/auth/...`. 
+:::

www/docs/providers/atlassian.md

@@ -9,8 +9,6 @@ https://developer.atlassian.com/cloud/jira/platform/oauth-2-authorization-code-g
 
 ## Example
 
-For Jira Platform API access:
-
 ```js
 import Providers from `next-auth/providers`
 ...
@@ -18,8 +16,7 @@ providers: [
   Providers.Atlassian({
     clientId: process.env.ATLASSIAN_CLIENT_ID,
     clientSecret: process.env.ATLASSIAN_CLIENT_SECRET,
-      scope:
-        'write:jira-work read:jira-work read:jira-user offline_access read:me',
+    scope: 'write:jira-work read:jira-work read:jira-user offline_access read:me'
   })
 ]
 ...
@@ -33,7 +30,7 @@ providers: [
 An app can be created at https://developer.atlassian.com/apps/
 :::
 
-Under "Apis and features" side menu, configure the following for the "OAuth 2.0 (3LO)"
+Under "Apis and features" in the side menu, configure the following for "OAuth 2.0 (3LO)":
 
 - Redirect URL
   - http://localhost:3000/api/auth/callback/atlassian

www/docs/providers/eveonline.md

@@ -0,0 +1,57 @@
+---
+id: eveonline
+title: EVE Online
+---
+
+## Documentation
+
+https://developers.eveonline.com/blog/article/sso-to-authenticated-calls
+
+## Configuration
+
+https://developers.eveonline.com/
+
+## Example
+
+```js
+import Providers from `next-auth/providers`
+...
+providers: [
+  Providers.EVEOnline({
+    clientId: process.env.EVE_CLIENT_ID,
+    clientSecret: process.env.EVE_CLIENT_SECRET
+  })
+]
+...
+```
+
+:::tip When creating your application, make sure to select `Authentication Only` as the connection type.
+
+:::tip If using JWT for the session, you can add the `CharacterID` to the JWT token and session. Example:
+
+```js
+...
+options: {
+  jwt: {
+    secret: process.env.JWT_SECRET,
+  },
+  callbacks: {
+    jwt: async (token, user, account, profile, isNewUser) => {
+      if (profile) {
+        token = {
+          ...token,
+          id: profile.CharacterID,
+        }
+      }
+      return token;
+    },
+    session: async (session, token) => {
+      if (token) {
+        session.user.id = token.id;
+      }
+      return session;
+    }
+  }
+}
+...
+```

www/providers.json

@@ -11,6 +11,7 @@
   "credentials": "Credentials",
   "discord": "Discord",
   "email": "Email",
+  "eveonline": "EVE Online",
   "facebook": "Facebook",
   "foursquare": "Foursquare",
   "fusionauth": "FusionAuth",