Merge pull request #395 from nhost/changeset-release/main

chore: update versions

.config/esbuild.lib.js

@@ -25,6 +25,6 @@ esbuild
     platform: 'browser',
     format: 'esm',
     sourcemap: true,
-    target: 'esnext'
+    target: 'es2019'
   })
   .catch(() => process.exit(1))

.config/vite.lib.react.js

@@ -38,10 +38,11 @@ export default defineConfig({
       fileName: 'index'
     },
     rollupOptions: {
-      external: ['react'],
+      external: ['react', '@nhost/react'],
       output: {
         globals: {
-          react: 'react'
+          react: 'react',
+          '@nhost/react': '@nhost/react'
         }
       }
     }

.github/workflows/changesets.yaml

@@ -16,29 +16,33 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v2
-
-      - name: Cache pnpm modules
-        uses: actions/cache@v2
+      - name: Checkout repository
+        uses: actions/checkout@v2
         with:
-          path: ~/.pnpm-store
-          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-
+          fetch-depth: 0
 
       - uses: pnpm/action-setup@v2.1.0
         with:
-          version: 6.30.1
-          run_install: true
-
+          version: 6.32.3
+          # run_install: true
+      - name: Use Node.js 17
+        uses: actions/setup-node@v2
+        with:
+          node-version: '17.8.0'
+          cache: 'pnpm'
+      - name: Pick the right npm version
+        # * See: https://github.com/pnpm/pnpm/issues/4348
+        run: npm install --global npm@8.4
+      - name: Install dependencies
+        run: pnpm install
       - name: Create PR or Publish release
         id: changesets
         uses: changesets/action@v1
         with:
-          version: pnpm ci:version
+          version: pnpm run ci:version
           commit: 'chore: update versions'
           title: 'chore: update versions'
-          publish: pnpm release
+          publish: pnpm run release
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/contributors.yaml

@@ -0,0 +1,15 @@
+name: Add contributors
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  contrib-readme-job:
+    runs-on: ubuntu-latest
+    name: A job to automate contrib in readme
+    steps:
+      - name: Contribute List
+        uses: akhilmhdh/contributors-readme-action@v2.3.4
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/tests.yaml

@@ -27,45 +27,44 @@ on:
 jobs:
   build:
     runs-on: ubuntu-latest
-
     strategy:
       matrix:
-        node-version: [12.x, 14.x, 16.x]
-
+        node-version: [14, 16]
     steps:
       - uses: actions/checkout@v2
 
-      - name: Cache pnpm modules
-        uses: actions/cache@v2
-        with:
-          path: ~/.pnpm-store
-          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-
-
-      - uses: pnpm/action-setup@v2.0.1
-        with:
-          version: 6.30.1
-          run_install: true
-
-      - name: Cache turbo
-        uses: actions/cache@v2
-        with:
-          path: ./node_modules/.cache
-          key: ${{ runner.os }}-${{ matrix.node-version }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-${{ matrix.node-version }}
-
       - name: Install nhost CLI
         run: curl -L https://raw.githubusercontent.com/nhost/cli/main/get.sh | bash
 
       - name: Start Nhost Backend
         run: |
-          cd examples/testing-project
+          cp -R examples/testing-project /tmp/
+          cd /tmp/testing-project
+          nhost dev &
 
-          nhost dev -d --no-browser &
-      - name: Wait for Nhost Backend to start
-        run: |
-          pnpm dlx wait-on http://localhost:1337/v1/auth/healthz -i 500 -t 120000
+      - uses: pnpm/action-setup@v2.2.1
+        with:
+          version: 6.32.3
 
-      - run: pnpm run ci
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'pnpm'
+
+      - name: Cache turbo
+        uses: actions/cache@v2
+        with:
+          path: ./node_modules/.cache/turbo
+          key: turbo-${{ github.job }}-${{ github.ref_name }}-${{ github.sha }}
+          restore-keys: |
+            turbo-${{ github.job }}-${{ github.ref_name }}-
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Wait for Nhost
+        run: pnpm run wait
+
+      - name: Build, tests and lint
+        run: pnpm run ci

README.md

@@ -1,8 +1,8 @@
-<div align="center">
-  <img width="237" src="https://raw.githubusercontent.com/nhost/nhost/main/assets/logo.png"/>
+![Nhost](https://imgur.com/fGo6E4d.png)
 
-  <br />
-  <br />
+<div align="center">
+
+# Nhost
 
 <a href="https://docs.nhost.io/get-started">Quickstart</a>
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
@@ -20,9 +20,9 @@
   <hr />
 </div>
 
-**Nhost is a serverless backend for web and mobile apps** and is built with the following things in mind:
+**Nhost is a open-source GraphQL backend,** built with the following things in mind:
 
-- Open Source
+- Open-Source
 - Developer Productivity
 - SQL
 - GraphQL
@@ -36,6 +36,15 @@ Nhost consists of open source software:
 - Serverless Functions: Node.js (JavaScript and TypeScript)
 - [Nhost CLI](https://docs.nhost.io/reference/cli) for local development
 
+## Architecture of Nhost
+
+<div align="center">
+  <br />
+  <img src="assets/nhost-diagram.png"/>
+  <br />
+  <br />
+</div>
+
 Visit [https://docs.nhost.io](http://docs.nhost.io) for the complete documentation.
 
 # How to get started
@@ -92,8 +101,8 @@ Nhost libraries and tools
 - [JavaScript/TypeScript SDK](https://docs.nhost.io/reference/sdk)
 - [Dart and Flutter SDK](https://github.com/nhost/nhost-dart)
 - [Nhost CLI](https://docs.nhost.io/reference/cli)
-- [Nhost React Auth](https://docs.nhost.io/reference/supporting-libraries/react-auth)
-- [Nhost React Apollo](https://docs.nhost.io/reference/supporting-libraries/react-apollo)
+- [Nhost React](https://docs.nhost.io/reference/react)
+- [Nhost Next.js](https://docs.nhost.io/reference/nextjs)
 
 ## Community ❤️
 
@@ -101,7 +110,7 @@ First and foremost: **Star and watch this repository** to stay up-to-date.
 
 Also, follow Nhost on [GitHub Discussions](https://github.com/nhost/nhost/discussions), our [Blog](https://nhost.io/blog), and on [Twitter](https://twitter.com/nhostio). You can chat with the team and other members on [Discord](https://discord.com/invite/9V7Qb2U) and follow our tutorials and other video material at [YouTube](https://www.youtube.com/channel/UCJ7irtvV9Y0EQMxpabb6ntg?view_as=subscriber).
 
-## Nhost is Open Source
+### Nhost is Open Source
 
 This repository, and most of our other open source projects, are licensed under the MIT license.
 
@@ -113,6 +122,189 @@ Here are some ways of contributing to making Nhost better:
 - Join our [Discord](https://discord.com/invite/9V7Qb2U) and connect with other members to share and learn from.
 - Send a pull request to any of our [open source repositories](https://github.com/nhost) on Github. Check our [contribution guide](https://github.com/nhost/nhost/blob/main/CONTRIBUTING.md) for more details about how to contribute. We're looking forward to your contribution!
 
-## Security
+### Contributors
 
-If you discover a security vulnerability within Nhost, please e-mail [security@nhost.io](mailto:security@nhost.io). All security vulnerabilities will be promptly addressed.
+<!-- readme: contributors -start -->
+<table>
+<tr>
+    <td align="center">
+        <a href="https://github.com/plmercereau">
+            <img src="https://avatars.githubusercontent.com/u/24897252?v=4" width="100;" alt="plmercereau"/>
+            <br />
+            <sub><b>Pilou</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/elitan">
+            <img src="https://avatars.githubusercontent.com/u/331818?v=4" width="100;" alt="elitan"/>
+            <br />
+            <sub><b>Johan Eliasson</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/szilarddoro">
+            <img src="https://avatars.githubusercontent.com/u/310881?v=4" width="100;" alt="szilarddoro"/>
+            <br />
+            <sub><b>Szilárd Dóró</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/nunopato">
+            <img src="https://avatars.githubusercontent.com/u/1523504?v=4" width="100;" alt="nunopato"/>
+            <br />
+            <sub><b>Nuno Pato</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/subatuba21">
+            <img src="https://avatars.githubusercontent.com/u/34824571?v=4" width="100;" alt="subatuba21"/>
+            <br />
+            <sub><b>Subha Das</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/guicurcio">
+            <img src="https://avatars.githubusercontent.com/u/20285232?v=4" width="100;" alt="guicurcio"/>
+            <br />
+            <sub><b>Guido Curcio</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/sebagudelo">
+            <img src="https://avatars.githubusercontent.com/u/43288271?v=4" width="100;" alt="sebagudelo"/>
+            <br />
+            <sub><b>Sebagudelo</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/mrinalwahal">
+            <img src="https://avatars.githubusercontent.com/u/9859731?v=4" width="100;" alt="mrinalwahal"/>
+            <br />
+            <sub><b>Mrinal Wahal</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/gdangelo">
+            <img src="https://avatars.githubusercontent.com/u/4352286?v=4" width="100;" alt="gdangelo"/>
+            <br />
+            <sub><b>Grégory D'Angelo</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/FuzzyReason">
+            <img src="https://avatars.githubusercontent.com/u/62517920?v=4" width="100;" alt="FuzzyReason"/>
+            <br />
+            <sub><b>Vadim Smirnov</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/subhendukundu">
+            <img src="https://avatars.githubusercontent.com/u/20059141?v=4" width="100;" alt="subhendukundu"/>
+            <br />
+            <sub><b>Subhendu Kundu</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/chrtze">
+            <img src="https://avatars.githubusercontent.com/u/3797215?v=4" width="100;" alt="chrtze"/>
+            <br />
+            <sub><b>Christopher Möller</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/jerryjappinen">
+            <img src="https://avatars.githubusercontent.com/u/1101002?v=4" width="100;" alt="jerryjappinen"/>
+            <br />
+            <sub><b>Jerry Jäppinen</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/mustafa-hanif">
+            <img src="https://avatars.githubusercontent.com/u/30019262?v=4" width="100;" alt="mustafa-hanif"/>
+            <br />
+            <sub><b>Mustafa Hanif</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/Savinvadim1312">
+            <img src="https://avatars.githubusercontent.com/u/16936043?v=4" width="100;" alt="Savinvadim1312"/>
+            <br />
+            <sub><b>Savin Vadim</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/ahmic">
+            <img src="https://avatars.githubusercontent.com/u/13452362?v=4" width="100;" alt="ahmic"/>
+            <br />
+            <sub><b>Amir Ahmic</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/akd-io">
+            <img src="https://avatars.githubusercontent.com/u/30059155?v=4" width="100;" alt="akd-io"/>
+            <br />
+            <sub><b>Anders Kjær Damgaard</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/rustyb">
+            <img src="https://avatars.githubusercontent.com/u/53086?v=4" width="100;" alt="rustyb"/>
+            <br />
+            <sub><b>Colin Broderick</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/dohomi">
+            <img src="https://avatars.githubusercontent.com/u/489221?v=4" width="100;" alt="dohomi"/>
+            <br />
+            <sub><b>Dominic Garms</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/alveshelio">
+            <img src="https://avatars.githubusercontent.com/u/8176422?v=4" width="100;" alt="alveshelio"/>
+            <br />
+            <sub><b>Helio Alves</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/nkhdo">
+            <img src="https://avatars.githubusercontent.com/u/26102306?v=4" width="100;" alt="nkhdo"/>
+            <br />
+            <sub><b>Hoang Do</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/ghoshnirmalya">
+            <img src="https://avatars.githubusercontent.com/u/6391763?v=4" width="100;" alt="ghoshnirmalya"/>
+            <br />
+            <sub><b>Nirmalya Ghosh</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/timpratim">
+            <img src="https://avatars.githubusercontent.com/u/32492961?v=4" width="100;" alt="timpratim"/>
+            <br />
+            <sub><b>Pratim</b></sub>
+        </a>
+    </td>
+    <td align="center">
+        <a href="https://github.com/quentin-decre">
+            <img src="https://avatars.githubusercontent.com/u/1137511?v=4" width="100;" alt="quentin-decre"/>
+            <br />
+            <sub><b>Quentin Decré</b></sub>
+        </a>
+    </td></tr>
+<tr>
+    <td align="center">
+        <a href="https://github.com/komninoschat">
+            <img src="https://avatars.githubusercontent.com/u/29049104?v=4" width="100;" alt="komninoschat"/>
+            <br />
+            <sub><b>Komninos</b></sub>
+        </a>
+    </td></tr>
+</table>
+<!-- readme: contributors -end -->

docs/README.md

@@ -2,12 +2,15 @@
 
 ## Get started
 
-1. Install dependencies: `yarn`
-2. Start dev server: `yarn dev`
+From the **root** of the `nhost/nhost` repository:
 
-## NOTES;
+```bash
+pnpm run clean:all
+pnpm i
+cd docs
+pnpm run dev
+```
 
-The content is copied from the main `nhost/nhost` repo. This repo is only to modify styles/react components.
 
 ## Structure
 
@@ -30,8 +33,10 @@ export const orderTwo = {
   },
   reference: {
     sdk: ['index', 'graphql', 'authentication', 'storage', 'functions'],
+    react: ['index', 'hooks', 'protecting-routes', 'apollo'],
+    nextjs: ['index', 'configuration', 'protecting-routes', ],
     cli: ['index'],
-    'supporting-libraries': ['react-apollo', 'react-auth']
+    'hasura-auth': ['index', 'installation', 'configuration', 'environment-variables', 'schema', 'api-reference']
   }
 };
 ```

docs/components/MDX/CodeComponent.tsx

@@ -2,15 +2,15 @@ import { lightNhostTheme } from '@/data/lightTheme'
 import { useState } from 'react'
 import { Light as SyntaxHighlighter } from 'react-syntax-highlighter'
 import js from 'react-syntax-highlighter/dist/cjs/languages/hljs/javascript'
+import ts from 'react-syntax-highlighter/dist/cjs/languages/hljs/typescript'
 
 import Check from '../icons/Check'
 import Copy from '../icons/Copy'
 
-// @ts-ignore -> add to types
-// @ts-ignore -> add to types
-SyntaxHighlighter.registerLanguage('js', js)
+SyntaxHighlighter.registerLanguage('language-js', js)
+SyntaxHighlighter.registerLanguage('language-ts', ts)
 // TODO highlight JSX
-SyntaxHighlighter.registerLanguage('jsx', js)
+SyntaxHighlighter.registerLanguage('language-jsx', js)
 
 export interface CodeEditorProps {
   code: string
@@ -24,7 +24,7 @@ export interface CodeEditorProps {
 }
 
 const CodeEditor = (props: CodeEditorProps) => {
-  const { children, url } = props
+  const { children, className } = props
   const [copied, setCopied] = useState(false)
 
   return (
@@ -53,6 +53,7 @@ const CodeEditor = (props: CodeEditorProps) => {
         </button>
       </div>
       <SyntaxHighlighter
+        language={className}
         style={lightNhostTheme}
         wrapLongLines={true}
         wrapLines={true}

docs/components/MDX/components.tsx

@@ -8,6 +8,7 @@ import React, { DetailedHTMLProps, HTMLProps, PropsWithChildren } from 'react'
 
 import Command from '../Command'
 import Divider from '../Divider'
+import { Swagger } from '../Swagger'
 
 function Note({ children }: PropsWithChildren<unknown>) {
   return (
@@ -65,7 +66,7 @@ const CustomLink = ({
 const components = {
   img: (props: DetailedHTMLProps<HTMLProps<HTMLImageElement>, HTMLImageElement>) => {
     return (
-      <span className="block mx-10 mt-5 ">
+      <span className="block mx-10 my-10 ">
         <img src={props.src} alt={props.alt} className="mx-auto mt-2" />
       </span>
     )
@@ -135,6 +136,7 @@ const components = {
   }: DetailedHTMLProps<HTMLProps<HTMLTableCellElement>, HTMLTableCellElement>) => {
     return <td className={clsx('font-display', className)} {...props} />
   },
+  Swagger,
   Mermaid: ({ chart }) => {
     const [html, setHtml] = React.useState('')
     React.useEffect(() => {

docs/components/Swagger.tsx

@@ -0,0 +1,29 @@
+import SwaggerUI from 'swagger-ui-react'
+import 'swagger-ui-react/swagger-ui.css'
+
+const OperationsLayout = (props) => {
+  const { getComponent } = props
+  const Operations = getComponent('operations', true)
+  let SvgAssets = getComponent('SvgAssets')
+  return (
+    <div className="swagger-ui">
+      <SvgAssets />
+      <Operations />
+    </div>
+  )
+}
+
+const OperationsLayoutPlugin = () => ({
+  components: {
+    OperationsLayout
+  }
+})
+
+export const Swagger: React.FC<{ spec: string }> = ({ spec }) => (
+  <SwaggerUI
+    url={`/openapi/${spec}`}
+    plugins={[OperationsLayoutPlugin]}
+    layout="OperationsLayout"
+    supportedSubmitMethods={[]}
+  />
+)

docs/content/docs/get-started/quick-start/javascript-client.mdx

@@ -18,9 +18,14 @@ In this guide, we'll keep the example simple. We're not using a frontend framewo
 
 Create a new folder called `nhost-todos`, and initialize a new JavaScript app there:
 
+Using npm package manager
 ```sh
 npm init -y
-# or
+```
+or
+
+Using Yarn package manager
+```sh
 yarn init -y
 ```
 
@@ -28,9 +33,13 @@ yarn init -y
 
 Install Nhost JavaScript SDK:
 
+Using npm package manager
 ```sh
 npm install @nhost/nhost-js
-# or
+```
+or
+Using Yarn package manager
+```sh
 yarn add @nhost/nhost-js
 ```
 

docs/content/docs/platform/authentication/sign-in-with-facebook.mdx

@@ -0,0 +1,58 @@
+---
+title: Sign In with Facebook
+---
+
+Follow this guide to sign in users with Facebook with your Nhost App.
+
+![Facebook Sign In Preview](/images/platform/social-providers/facebook-preview.png)
+
+# Create Facebook account
+
+- Create a new [Facebook account](https://www.facebook.com/) if you don’t have one already.
+
+## Create Facebook App
+
+- Go to [Meta for Developers](https://developers.facebook.com/).
+- Click **My Apps** in the top right
+- Click **Create App** in the top right.
+- Select your **app type** (e.g. Consumer).
+- Click **Next**.
+- Fill in the **Display name.**
+- Click **Create app**.
+
+## Set up Facebook Login
+
+- Click on Add Product in the left menu.
+- Click on Setup in the Facebook login card.
+- **Don’t** complete the quickstart. Instead, follow the next step.
+- Click on **Settings** under **Facebook Login** in the left menu.
+- Make sure **Embedded Browser OAuth Login** is set to **Yes**.
+- Fill in **Valid OAuth Redirect URIs** with your **OAuth Callback URL** from Nhost.
+- Click **Save changes**.
+
+## Activate Facebook permissions and features
+
+To make sure we can fetch all user data (email, profile picture and name). For that we need to enable **email** and **public_profile** permissions.
+
+- Click on App Review and Permission and Features in the left menu
+- Search and for **email** in the **Search Permissions and Features** search box**.**
+- Click on Request advanced access and complete the steps.
+- Search and for **public_profile** in the **Search Permissions and Features** search box**.**
+- Click on **Request advanced access** and complete the steps.
+
+## Configure Nhost
+
+- Click **Settings** and then **Basic** in the left menu.
+- Copy and paste the **App ID (Client ID)** and **App secret (Client Secret)** from Facebook to your Nhost OAuth settings for Facebook. Make sure the [OAuth provider is enabled in Nhost](/platform/authentication/social-sign-in#enabling-social-sign-in).
+- Click the checkbox “**I have pasted the redirect URI into Facebook”**.
+- Click **Confirm settings**.
+
+## Sign In users in your app
+
+Use the [Nhost JavaScript client](/reference/sdk) to sign in users in your app:
+
+```js
+nhost.auth.signIn({
+  provider: 'facebook'
+})
+```

docs/content/docs/platform/authentication/sign-in-with-github.mdx

@@ -0,0 +1,43 @@
+---
+title: Sign In with GitHub
+---
+
+Follow this guide to sign in users with GitHub with your Nhost App.
+
+![GitHub Sign In Preview](/images/platform/social-providers/github-preview.png)
+
+# Create GitHub account
+
+- Create a new [GitHub account](https://github.com/signup) if you don’t have one already.
+
+## Create GitHub OAuth App
+
+- Create a new OAuth application [(direct link)](https://github.com/settings/applications/new) by:
+  - Click on your profile photo in the top right.
+  - Click on Settings
+  - In the left menu, click Developer settings at the bottom.
+  - Click on Oauth Apps in the left menu
+  - Click on New OAuth App button in the top right
+
+## GitHub OAuth App information
+
+- Fill in Application Name
+- Fill in Homepage URL
+- Fill in **Authorization callback URL** with your OAuth Callbacke URL from Nhost
+
+## Configure Nhost
+
+- Click Generate a new client secret to generate a OAuth client secret.
+- Copy and paste the **Client ID** and **Client Secret** from GitHub to your Nhost OAuth settings for GitHub. Make sure the [OAuth provider is enabled in Nhost](/platform/authentication/social-sign-in#enabling-social-sign-in).
+- Click the checkbox “**I have pasted the redirect URI into GitHub”**.
+- Click **Confirm settings**.
+
+## Sign In users in your app
+
+Use the [Nhost JavaScript client](/reference/sdk) to sign in users in your app:
+
+```js
+nhost.auth.signIn({
+  provider: 'github'
+})
+```

docs/content/docs/platform/authentication/sign-in-with-google.mdx

@@ -0,0 +1,67 @@
+---
+title: Sign In with Google
+---
+
+Follow this guide to sign in users with Google with your Nhost App.
+
+![Google Sign In Preview](/images/platform/social-providers/google-preview.png)
+
+## Sign up for Google
+
+- Sign up for [Google Cloud](https://cloud.google.com/free) if you don’t have one already.
+
+## Create a Google Cloud Project
+
+> 💡 You can skip this step if you already have a Google Cloud project you want to use.
+
+- Create a new Google Cloud project if you don’t already have a project you want to use.
+
+## Configure OAuth consent screen
+
+- Search for **OAuth consent screen** in the top search bar in the Google Cloud Console.
+- Click on **OAuth consent screen** in the search results.
+- Select User Type **External** and click **CREATE**.
+
+## **Edit app registration**
+
+### OAuth consent screen
+
+- Fill in your App information.
+- Click **SAVE AND CONTINUE.**
+
+### Scopes
+
+- Click **SAVE AND CONTINUE**.
+
+### Test user
+
+- Click **SAVE AND CONTINUE**.
+
+### Summary
+
+- Click **BACK TO DASHBOARD**.
+
+## Create credentials
+
+- Click on **Credentials** under **APIs & Services** in the left menu.
+- Click **+ CREATE CREDENTIALS** and then **OAuth client ID** in the top menu.
+- On the **Create OAuth client ID** page for **Application Type** select **Web application**.
+- Under **Authorized redirect URIs** add your **OAuth Callback URL** from Nhost.
+- Click **CREATE**.
+
+## Configure Nhost
+
+- A modal appears with your Google Client ID and Client secret.
+- Copy and paste the **Client ID** and **Client Secret** from Google to your Nhost OAuth settings for Google. Make sure the [OAuth provider is enabled in Nhost](/platform/authentication/social-sign-in#enabling-social-sign-in).
+- Click the checkbox “**I have pasted the redirect URI into Google”**.
+- Click **Confirm settings**.
+
+## Sign In users in your app
+
+Use the [Nhost JavaScript client](/reference/sdk) to sign in users in your app:
+
+```js
+nhost.auth.signIn({
+  provider: 'google'
+})
+```

docs/content/docs/platform/authentication/sign-in-with-linkedin.mdx

@@ -0,0 +1,50 @@
+---
+title: Sign In with LinkedIn
+---
+
+Follow this guide to sign in users with LinkedIn with your Nhost App.
+
+![LinkedIn Sign In Preview](/images/platform/social-providers/linkedin-preview.png)
+
+## Create LinkedIn account
+
+- Create a [LinkedIn account](https://linkedin.com/) if you don't have one already.
+
+## Create LinkedIn OAuth App
+
+- Go to the [LinkedIn Developer Dashboard](https://www.linkedin.com/developers/apps).
+- Click on Create App in the top right.
+- Fill in **App Name**, **LinkedIn Page** and **App Logo**.
+- Click **“I have read and agree to these terms”**.
+- Click **Create app** in the bottom right.
+
+## LinkedIn OAuth App information
+
+- Click on **Auth** in the top menu.
+- Click on the **pen icon** under **OAuth 2.0 settings** and right next to **Authorized redirect URLs for your app.**
+- Click **Add redirect URL**.
+- Copy and past the **OAuth Callback URL** from Nhost.
+- Click **Update**.
+
+## Configure Nhost
+
+- Copy and paste the **Client ID** and **Client Secret** from LinkedIn to your Nhost OAuth settings for LinkedIn.
+- Click the checkbox “**I have pasted the redirect URI into LinkedIn”**.
+- Click **Confirm settings**.
+
+## Enable Auth for your LinkedIn OAuth App
+
+- Click on **Products** in the top menu
+- Click Select on the **Sign In with LinkedIn**.
+- Check the checkbox **I have read and agree to these terms.**
+- Click **Add product**.
+
+## Sign In users in your app
+
+Use the [Nhost JavaScript client](/reference/sdk) to sign in users in your app:
+
+```js
+nhost.auth.signIn({
+  provider: 'linkedin'
+})
+```

docs/content/docs/platform/authentication/sign-in-with-spotify.mdx

@@ -0,0 +1,43 @@
+---
+title: Sign In with Spotify
+---
+
+Follow this guide to sign in users with Spotify with your Nhost App.
+
+![Spotify Sign In Preview](/images/platform/social-providers/spotify-preview.png)
+
+# Create Spotify account
+
+- Create a new [Spotify account](https://www.spotify.com/) if you don't have one already.
+
+## Create Spotify App
+
+- Go to the [Spotify Developer Dashboard](https://developer.spotify.com/dashboard/).
+- Click on CREATE AN APP.
+- Fill in a App name and App description
+- Check the box to aggre Spotify's [Developer Terms of Service](https://developer.spotify.com/terms) and [Branding Guidelines](https://developer.spotify.com/branding-guidelines).
+
+## Configure OAuth Callback URL
+
+- Click EDIT SETTINGS
+- A modal appears
+- Fill in **Redirect URIs** with your **OAuth Callback URL** from Nhost.
+- Click ADD to add the OAuth callback URL.
+- Click SAVE.
+
+## Configure Nhost
+
+- Click SHOW CLIENT SECRET in the Spotify App Dashboard.
+- Copy and paste the **Client ID** and **Client Secret** from Spotify to your Nhost OAuth settings for Spotify.
+- Click the checkbox “**I have pasted the redirect URI into Spotify”**.
+- Click **Confirm settings**.
+
+## Sign In users in your app
+
+Use the [Nhost JavaScript client](/reference/sdk) to sign in users in your app:
+
+```js
+nhost.auth.signIn({
+  provider: 'spotify'
+})
+```

docs/content/docs/platform/authentication/social-login.mdx

@@ -1,38 +0,0 @@
----
-title: 'Social login'
----
-
-Nhost Auth supports the following social login providers:
-
-- GitHub
-- Google
-- Facebook
-- LinkedIn
-
----
-
-## Enabling social login
-
-To start with social login, select your app in Nhost Console and go to **Users** → **Login settings**.
-
-Enabling any of the supported login providers requires a developer account for the selected login provider. Follow the on-screen instructions to enable the login method of your choosing.
-
----
-
-## Implementing login experience
-
-To implement social login in your app, use the [Nhost JavaScript SDK](/reference/sdk) and the `signIn()` method:
-
-```js
-nhost.auth.signIn({
-  provider: 'github'
-})
-```
-
----
-
-## OAuth scopes
-
-Scopes are a mechanism in OAuth to allow or limit an application's access to a user's account.
-
-By default, Nhost sets the scope to get the name, email and avatar for each user. Editing scope is not currently supported.

docs/content/docs/platform/authentication/social-sign-in.mdx

@@ -0,0 +1,47 @@
+---
+title: 'Social Sign-In Providers'
+---
+
+Nhost Auth supports the following social sign-in providers:
+
+- [GitHub](/platform/authentication/sign-in-with-github)
+- [Google](/platform/authentication/sign-in-with-google)
+- [Facebook](/platform/authentication/sign-in-with-facebook)
+- [LinkedIn](/platform/authentication/sign-in-with-linkedin)
+- [Spotify](/platform/authentication/sign-in-with-spotify)
+
+---
+
+## Enabling Social Sign-In Provider
+
+To start with social sign-in, select your app in Nhost Console and go to **Users** → **Login settings**.
+
+You need to set client ID and client secret for each provider that you want to enable.
+
+---
+
+## Implementing sign-in experience
+
+Use the [Nhost JavaScript SDK](/reference/sdk) and the `signIn()` method to implement social sign-in in your app,
+
+Here's an example of how to implement sign-in with GitHub:
+
+```js
+nhost.auth.signIn({
+  provider: 'github'
+})
+```
+
+Users are redirected to your Nhost app's **client URL** by default. By default your Nhost app's client URL is set to `http://localhost:3000`. You can change the value of your client URL in the Nhost console by going to **Users** → **Login settings** → **Client URL**.
+
+---
+
+## Provider OAuth scopes
+
+Scopes are a mechanism in OAuth to allow or limit an application's access to a user's account.
+
+By default, Nhost sets the scope to get the name, email and avatar for each user. Editing scope is not currently supported.
+
+## Provider OAuth Tokens
+
+Nhost saves both access and refresh tokens for each user and provider in the `auth.user_providers` table. These tokens can be used to interact with the provider if needed.

docs/content/docs/platform/authentication/user-management.mdx

@@ -24,7 +24,7 @@ Example of getting one user in GraphQL:
 
 ```graphql
 query {
-  user(id: "some-user-id") {
+  user(id: "<user-id>") {
     id
     displayName
     email

docs/content/docs/platform/database/permissions.mdx

@@ -20,6 +20,8 @@ Access token data is included as headers with every API request. By default, eve
 
 The default role for users is `user`.
 
+> You can also [add custom permission](#add-permission-variables) varaibles if you need to.
+
 ---
 
 ## Select permissions
@@ -60,3 +62,23 @@ In our example, we only select `name`, because we want all other other columns t
 We also want every new record's `user_id` value to be set to the ID of the user making the request. We can tell Hasura to do this with **column presets**.
 
 1. Under column presets, set `user_id` to `x-hasura-user-id`.
+
+## Add Permission Variables
+
+You can add extra permission variables in the Nhost console under **Users** and then **Roles and permissions**. These permission variables are then available when creating permissions for your GraphQL API in the Hasura console.
+
+![Permission Variables](/images/platform/permission-variables-preview.svg)
+
+As an example, let's say you add a new permission variable `x-hasura-organisation-id` with path `user.profile.organisation.id`. This means that Nhost Auth will get the value for `x-hasura-organisation-id` by internally generating the following GraphQL query:
+
+```graphql
+query {
+  user(id: "<user-id>") {
+    profile {
+      organisation {
+        id
+      }
+    }
+  }
+}
+```

docs/content/docs/platform/serverless-functions/index.mdx

@@ -39,10 +39,10 @@ HTTP endpoints are automatically generated based on the file structure under `fu
 As such, given this file structure:
 
 ```js
-functions / index.js
-users / index.ts
-active.ts
-my - company.js
+functions/index.js
+functions/users/index.ts
+functions/active.ts
+functions/my-company.js
 ```
 
 The following endpoints will be available:

docs/content/docs/reference/hasura-auth/api-reference.mdx

@@ -0,0 +1,6 @@
+---
+title: 'API Reference'
+subtitle: 'Hasura Auth'
+---
+
+<Swagger spec="hasura-auth.json" />

docs/content/docs/reference/hasura-auth/configuration.mdx

@@ -0,0 +1,221 @@
+---
+title: Configuration
+---
+
+## Email configuration
+
+Hasura Auth automatically sends transactional emails to manage the following operations:
+
+- Sign up
+- Password reset
+- Email change
+- Passwordless with emails
+
+### SMTP settings
+
+```bash
+AUTH_SMTP_HOST=smtp.example.com
+AUTH_SMTP_PORT=1025
+AUTH_SMTP_USER=user
+AUTH_SMTP_PASS=password
+AUTH_SMTP_SENDER=hasura-auth@example.com
+```
+
+See the [environment variables](/reference/hasura-auth/environment-variables) for additional information about how to connnect to an SMTP server.
+
+### Email templates
+
+You can create your own templates to customize the emails that will be sent to the users. You can have a look at the [official email templates](https://github.com/nhost/hasura-auth/tree/main/email-templates) to understand how they are structured.
+
+#### With Docker
+
+When using Docker, you can mount your own email templates from the local file system. You can have a look at this [docker-compose example](https://github.com/nhost/hasura-auth/blob/16df3e84b6c9a4f888b2ff07bd85afc34f8ed051/docker-compose-example.yaml#L41) to see how to set it up.
+
+#### Remote email templates
+
+When running Hasura Auth in its own infrastructure, it is possible to mount a volume with custom `email-templates` directory. However, in some cases, we may want to fetch templates from an external HTTP endpoint. Hence the introduction of a new `AUTH_EMAIL_TEMPLATE_FETCH_URL` environment variable:
+
+```bash
+AUTH_EMAIL_TEMPLATE_FETCH_URL=https://github.com/nhost/nhost/tree/custom-email-templates-example/examples/custom-email-templates
+```
+
+In the above example, on every email creation, the server will use this URL to fetch its templates, depending on the locale, email type and field.
+
+For instance, the template for english verification email body will the fetched in [https://raw.githubusercontent.com/nhost/nhost/main/examples/custom-email-templates/en/email-verify/body.html](https://raw.githubusercontent.com/nhost/nhost/main/examples/custom-email-templates/en/email-verify/body.html).
+
+See the [example in the main nhost/nhost repository](https://github.com/nhost/nhost/tree/main/examples/custom-email-templates).
+
+The context variables in email templates have been simplified: the `${link}` variable contains the entire redirection url the recipient needs to follow.
+
+---
+
+## Redirections
+
+Some authentication operations redirects the users to the frontend application:
+
+- After an OAuth provider completes or fails authentication, the user is redirected to the frontend
+- Every email sent to the user (passwordless with email, password/email change, password reset) contains a link, that redirects the user to the frontend
+
+In order to achieve that, you need to set the `AUTH_CLIENT_URL` environment variable, for instance:
+
+```bash
+AUTH_CLIENT_URL=https://my-app.vercel.com
+```
+
+---
+
+## Email + password authentication
+
+### Email checks
+
+You can specify a list of allowed emails or domains with `AUTH_ACCESS_CONTROL_ALLOWED_EMAILS` and `AUTH_ACCESS_CONTROL_ALLOWED_EMAIL_DOMAINS`.
+
+As an example, the following environment variables will only allow `@nhost.io`, `@example.com` and `bob@smith.com` to register to the application:
+
+```bash
+AUTH_ACCESS_CONTROL_ALLOWED_EMAILS=bob@smith.com
+AUTH_ACCESS_CONTROL_ALLOWED_EMAIL_DOMAINS=nhost.io,example.com
+```
+
+In the above example, users with the following emails would be able to register `bob@smith.com`, `emma@example.com`, `john@nhost.io`, whereas `mary@firebase.com` won't.
+
+Similarly, it is possible to provide a list of forbidden emails or domains with `AUTH_ACCESS_CONTROL_BLOCKED_EMAILS` and `AUTH_ACCESS_CONTROL_BLOCKED_EMAIL_DOMAINS`.
+
+### Password checks
+
+Hasura auth does not accepts passwords with less than three characters. This limit can be changed in changing the `AUTH_PASSWORD_MIN_LENGTH` environment variable.
+
+It is also possible to only allow [passwords that have not been pwned](https://haveibeenpwned.com/) in setting `AUTH_PASSWORD_HIBP_ENABLED` to `true`.
+
+<!-- TODO ### Change -->
+<!-- TODO ### Reset email -->
+
+<!-- TODO ### Reset password -->
+
+<!-- ---
+TODO ## Anonymous users -->
+
+---
+
+## Multi-factor authentication
+
+Hasura Auth supports different types of Multi-Factor Authentication (MFA): passwordless with emails (magic links), passwordless with SMS, and Time-based one-time passwords.
+
+### Passwordless with emails (magic links)
+
+Hasura Auth supports email [passwordless authentication](https://en.wikipedia.org/wiki/Passwordless_authentication). It requires [SMTP](#email-configuration) to be configured properly.
+
+Set `AUTH_EMAIL_PASSWORDLESS_ENABLED` to `true` to enable passwordless authentication.
+
+<!-- TODO ### Passwordless with SMS -->
+
+### Time-based one-time password (TOTP)
+
+It is possible to add a step to authentication with email and password authentication. Once users registered, they can activate MFA TOTP:
+
+1. Users generate a QR Code, that is then scanned in an authentication app such as [Authy](https://authy.com/) or [Google Authenticator](https://en.wikipedia.org/wiki/Google_Authenticator).
+2. They then send the TOTP code to Hasura Auth. MFA is now activated
+3. Next time they authenticate, Hasura Auth will first expect their email and password, but then, instead of completing authentication, Hasura Auth will expect the TOTP in order to return the refresh and the access tokens.
+
+In order for users to be able to activate MFA TOTP, `AUTH_MFA_ENABLED` must be set to `true`.
+
+<!-- ---
+
+TODO ## OAuth authentication -->
+
+---
+
+## Gravatar
+
+Hasura Auth stores the avatar URL of users in `auth.users.avatar_url`. By default, it will look for the Gravatar linked to the email, and store it into this field.
+It is possible to deactivate the use of Gravatar in setting the `AUTH_GRAVATAR_ENABLED` environment variable to `false`.
+
+---
+
+## Extending user schema
+
+Adding columns to the user tables may be tempting. However, all the tables and columns have a specific purpose, and changing the structure of the `auth` schema will very likely end in breaking the functionning of Hasura Auth. It's, therefore, **highly recommended** not to modify the database schema for any tables in the `auth` schema.
+
+Instead, we recommend adding extra user information in the following ways:
+
+- to store information in the `auth.users.metadata` column
+- to store information in a separate table located in the `public` PostgreSQL schema, and to point to `auth.users.id` through a foreign key.
+
+### `metadata` user field
+
+The `auth.users.metadata` field is a JSON column, that can be used as an option on registration:
+
+```json
+{
+  "email": "bob@bob.com",
+  "passord": "12345678",
+  "options": {
+    "metadata": {
+      "first_name": "Bob"
+    }
+  }
+}
+```
+
+### Additional user information in the `public` schema
+
+As previously explained, the alteration of the `auth` schema may seriously hamper the functionning of Hasura Auth. The `metadata` field in the `auth.users` table may tackle some use cases, but in some other cases, we want to keep a certain level of structure in the way data is structured.
+
+In that case, it is possible to create a dedicated table in the `public` schema, with a `user_id` foreign key column that would point to the `auth.users.id` column. It is then possible to add an Hasura object relationship that would join the two tables together.
+
+<!-- TODO hooks on the metadata field -->
+
+---
+
+## Custom Hasura JWT claims
+
+Hasura comes with a [powerful authorisation system](https://hasura.io/docs/latest/graphql/core/auth/authorization/index.html). Hasura Auth is already configured to add `x-hasura-user-id`, `x-hasura-allowed-roles`, and `x-hasura-user-isAnonymous` to the JSON Web Tokens it generates.
+
+In Hasura Auth, it is possible to define custom claims to add to the JWT, so they can be used by Hasura to determine the permissions of the received GraphQL operation.
+
+Each custom claim is defined by a pair of a key and a value:
+
+- The key determines the name of the claim, prefixed by `x-hasura`. For instance, `organisation-id` will become `x-hasura-organisation-id`.
+- The value is a representation of the path to look at to determine the value of the claim. For instance `profile.organisation.id` will look for the `user.profile` Hasura relationship, and the `profile.organisation` Hasura relationship. Array values are transformed into Postgres syntax so Hasura can interpret them. See the official Hasura documentation to understand the [session variables format](https://hasura.io/docs/latest/graphql/core/auth/authorization/roles-variables.html#format-of-session-variables).
+
+```bash
+AUTH_JWT_CUSTOM_CLAIMS={"organisation-id":"profile.organisation.id", "project-ids":"profile.contributesTo.project.id"}
+```
+
+Will automatically generate and fetch the following GraphQL query:
+
+```graphql
+{
+  user(id: "<user-id>") {
+    profile {
+      organisation {
+        id
+      }
+      contributesTo {
+        project {
+          id
+        }
+      }
+    }
+  }
+}
+```
+
+It will then use the same expressions e.g. `profile.contributesTo.project.id` to evaluate the result with [JSONata](https://jsonata.org/), and possibly transform arrays into Hasura-readable, PostgreSQL arrays.Finally, it adds the custom claims to the JWT in the `https://hasura.io/jwt/claims` namespace:
+
+```json
+{
+  "https://hasura.io/jwt/claims": {
+    "x-hasura-organisation-id": "8bdc4f57-7d64-4146-a663-6bcb05ea2ac1",
+    "x-hasura-project-ids": "{\"3af1b33f-fd0f-425e-92e2-0db09c8b2e29\",\"979cb94c-d873-4d5b-8ee0-74527428f58f\"}",
+    "x-hasura-allowed-roles": [ "me", "user" ],
+    "x-hasura-default-role": "user",
+    "x-hasura-user-id": "121bbea4-908e-4540-ac5d-52c7f6f93bec",
+    "x-hasura-user-isAnonymous": "false"
+  }
+  "sub": "f8776768-4bbd-46f8-bae1-3c40da4a89ff",
+  "iss": "hasura-auth",
+  "iat": 1643040189,
+  "exp": 1643041089
+}
+```

docs/content/docs/reference/hasura-auth/environment-variables.mdx

@@ -0,0 +1,107 @@
+---
+title: Environment Variables
+---
+
+## General environment variables
+
+| Name (a star**\*** means the variable is required) | Description                                                                                                                                                                                            | Default value                |
+| -------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------- |
+| HASURA_GRAPHQL_JWT_SECRET**\***                    | Key used for generating JWTs. Must be `HMAC-SHA`-based and the same as configured in Hasura. [More info](https://hasura.io/docs/latest/graphql/core/auth/authentication/jwt.html#running-with-jwt)     |                              |
+| HASURA_GRAPHQL_DATABASE_URL**\***                  | [PostgreSQL connection URI](https://www.postgresql.org/docs/current/libpq-connect.html#LIBPQ-CONNSTRING). Required to inject the `auth` schema into the database.                                      |                              |
+| HASURA_GRAPHQL_GRAPHQL_URL**\***                   | Hasura GraphQL endpoint. Required to manipulate account data. For instance: `https://graphql-engine:8080/v1/graphql`                                                                                   |                              |
+| HASURA_GRAPHQL_ADMIN_SECRET**\***                  | Hasura GraphQL Admin Secret. Required to manipulate account data.                                                                                                                                      |                              |
+| AUTH_HOST                                          | Server host. [Docs](http://expressjs.com/en/5x/api.html#app.listen)                                                                                                                                    | `0.0.0.0`                    |
+| AUTH_PORT                                          | Server port. [Docs](http://expressjs.com/en/5x/api.html#app.listen)                                                                                                                                    | `4000`                       |
+| AUTH_SERVER_URL                                    | Server URL of where Hasura Backend Plus is running. This value is to used as a callback in email templates and for the OAuth authentication process.                                                   |                              |
+| AUTH_CLIENT_URL                                    | URL of your frontend application. Used to redirect users to the right page once actions based on emails or OAuth succeed.                                                                              |                              |
+| AUTH_SMTP_HOST                                     | SMTP server hostname used for sending emails                                                                                                                                                           |                              |
+| AUTH_SMTP_PORT                                     | SMTP port                                                                                                                                                                                              | `587`                        |
+| AUTH_SMTP_USER                                     | Username to use to authenticate on the SMTP server                                                                                                                                                     |                              |
+| AUTH_SMTP_PASS                                     | Password to use to authenticate on the SMTP server                                                                                                                                                     |                              |
+| AUTH_SMTP_SENDER                                   | Email to use in the `From` field of the email                                                                                                                                                          |                              |
+| AUTH_SMTP_AUTH_METHOD                              | SMTP authentication method                                                                                                                                                                             | `PLAIN`                      |
+| AUTH_SMTP_SECURE                                   | Enables SSL. [More info](https://nodemailer.com/smtp/#tls-options).                                                                                                                                    | `false`                      |
+| AUTH_GRAVATAR_ENABLED                              |                                                                                                                                                                                                        | `true`                       |
+| AUTH_GRAVATAR_DEFAULT                              |                                                                                                                                                                                                        | `blank`                      |
+| AUTH_GRAVATAR_RATING                               |                                                                                                                                                                                                        | `g`                          |
+| AUTH_ANONYMOUS_USERS_ENABLED                       | Enables users to register as an anonymous user.                                                                                                                                                        | `false`                      |
+| AUTH_DISABLE_NEW_USERS                             | If set, new users will be disabled after finishing registration and won't be able to connect.                                                                                                          | `false`                      |
+| AUTH_ACCESS_CONTROL_ALLOWED_EMAILS                 | Comma-separated list of emails that are allowed to register.                                                                                                                                           |                              |
+| AUTH_ACCESS_CONTROL_ALLOWED_EMAIL_DOMAINS          | Comma-separated list of email domains that are allowed to register. If `ALLOWED_EMAIL_DOMAINS` is `tesla.com,ikea.se`, only emails from tesla.com and ikea.se would be allowed to register an account. | `` (allow all email domains) |
+| AUTH_ACCESS_CONTROL_BLOCKED_EMAILS                 | Comma-separated list of emails that cannot register.                                                                                                                                                   |                              |
+| AUTH_ACCESS_CONTROL_BLOCKED_EMAIL_DOMAINS          | Comma-separated list of email domains that cannot register.                                                                                                                                            |                              |
+| AUTH_PASSWORD_MIN_LENGTH                           | Minimum password length.                                                                                                                                                                               | `3`                          |
+| AUTH_PASSWORD_HIBP_ENABLED                         | User's password is checked against [Pwned Passwords](https://haveibeenpwned.com/Passwords).                                                                                                            | `false`                      |
+| AUTH_USER_DEFAULT_ROLE                             | Default user role for registered users.                                                                                                                                                                | `user`                       |
+| AUTH_USER_DEFAULT_ALLOWED_ROLES                    | Comma-separated list of default allowed user roles.                                                                                                                                                    | `me,$AUTH_USER_DEFAULT_ROLE` |
+| AUTH_LOCALE_DEFAULT                                |                                                                                                                                                                                                        | `en`                         |
+| AUTH_LOCALE_ALLOWED_LOCALES                        |                                                                                                                                                                                                        | `en`                         |
+| AUTH_EMAIL_PASSWORDLESS_ENABLED                    | Enables passwordless authentication by email. The SMTP server must then be configured.                                                                                                                 | `false`                      |
+| AUTH_SMS_PASSWORDLESS_ENABLED                      | Enables passwordless authentication by SMS. An SMS provider must then be configured.                                                                                                                   | `false`                      |
+| AUTH_SMS_PROVIDER                                  | SMS provider name. Only `twilio` is possible as an option for now.                                                                                                                                     |                              |
+| AUTH_SMS_TWILIO_ACCOUNT_SID                        |                                                                                                                                                                                                        |                              |
+| AUTH_SMS_TWILIO_AUTH_TOKEN                         |                                                                                                                                                                                                        |                              |
+| AUTH_SMS_TWILIO_MESSAGING_SERVICE_ID               |                                                                                                                                                                                                        |                              |
+| AUTH_SMS_TWILIO_FROM                               |                                                                                                                                                                                                        |                              |
+| AUTH_EMAIL_SIGNIN_EMAIL_VERIFIED_REQUIRED          | When enabled, any email-based authentication requires emails to be verified by a link sent to this email.                                                                                              | `true`                       |
+| AUTH_ACCESS_CONTROL_ALLOWED_REDIRECT_URLS          |                                                                                                                                                                                                        |                              |
+| AUTH_MFA_ENABLED                                   | Enables users to use Multi Factor Authentication.                                                                                                                                                      | `false`                      |
+| AUTH_MFA_TOTP_ISSUER                               | The name of the One Time Password (OTP) issuer. Probably your app's name.                                                                                                                              | `hasura-auth`                |
+| AUTH_ACCESS_TOKEN_EXPIRES_IN                       | Number of seconds before the access token (JWT) expires.                                                                                                                                               | `900`(15 minutes)            |
+| AUTH_REFRESH_TOKEN_EXPIRES_IN                      | Number of seconds before the refresh token expires.                                                                                                                                                    | `2592000` (30 days)          |
+| AUTH_EMAIL_TEMPLATE_FETCH_URL                      |                                                                                                                                                                                                        |                              |
+| AUTH_JWT_CUSTOM_CLAIMS                             |                                                                                                                                                                                                        |                              |
+
+## OAuth environment variables
+
+| Name (a star**\*** means the variable is required when the provider is enabled) | Default value                       |
+| ------------------------------------------------------------------------------- | ----------------------------------- |
+| AUTH_PROVIDER_GITHUB_ENABLED                                                    | `false`                             |
+| AUTH_PROVIDER_GITHUB_CLIENT_ID**\***                                            |                                     |
+| AUTH_PROVIDER_GITHUB_CLIENT_SECRET**\***                                        |                                     |
+| AUTH_PROVIDER_GITHUB_AUTHORIZATION_URL                                          |                                     |
+| AUTH_PROVIDER_GITHUB_TOKEN_URL                                                  |                                     |
+| AUTH_PROVIDER_GITHUB_USER_PROFILE_URL                                           |                                     |
+| AUTH_PROVIDER_GITHUB_SCOPE                                                      | `user:email `                       |
+| AUTH_PROVIDER_GOOGLE_ENABLED                                                    | `false`                             |
+| AUTH_PROVIDER_GOOGLE_CLIENT_ID**\***                                            |                                     |
+| AUTH_PROVIDER_GOOGLE_CLIENT_SECRET**\***                                        |                                     |
+| AUTH_PROVIDER_GOOGLE_SCOPE                                                      | `email,profile`                     |
+| AUTH_PROVIDER_FACEBOOK_ENABLED                                                  | `false`                             |
+| AUTH_PROVIDER_FACEBOOK_CLIENT_ID**\***                                          |                                     |
+| AUTH_PROVIDER_FACEBOOK_CLIENT_SECRET**\***                                      |                                     |
+| AUTH_PROVIDER_FACEBOOK_PROFILE_FIELDS                                           | `email,photos,displayName`          |
+| AUTH_PROVIDER_FACEBOOK_SCOPE                                                    | `email`                             |
+| AUTH_PROVIDER_TWITTER_ENABLED                                                   | `false`                             |
+| AUTH_PROVIDER_TWITTER_CONSUMER_KEY**\***                                        |                                     |
+| AUTH_PROVIDER_TWITTER_CONSUMER_SECRET**\***                                     |                                     |
+| AUTH_PROVIDER_LINKEDIN_ENABLED                                                  |                                     |
+| AUTH_PROVIDER_LINKEDIN_CLIENT_ID**\***                                          |                                     |
+| AUTH_PROVIDER_LINKEDIN_CLIENT_SECRET**\***                                      |                                     |
+| AUTH_PROVIDER_LINKEDIN_SCOPE                                                    | `r_emailaddress,r_liteprofile`      |
+| AUTH_PROVIDER_APPLE_ENABLED                                                     | `false`                             |
+| AUTH_PROVIDER_APPLE_CLIENT_ID**\***                                             |                                     |
+| AUTH_PROVIDER_APPLE_TEAM_ID**\***                                               |                                     |
+| AUTH_PROVIDER_APPLE_KEY_ID**\***                                                |                                     |
+| AUTH_PROVIDER_APPLE_PRIVATE_KEY**\***                                           | Base64 format                       |
+| AUTH_PROVIDER_APPLE_SCOPE                                                       | `name,email`                        |
+| AUTH_PROVIDER_WINDOWS_LIVE_ENABLED                                              | `false`                             |
+| AUTH_PROVIDER_WINDOWS_LIVE_CLIENT_ID**\***                                      |                                     |
+| AUTH_PROVIDER_WINDOWS_LIVE_CLIENT_SECRET**\***                                  |                                     |
+| AUTH_PROVIDER_WINDOWS_LIVE_SCOPE                                                | `wl.basic,wl.emails`                |
+| AUTH_PROVIDER_SPOTIFY_ENABLED                                                   | `false`                             |
+| AUTH_PROVIDER_SPOTIFY_CLIENT_ID**\***                                           |                                     |
+| AUTH_PROVIDER_SPOTIFY_CLIENT_SECRET**\***                                       |                                     |
+| AUTH_PROVIDER_SPOTIFY_SCOPE                                                     | `user-read-email,user-read-private` |
+| AUTH_PROVIDER_GITLAB_ENABLED                                                    | `false`                             |
+| AUTH_PROVIDER_GITLAB_CLIENT_ID**\***                                            |                                     |
+| AUTH_PROVIDER_GITLAB_CLIENT_SECRET**\***                                        |                                     |
+| AUTH_PROVIDER_GITLAB_BASE_URL                                                   |                                     |
+| AUTH_PROVIDER_GITLAB_SCOPE                                                      | `read_user`                         |
+| AUTH_PROVIDER_BITBUCKET_ENABLED                                                 | `false`                             |
+| AUTH_PROVIDER_BITBUCKET_CLIENT_ID**\***                                         |                                     |
+| AUTH_PROVIDER_BITBUCKET_CLIENT_SECRET**\***                                     |                                     |
+| AUTH_PROVIDER_STRAVA_ENABLED                                                    | `false`                             |
+| AUTH_PROVIDER_STRAVA_CLIENT_ID**\***                                            |                                     |
+| AUTH_PROVIDER_STRAVA_CLIENT_SECRET**\***                                        |                                     |
+| AUTH_PROVIDER_STRAVA_SCOPE                                                      | `profile:read_all`                  |

docs/content/docs/reference/hasura-auth/index.mdx

@@ -0,0 +1,41 @@
+---
+title: 'Overview'
+---
+
+Hasura Auth handles **authentication** for [Hasura](https://github.com/hasura/graphql-engine).
+
+Hasura Auth runs in a separate Docker container alongside Postgres and Hasura.
+
+## Features
+
+- 🧑‍🤝‍🧑 Users are stored in Postgres and accessed via GraphQL
+- 🔑 Multiple sign-in methods
+- ✨ Integrates with GraphQL and Hasura Permissions
+- 🔐 JWT tokens and Refresh Tokens.
+- ✉️ Emails sent on various operations
+<!-- - ✅ Optional checking for Pwned Passwords. -->
+- 🛡️ Two-factor authentication support.
+- 👨‍💻 Written 100% in TypeScript.
+
+### Authentication methods
+
+- **Email and Password**: simple email and password method.
+- **Email**, also called **passwordless email** or **magic link**.
+- **SMS**, also called **passwordless sms**.
+- **Anonymous**: sign in users without any method. Anonymous users can be
+  converted to _regular_ users at a later stage.
+- **OAuth providers**: Facebook, Google, GitHub, Twitter, Apple, LinkedIn, Windows Live, Spotify, Strave, GitLab, BitBucket
+
+## Integration with Hasura
+
+Hasura Auth's final purpose is to securely provide a JSON Web Token that can be added as an authorization header to GraphQL operation sent to Hasura.
+Hasura auth automatically generates and manages two kinds of tokens:
+
+- An access token (JWT), that will be used to authenticate the GraphQL operations in Hasura, and that has a limited expiration limit (15 minutes by default)
+- A refresh token, that is used to ask Hasura Auth for a new access token, and that can be consummed only once.
+
+Access tokens generated by Hasura Auth contains information and user id, its default role, and the roles they actually have. In addition, it is possible since version `0.2.0` to extend JWT claims with custom information such as organisation or project ownership, so your application can leverage the capabilities of the [Hasura permissions layer](https://hasura.io/docs/latest/graphql/core/auth/authorization/index.html).
+
+<!-- - Users and accounts are saved in the database. -->
+
+You can read further information about JWT and Hasura in the [official Hasura documentation](https://hasura.io/docs/latest/graphql/core/auth/authentication/jwt.html).

docs/content/docs/reference/hasura-auth/installation.mdx

@@ -0,0 +1,24 @@
+---
+title: Installation
+---
+
+Hasura Auth runs in a container alongside Postgres and Hasura.
+
+## Nhost (recommended)
+
+The recommended way to start using Hasura Auth is by using Nhost. With Nhost, you will get a complete backend ready in seconds with Hasura, authentication, storage and serverless functions.
+
+Go to [Nhost](https://nhost.io) and start building your app now.
+
+## Docker-compose
+
+```sh
+git clone https://github.com/nhost/hasura-auth.git
+cd hasura-auth
+cp .env.example .env
+docker-compose -f docker-compose-example.yaml up
+```
+
+Hasura Auth comes with plenty of options. They are explained in the [configuration section](/reference/hasura-auth/configuration).
+
+If you are already familiar with the application, you can also have a look at the [environment variables](/reference/hasura-auth/environment-variables) that can be passed on to your docker container.

docs/content/docs/reference/hasura-auth/schema.mdx

@@ -0,0 +1,85 @@
+---
+title: 'Schema'
+---
+
+Hasura Auth stores all its data in a dedicated `auth` PostgreSQL schema. When Hasura Auth starts, it checks if the `auth` schema exists, then automatically syncs the following tables and their corresponding Hasura metadata:
+
+```mermaid
+erDiagram
+migrations {
+    integer id PK
+    varchar name
+    varchar hash
+    timestamp executed_at "CURRENT_TIMESTAMP"
+}
+
+users ||--o{ user_roles : roles
+user_roles }o--|| roles: role
+users }o--|| roles: role
+users ||--o{ refresh_tokens: refreshTokens
+users ||--o{ user_providers: provider
+providers ||--o{ user_providers: user
+
+provider_requests {
+    uuid id PK "gen_random_uuid()"
+    test redirect_url
+}
+
+
+refresh_tokens {
+    uuid refresh_token PK
+    uuid user_id FK
+    timestamptz created_at "now()"
+    timestamptz expires_at
+}
+
+providers {
+    text id PK
+}
+user_providers {
+    uuid id PK "gen_random_uuid()"
+    timestamptz created_at "now()"
+    timestamptz updated_at "now()"
+    uuid user_id FK
+    text access_token
+    text refresh_token
+    text provider_id FK
+    text provider_user_id
+}
+user_roles {
+    uuid id PK "gen_random_uuid()"
+    timestamptz created_at "now()"
+    uuid user_id FK
+    text role FK
+}
+users {
+    uuid id PK "gen_random_uuid()"
+    timestamptz created_at "now()"
+    timestamptz updated_at "now()"
+    timestamptz last_seen "nullable"
+    boolean disabled "false"
+    text display_name "''"
+    text avatar_url "''"
+    varchar locale
+    email email "nullable"
+    text phone_number "nullable"
+    text password_hash "nullable"
+    boolean email_verified "false"
+    boolean phone_number_verified "false"
+    email new_email "nullable"
+    text otp_method_last_used "nullable"
+    text otp_hash "nullable"
+    timestamptz opt_hash_expires_at "now()"
+    text default_role FK "user"
+    boolean is_anonymous "false"
+    text totp_secret "nullable"
+    text active_mfa_type "nullable"
+    text ticket "nullable"
+    timestamptz ticket_expires_at "now()"
+    jsonb metadata "nullable"
+}
+
+roles {
+    text roles PK
+}
+```

docs/content/docs/reference/index.mdx

@@ -28,3 +28,11 @@ In this section:
 ### Nhost CLI
 
 - [CLI overview](/reference/cli)
+### Hasura Auth
+
+- [Overview](./reference/hasura-auth)
+- [Installation](./reference/hasura-auth/installation)
+- [Configuration](./reference/hasura-auth/configuration)
+- [Environment variables](./reference/hasura-auth/environment-variables)
+- [API](./reference/hasura-auth/api-reference)
+- [Schema](./reference/hasura-auth/api-reference)

docs/content/docs/reference/nextjs/configuration.mdx

@@ -2,41 +2,59 @@
 title: 'Configuration'
 ---
 
+## Installation
+
+With yarn:
+
+```sh
+yarn add @nhost/react @nhost/nextjs
+```
+
+With Npm:
+
+```sh
+npm install @nhost/react @nhost/nextjs
+```
+
+---
+
 ## Configuration
 
-Configuring Nhost with Next.js follows the same logic as React, except we are initializing with `NhostSSR` instead of `Nhost`.
-Under the hood, `NhostSSR` uses cookies to store the refresh token, and disables auto-refresh and auto-login when running on the server-side.
+Configuring Nhost with Next.js follows the same logic as React, except we are initializing with the `NhostClient` from the `@nhost/nextjs` package.
+Under the hood, `NhostClient` uses cookies to store the refresh token, and disables auto-refresh and auto-login when running on the server-side.
 
 ```jsx
 // {project-root}/pages/_app.tsx
 import type { AppProps } from 'next/app'
 
-import { NhostSSR, NhostProvider } from '@nhost/nextjs'
+import { NhostClient, NhostNextProvider } from '@nhost/nextjs'
 
 import Header from '../components/Header'
 
-const nhost = new NhostSSR({ backendUrl: 'my-app.nhost.run' })
+const nhost = new NhostClient({ backendUrl: 'my-app.nhost.run' })
 
 function MyApp({ Component, pageProps }: AppProps) {
   return (
-    <NhostProvider nhost={nhost} initial={pageProps.nhostSession}>
+    <NhostNextProvider nhost={nhost} initial={pageProps.nhostSession}>
       <div>
         <Header />
         <Component {...pageProps} />
       </div>
-    </NhostProvider>
+    </NhostNextProvider>
   )
 }
 
 export default MyApp
 ```
 
+---
+
 ## Client-side rendering
 
 The logic is the same as in a classic React application:
 
 ```jsx
-// {project-root}/pages/csr-page.jsx
+// {project-root}/pages/csr-page.tsx
 import { NextPageContext } from 'next'
 import React from 'react'
 
@@ -58,12 +76,14 @@ const ClientSidePage: React.FC = () => {
 export default ClientSidePage
 ```
 
+---
+
 ## Server-side rendering
 
 You need to load the session from the server first from `getServerSideProps`. Once it is done, the `_app` component will make sure to load or update the session through `pageProps`.
 
 ```jsx
-// {project-root}/pages/ssr-page.jsx
+// {project-root}/pages/ssr-page.tsx
 import { NextPageContext } from 'next'
 import React from 'react'
 

docs/content/docs/reference/nextjs/index.mdx

@@ -2,7 +2,7 @@
 title: 'Introduction'
 ---
 
-It is possible to use [`@nhost/react`](/reference/react) in any Next.js page that would be configured to render on the client-side.
+All the React hooks and helpers from [`@nhost/react`](/reference/react) are available in Next.js and are exported in the `@nhost/nextjs` package.
 
 When rendering a page from the server-side, Next.js needs to get some information from the client to determine their authentication status. Such communication is only available from cookies, and the Nhost client is designed to enable such a mechanism.
 

docs/content/docs/reference/nextjs/protecting-routes.mdx

@@ -6,13 +6,12 @@ Create a `auth-protected.js` file:
 
 ```jsx
 import { useRouter } from 'next/router'
-import { useAuthLoading, useAuthenticated } from '@nhost/react'
+import { useAuthenticationStatus } from '@nhost/nextjs'
 
 export function authProtected(Comp) {
   return function AuthProtected(props) {
     const router = useRouter()
-    const isLoading = useAuthLoading()
-    const isAuthenticated = useAuthenticated()
+    const { isLoading, isAuthenticated } = useAuthenticationStatus()
 
     if (isLoading) {
       return <div>Loading...</div>

docs/content/docs/reference/react/apollo.mdx

@@ -7,38 +7,37 @@ title: 'Apollo GraphQL'
 With Yarn:
 
 ```sh
-yarn add @nhost/react @nhost/react-apollo
+yarn add @nhost/react @nhost/react-apollo @apollo/client
 ```
 
 With Npm:
 
 ```sh
-npm install @nhost/react @nhost/react-apollo
+npm install @nhost/react @nhost/react-apollo @apollo/client
 ```
 
 ## Configuration
 
-Let's add a `NhostApolloProvider`. Make sure the Apollo Provider is nested into `NhostProvider`, as it will need the Nhost context to determine the authentication headers to be sent to the GraphQL endpoint.
+Let's add a `NhostApolloProvider`. Make sure the Apollo Provider is nested into `NhostReactProvider`, as it will need the Nhost context to determine the authentication headers to be sent to the GraphQL endpoint.
 
 ```jsx
 import React from 'react'
 import ReactDOM from 'react-dom'
 import App from './App'
 import { NhostApolloProvider } from '@nhost/react-apollo'
-import { NhostProvider } from '@nhost/react'
-import { Nhost } from '@nhost/client'
+import { NhostClient, NhostReactProvider } from '@nhost/react'
 
-const nhost = new Nhost({
+const nhost = new NhostClient({
   backendUrl: 'http://localhost:1337'
 })
 
 ReactDOM.render(
   <React.StrictMode>
-    <NhostProvider nhost={nhost}>
-      <NhostApolloProvider>
+    <NhostReactProvider nhost={nhost}>
+      <NhostApolloProvider nhost={nhost}>
         <App />
       </NhostApolloProvider>
-    </NhostProvider>
+    </NhostReactProvider>
   </React.StrictMode>,
   document.getElementById('root')
 )

docs/content/docs/reference/react/hooks.mdx

@@ -7,36 +7,38 @@ title: 'Hooks'
 ### Email and Password Sign-Un
 
 ```js
-const { signUp, isLoading, isSuccess, needsVerification, isError, error } =
-  useEmailPasswordSignUp(email?: string, password?: string, options?: Options )
+const { signUpEmailPassword, isLoading, isSuccess, needsEmailVerification, isError, error } =
+  useSignUpEmailPassword(options?: Options)
 ```
 
-| Name                   | Type                                                          | Notes                                                                                                                                                                                                             |
-| ---------------------- | ------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `signUp`               | (email?: string, password?: string) => void                   | Used for a new user to sign up. The email/password arguments will take precedence over the possible state values used when creating the hook.                                                                     |
-| `isLoading`            | boolean                                                       | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
-| `needsVerification`    | boolean                                                       | Returns `true` if the sign-up has been accepted, but a verificaiton email has been sent and is awaiting.                                                                                                          |
-| `isSuccess`            | boolean                                                       | Returns `true` if the sign-up suceeded. Returns `false` if the new email needs to be verified first, or if an error occurred.                                                                                     |
-| `isError`              | boolean                                                       | Returns `true` if an error occurred.                                                                                                                                                                              |
-| `error`                | {status: number, error: string, message: string} \| undefined | Provides details about the error.                                                                                                                                                                                 |
-| `options.locale`       | string \| undefined                                           | Locale of the user, in two digits, for instance `en`.                                                                                                                                                             |
-| `options.allowedRoles` | string[] \| undefined                                         | Allowed roles of the user. Must be a subset of the default allowed roles defined in Hasura Auth.                                                                                                                  |
-| `options.defaultRole`  | string \| undefined                                           | Default role of the user. Must be part of the default allowed roles defined in Hasura Auth.                                                                                                                       |
-| `options.displayName`  | string \| undefined                                           |                                                                                                                                                                                                                   |
-| `options.metadata`     | Record<string, unknown> \| undefined                          | Custom additional user information stored in the `metadata` column. Can be any JSON object.                                                                                                                       |
-| `options.redirectTo`   | string \| undefined                                           | redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+| Name                     | Type                                                     | Notes                                                                                                                                                                                                             |
+| ------------------------ | -------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `signUpEmailPassword`    | (email?: string, password?: string) => void              | Used for a new user to sign up. Returns a promise with the current context                                                                                                                                        |
+| `isLoading`              | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
+| `needsEmailVerification` | boolean                                                  | Returns `true` if the sign-up has been accepted, but a verificaiton email has been sent and is awaiting.                                                                                                          |
+| `isSuccess`              | boolean                                                  | Returns `true` if the sign-up suceeded. Returns `false` if the new email needs to be verified first, or if an error occurred.                                                                                     |
+| `isError`                | boolean                                                  | Returns `true` if an error occurred.                                                                                                                                                                              |
+| `error`                  | {status: number, error: string, message: string} \| null | Provides details about the error.                                                                                                                                                                                 |
+| `user`                   | User \| null                                             | User information                                                                                                                                                                                                  |
+| `accessToken`            | string \| null                                           | Access token (JWT)                                                                                                                                                                                                |
+| `options.locale`         | string \| undefined                                      | Locale of the user, in two digits, for instance `en`.                                                                                                                                                             |
+| `options.allowedRoles`   | string[] \| undefined                                    | Allowed roles of the user. Must be a subset of the default allowed roles defined in Hasura Auth.                                                                                                                  |
+| `options.defaultRole`    | string \| undefined                                      | Default role of the user. Must be part of the default allowed roles defined in Hasura Auth.                                                                                                                       |
+| `options.displayName`    | string \| undefined                                      |                                                                                                                                                                                                                   |
+| `options.metadata`       | Record<string, unknown> \| undefined                     | Custom additional user information stored in the `metadata` column. Can be any JSON object.                                                                                                                       |
+| `options.redirectTo`     | string \| undefined                                      | redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
 
 #### Usage
 
 ```jsx
 import { useState } from 'react'
-import { useEmailPasswordSignUp } from '@nhost/react'
+import { useSignUpEmailPassword } from '@nhost/react'
 
 const Component = () => {
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
-  const { signUp, isLoading, isSuccess, needsVerification, isError, error } =
-    useEmailPasswordSignUp(email, password)
+  const { signUpEmailPassword, isLoading, isSuccess, needsEmailVerification, isError, error } =
+    useSignUpEmailPassword()
   return (
     <div>
       <input value={email} onChange={(event) => setEmail(event.target.value)} placeholder="Email" />
@@ -45,9 +47,9 @@ const Component = () => {
         onChange={(event) => setPassword(event.target.value)}
         placeholder="Password"
       />
-      <button onClick={signUp}>Register</button>
+      <button onClick={() => signUpEmailPassword(email, password)}>Register</button>
       {isSuccess && <div>Your account have beed created! You are now authenticated</div>}
-      {needsVerification && (
+      {needsEmailVerification && (
         <div>Please check your mailbox and follow the verification link to verify your email</div>
       )}
     </div>
@@ -58,30 +60,43 @@ const Component = () => {
 ### Email and Password Sign-In
 
 ```js
-const { signIn, isLoading, needsVerification, isSuccess, isError, error } =
-  useEmailPasswordSignIn(email?: string, password?: string)
+const {
+  signInEmailPassword,
+  isLoading,
+  needsEmailVerification,
+  needsMfaOtp,
+  sendMfaOtp,
+  isSuccess,
+  isError,
+  error,
+  user
+} = useSignInEmailPassword()
 ```
 
-| Name                | Type                                                          | Notes                                                                                                                                       |
-| ------------------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
-| `signIn`            | (email?: string, password?: string) => void                   | Will try to authenticate. The email/password arguments will take precedence over the possible state values used when creating the hook.     |
-| `isLoading`         | boolean                                                       | Returns `true` when the action is executing, `false` when it finished its execution.                                                        |
-| `needsVerification` | boolean                                                       | Returns `true` if the user email is still pending verification.                                                                             |
-| `isSuccess`         | boolean                                                       | Returns `true` if the user has successfully authenticated. Returns `false` in case or error or if the new email needs to be verified first. |
-| `isError`           | boolean                                                       | Returns `true` if an error occurred.                                                                                                        |
-| `error`             | {status: number, error: string, message: string} \| undefined | Provides details about the error.                                                                                                           |
+| Name                     | Type                                                     | Notes                                                                                                                                       |
+| ------------------------ | -------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
+| `signInEmailPassword`    | (email?: string, password?: string)                      | Will try to authenticate. Returns a promise with the current context                                                                        |
+| `isLoading`              | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution.                                                        |
+| `needsEmailVerification` | boolean                                                  | Returns `true` if the user email is still pending email verification.                                                                       |
+| `needsMfaOtp`            | boolean                                                  | Returns `true` if the server is awaiting an MFA one-time password to complete the authentication.                                           |
+| `sendMfaOtp`             | (otp: string) => void                                    | Sends MFA One-time password. Will turn either `isSuccess` or `isError` to true, and store potential error in `error`.                       |
+| `isSuccess`              | boolean                                                  | Returns `true` if the user has successfully authenticated. Returns `false` in case or error or if the new email needs to be verified first. |
+| `isError`                | boolean                                                  | Returns `true` if an error occurred.                                                                                                        |
+| `error`                  | {status: number, error: string, message: string} \| null | Provides details about the error.                                                                                                           |
+| `user`                   | User \| null                                             | User information                                                                                                                            |
+| `accessToken`            | string \| null                                           | Access token (JWT)                                                                                                                          |
 
 #### Usage
 
 ```jsx
 import { useState } from 'react'
-import { useEmailPasswordSignIn } from '@nhost/react'
+import { useSignInEmailPassword } from '@nhost/react'
 
 const Component = () => {
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
-  const { signIn, isLoading, isSuccess, needsVerification, isError, error } =
-    useEmailPasswordSignIn(email, password)
+  const { signInEmailPassword, isLoading, isSuccess, needsEmailVerification, isError, error } =
+    useSignInEmailPassword()
   return (
     <div>
       <input value={email} onChange={(event) => setEmail(event.target.value)} placeholder="Email" />
@@ -90,9 +105,9 @@ const Component = () => {
         onChange={(event) => setPassword(event.target.value)}
         placeholder="Password"
       />
-      <button onClick={signUp}>Register</button>
+      <button onClick={() => signInEmailPassword(email, password)}>Register</button>
       {isSuccess && <div>Authentication suceeded</div>}
-      {needsVerification && (
+      {needsEmailVerification && (
         <div>
           You must verify your email to sign in. Check your mailbox and follow the instructions to
           verify your email.
@@ -105,49 +120,69 @@ const Component = () => {
 
 ### Oauth Providers
 
+```js
+const providerLink = useProviderLink(options?: Options)
+```
+
+| Name                   | Type                                 | Notes                                                                                                                                                                                                             |
+| ---------------------- | ------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `options.locale`       | string \| undefined                  | Locale of the user, in two digits, for instance `en`.                                                                                                                                                             |
+| `options.allowedRoles` | string[] \| undefined                | Allowed roles of the user. Must be a subset of the default allowed roles defined in Hasua Auth.                                                                                                                   |
+| `options.defaultRole`  | string \| undefined                  | Default role of the user. Must be part of the default allowed roles defined in Hasura Auth.                                                                                                                       |
+| `options.displayName`  | string \| undefined                  |
+| `options.metadata`     | Record<string, unknown> \| undefined | Custom additional user information stored in the `metadata` column. Can be any JSON object.                                                                                                                       |
+| `options.redirectTo`   | string \| undefined                  | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+
+#### Usage
+
 ```js
 import { useProviderLink } from '@nhost/react'
 
 const Component = () => {
-  const { github } = useProviderLink()
-  return <a href={github}>Authenticate with GitHub</a>
+  const { facebook, github } = useProviderLink()
+  return
+  ;<div>
+    <a href={facebook}>Authenticate with Facebook</a>
+    <a href={github}>Authenticate with GitHub</a>
+  </div>
 }
 ```
 
 ### Passwordless email authentication
 
 ```js
-const { signIn, isLoading, isSuccess, isError, error } =
-  useEmailPasswordlessSignIn(email?: string, options?: Options)
+const { signInEmailPasswordless, isLoading, isSuccess, isError, error } =
+  useSignInEmailPasswordless(options?: Options)
 ```
 
-| Name                   | Type                                             | Notes                                                                                                                                                                                                             |
-| ---------------------- | ------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `signIn`               | (email?: string) => void                         | Sends a magic link to the given email The email argument will take precedence over the the possible state value used when creating the hook.                                                                      |
-| `isLoading`            | boolean                                          | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
-| `isSuccess`            | boolean                                          | Returns `true` if the magic link email user has successfully send.                                                                                                                                                |
-| `isError`              | boolean                                          | Returns `true` if an error occurred.                                                                                                                                                                              |
-| `error`                | {status: number, error: string, message: string} | Provides details about the error.                                                                                                                                                                                 |
-| `options.locale`       | string \| undefined                              | Locale of the user, in two digits, for instance `en`.                                                                                                                                                             |
-| `options.allowedRoles` | string[] \| undefined                            | Allowed roles of the user. Must be a subset of the default allowed roles defined in Hasua Auth.                                                                                                                   |
-| `options.defaultRole`  | string \| undefined                              | Default role of the user. Must be part of the default allowed roles defined in Hasura Auth.                                                                                                                       |
-| `options.displayName`  | string \| undefined                              |
-| `options.metadata`     | Record<string, unknown> \| undefined             | Custom additional user information stored in the `metadata` column. Can be any JSON object.                                                                                                                       |
-| `options.redirectTo`   | string \| undefined                              | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+| Name                      | Type                                             | Notes                                                                                                                                                                                                             |
+| ------------------------- | ------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `signInEmailPasswordless` | (email?: string) => void                         | Sends a magic link to the given email.                                                                                                                                                                            |
+| `isLoading`               | boolean                                          | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
+| `isSuccess`               | boolean                                          | Returns `true` if the magic link email user has successfully send.                                                                                                                                                |
+| `isError`                 | boolean                                          | Returns `true` if an error occurred.                                                                                                                                                                              |
+| `error`                   | {status: number, error: string, message: string} | Provides details about the error.                                                                                                                                                                                 |
+| `options.locale`          | string \| undefined                              | Locale of the user, in two digits, for instance `en`.                                                                                                                                                             |
+| `options.allowedRoles`    | string[] \| undefined                            | Allowed roles of the user. Must be a subset of the default allowed roles defined in Hasua Auth.                                                                                                                   |
+| `options.defaultRole`     | string \| undefined                              | Default role of the user. Must be part of the default allowed roles defined in Hasura Auth.                                                                                                                       |
+| `options.displayName`     | string \| undefined                              |
+| `options.metadata`        | Record<string, unknown> \| undefined             | Custom additional user information stored in the `metadata` column. Can be any JSON object.                                                                                                                       |
+| `options.redirectTo`      | string \| undefined                              | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
 
 #### Usage
 
 ```jsx
 import { useState } from 'react'
-import { useEmailPasswordlessSignIn } from '@nhost/react'
+import { useSignInEmailPasswordless } from '@nhost/react'
 
 const Component = () => {
   const [email, setEmail] = useState('')
-  const { signIn, isLoading, isSuccess, isError, error } = useEmailPasswordlessSignIn(email)
+  const { signInEmailPasswordless, isLoading, isSuccess, isError, error } =
+    useSignInEmailPasswordless()
   return (
     <div>
       <input value={email} onChange={(event) => setEmail(event.target.value)} placeholder="Email" />
-      <button onClick={signUp}>Register</button>
+      <button onClick={() => signInEmailPasswordless(email)}>Authenticate</button>
       {isSuccess && (
         <div>
           An email has been sent to {email}. Please check your mailbox and click on the
@@ -192,22 +227,23 @@ const Component = () => {
 }
 ```
 
+---
+
 ## Authentication status
 
-### `useAuthLoading`
+### `useAuthenticationStatus`
 
 The Nhost client may need some initial steps to determine the authentication status during startup, like fetching a new JWT from an existing refresh token.
 
-`useAuthLoading` will return `true` until the authentication status is known.
+`isLoading` will return `true` until the authentication status is known.
 
 #### Usage
 
 ```jsx
-import { useAuthLoading, useAuthenticated } from '@nhost/react'
+import { useAuthenticationStatus } from '@nhost/react'
 
 const Component = () => {
-  const isLoading = useAuthLoading()
-  const isAuthenticated = useAuthenticated()
+  const { isLoading, isAuthenticated } = useAuthenticationStatus()
   if (isLoading) return <div>Loading Nhost authentication status...</div>
   else if (isAuthenticated) return <div>User is authenticated</div>
   else return <div>Public section</div>
@@ -216,29 +252,31 @@ const Component = () => {
 
 ### Get the JWT access token
 
-<!-- TODO better documentation -->
+<!-- TODO ellaborate -->
 
 ```js
 const accessToken = useAccessToken()
 ```
 
+---
+
 ## User management
 
 ### Change email
 
 ```js
-const { changeEmail, isLoading, isSuccess, needsVerification, isError, error } =
-  useChangeEmail(email?: string, options?: { redirectTo?: string })
+const { changeEmail, isLoading, isSuccess, needsEmailVerification, isError, error } =
+  useChangeEmail(options?: { redirectTo?: string })
 ```
 
-| Name                | Type                                                          | Notes                                                                                                                                                                                                             |
-| ------------------- | ------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `changeEmail`       | (email?: string) => void                                      | Rrequests the email change. The arguement password will take precedence over the the possible state value used when creating the hook.                                                                            |
-| `isLoading`         | boolean                                                       | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
-| `needsVerification` | boolean                                                       | Returns `true` if the email change has been requested, but that a email has been sent to the user to verify the new email.                                                                                        |
-| `isError`           | boolean                                                       | Returns `true` if an error occurred.                                                                                                                                                                              |
-| `error`             | {status: number, error: string, message: string} \| undefined | Provides details about the error.                                                                                                                                                                                 |
-| `redirectTo`        | string \| undefined                                           | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+| Name                     | Type                                                     | Notes                                                                                                                                                                                                             |
+| ------------------------ | -------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `changeEmail`            | (email?: string) => void                                 | Requests the email change. Returns a promise with the current context                                                                                                                                             |
+| `isLoading`              | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
+| `needsEmailVerification` | boolean                                                  | Returns `true` if the email change has been requested, but that a email has been sent to the user to verify the new email.                                                                                        |
+| `isError`                | boolean                                                  | Returns `true` if an error occurred.                                                                                                                                                                              |
+| `error`                  | {status: number, error: string, message: string} \| null | Provides details about the error.                                                                                                                                                                                 |
+| `redirectTo`             | string \| undefined                                      | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
 
 #### Usage
 
@@ -248,12 +286,12 @@ import { useChangeEmail } from '@nhost/react'
 
 const Component = () => {
   const [email, setEmail] = useState('')
-  const { changeEmail, isLoading, needsVerification, isError, error } = useChangeEmail(password)
+  const { changeEmail, isLoading, needsEmailVerification, isError, error } = useChangeEmail()
   return (
     <div>
       <input value={email} onChange={(event) => setEmail(event.target.value)} />
-      <button onClick={changeEmail}>Change password</button>
-      {needsVerification && (
+      <button onClick={() => changeEmail(email)}>Change email</button>
+      {needsEmailVerification && (
         <div>
           Please check your mailbox and follow the verification link to confirm your new email
         </div>
@@ -266,16 +304,16 @@ const Component = () => {
 ### Change password
 
 ```js
-const { changePassword, isLoading, isSuccess, isError, error } = useChangePassword(password?: string)
+const { changePassword, isLoading, isSuccess, isError, error } = useChangePassword()
 ```
 
-| Name             | Type                                                          | Notes                                                                                                                                    |
-| ---------------- | ------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
-| `changePassword` | (password?: string) => void                                   | Requests the password change. The arguement password will take precedence over the the possible state value used when creating the hook. |
-| `isLoading`      | boolean                                                       | Returns `true` when the action is executing, `false` when it finished its execution.                                                     |
-| `isSuccess`      | boolean                                                       | Returns `true` if the password has beed successfully changed.                                                                            |
-| `isError`        | boolean                                                       | Returns `true` if an error occurred.                                                                                                     |
-| `error`          | {status: number, error: string, message: string} \| undefined | Provides details about the error.                                                                                                        |
+| Name             | Type                                                     | Notes                                                                                |
+| ---------------- | -------------------------------------------------------- | ------------------------------------------------------------------------------------ |
+| `changePassword` | (password?: string)                                      | Requests the password change. Returns a promise with the current context             |
+| `isLoading`      | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution. |
+| `isSuccess`      | boolean                                                  | Returns `true` if the password has beed successfully changed.                        |
+| `isError`        | boolean                                                  | Returns `true` if an error occurred.                                                 |
+| `error`          | {status: number, error: string, message: string} \| null | Provides details about the error.                                                    |
 
 #### Usage
 
@@ -285,11 +323,11 @@ import { useChangePassword } from '@nhost/react'
 
 const Component = () => {
   const [password, setPassword] = useState('')
-  const { changePassword, isLoading, isSuccess, isError, error } = useChangePassword(password)
+  const { changePassword, isLoading, isSuccess, isError, error } = useChangePassword()
   return (
     <div>
       <input value={password} onChange={(event) => setPassword(event.target.value)} />
-      <button onClick={changePassword}>Change password</button>
+      <button onClick={() => changePassword(password)}>Change password</button>
     </div>
   )
 }
@@ -300,17 +338,17 @@ const Component = () => {
 If a user loses their password, we can resend them an email to authenticate so that they can change it to a new one:
 
 ```js
-const { resetPassword, isLoading, isSent, isError, error } = useResetPassword(email?: string, options?: { redirectTo?: string })
+const { resetPassword, isLoading, isSent, isError, error } = useResetPassword(options?: { redirectTo?: string })
 ```
 
-| Name            | Type                                                          | Notes                                                                                                                                                                                                             |
-| --------------- | ------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `resetPassword` | (email?: string) => void                                      | Sends an email with a temporary connection link. The arguement email will take precedence over the the possible state value used when creating the hook.                                                          |
-| `isLoading`     | boolean                                                       | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
-| `isSent`        | boolean                                                       | Returns `true` when the email has been successfully sent.                                                                                                                                                         |
-| `isError`       | boolean                                                       | Returns `true` if an error occurred.                                                                                                                                                                              |
-| `error`         | {status: number, error: string, message: string} \| undefined | Provides details about the error.                                                                                                                                                                                 |
-| `redirectTo`    | string \| undefined                                           | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+| Name            | Type                                                     | Notes                                                                                                                                                                                                             |
+| --------------- | -------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `resetPassword` | (email?: string)                                         | Sends an email with a temporary connection link. Returns a promise with the current context                                                                                                                       |
+| `isLoading`     | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
+| `isSent`        | boolean                                                  | Returns `true` when the email has been successfully sent.                                                                                                                                                         |
+| `isError`       | boolean                                                  | Returns `true` if an error occurred.                                                                                                                                                                              |
+| `error`         | {status: number, error: string, message: string} \| null | Provides details about the error.                                                                                                                                                                                 |
+| `redirectTo`    | string \| undefined                                      | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
 
 #### Usage
 
@@ -319,23 +357,93 @@ import { useState } from 'react'
 import { useResetPassword } from '@nhost/react'
 
 const Component = () => {
-  const [email, setEamil] = useState('')
-  const { resetPassword, isLoading, isSent, isError, error } = useResetPassword(email?: string)
+  const [email, setEmail] = useState('')
+  const { resetPassword, isLoading, isSent, isError, error } = useResetPassword()
   return (
     <div>
       <input value={email} onChange={(event) => setEmail(event.target.value)} />
-      <button onClick={resetPassword}>Send reset link</button>
+      <button onClick={() => resetPassword(email)}>Send reset link</button>
     </div>
   )
 }
 ```
 
-## User data
-
-<!-- TODO document -->
+### Send email verification
 
 ```js
-const userData = useUserData()
+const { sendEmail, isLoading, isSent, isError, error } =
+  useSendVerificationEmail(options?: { redirectTo?: string })
+```
+
+| Name         | Type                                                     | Notes                                                                                                                                                                                                             |
+| ------------ | -------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `sendEmail`  | (email?: string)                                         | Resend the verification email. Returns a promise with the current context                                                                                                                                         |
+| `isLoading`  | boolean                                                  | Returns `true` when the action is executing, `false` when it finished its execution.                                                                                                                              |
+| `isSent`     | boolean                                                  | Returns `true` if the verification email has been sent                                                                                                                                                            |
+| `isError`    | boolean                                                  | Returns `true` if an error occurred.                                                                                                                                                                              |
+| `error`      | {status: number, error: string, message: string} \| null | Provides details about the error.                                                                                                                                                                                 |
+| `redirectTo` | string \| undefined                                      | Redirection path in the client application that will be used in the link in the verification email. For instance, if you want to redirect to `https://myapp.com/success`, the `redirectTo` value is `'/success'`. |
+
+#### Usage
+
+```jsx
+import { useState } from 'react'
+import { useSendVerificationEmail } from '@nhost/react'
+
+const Component = () => {
+  const [email, setEmail] = useState('')
+  const { sendEmail, isLoading, isSent, isError, error } = useSendVerificationEmail()
+  return (
+    <div>
+      <input value={email} onChange={(event) => setEmail(event.target.value)} />
+      <button onClick={() => sendEmail(email)}>Send email verification</button>
+      {isSent && (
+        <div>Please check your mailbox and follow the verification link to confirm your email</div>
+      )}
+    </div>
+  )
+}
+```
+
+---
+
+## User data
+
+```js
+const { id, email, displayName, avatarUrl, isAnonymous, locale, defaultRole, roles, metadata, createdAt }  = useUserData()
+```
+
+| Name          | Type          | Default          | Notes                                                  |
+| ------------- | ------------- | ---------------- | ------------------------------------------------------ |
+| `id`          | string        |                  | User's unique identifier (uuid)                        |
+| `email`       | string        |                  | User's email address                                   |
+| `displayName` | string        | `""`             | User's display name                                    |
+| `avatarUrl`   | string        | `""`             | The URL to the user's profile picture                  |
+| `isAnonymous` | boolean       | `false`          | Whether or not the user is anonymous                   |
+| `locale`      | string        | `"en"`           | A two-characters locale                                |
+| `defaultRole` | string        | `"user"`         | The default role of the user                           |
+| `roles`       | string[]      | `["me", "user"]` | The roles assigned to the user                         |
+| `metadata`    | JSON object   | `null`           | Additional attributes used for user information        |
+| `createdAt`   | string        |                  | The date-time when the user has been created           |
+
+Example of an authenticated user:
+
+```json
+{
+  "avatarUrl": "https://s.gravatar.com/avatar/3020737ed9d932c6665111a5550454d2?r=g&default=blank",
+  "createdAt": "2022-04-11T16:33:14.780439+00:00",
+  "defaultRole": "user",
+  "displayName": "Grégory D'Angelo",
+  "email": "greg@nhost.io",
+  "id": "05e054c7-a722-42e7-90a6-3f77a2f118c8",
+  "isAnonymous": false,
+  "locale": "en",
+  "metadata": {
+    "lastName": "D'Angelo",
+    "firstName": "Grégory"
+  },
+  "roles": ["user", "me"]
+}
 ```
 
 ### Avatar
@@ -368,7 +476,7 @@ const Avatar = () => {
 ### Display name
 
 ```jsx
-import { displayName } from '@nhost/react'
+import { useDisplayName } from '@nhost/react'
 
 const Avatar = () => {
   const displayName = useDisplayName()

docs/content/docs/reference/react/index.mdx

@@ -16,43 +16,53 @@ With Npm:
 npm install @nhost/react
 ```
 
+---
+
 ## Configuration
 
-`@nhost/react` exports a React provider `NhostProvider` that makes the authentication state and the several hooks available in your application. Wrap this component around your whole App.
+`@nhost/react` exports a React provider `NhostReactProvider` that makes the authentication state and the several hooks available in your application. Wrap this component around your whole App.
 
 ```jsx
 import React from 'react'
 import ReactDOM from 'react-dom'
 
-import { NhostProvider } from '@nhost/react'
-import { Nhost } from '@nhost/client'
+import { NhostClient, NhostReactProvider } from '@nhost/react'
 
 import App from './App'
 
-const nhost = new Nhost({
+const nhost = new NhostClient({
   backendUrl: 'http://localhost:1337'
 })
 
 ReactDOM.render(
   <React.StrictMode>
-    <NhostProvider nhost={nhost}>
+    <NhostReactProvider nhost={nhost}>
       <App />
-    </NhostProvider>
+    </NhostReactProvider>
   </React.StrictMode>,
   document.getElementById('root')
 )
 ```
 
+---
+
 ### Options
 
 ```js
-const nhost = new Nhost({ backendUrl, autoSignIn, autoRefreshToken, storageGetter, storageSetter })
+const nhost = new NhostClient({
+  backendUrl,
+  autoLogin,
+  autoRefreshToken,
+  clientStorageGetter,
+  clientStorageSetter
+})
 ```
 
-| Name               | Type                                | Default          | Notes                                                                                                                                                                                                                                          |
-| ------------------ | ----------------------------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `backendUrl`       | string                              |                  | The Nhost app url, for instance `https://my-app.nhost.run`. When using the CLI, its value is `http://localhost:1337`                                                                                                                           |
-| `autoSignIn`       | boolean                             | `true`           | If set to `true`, the client will detect credentials in the current URL that could have been sent during an email verification or an Oauth authentication. It will also automatically authenticate all the active tabs in the current browser. |
-| `autoRefreshToken` | boolean                             | `true`           | If set to `true`, the JWT (access token) will be automatically refreshed before it expires.                                                                                                                                                    |
-| `storageGetter`    | (key:string) => string \| null      | use localStorage | Nhost stores a refresh token in `localStorage` so the session can be restored when starting the browser.                                                                                                                                       |
-| `storageSetter`    | (key: string, value: string \| null | use localStorage |                                                                                                                                                                                                                                                |
+| Name                  | Type                                | Default          | Notes                                                                                                                                                                                                                                          |
+| --------------------- | ----------------------------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `backendUrl`          | string                              |                  | The Nhost app url, for instance `https://my-app.nhost.run`. When using the CLI, its value is `http://localhost:1337`                                                                                                                           |
+| `autoLogin`           | boolean                             | `true`           | If set to `true`, the client will detect credentials in the current URL that could have been sent during an email verification or an Oauth authentication. It will also automatically authenticate all the active tabs in the current browser. |
+| `autoRefreshToken`    | boolean                             | `true`           | If set to `true`, the JWT (access token) will be automatically refreshed before it expires.                                                                                                                                                    |
+| `clientStorageGetter` | (key:string) => string \| null      | use localStorage | Nhost stores a refresh token in `localStorage` so the session can be restored when starting the browser.                                                                                                                                       |
+| `clientStorageSetter` | (key: string, value: string \| null | use localStorage |                                                                                                                                                                                                                                                |
+| `refreshIntervalTime` |                                     |                  |

docs/content/docs/reference/react/protecting-routes.mdx

@@ -4,41 +4,67 @@ title: 'Protecting routes'
 
 ## React Router
 
-You can protect routes by creating an `AuthGate` component when using `@nhost/react` with [React Router](https://reactrouter.com/web/guides/quick-start).
+> This example uses the latest version of [React Router (v6)](https://reactrouter.com/docs/en/v6).
+
+You can protect routes by creating a wrapper component, `ProtectedRoute`, to implement the authentication logic using `@nhost/react`.
 
 ```jsx
-import { Redirect } from 'react-router-dom'
-import { useAuthLoading, useAuthenticated } from '@nhost/react'
+// src/components/ProtectedRoute.js
 
-export function AuthGate(children) {
-  const isLoading = useAuthLoading()
-  const isAuthenticated = useAuthenticated()
+import { useAuthenticationStatus } from '@nhost/react';
+import { Navigate, Outlet, useLocation } from 'react-router-dom';
+
+const ProtectedRoute = () => {
+  const { isAuthenticated, isLoading } = useAuthenticationStatus();
+  const location = useLocation();
 
   if (isLoading) {
-    return <div>Loading...</div>
+    return <div>Loading...</div>;
   }
 
   if (!isAuthenticated) {
-    return <Redirect to="/login" />
+    return <Navigate to="/login" />;
   }
 
-  return children
-}
+  return <Outlet />;
+};
+
+export default ProtectedRoute;
 ```
 
-Then, in your React Router, wrap the `AuthGate` component around the routes you want to protect:
+So, if the user is not authenticated, we redirect him to the `/login` route using the [`Navigate`](https://reactrouter.com/docs/en/v6/api#navigate) component from React Router. Otherwise, we render the [`Outlet`](https://reactrouter.com/docs/en/v6/api#outlet) component, also provided by React Router, to render the `ProtectedRoute` child route elements.
+
+Then, in your `App.js` file, you can use a [layout route](https://reactrouter.com/docs/en/v6/getting-started/concepts#layout-route) to wrap the `ProtectedRoute` component around the routes you want to protect:
 
 ```jsx
-<Router>
-  <Switch>
-    <Route path="/login">
-      <Login />
-    </Route>
-    <Route path="/" exact>
-      <AuthGate> // <--- Use AuthGate component like this
-        <div>My protected dashboard</div>
-      </AuthGate>
-    </Route>
-  </Switch>
-</Router>
+// src/App.js
+
+import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import { NhostReactProvider } from '@nhost/react';
+
+import ProtectedRoute from './components/ProtectedRoute';
+
+import Home from './pages/Home';
+import Login from './pages/Login';
+import Dashboard from './pages/Dashboard';
+import Profile from './pages/Profile';
+
+import { nhost } from './lib/nhost';
+
+export function App() {
+  return (
+    <NhostReactProvider nhost={nhost}>
+      <BrowserRouter>
+        <Routes>
+          <Route path="/" element={<Home />} />
+          <Route path="/login" element={<Login />} />
+          <Route path="/dashboard" element={<ProtectedRoute />}>
+            <Route index element={<Dashboard />} />
+            <Route path="profile" element={<Profile />} />
+          </Route>
+        </Routes>
+      </BrowserRouter>
+    </NhostReactProvider>
+  );
+}
 ```

docs/lib/order.ts

@@ -2,12 +2,29 @@ export const orderTwo = {
   'get-started': {
     'quick-start': ['index', 'schema', 'javascript-client', 'permissions'],
     authentication: ['index'],
-    'cli-workflow': ['index', 'workflow-setup', 'install-cli', 'local-changes', 'metadata-and-serverless-functions'],
+    'cli-workflow': [
+      'index',
+      'workflow-setup',
+      'install-cli',
+      'local-changes',
+      'metadata-and-serverless-functions'
+    ],
     upgrade: ['index']
   },
   platform: {
     database: ['index', 'permissions', 'graphql'],
-    authentication: ['index', 'user-management', 'sign-in-methods', 'social-login', 'email-templates'],
+    authentication: [
+      'index',
+      'user-management',
+      'sign-in-methods',
+      'social-sign-in',
+      'sign-in-with-google',
+      'sign-in-with-github',
+      'sign-in-with-facebook',
+      'sign-in-with-linkedin',
+      'sign-in-with-spotify',
+      'email-templates'
+    ],
     storage: ['index'],
     'serverless-functions': ['index', 'event-triggers'],
     nhost: ['index', 'environment-variables', 'github-integration', 'local-development']
@@ -16,6 +33,7 @@ export const orderTwo = {
     sdk: ['index', 'graphql', 'authentication', 'storage', 'functions'],
     react: ['index', 'hooks', 'protecting-routes', 'apollo'],
     nextjs: ['index', 'configuration', 'protecting-routes', ],
-    cli: ['index']
+    cli: ['index'],
+    'hasura-auth': ['index', 'installation', 'configuration', 'environment-variables', 'schema', 'api-reference']
   }
 }

docs/next.config.js

@@ -15,6 +15,11 @@ module.exports = {
         source: '/reference/sdk/javascript-sdk',
         destination: '/reference/sdk',
         permanent: false
+      },
+      {
+        source: '/platform/authentication/social-login',
+        destination: '/platform/authentication/social-sign-in',
+        permanent: false
       }
     ]
   }

docs/package.json

@@ -2,7 +2,6 @@
   "name": "nhost-documentation",
   "private": true,
   "version": "0.0.1",
-
   "scripts": {
     "dev": "next",
     "build:next": "next build",
@@ -34,9 +33,11 @@
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-merge-refs": "^1.1.0",
-    "react-syntax-highlighter": "^15.4.5"
+    "react-syntax-highlighter": "^15.4.5",
+    "swagger-ui-react": "^4.5.2"
   },
   "devDependencies": {
+    "@types/node": "^17.0.21",
     "@types/react": "^17.0.37",
     "autoprefixer": "^10.4.0",
     "next-sitemap": "^1.6.203",

docs/public/sitemap.xml

@@ -1,46 +1,57 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
-<url><loc>https://docs.nhost.io</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/cli-workflow</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/quick-start</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/upgrade</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/database</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/nhost</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/serverless-functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/storage</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/cli</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/nextjs</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/react</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/sdk</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/supporting-libraries</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/cli-workflow/install-cli</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/cli-workflow/local-changes</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/cli-workflow/metadata-and-serverless-functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/cli-workflow/workflow-setup</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/quick-start/javascript-client</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/quick-start/permissions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/get-started/quick-start/schema</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/authentication/sign-in-methods</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/authentication/social-login</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/authentication/user-management</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/database/graphql</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/database/permissions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/nhost/environment-variables</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/nhost/github-integration</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/nhost/local-development</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/platform/serverless-functions/event-triggers</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/nextjs/server-side</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/react/apollo</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/react/hooks</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/sdk/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/sdk/functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/sdk/graphql</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/sdk/storage</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/supporting-libraries/react-apollo</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
-<url><loc>https://docs.nhost.io/reference/supporting-libraries/react-auth</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-02-21T10:17:26.089Z</lastmod></url>
+<url><loc>https://docs.nhost.io</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/cli-workflow</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/quick-start</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/upgrade</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/database</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/nhost</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/serverless-functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/storage</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/cli</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/nextjs</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.648Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/react</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/sdk</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/cli-workflow/install-cli</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/cli-workflow/local-changes</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/cli-workflow/metadata-and-serverless-functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/cli-workflow/workflow-setup</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/quick-start/javascript-client</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/quick-start/permissions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/get-started/quick-start/schema</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/email-templates</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-methods</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-with-facebook</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-with-github</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-with-google</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-with-linkedin</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/sign-in-with-spotify</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/social-sign-in</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/authentication/user-management</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/database/graphql</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/database/permissions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/nhost/environment-variables</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/nhost/github-integration</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/nhost/local-development</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/platform/serverless-functions/event-triggers</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth/api-reference</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth/configuration</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth/environment-variables</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth/installation</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/hasura-auth/schema</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/nextjs/configuration</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/nextjs/protecting-routes</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/react/apollo</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/react/hooks</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/react/protecting-routes</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/sdk/authentication</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/sdk/functions</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/sdk/graphql</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
+<url><loc>https://docs.nhost.io/reference/sdk/storage</loc><changefreq>daily</changefreq><priority>0.7</priority><lastmod>2022-04-08T13:10:11.649Z</lastmod></url>
 </urlset>

examples/nextjs/.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ["next/babel"],
-  "plugins": []
-}

examples/nextjs/.gitignore

@@ -35,3 +35,4 @@ yarn-error.log*
 
 # typescript
 *.tsbuildinfo
+.nhost

examples/nextjs/CHANGELOG.md

@@ -4,12 +4,6 @@
 
 ### Patch Changes
 
-- Updated dependencies [207ae38]
-- Updated dependencies [207ae38]
-- Updated dependencies [207ae38]
-- Updated dependencies [207ae38]
-- Updated dependencies [207ae38]
-- Updated dependencies [207ae38]
 - Updated dependencies [207ae38]
   - @nhost/react-apollo@3.0.0
   - @nhost/apollo@0.2.0

examples/nextjs/README.md

@@ -1,34 +1,25 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+## Nhost & Next.js example (WIP)
 
-## Getting Started
+This demo is a work in progress, further improvements are to come
 
-First, run the development server:
+### Installation
 
-```bash
-npm run dev
-# or
+First, clone this repo. Then run the commands:
+
+```sh
+cd examples/nextjs
+yarn
 yarn dev
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+If you want to use this demo with your own cloud instance:
 
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+- modify the `BACKEND_URL` value in `src/helpers/index.ts`
+- don't forget to change the client URL in the Nhost console so email verification will work: `Users -> Login Settings -> Client login URLs`: `http://localhost:4000`
 
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+If you want to use a local Nhost instance, start the CLI in parallel to Nextjs:
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
-
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
-
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+```sh
+# Inside examples/nextjs
+nhost -d
+```

examples/nextjs/components/Header.tsx

@@ -7,7 +7,8 @@ export default function Header() {
       <nav>
         <Link href="/">Index</Link> <br />
         <Link href="/second">Second</Link> <br />
-        <Link href="/third">Third</Link> <br />
+        <Link href="/third">SSR auth-guarded page</Link> <br />
+        <Link href="/client-side-auth-guard">CSR auth-guarded page</Link> <br />
       </nav>
     </header>
   )

examples/nextjs/components/protected-route.tsx

@@ -0,0 +1,21 @@
+import { useRouter } from 'next/router'
+
+import { useAuthenticationStatus } from '@nhost/nextjs'
+
+export function authProtected(Comp) {
+  return function AuthProtected(props) {
+    const router = useRouter()
+    const { isLoading, isAuthenticated } = useAuthenticationStatus()
+    console.log('Authentication guard: check auth status', { isLoading, isAuthenticated })
+    if (isLoading) {
+      return <div>Loading...</div>
+    }
+
+    if (!isAuthenticated) {
+      router.push('/')
+      return null
+    }
+
+    return <Comp {...props} />
+  }
+}

examples/nextjs/helpers/queries.ts

@@ -1,18 +1,10 @@
 import { gql } from '@apollo/client'
 
-export const QUERY = gql`
-  query MyQuery {
-    test {
+export const BOOKS_QUERY = gql`
+  query BookQuery {
+    books {
       id
-    }
-  }
-`
-
-export const QUERY_INDEX = gql`
-  query MyQuery {
-    test {
-      id
-      bidon
+      title
     }
   }
 `

examples/nextjs/next.config.js

@@ -1,28 +0,0 @@
-/** @type {import('next').NextConfig} */
-// * Only required to make it work with the monorepo. Is not required otherwise
-const nextConfig = {
-  reactStrictMode: true,
-  typescript: {
-    ignoreBuildErrors: true
-  },
-  eslint: {
-    ignoreDuringBuilds: true
-  },
-  webpack: (config, { isServer }) => {
-    if (isServer) {
-      // * Related to monorepo and the use of ws in @nhost/apollo
-      config.resolve.fallback = { bufferutil: false, 'utf-8-validate': false }
-    }
-    return config
-  }
-}
-
-const withTM = require('next-transpile-modules')(
-  ['@nhost/client', '@nhost/react', '@nhost/react-apollo', '@nhost/apollo', '@nhost/nextjs'],
-  {
-    // resolveSymlinks: true
-    // debug: true
-  }
-) // pass the modules you would like to see transpiled
-
-module.exports = withTM(nextConfig)

examples/nextjs/nhost/config.yaml

@@ -0,0 +1,133 @@
+metadata_directory: metadata
+services:
+  mailhog:
+    port: 8025
+  hasura:
+    version: v2.2.0
+    environment:
+      hasura_graphql_enable_remote_schema_permissions: false
+  auth:
+    version: 0.4.2
+auth:
+  access_control:
+    email:
+      allowed_email_domains: ''
+      allowed_emails: ''
+      blocked_email_domains: ''
+      blocked_emails: ''
+    url:
+      allowed_redirect_urls: ''
+  anonymous_users_enabled: false
+  client_url: http://localhost:3000
+  disable_new_users: false
+  email:
+    passwordless:
+      enabled: true
+    template_fetch_url: ''
+  gravatar:
+    default: ''
+    enabled: true
+    rating: ''
+  locale:
+    allowed: en
+    default: en
+  password:
+    hibp_enabled: false
+    min_length: 3
+  provider:
+    apple:
+      client_id: ''
+      enabled: false
+      key_id: ''
+      private_key: ''
+      scope: name,email
+      team_id: ''
+    bitbucket:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+    facebook:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: email,photos,displayName
+    github:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: user:email
+      token_url: ''
+      user_profile_url: ''
+    gitlab:
+      base_url: ''
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: read_user
+    google:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: email,profile
+    linkedin:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: r_emailaddress,r_liteprofile
+    spotify:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: user-read-email,user-read-private
+    strava:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+    twilio:
+      account_sid: ''
+      auth_token: ''
+      enabled: false
+      messaging_service_id: ''
+    twitter:
+      consumer_key: ''
+      consumer_secret: ''
+      enabled: false
+    windows_live:
+      client_id: ''
+      client_secret: ''
+      enabled: false
+      scope: wl.basic,wl.emails,wl.contacts_emails
+  sms:
+    enabled: false
+    passwordless:
+      enabled: false
+    provider:
+      twilio:
+        account_sid: ''
+        auth_token: ''
+        from: ''
+        messaging_service_id: ''
+  smtp:
+    host: nhost_mailhog
+    method: ''
+    pass: password
+    port: 1807
+    secure: false
+    sender: hasura-auth@example.com
+    user: user
+  token:
+    access:
+      expires_in: 900
+    refresh:
+      expires_in: 43200
+  user:
+    allowed_roles: user,me
+    default_allowed_roles: user,me
+    default_role: user
+    mfa:
+      enabled: false
+      issuer: nhost
+    signin_email_verified_required: true
+storage:
+  force_download_for_content_types: text/html,application/javascript
+version: 3

examples/nextjs/nhost/emails/en/email-confirm-change/body.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Confirm Email Change</h2>
+    <p>Use this link to confirm changing email:</p>
+    <p>
+      <a
+        href="${serverUrl}/verify?&ticket=${ticket}&type=emailConfirmChange&redirectTo=${redirectTo}"
+      >
+        Change email
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/en/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Change your email address

examples/nextjs/nhost/emails/en/email-verify/body.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Verify Email</h2>
+    <p>Use this link to verify your email:</p>
+    <p>
+      <a href="${serverUrl}/verify?&ticket=${ticket}&type=emailVerify&redirectTo=${redirectTo}">
+        Verify Email
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/en/email-verify/subject.txt

@@ -0,0 +1 @@
+Verify your email

examples/nextjs/nhost/emails/en/password-reset/body.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Reset Password</h2>
+    <p>Use this link to reset your password:</p>
+    <p>
+      <a href="${serverUrl}/verify?&ticket=${ticket}&type=passwordReset&redirectTo=${redirectTo}">
+        Reset password
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/en/password-reset/subject.txt

@@ -0,0 +1 @@
+Reset your password

examples/nextjs/nhost/emails/en/signin-passwordless/body.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Magic Link</h2>
+    <p>Use this link to securely sign in:</p>
+    <p>
+      <a
+        href="${serverUrl}/verify?&ticket=${ticket}&type=signinPasswordless&redirectTo=${redirectTo}"
+      >
+        Sign In
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/en/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Secure sign-in link

examples/nextjs/nhost/emails/fr/email-confirm-change/body.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Confirmer changement de courriel</h2>
+    <p>Utilisez ce lien pour confirmer le changement de courriel:</p>
+    <p>
+      <a
+        href="${serverUrl}/verify?&ticket=${ticket}&type=emailConfirmChange&redirectTo=${redirectTo}"
+      >
+        Changer courriel
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/fr/email-confirm-change/subject.txt

@@ -0,0 +1 @@
+Changez votre adresse courriel

examples/nextjs/nhost/emails/fr/email-verify/body.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>V&eacute;rifiez votre courriel</h2>
+    <p>Utilisez ce lien pour v&eacute;rifier votre courriel:</p>
+    <p>
+      <a href="${serverUrl}/verify?&ticket=${ticket}&type=emailVerify&redirectTo=${redirectTo}">
+        V&eacute;rifier courriel
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/fr/email-verify/subject.txt

@@ -0,0 +1 @@
+Vérifier votre courriel

examples/nextjs/nhost/emails/fr/password-reset/body.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>R&eacute;initializer votre mot de passe</h2>
+    <p>Utilisez ce lien pour r&eacute;initializer votre mot de passe:</p>
+    <p>
+      <a href="${serverUrl}/verify?&ticket=${ticket}&type=passwordReset&redirectTo=${redirectTo}">
+        R&eacute;initializer mot de passe
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/fr/password-reset/subject.txt

@@ -0,0 +1 @@
+Réinitialiser votre mot de passe

examples/nextjs/nhost/emails/fr/signin-passwordless/body.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+    <h2>Lien magique</h2>
+    <p>Utilisez ce lien pour vous connecter de fa&ccedil;on s&eacute;curitaire:</p>
+    <p>
+      <a
+        href="${serverUrl}/verify?&ticket=${ticket}&type=signinPasswordless&redirectTo=${redirectTo}"
+      >
+        Connexion
+      </a>
+    </p>
+  </body>
+</html>

examples/nextjs/nhost/emails/fr/signin-passwordless/subject.txt

@@ -0,0 +1 @@
+Lien de connexion sécurisé

examples/nextjs/nhost/metadata/actions.yaml

@@ -0,0 +1,6 @@
+actions: []
+custom_types:
+  enums: []
+  input_objects: []
+  objects: []
+  scalars: []

examples/nextjs/nhost/metadata/allow_list.yaml

@@ -0,0 +1 @@
+[]

examples/nextjs/nhost/metadata/cron_triggers.yaml

@@ -0,0 +1 @@
+[]

examples/nextjs/nhost/metadata/databases/databases.yaml

@@ -0,0 +1,14 @@
+- name: default
+  kind: postgres
+  configuration:
+    connection_info:
+      database_url:
+        from_env: HASURA_GRAPHQL_DATABASE_URL
+      isolation_level: read-committed
+      pool_settings:
+        connection_lifetime: 600
+        idle_timeout: 180
+        max_connections: 50
+        retries: 20
+      use_prepared_statements: true
+  tables: "!include default/tables/tables.yaml"

examples/nextjs/nhost/metadata/databases/default/tables/auth_provider_requests.yaml

@@ -0,0 +1,17 @@
+table:
+  name: provider_requests
+  schema: auth
+configuration:
+  custom_column_names:
+    id: id
+  custom_name: authProviderRequests
+  custom_root_fields:
+    delete: deleteAuthProviderRequests
+    delete_by_pk: deleteAuthProviderRequest
+    insert: insertAuthProviderRequests
+    insert_one: insertAuthProviderRequest
+    select: authProviderRequests
+    select_aggregate: authProviderRequestsAggregate
+    select_by_pk: authProviderRequest
+    update: updateAuthProviderRequests
+    update_by_pk: updateAuthProviderRequest

examples/nextjs/nhost/metadata/databases/default/tables/auth_providers.yaml

@@ -0,0 +1,25 @@
+table:
+  name: providers
+  schema: auth
+configuration:
+  custom_column_names:
+    id: id
+  custom_name: authProviders
+  custom_root_fields:
+    delete: deleteAuthProviders
+    delete_by_pk: deleteAuthProvider
+    insert: insertAuthProviders
+    insert_one: insertAuthProvider
+    select: authProviders
+    select_aggregate: authProvidersAggregate
+    select_by_pk: authProvider
+    update: updateAuthProviders
+    update_by_pk: updateAuthProvider
+array_relationships:
+- name: userProviders
+  using:
+    foreign_key_constraint_on:
+      column: provider_id
+      table:
+        name: user_providers
+        schema: auth

examples/nextjs/nhost/metadata/databases/default/tables/auth_refresh_tokens.yaml

@@ -0,0 +1,24 @@
+table:
+  name: refresh_tokens
+  schema: auth
+configuration:
+  custom_column_names:
+    created_at: createdAt
+    expires_at: expiresAt
+    refresh_token: refreshToken
+    user_id: userId
+  custom_name: authRefreshTokens
+  custom_root_fields:
+    delete: deleteAuthRefreshTokens
+    delete_by_pk: deleteAuthRefreshToken
+    insert: insertAuthRefreshTokens
+    insert_one: insertAuthRefreshToken
+    select: authRefreshTokens
+    select_aggregate: authRefreshTokensAggregate
+    select_by_pk: authRefreshToken
+    update: updateAuthRefreshTokens
+    update_by_pk: updateAuthRefreshToken
+object_relationships:
+- name: user
+  using:
+    foreign_key_constraint_on: user_id

examples/nextjs/nhost/metadata/databases/default/tables/auth_roles.yaml

@@ -0,0 +1,32 @@
+table:
+  name: roles
+  schema: auth
+configuration:
+  custom_column_names:
+    role: role
+  custom_name: authRoles
+  custom_root_fields:
+    delete: deleteAuthRoles
+    delete_by_pk: deleteAuthRole
+    insert: insertAuthRoles
+    insert_one: insertAuthRole
+    select: authRoles
+    select_aggregate: authRolesAggregate
+    select_by_pk: authRole
+    update: updateAuthRoles
+    update_by_pk: updateAuthRole
+array_relationships:
+- name: userRoles
+  using:
+    foreign_key_constraint_on:
+      column: role
+      table:
+        name: user_roles
+        schema: auth
+- name: usersByDefaultRole
+  using:
+    foreign_key_constraint_on:
+      column: default_role
+      table:
+        name: users
+        schema: auth

examples/nextjs/nhost/metadata/databases/default/tables/auth_user_providers.yaml

@@ -0,0 +1,31 @@
+table:
+  name: user_providers
+  schema: auth
+configuration:
+  custom_column_names:
+    access_token: accessToken
+    created_at: createdAt
+    id: id
+    provider_id: providerId
+    provider_user_id: providerUserId
+    refresh_token: refreshToken
+    updated_at: updatedAt
+    user_id: userId
+  custom_name: authUserProviders
+  custom_root_fields:
+    delete: deleteAuthUserProviders
+    delete_by_pk: deleteAuthUserProvider
+    insert: insertAuthUserProviders
+    insert_one: insertAuthUserProvider
+    select: authUserProviders
+    select_aggregate: authUserProvidersAggregate
+    select_by_pk: authUserProvider
+    update: updateAuthUserProviders
+    update_by_pk: updateAuthUserProvider
+object_relationships:
+- name: provider
+  using:
+    foreign_key_constraint_on: provider_id
+- name: user
+  using:
+    foreign_key_constraint_on: user_id

examples/nextjs/nhost/metadata/databases/default/tables/auth_user_roles.yaml

@@ -0,0 +1,27 @@
+table:
+  name: user_roles
+  schema: auth
+configuration:
+  custom_column_names:
+    created_at: createdAt
+    id: id
+    role: role
+    user_id: userId
+  custom_name: authUserRoles
+  custom_root_fields:
+    delete: deleteAuthUserRoles
+    delete_by_pk: deleteAuthUserRole
+    insert: insertAuthUserRoles
+    insert_one: insertAuthUserRole
+    select: authUserRoles
+    select_aggregate: authUserRolesAggregate
+    select_by_pk: authUserRole
+    update: updateAuthUserRoles
+    update_by_pk: updateAuthUserRole
+object_relationships:
+- name: roleByRole
+  using:
+    foreign_key_constraint_on: role
+- name: user
+  using:
+    foreign_key_constraint_on: user_id

examples/nextjs/nhost/metadata/databases/default/tables/auth_users.yaml

@@ -0,0 +1,65 @@
+table:
+  name: users
+  schema: auth
+configuration:
+  custom_column_names:
+    active_mfa_type: activeMfaType
+    avatar_url: avatarUrl
+    created_at: createdAt
+    default_role: defaultRole
+    disabled: disabled
+    display_name: displayName
+    email: email
+    email_verified: emailVerified
+    id: id
+    is_anonymous: isAnonymous
+    last_seen: lastSeen
+    locale: locale
+    new_email: newEmail
+    otp_hash: otpHash
+    otp_hash_expires_at: otpHashExpiresAt
+    otp_method_last_used: otpMethodLastUsed
+    password_hash: passwordHash
+    phone_number: phoneNumber
+    phone_number_verified: phoneNumberVerified
+    ticket: ticket
+    ticket_expires_at: ticketExpiresAt
+    totp_secret: totpSecret
+    updated_at: updatedAt
+  custom_name: users
+  custom_root_fields:
+    delete: deleteUsers
+    delete_by_pk: deleteUser
+    insert: insertUsers
+    insert_one: insertUser
+    select: users
+    select_aggregate: userAggregate
+    select_by_pk: user
+    update: updateUsers
+    update_by_pk: updateUser
+object_relationships:
+- name: defaultRoleByRole
+  using:
+    foreign_key_constraint_on: default_role
+array_relationships:
+- name: refreshTokens
+  using:
+    foreign_key_constraint_on:
+      column: user_id
+      table:
+        name: refresh_tokens
+        schema: auth
+- name: roles
+  using:
+    foreign_key_constraint_on:
+      column: user_id
+      table:
+        name: user_roles
+        schema: auth
+- name: userProviders
+  using:
+    foreign_key_constraint_on:
+      column: user_id
+      table:
+        name: user_providers
+        schema: auth

examples/nextjs/nhost/metadata/databases/default/tables/public_books.yaml

@@ -0,0 +1,10 @@
+table:
+  name: books
+  schema: public
+select_permissions:
+- permission:
+    columns:
+    - id
+    - title
+    filter: {}
+  role: user

examples/nextjs/nhost/metadata/databases/default/tables/public_test.yaml

@@ -0,0 +1,10 @@
+table:
+  name: test
+  schema: public
+select_permissions:
+- permission:
+    columns:
+    - bidon
+    - id
+    filter: {}
+  role: user

examples/nextjs/nhost/metadata/databases/default/tables/storage_buckets.yaml

@@ -0,0 +1,32 @@
+table:
+  name: buckets
+  schema: storage
+configuration:
+  custom_column_names:
+    cache_control: cacheControl
+    created_at: createdAt
+    download_expiration: downloadExpiration
+    id: id
+    max_upload_file_size: maxUploadFileSize
+    min_upload_file_size: minUploadFileSize
+    presigned_urls_enabled: presignedUrlsEnabled
+    updated_at: updatedAt
+  custom_name: buckets
+  custom_root_fields:
+    delete: deleteBuckets
+    delete_by_pk: deleteBucket
+    insert: insertBuckets
+    insert_one: insertBucket
+    select: buckets
+    select_aggregate: bucketsAggregate
+    select_by_pk: bucket
+    update: updateBuckets
+    update_by_pk: updateBucket
+array_relationships:
+- name: files
+  using:
+    foreign_key_constraint_on:
+      column: bucket_id
+      table:
+        name: files
+        schema: storage

examples/nextjs/nhost/metadata/databases/default/tables/storage_files.yaml

@@ -0,0 +1,30 @@
+table:
+  name: files
+  schema: storage
+configuration:
+  custom_column_names:
+    bucket_id: bucketId
+    created_at: createdAt
+    etag: etag
+    id: id
+    is_uploaded: isUploaded
+    mime_type: mimeType
+    name: name
+    size: size
+    updated_at: updatedAt
+    uploaded_by_user_id: uploadedByUserId
+  custom_name: files
+  custom_root_fields:
+    delete: deleteFiles
+    delete_by_pk: deleteFile
+    insert: insertFiles
+    insert_one: insertFile
+    select: files
+    select_aggregate: filesAggregate
+    select_by_pk: file
+    update: updateFiles
+    update_by_pk: updateFile
+object_relationships:
+- name: bucket
+  using:
+    foreign_key_constraint_on: bucket_id

examples/nextjs/nhost/metadata/databases/default/tables/tables.yaml

@@ -0,0 +1,10 @@
+- "!include auth_provider_requests.yaml"
+- "!include auth_providers.yaml"
+- "!include auth_refresh_tokens.yaml"
+- "!include auth_roles.yaml"
+- "!include auth_user_providers.yaml"
+- "!include auth_user_roles.yaml"
+- "!include auth_users.yaml"
+- "!include public_books.yaml"
+- "!include storage_buckets.yaml"
+- "!include storage_files.yaml"

examples/nextjs/nhost/metadata/query_collections.yaml

@@ -0,0 +1 @@
+[]

examples/nextjs/nhost/metadata/remote_schemas.yaml

@@ -0,0 +1 @@
+[]

examples/nextjs/nhost/metadata/rest_endpoints.yaml

@@ -0,0 +1 @@
+[]

examples/nextjs/nhost/metadata/version.yaml

@@ -0,0 +1 @@
+version: 3

examples/nextjs/nhost/migrations/default/1644527455723_create_table_public_test/down.sql

@@ -0,0 +1 @@
+DROP TABLE "public"."test";

examples/nextjs/nhost/migrations/default/1644527455723_create_table_public_test/up.sql

@@ -0,0 +1,2 @@
+CREATE TABLE "public"."test" ("id" uuid NOT NULL DEFAULT gen_random_uuid(), PRIMARY KEY ("id") );
+CREATE EXTENSION IF NOT EXISTS pgcrypto;

examples/nextjs/nhost/migrations/default/1644588996374_alter_table_public_test_add_column_bidon/down.sql

@@ -0,0 +1,4 @@
+-- Could not auto-generate a down migration.
+-- Please write an appropriate down migration for the SQL below:
+-- alter table "public"."test" add column "bidon" text
+--  null;

examples/nextjs/nhost/migrations/default/1644588996374_alter_table_public_test_add_column_bidon/up.sql

@@ -0,0 +1,2 @@
+alter table "public"."test" add column "bidon" text
+ null;

examples/nextjs/nhost/migrations/default/1646492179832_drop_table_public_test/down.sql

@@ -0,0 +1,3 @@
+-- Could not auto-generate a down migration.
+-- Please write an appropriate down migration for the SQL below:
+-- DROP table "public"."test";