From ba9f6b2cd6362a594f84868eb40803ea20ed2787 Mon Sep 17 00:00:00 2001
From: Jimmy Merritello <7191639+jmfury@users.noreply.github.com>
Date: Wed, 23 Sep 2020 15:47:30 -0500
Subject: [PATCH] [Website] Add Auth  (#417)

* Initial auth commit

* Add Auth0 to preview env config

* Proper website package name
---
 website/.gitignore                            |   1 +
 .../components/auth-gate/auth-gate.module.css |  17 +
 website/components/auth-gate/index.jsx        |  83 +++
 website/components/auth-gate/loading.svg      |   1 +
 .../auth-indicator/auth-indicator.module.css  |  25 +
 website/components/auth-indicator/index.jsx   |  30 ++
 website/components/auth-indicator/loading.svg |   1 +
 .../conditional-auth-provider/index.jsx       |  19 +
 .../components/signin-error-page/index.jsx    |  33 ++
 .../signin-error-page/signin-error.module.css |  29 +
 website/lib/next-auth-utils/config.js         |  19 +
 website/next.config.js                        |   9 +
 website/package-lock.json                     | 506 ++++++++++++++++++
 website/package.json                          |   6 +-
 website/pages/_app.js                         |  69 +--
 website/pages/api/auth/[...nextauth].js       |  12 +
 website/pages/signin-error/index.jsx          |   5 +
 17 files changed, 831 insertions(+), 34 deletions(-)
 create mode 100644 website/components/auth-gate/auth-gate.module.css
 create mode 100644 website/components/auth-gate/index.jsx
 create mode 100644 website/components/auth-gate/loading.svg
 create mode 100644 website/components/auth-indicator/auth-indicator.module.css
 create mode 100644 website/components/auth-indicator/index.jsx
 create mode 100644 website/components/auth-indicator/loading.svg
 create mode 100644 website/components/conditional-auth-provider/index.jsx
 create mode 100644 website/components/signin-error-page/index.jsx
 create mode 100644 website/components/signin-error-page/signin-error.module.css
 create mode 100644 website/lib/next-auth-utils/config.js
 create mode 100644 website/pages/api/auth/[...nextauth].js
 create mode 100644 website/pages/signin-error/index.jsx

diff --git a/website/.gitignore b/website/.gitignore
index 1d23ce1de..4407f9d43 100644
--- a/website/.gitignore
+++ b/website/.gitignore
@@ -3,3 +3,4 @@ node_modules
 .next
 out
 .mdx-data
+.env*.local
diff --git a/website/components/auth-gate/auth-gate.module.css b/website/components/auth-gate/auth-gate.module.css
new file mode 100644
index 000000000..dbda7381e
--- /dev/null
+++ b/website/components/auth-gate/auth-gate.module.css
@@ -0,0 +1,17 @@
+.signInWrapper {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.loadingIconSpin {
+  transform: translateY(-100px);
+}
+
+.loginLockup {
+  display: flex;
+  width: 50vw;
+  justify-content: space-around;
+}
diff --git a/website/components/auth-gate/index.jsx b/website/components/auth-gate/index.jsx
new file mode 100644
index 000000000..a5b4b20dc
--- /dev/null
+++ b/website/components/auth-gate/index.jsx
@@ -0,0 +1,83 @@
+import { useSession, getCsrfToken, getProviders } from 'next-auth/client'
+import LoadingIcon from './loading.svg?include'
+import InlineSvg from '@hashicorp/react-inline-svg'
+import styles from './auth-gate.module.css'
+import Button from '@hashicorp/react-button'
+import { useEffect, useState } from 'react'
+import { useRouter } from 'next/router'
+import SigninErrorPage from 'components/signin-error-page'
+
+export default function AuthGate({ children }) {
+  const [session, loading] = useSession()
+  const { query } = useRouter()
+  if (query?.error === 'oAuthCallback') return <SigninErrorPage />
+
+  if (loading)
+    return <InlineSvg className={styles.loadingIconSpin} src={LoadingIcon} />
+  return session ? (
+    <>{children}</>
+  ) : (
+    <div className={styles.signInWrapper}>
+      <SignInForm />
+    </div>
+  )
+}
+
+function SignInForm() {
+  const [token, setToken] = useState(null)
+  useEffect(() => {
+    async function getToken() {
+      const t = await getCsrfToken()
+      if (t) {
+        setToken(t)
+      }
+    }
+    getToken()
+  }, [token])
+  return token ? (
+    <section className={styles.signInWrapper}>
+      <Form token={token} callbackUrl={window.location.origin} />
+    </section>
+  ) : null
+}
+
+function Form({ callbackUrl, token }) {
+  const authProviders = useAuthProviders()
+
+  return (
+    <div className={styles.loginLockup}>
+      {authProviders &&
+        Object.keys(authProviders).map((ap) => (
+          <form
+            key={ap}
+            action={`${callbackUrl}/api/auth/signin/${ap}`}
+            method="POST"
+          >
+            <input type="hidden" name="csrfToken" value={token} />
+            <input type="hidden" name="callbackUrl" value={callbackUrl} />
+            <Button
+              type="submit"
+              title={`Sign in with ${authProviders[ap].name}`}
+              theme={{ variant: 'primary', background: 'dark' }}
+            />
+          </form>
+        ))}
+    </div>
+  )
+}
+
+export function useAuthProviders() {
+  const [authProviders, setAuthProviders] = useState([])
+  async function getProviderList() {
+    const providers = await getProviders()
+    if (providers) {
+      setAuthProviders(providers)
+    }
+  }
+  useEffect(() => {
+    if (typeof window !== 'undefined') {
+      getProviderList()
+    }
+  }, [])
+  return authProviders
+}
diff --git a/website/components/auth-gate/loading.svg b/website/components/auth-gate/loading.svg
new file mode 100644
index 000000000..9a3df750a
--- /dev/null
+++ b/website/components/auth-gate/loading.svg
@@ -0,0 +1 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle opacity=".3" cx="24" cy="24" r="24" fill="#fff"/><path d="M48 24A24 24 0 1131.416 1.175l-1.112 3.423A20.4 20.4 0 1044.4 24H48z" fill="#1D1E23"/></svg>
\ No newline at end of file
diff --git a/website/components/auth-indicator/auth-indicator.module.css b/website/components/auth-indicator/auth-indicator.module.css
new file mode 100644
index 000000000..24b720797
--- /dev/null
+++ b/website/components/auth-indicator/auth-indicator.module.css
@@ -0,0 +1,25 @@
+.authIndicator {
+  position: fixed;
+  bottom: 0;
+  width: 100vw;
+  z-index: 3;
+  padding: 1rem;
+  text-align: center;
+  background: var(--black);
+  color: var(--white);
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+  @media (--medium-up) {
+    justify-content: flex-end;
+  }
+}
+
+.loadingIconSpin {
+  transform: translateY(-100px);
+}
+
+.loggedInText {
+  margin: 0 1rem;
+}
diff --git a/website/components/auth-indicator/index.jsx b/website/components/auth-indicator/index.jsx
new file mode 100644
index 000000000..2f6cf52a3
--- /dev/null
+++ b/website/components/auth-indicator/index.jsx
@@ -0,0 +1,30 @@
+import { signOut, useSession } from 'next-auth/client'
+import LoadingIcon from './loading.svg?include'
+import InlineSvg from '@hashicorp/react-inline-svg'
+import styles from './auth-indicator.module.css'
+import Button from '@hashicorp/react-button'
+
+export default function AuthIndicator() {
+  const [session, loading] = useSession()
+  if (loading)
+    return <InlineSvg className={styles.loadingIconSpin} src={LoadingIcon} />
+  return (
+    <div className={styles.authIndicator}>
+      {session && (
+        <>
+          <span className={`g-type-label ${styles.loggedInText}`}>
+            Signed in as {session.user.email}
+          </span>
+          <span>
+            <Button
+              onClick={signOut}
+              title={`Sign out`}
+              size="small"
+              theme={{ variant: 'secondary-neutral', background: 'dark' }}
+            />
+          </span>
+        </>
+      )}
+    </div>
+  )
+}
diff --git a/website/components/auth-indicator/loading.svg b/website/components/auth-indicator/loading.svg
new file mode 100644
index 000000000..9a3df750a
--- /dev/null
+++ b/website/components/auth-indicator/loading.svg
@@ -0,0 +1 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle opacity=".3" cx="24" cy="24" r="24" fill="#fff"/><path d="M48 24A24 24 0 1131.416 1.175l-1.112 3.423A20.4 20.4 0 1044.4 24H48z" fill="#1D1E23"/></svg>
\ No newline at end of file
diff --git a/website/components/conditional-auth-provider/index.jsx b/website/components/conditional-auth-provider/index.jsx
new file mode 100644
index 000000000..71e2eec64
--- /dev/null
+++ b/website/components/conditional-auth-provider/index.jsx
@@ -0,0 +1,19 @@
+import AuthIndicator from 'components/auth-indicator'
+import AuthGate from 'components/auth-gate'
+import { Provider as NextAuthProvider } from 'next-auth/client'
+
+const shouldApplyAuth =
+  process.env.HASHI_ENV === 'production' || process.env.HASHI_ENV === 'preview'
+
+export default function ConditionalAuthProvider({ children, session }) {
+  return shouldApplyAuth ? (
+    <NextAuthProvider session={session}>
+      <AuthGate>
+        {children}
+        <AuthIndicator />
+      </AuthGate>
+    </NextAuthProvider>
+  ) : (
+    <>{children}</>
+  )
+}
diff --git a/website/components/signin-error-page/index.jsx b/website/components/signin-error-page/index.jsx
new file mode 100644
index 000000000..14d93965d
--- /dev/null
+++ b/website/components/signin-error-page/index.jsx
@@ -0,0 +1,33 @@
+import styles from './signin-error.module.css'
+import Button from '@hashicorp/react-button'
+import { useAuthProviders } from 'components/auth-gate'
+
+export default function SigninErrorPage() {
+  const authProviders = useAuthProviders()
+  return (
+    <div className={styles.signinErrorWrapper}>
+      <h1 className="g-type-display-3">
+        Sorry! <br />
+        It seems you do not have appropriate permissions to view this content.
+      </h1>
+      {authProviders && (
+        <div className={styles.logoutCard}>
+          <div className={styles.authProviderGoBack}>
+            <h4>{`If you'd like to try again with another Okta account, please log out of Okta`}</h4>
+            {process.env.NEXT_PUBLIC_OKTA_DOMAIN && (
+              <Button
+                url={`https://${process.env.NEXT_PUBLIC_OKTA_DOMAIN}`}
+                title={`Go to Okta`}
+              />
+            )}
+          </div>
+          <div className={styles.authProviderGoBack}>
+            <h4>{`If you'd like to try again with another Auth0 account, please go back`}</h4>
+            <Button url="/" title="Go back" />
+          </div>
+          )
+        </div>
+      )}
+    </div>
+  )
+}
diff --git a/website/components/signin-error-page/signin-error.module.css b/website/components/signin-error-page/signin-error.module.css
new file mode 100644
index 000000000..437ac9257
--- /dev/null
+++ b/website/components/signin-error-page/signin-error.module.css
@@ -0,0 +1,29 @@
+.signinErrorWrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  flex-direction: column;
+  width: 100vw;
+  height: 100vh;
+}
+
+.logoutCard {
+  margin-top: 3rem;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  align-items: center;
+  text-align: center;
+  padding: 2rem;
+  border: 1px solid var(--gray-6);
+}
+
+.authProviderGoBack {
+  display: flex;
+  flex: 0 1 600px;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  flex-direction: column;
+}
diff --git a/website/lib/next-auth-utils/config.js b/website/lib/next-auth-utils/config.js
new file mode 100644
index 000000000..e56a10d2e
--- /dev/null
+++ b/website/lib/next-auth-utils/config.js
@@ -0,0 +1,19 @@
+import NextAuth from 'next-auth'
+import NextAuthProviders from 'next-auth/providers'
+
+function formatProviderConfig(ap) {
+  const apName = ap.toUpperCase()
+  const config = {
+    clientId: process.env[`${apName}_CLIENT_ID`],
+    clientSecret: process.env[`${apName}_CLIENT_SECRET`],
+    domain: process.env[`${apName}_DOMAIN`],
+  }
+  return NextAuthProviders[ap](config)
+}
+
+export default (req, res) => ({ environments, pages }) =>
+  NextAuth(req, res, {
+    providers:
+      environments[process.env.HASHI_ENV]?.map(formatProviderConfig) || [],
+    pages,
+  })
diff --git a/website/next.config.js b/website/next.config.js
index c3e65caf7..8b7bb09cd 100644
--- a/website/next.config.js
+++ b/website/next.config.js
@@ -1,6 +1,13 @@
 const withHashicorp = require('@hashicorp/nextjs-scripts')
 const path = require('path')
 
+// log out our primary environment variables for clarity in build logs
+console.log(`HASHI_ENV: ${process.env.HASHI_ENV}`)
+console.log(`NODE_ENV: ${process.env.NODE_ENV}`)
+console.log(`NEXTAUTH_URL: ${process.env.NEXTAUTH_URL}`)
+console.log(`OKTA_DOMAIN: ${process.env.OKTA_DOMAIN}`)
+console.log(`AUTH0_DOMAIN: ${process.env.AUTH0_DOMAIN}`)
+
 module.exports = withHashicorp({
   defaultLayout: true,
   transpileModules: ['is-absolute-url', '@hashicorp/react-mega-nav'],
@@ -12,5 +19,7 @@ module.exports = withHashicorp({
     SEGMENT_WRITE_KEY: 'xxx',
     BUGSNAG_CLIENT_KEY: 'xxx',
     BUGSNAG_SERVER_KEY: 'xxx',
+    NEXT_PUBLIC_OKTA_DOMAIN: process.env.OKTA_DOMAIN,
+    NEXT_PUBLIC_AUTH0_DOMAIN: process.env.AUTH0_DOMAIN,
   },
 })
diff --git a/website/package-lock.json b/website/package-lock.json
index 1724e03c1..87da21474 100644
--- a/website/package-lock.json
+++ b/website/package-lock.json
@@ -1787,6 +1787,11 @@
         "fastq": "^1.6.0"
       }
     },
+    "@panva/asn1.js": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@panva/asn1.js/-/asn1.js-1.0.0.tgz",
+      "integrity": "sha512-UdkG3mLEqXgnlKsWanWcgb6dOjUzJ+XC5f+aWw30qrtjxeNUSfKX1cd5FBzOaXQumoe9nIqeZUvrRJS03HCCtw=="
+    },
     "@segment/in-eu": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/@segment/in-eu/-/in-eu-0.2.1.tgz",
@@ -2421,6 +2426,11 @@
         "color-convert": "^1.9.0"
       }
     },
+    "any-promise": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
+      "integrity": "sha1-q8av7tzqUugJzcA3au0845Y10X8="
+    },
     "anymatch": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
@@ -2559,6 +2569,11 @@
         }
       }
     },
+    "app-root-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/app-root-path/-/app-root-path-3.0.0.tgz",
+      "integrity": "sha512-qMcx+Gy2UZynHjOHOIXPNvpf+9cjvk3cWrBBK7zg4gH9+clobJRb9NGzcT7mQTcV/6Gm/1WelUtqxVXnNlrwcw=="
+    },
     "aproba": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
@@ -3600,6 +3615,11 @@
       "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
       "integrity": "sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI="
     },
+    "buffer-equal-constant-time": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
+      "integrity": "sha1-+OcRMvf/5uAaXJaXpMbz5I1cyBk="
+    },
     "buffer-fill": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/buffer-fill/-/buffer-fill-1.0.0.tgz",
@@ -4111,6 +4131,156 @@
         "restore-cursor": "^3.1.0"
       }
     },
+    "cli-highlight": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/cli-highlight/-/cli-highlight-2.1.4.tgz",
+      "integrity": "sha512-s7Zofobm20qriqDoU9sXptQx0t2R9PEgac92mENNm7xaEe1hn71IIMsXMK+6encA6WRCWWxIGQbipr3q998tlQ==",
+      "requires": {
+        "chalk": "^3.0.0",
+        "highlight.js": "^9.6.0",
+        "mz": "^2.4.0",
+        "parse5": "^5.1.1",
+        "parse5-htmlparser2-tree-adapter": "^5.1.1",
+        "yargs": "^15.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.2.1.tgz",
+          "integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
+          "requires": {
+            "@types/color-name": "^1.1.1",
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
+          "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "cliui": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
+          "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+          "requires": {
+            "string-width": "^4.2.0",
+            "strip-ansi": "^6.0.0",
+            "wrap-ansi": "^6.2.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
+        "emoji-regex": {
+          "version": "8.0.0",
+          "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+          "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+        },
+        "find-up": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+          "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+          "requires": {
+            "locate-path": "^5.0.0",
+            "path-exists": "^4.0.0"
+          }
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
+        },
+        "is-fullwidth-code-point": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+          "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
+        },
+        "locate-path": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+          "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+          "requires": {
+            "p-locate": "^4.1.0"
+          }
+        },
+        "p-limit": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+          "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+          "requires": {
+            "p-try": "^2.0.0"
+          }
+        },
+        "p-locate": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+          "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+          "requires": {
+            "p-limit": "^2.2.0"
+          }
+        },
+        "p-try": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+          "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ=="
+        },
+        "path-exists": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+          "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w=="
+        },
+        "string-width": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.0.tgz",
+          "integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
+          "requires": {
+            "emoji-regex": "^8.0.0",
+            "is-fullwidth-code-point": "^3.0.0",
+            "strip-ansi": "^6.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
+        "yargs": {
+          "version": "15.4.1",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
+          "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
+          "requires": {
+            "cliui": "^6.0.0",
+            "decamelize": "^1.2.0",
+            "find-up": "^4.1.0",
+            "get-caller-file": "^2.0.1",
+            "require-directory": "^2.1.1",
+            "require-main-filename": "^2.0.0",
+            "set-blocking": "^2.0.0",
+            "string-width": "^4.2.0",
+            "which-module": "^2.0.0",
+            "y18n": "^4.0.0",
+            "yargs-parser": "^18.1.2"
+          }
+        }
+      }
+    },
     "cli-spinners": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-1.3.1.tgz",
@@ -4601,6 +4771,11 @@
         "randomfill": "^1.0.3"
       }
     },
+    "crypto-js": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.0.0.tgz",
+      "integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg=="
+    },
     "css": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/css/-/css-2.2.4.tgz",
@@ -5295,6 +5470,11 @@
         }
       }
     },
+    "dotenv": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
+      "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw=="
+    },
     "download": {
       "version": "6.2.5",
       "resolved": "https://registry.npmjs.org/download/-/download-6.2.5.tgz",
@@ -5346,6 +5526,14 @@
         "stream-shift": "^1.0.0"
       }
     },
+    "ecdsa-sig-formatter": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
+      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
+      "requires": {
+        "safe-buffer": "^5.0.1"
+      }
+    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -6114,6 +6302,11 @@
       "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.2.tgz",
       "integrity": "sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw=="
     },
+    "figlet": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/figlet/-/figlet-1.5.0.tgz",
+      "integrity": "sha512-ZQJM4aifMpz6H19AW1VqvZ7l4pOE9p7i/3LyxgO2kp+PO/VcDYNqIHEMtkccqIhTXMKci4kjueJr/iCQEaT/Ww=="
+    },
     "figures": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
@@ -6613,6 +6806,11 @@
       "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.6.1.tgz",
       "integrity": "sha512-hT9yh/tiinkmirKrlv4KWOjztdoZo1mx9Qh4KvWqC7isoXwdUY3PNWUxceF4/qO9R6riA2C29jdTOeQOIROjgw=="
     },
+    "futoin-hkdf": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/futoin-hkdf/-/futoin-hkdf-1.3.2.tgz",
+      "integrity": "sha512-3EVi3ETTyJg5PSXlxLCaUVVn0pSbDf62L3Gwxne7Uq+d8adOSNWQAad4gg7WToHkcgnCJb3Wlb1P8r4Evj4GPw=="
+    },
     "fuzzysearch": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/fuzzysearch/-/fuzzysearch-1.0.3.tgz",
@@ -7114,6 +7312,11 @@
       "resolved": "https://registry.npmjs.org/hex-color-regex/-/hex-color-regex-1.1.0.tgz",
       "integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ=="
     },
+    "highlight.js": {
+      "version": "9.18.3",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.18.3.tgz",
+      "integrity": "sha512-zBZAmhSupHIl5sITeMqIJnYCDfAEc3Gdkqj65wC1lpI468MMQeeQkhcIAvk+RylAkxrCcI9xy9piHiXeQ1BdzQ=="
+    },
     "hmac-drbg": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
@@ -8399,6 +8602,14 @@
       "resolved": "https://registry.npmjs.org/join-component/-/join-component-1.1.0.tgz",
       "integrity": "sha1-uEF7dQZho5K+4sJTfGiyqdSXfNU="
     },
+    "jose": {
+      "version": "1.28.0",
+      "resolved": "https://registry.npmjs.org/jose/-/jose-1.28.0.tgz",
+      "integrity": "sha512-JmfDRzt/HSj8ipd9TsDtEHoLUnLYavG+7e8F6s1mx2jfVSfXOTaFQsJUydbjJpTnTDHP1+yKL9Ke7ktS/a0Eiw==",
+      "requires": {
+        "@panva/asn1.js": "^1.0.0"
+      }
+    },
     "js-cookie": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
@@ -8473,6 +8684,35 @@
       "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
       "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
     },
+    "jsonwebtoken": {
+      "version": "8.5.1",
+      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+      "requires": {
+        "jws": "^3.2.2",
+        "lodash.includes": "^4.3.0",
+        "lodash.isboolean": "^3.0.3",
+        "lodash.isinteger": "^4.0.4",
+        "lodash.isnumber": "^3.0.3",
+        "lodash.isplainobject": "^4.0.6",
+        "lodash.isstring": "^4.0.1",
+        "lodash.once": "^4.0.0",
+        "ms": "^2.1.1",
+        "semver": "^5.6.0"
+      },
+      "dependencies": {
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+        },
+        "semver": {
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
+        }
+      }
+    },
     "jstz": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/jstz/-/jstz-2.1.1.tgz",
@@ -8487,6 +8727,30 @@
         "object.assign": "^4.1.0"
       }
     },
+    "jwa": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
+      "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
+      "requires": {
+        "buffer-equal-constant-time": "1.0.1",
+        "ecdsa-sig-formatter": "1.0.11",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "jws": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
+      "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
+      "requires": {
+        "jwa": "^1.4.1",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "jwt-decode": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-2.2.0.tgz",
+      "integrity": "sha1-fYa9VmefWM5qhHBKZX3TkruoGnk="
+    },
     "katex": {
       "version": "0.11.1",
       "resolved": "https://registry.npmjs.org/katex/-/katex-0.11.1.tgz",
@@ -8680,11 +8944,36 @@
       "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
       "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
     },
+    "lodash.includes": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
+      "integrity": "sha1-YLuYqHy5I8aMoeUTJUgzFISfVT8="
+    },
+    "lodash.isboolean": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz",
+      "integrity": "sha1-bC4XHbKiV82WgC/UOwGyDV9YcPY="
+    },
     "lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
       "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
     },
+    "lodash.isinteger": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/lodash.isinteger/-/lodash.isinteger-4.0.4.tgz",
+      "integrity": "sha1-YZwK89A/iwTDH1iChAt3sRzWg0M="
+    },
+    "lodash.isnumber": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/lodash.isnumber/-/lodash.isnumber-3.0.3.tgz",
+      "integrity": "sha1-POdoEMWSjQM1IwGsKHMX8RwLH/w="
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+    },
     "lodash.isstring": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
@@ -8695,6 +8984,11 @@
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
+    "lodash.once": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.once/-/lodash.once-4.1.1.tgz",
+      "integrity": "sha1-DdOXEhPHxW34gJd9UEyI+0cal6w="
+    },
     "lodash.sortby": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
@@ -9321,6 +9615,16 @@
       "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
       "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA=="
     },
+    "mz": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
+      "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
+      "requires": {
+        "any-promise": "^1.0.0",
+        "object-assign": "^4.0.1",
+        "thenify-all": "^1.0.0"
+      }
+    },
     "nan": {
       "version": "2.14.1",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.1.tgz",
@@ -9577,6 +9881,25 @@
         }
       }
     },
+    "next-auth": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/next-auth/-/next-auth-3.1.0.tgz",
+      "integrity": "sha512-e+s6hjPZpqbnjla9WOi0VuLkDlLMU3cJmS0jTBBvsvSGsOPvMbaCCAMBEoNV3nWSgPrq6zLG2dixmCCxzG7fXA==",
+      "requires": {
+        "crypto-js": "^4.0.0",
+        "futoin-hkdf": "^1.3.2",
+        "jose": "^1.27.2",
+        "jsonwebtoken": "^8.5.1",
+        "jwt-decode": "^2.2.0",
+        "nodemailer": "^6.4.6",
+        "oauth": "^0.9.15",
+        "preact": "^10.4.1",
+        "preact-render-to-string": "^5.1.7",
+        "querystring": "^0.2.0",
+        "require_optional": "^1.0.1",
+        "typeorm": "^0.2.24"
+      }
+    },
     "next-mdx-enhanced": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/next-mdx-enhanced/-/next-mdx-enhanced-3.0.0.tgz",
@@ -9720,6 +10043,11 @@
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.59.tgz",
       "integrity": "sha512-H3JrdUczbdiwxN5FuJPyCHnGHIFqQ0wWxo+9j1kAXAzqNMAHlo+4I/sYYxpyK0irQ73HgdiyzD32oqQDcU2Osw=="
     },
+    "nodemailer": {
+      "version": "6.4.11",
+      "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.4.11.tgz",
+      "integrity": "sha512-BVZBDi+aJV4O38rxsUh164Dk1NCqgh6Cm0rQSb9SK/DHGll/DrCMnycVDD7msJgZCnmVa8ASo8EZzR7jsgTukQ=="
+    },
     "normalize-html-whitespace": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/normalize-html-whitespace/-/normalize-html-whitespace-1.0.0.tgz",
@@ -9830,6 +10158,11 @@
       "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
       "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4="
     },
+    "oauth": {
+      "version": "0.9.15",
+      "resolved": "https://registry.npmjs.org/oauth/-/oauth-0.9.15.tgz",
+      "integrity": "sha1-vR/vr2hslrdUda7VGWQS/2DPucE="
+    },
     "object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -10259,6 +10592,11 @@
         "callsites": "^3.0.0"
       }
     },
+    "parent-require": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/parent-require/-/parent-require-1.0.0.tgz",
+      "integrity": "sha1-dGoWdjgIOoYLDu9nMssn7UbDKXc="
+    },
     "parse-asn1": {
       "version": "5.1.5",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.5.tgz",
@@ -10298,6 +10636,14 @@
       "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz",
       "integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug=="
     },
+    "parse5-htmlparser2-tree-adapter": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-5.1.1.tgz",
+      "integrity": "sha512-CF+TKjXqoqyDwHqBhFQ+3l5t83xYi6fVT1tQNg+Ye0JRLnTxWvIroCjEp1A0k4lneHNBGnICUf0cfYVYGEazqw==",
+      "requires": {
+        "parse5": "^5.1.1"
+      }
+    },
     "parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -11578,6 +11924,19 @@
         "uniq": "^1.0.1"
       }
     },
+    "preact": {
+      "version": "10.5.2",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.5.2.tgz",
+      "integrity": "sha512-4y2Q6kMiJtMONMJR7z+o8P5tGkMzVItyy77AXGrUdusv+dk4jwoS3KrpCBkFloY2xsScRJYwZQZrx89tTjDkOw=="
+    },
+    "preact-render-to-string": {
+      "version": "5.1.10",
+      "resolved": "https://registry.npmjs.org/preact-render-to-string/-/preact-render-to-string-5.1.10.tgz",
+      "integrity": "sha512-40svy7NDe5Qe0ymdsIC11f0hZb05MeTSUqqIaWJ5DEFCh/sF86KcpRW0kN/ymGYDVVUCfv9qFrVuLCXR7aQxgQ==",
+      "requires": {
+        "pretty-format": "^3.8.0"
+      }
+    },
     "prebuild-webpack-plugin": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/prebuild-webpack-plugin/-/prebuild-webpack-plugin-1.1.0.tgz",
@@ -11612,6 +11971,11 @@
         "fast-diff": "^1.1.2"
       }
     },
+    "pretty-format": {
+      "version": "3.8.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-3.8.0.tgz",
+      "integrity": "sha1-v77VbV6ad2ZF9LH/eqGjrE+jw4U="
+    },
     "prismjs": {
       "version": "1.20.0",
       "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.20.0.tgz",
@@ -11982,6 +12346,11 @@
         "strip-indent": "^1.0.1"
       }
     },
+    "reflect-metadata": {
+      "version": "0.1.13",
+      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.13.tgz",
+      "integrity": "sha512-Ts1Y/anZELhSsjMcU605fU9RE4Oi3p5ORujwbIKXfWa+0Zxs510Qrmrce5/Jowq3cHSZSJqBjypxmHarc+vEWg=="
+    },
     "reflect.ownkeys": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz",
@@ -12354,6 +12723,27 @@
       "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
       "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
     },
+    "require_optional": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
+      "integrity": "sha512-qhM/y57enGWHAe3v/NcwML6a3/vfESLe/sGM2dII+gEO0BpKRUkWZow/tyloNqJyN6kXSl3RyyM8Ll5D/sJP8g==",
+      "requires": {
+        "resolve-from": "^2.0.0",
+        "semver": "^5.1.0"
+      },
+      "dependencies": {
+        "resolve-from": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-2.0.0.tgz",
+          "integrity": "sha1-lICrIOlP+h2egKgEx+oUdhGWa1c="
+        },
+        "semver": {
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
+        }
+      }
+    },
     "resolve": {
       "version": "1.17.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.17.0.tgz",
@@ -14291,6 +14681,22 @@
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
       "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
     },
+    "thenify": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
+      "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
+      "requires": {
+        "any-promise": "^1.0.0"
+      }
+    },
+    "thenify-all": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
+      "integrity": "sha1-GhkY1ALY/D+Y+/I02wvMjMEOlyY=",
+      "requires": {
+        "thenify": ">= 3.1.0 < 4"
+      }
+    },
     "through": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
@@ -14567,6 +14973,45 @@
         "is-typedarray": "^1.0.0"
       }
     },
+    "typeorm": {
+      "version": "0.2.26",
+      "resolved": "https://registry.npmjs.org/typeorm/-/typeorm-0.2.26.tgz",
+      "integrity": "sha512-sbKxK6K9sXZPCVF0weEb74UA/z1UW0sRWfI7EoOOtQaRZaLvSEwtgHPqle9t8asxEtD+gzkUdd+NqF7yH7HtIQ==",
+      "requires": {
+        "app-root-path": "^3.0.0",
+        "buffer": "^5.1.0",
+        "chalk": "^2.4.2",
+        "cli-highlight": "^2.0.0",
+        "debug": "^4.1.1",
+        "dotenv": "^8.2.0",
+        "glob": "^7.1.2",
+        "js-yaml": "^3.13.1",
+        "mkdirp": "^1.0.3",
+        "reflect-metadata": "^0.1.13",
+        "sha.js": "^2.4.11",
+        "tslib": "^1.9.0",
+        "xml2js": "^0.4.17",
+        "yargonaut": "^1.1.2",
+        "yargs": "^13.2.1"
+      },
+      "dependencies": {
+        "chalk": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+          "requires": {
+            "ansi-styles": "^3.2.1",
+            "escape-string-regexp": "^1.0.5",
+            "supports-color": "^5.3.0"
+          }
+        },
+        "mkdirp": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
+          "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw=="
+        }
+      }
+    },
     "typescript": {
       "version": "3.9.6",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.6.tgz",
@@ -15735,6 +16180,20 @@
         "async-limiter": "~1.0.0"
       }
     },
+    "xml2js": {
+      "version": "0.4.23",
+      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.4.23.tgz",
+      "integrity": "sha512-ySPiMjM0+pLDftHgXY4By0uswI3SPKLDw/i3UXbnO8M/p28zqexCUoPmQFrYD+/1BzhGJSs2i1ERWKJAtiLrug==",
+      "requires": {
+        "sax": ">=0.6.0",
+        "xmlbuilder": "~11.0.0"
+      }
+    },
+    "xmlbuilder": {
+      "version": "11.0.1",
+      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-11.0.1.tgz",
+      "integrity": "sha512-fDlsI/kFEx7gLvbecc0/ohLG50fugQp8ryHzMTuW9vSa1GJ0XYWKnhsUx7oie3G98+r56aTQIUB4kht42R3JvA=="
+    },
     "xtend": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
@@ -15755,6 +16214,53 @@
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.0.tgz",
       "integrity": "sha512-yr2icI4glYaNG+KWONODapy2/jDdMSDnrONSjblABjD9B4Z5LgiircSt8m8sRZFNi08kG9Sm0uSHtEmP3zaEGg=="
     },
+    "yargonaut": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/yargonaut/-/yargonaut-1.1.4.tgz",
+      "integrity": "sha512-rHgFmbgXAAzl+1nngqOcwEljqHGG9uUZoPjsdZEs1w5JW9RXYzrSvH/u70C1JE5qFi0qjsdhnUX/dJRpWqitSA==",
+      "requires": {
+        "chalk": "^1.1.1",
+        "figlet": "^1.1.1",
+        "parent-require": "^1.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+          "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+        },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "^2.2.1",
+            "escape-string-regexp": "^1.0.2",
+            "has-ansi": "^2.0.0",
+            "strip-ansi": "^3.0.0",
+            "supports-color": "^2.0.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+          "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+          "requires": {
+            "ansi-regex": "^2.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "yargs": {
       "version": "13.3.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
diff --git a/website/package.json b/website/package.json
index b7ba33cda..d14c71272 100644
--- a/website/package.json
+++ b/website/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "example-docs",
-  "description": "Documentation website for <product name>",
+  "name": "boundary-docs",
+  "description": "Documentation website for Boundary",
   "version": "1.0.0",
   "author": "HashiCorp",
   "dependencies": {
@@ -18,6 +18,7 @@
     "@hashicorp/react-vertical-text-block-list": "^2.0.2",
     "babel-plugin-import-glob-array": "^0.2.0",
     "next": "9.4.4",
+    "next-auth": "^3.1.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1"
   },
@@ -44,6 +45,7 @@
     "generate:readme": "next-hashicorp markdown-blocks README.md",
     "lint": "next-hashicorp lint",
     "start": "rm -rf .next/cache/next-babel-loader/ && next dev",
+    "dev:auth": "HASHI_ENV=preview npm start",
     "static": "npm run build && npm run export && cp _redirects out/.",
     "linkcheck": "linkcheck <website url>"
   }
diff --git a/website/pages/_app.js b/website/pages/_app.js
index c0c8bf58f..6ae282406 100644
--- a/website/pages/_app.js
+++ b/website/pages/_app.js
@@ -7,6 +7,8 @@ import Router from 'next/router'
 import HashiHead from '@hashicorp/react-head'
 import Head from 'next/head'
 import { ErrorBoundary } from '@hashicorp/nextjs-scripts/lib/bugsnag'
+import ConditionalAuthProvider from 'components/conditional-auth-provider'
+import MegaNav from '@hashicorp/react-mega-nav'
 import ProductSubnav from '../components/subnav'
 import Footer from 'components/footer'
 import Error from './_error'
@@ -22,38 +24,41 @@ function App({ Component, pageProps }) {
 
   return (
     <ErrorBoundary FallbackComponent={Error}>
-      <HashiHead
-        is={Head}
-        title={`${productName} by HashiCorp`}
-        siteName={`${productName} by HashiCorp`}
-        description="Write your description here"
-        image="https://www.example.com/img/og-image.png"
-        stylesheet={[
-          {
-            href:
-              'https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&display=swap',
-          },
-        ]}
-        icon={[{ href: '/favicon.ico' }]}
-        preload={[
-          { href: '/fonts/klavika/medium.woff2', as: 'font' },
-          { href: '/fonts/gilmer/light.woff2', as: 'font' },
-          { href: '/fonts/gilmer/regular.woff2', as: 'font' },
-          { href: '/fonts/gilmer/medium.woff2', as: 'font' },
-          { href: '/fonts/gilmer/bold.woff2', as: 'font' },
-          { href: '/fonts/metro-sans/book.woff2', as: 'font' },
-          { href: '/fonts/metro-sans/regular.woff2', as: 'font' },
-          { href: '/fonts/metro-sans/semi-bold.woff2', as: 'font' },
-          { href: '/fonts/metro-sans/bold.woff2', as: 'font' },
-          { href: '/fonts/dejavu/mono.woff2', as: 'font' },
-        ]}
-      />
-      <ProductSubnav />
-      <div className="content">
-        <Component {...pageProps} />
-      </div>
-      <Footer openConsentManager={openConsentManager} />
-      <ConsentManager />
+      <ConditionalAuthProvider session={pageProps.session}>
+        <HashiHead
+          is={Head}
+          title={`${productName} by HashiCorp`}
+          siteName={`${productName} by HashiCorp`}
+          description="Write your description here"
+          image="https://www.example.com/img/og-image.png"
+          stylesheet={[
+            {
+              href:
+                'https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&display=swap',
+            },
+          ]}
+          icon={[{ href: '/favicon.ico' }]}
+          preload={[
+            { href: '/fonts/klavika/medium.woff2', as: 'font' },
+            { href: '/fonts/gilmer/light.woff2', as: 'font' },
+            { href: '/fonts/gilmer/regular.woff2', as: 'font' },
+            { href: '/fonts/gilmer/medium.woff2', as: 'font' },
+            { href: '/fonts/gilmer/bold.woff2', as: 'font' },
+            { href: '/fonts/metro-sans/book.woff2', as: 'font' },
+            { href: '/fonts/metro-sans/regular.woff2', as: 'font' },
+            { href: '/fonts/metro-sans/semi-bold.woff2', as: 'font' },
+            { href: '/fonts/metro-sans/bold.woff2', as: 'font' },
+            { href: '/fonts/dejavu/mono.woff2', as: 'font' },
+          ]}
+        />
+        <MegaNav product={productName} />
+        <ProductSubnav />
+        <div className="content">
+          <Component {...pageProps} />
+        </div>
+        <Footer openConsentManager={openConsentManager} />
+        <ConsentManager />
+      </ConditionalAuthProvider>
     </ErrorBoundary>
   )
 }
diff --git a/website/pages/api/auth/[...nextauth].js b/website/pages/api/auth/[...nextauth].js
new file mode 100644
index 000000000..33b88283a
--- /dev/null
+++ b/website/pages/api/auth/[...nextauth].js
@@ -0,0 +1,12 @@
+import nextAuthApiRoute from 'lib/next-auth-utils/config'
+
+export default (req, res) =>
+  nextAuthApiRoute(
+    req,
+    res
+  )({
+    environments: { production: ['Okta'], preview: ['Okta', 'Auth0'] },
+    pages: {
+      error: '/signin-error', // Error code passed in query string as ?error=
+    },
+  })
diff --git a/website/pages/signin-error/index.jsx b/website/pages/signin-error/index.jsx
new file mode 100644
index 000000000..7908fa40a
--- /dev/null
+++ b/website/pages/signin-error/index.jsx
@@ -0,0 +1,5 @@
+import PageComponent from 'components/signin-error-page'
+
+export default function SigninErrorPage() {
+  return <PageComponent />
+}