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

chore: update versions

README.md

@@ -412,6 +412,13 @@ Here are some ways of contributing to making Nhost better:
             <sub><b>Tapas Adhikary</b></sub>
         </a>
     </td>
+    <td align="center">
+        <a href="https://github.com/uulwake">
+            <img src="https://avatars.githubusercontent.com/u/22399181?v=4" width="100;" alt="uulwake"/>
+            <br />
+            <sub><b>Ulrich Wake</b></sub>
+        </a>
+    </td>
     <td align="center">
         <a href="https://github.com/komninoschat">
             <img src="https://avatars.githubusercontent.com/u/29049104?v=4" width="100;" alt="komninoschat"/>

docs/docs/platform/cli.mdx

@@ -81,6 +81,18 @@ nhost up
 
 Hasura Console starts automatically and your Nhost app is running locally with the backend URL: `http://localhost:1337`.
 
+## Subdomain and Region
+
+Use `localhost:1337` as the `subdomain`, and skip `region` when using the CLI and the [JavaScript SDK](/reference/javascript):
+
+```
+import { NhostClient } from '@nhost/nhost-js'
+
+const nhost = new NhostClient({
+  subdomain: 'localhost:1337',
+})
+```
+
 ## Emails
 
 During local development with the CLI, all transactional emails from Authentication are sent to a local Mailhog instance, instead of to the recipient's email address. You'll see an address where after starting [`nhost up`](/reference/cli/up) where all emails are sent to.

docs/docs/platform/database/index.mdx

@@ -21,10 +21,10 @@ The database is managed via the Hasura Console where you can manage the database
 
 Hasura Console is where you manage your database. This is where you create and manage tables, schemas, and data.
 
-1) Open the Hasura Console by clicking on **GraphQL** in the top menu in the Nhost Dashboard.
-2) Click **Open Hasura Console** at the top right of the page.
-3) Copy the **admin secret**, and click **Open Hasura**.
-4) Use the **admin secret** to sign in.
+1. Open the Hasura Console by clicking on **GraphQL** in the top menu in the Nhost Dashboard.
+2. Click **Open Hasura Console** at the top right of the page.
+3. Copy the **admin secret**, and click **Open Hasura**.
+4. Use the **admin secret** to sign in.
 
 <video width="99%" autoPlay muted loop controls="true">
   <source src="/videos/open-hasura-console.mp4" type="video/mp4" />
@@ -131,6 +131,21 @@ To track database changes, use the [Nhost CLI](/platform/cli) to develop locally
 
 Learn how to [get started with Nhost CLI](/platform/overview/get-started-with-nhost-cli).
 
+## Seed Data
+
+Seed data is a way of automatically adding data to your database using SQL when a new environment is created. This is, for the moment, only applicable when you're using the [Nhost CLI](/platform/cli) to develop locally. When you're running `nhost up` for the first time, seed data is added.
+
+In the future, seed data will also be added to new preview environments.
+
+Seed data should be located in `nhost/seeds/default/` and are executed in alphabetical order.
+
+**Example:** Two seed scripts with countries and products.
+
+```text
+nhost/seeds/default/001-countries.sql
+nhost/seeds/default/002-products.sql
+```
+
 ## Backups
 
 Databases on [Pro and Enterprise plans](https://nhost.io/pricing) are backed up automatically.

docs/docs/platform/quickstarts/nextjs.mdx

@@ -132,7 +132,8 @@ import { NhostNextProvider, NhostClient } from '@nhost/nextjs';
 
 // highlight-start
 const nhost = new NhostClient({
-  backendUrl: process.env.NEXT_PUBLIC_NHOST_BACKEND_URL || '',
+  subdomain: process.env.NEXT_PUBLIC_NHOST_SUBDOMAIN || '',
+  region: process.env.NEXT_PUBLIC_NHOST_REGION || ''
 });
 // highlight-end
 
@@ -149,16 +150,16 @@ function MyApp({ Component, pageProps }) {
 }
 ```
 
-Finally, make sure to create an environment variable named
-`NEXT_PUBLIC_NHOST_BACKEND_URL` to store your Nhost backend URL:
+Finally, store the environment variables for `subdomain` and `region` in `.env.development`:
 
 ```yaml title=".env.development"
-NEXT_PUBLIC_NHOST_BACKEND_URL=YOUR_NHOST_BACKEND_URL
+NEXT_PUBLIC_NHOST_SUBDOMAIN=YOUR_NHOST_APP_SUBDOMAIN
+NEXT_PUBLIC_NHOST_REGION=YOUR_NHOST_APP_REGION
 ```
 
-You can find your Nhost backend URL for your project from [your dashboard](https://app.nhost.io) as shown below:
+You find your Nhost app's subdomain and region in [the app dashboard](https://app.nhost.io):
 
-![Nhost Backend URL](/img/quickstarts/app-dashboard.png)
+![Nhost App Dashboard](/img/quickstarts/app-dashboard.png)
 
 :::caution
 Don't forget to restart your Next.js server after saving your `.env.development`

docs/docs/platform/quickstarts/react.mdx

@@ -128,7 +128,8 @@ Nhost backend:
 import { NhostClient, NhostReactProvider } from '@nhost/react'
 
 const nhost = new NhostClient({
-  backendUrl: process.env.REACT_APP_NHOST_BACKEND_URL || ''
+  subdomain: process.env.REACT_APP_NHOST_SUBDOMAIN,
+  region: process.env.REACT_APP_NHOST_REGION
 })
 
 function App() {
@@ -143,15 +144,16 @@ export default App
 ```
 
 Finally, make sure to create an environment variable named
-`REACT_APP_NHOST_BACKEND_URL` to store your Nhost backend URL:
+`REACT_APP_NHOST_SUBDOMAIN` and `REACT_APP_NHOST_REGION` to store your Nhost domain details:
 
 ```yaml title=".env.local"
-REACT_APP_NHOST_BACKEND_URL=YOUR_NHOST_BACKEND_URL
+REACT_APP_NHOST_SUBDOMAIN=YOUR_NHOST_APP_SUBDOMAIN
+REACT_APP_NHOST_REGION=YOUR_NHOST_APP_REGION
 ```
 
-You can find your Nhost backend URL for your project from [your dashboard](https://app.nhost.io) as shown below:
+You find your Nhost app's subdomain and region in [the app dashboard](https://app.nhost.io):
 
-![Nhost Backend URL](/img/quickstarts/app-dashboard.png)
+![Nhost App Dashboard](/img/quickstarts/app-dashboard.png)
 
 :::caution
 Don't forget to restart your React server after saving your `.env.local`

docs/docs/platform/quickstarts/redwoodjs.mdx

@@ -136,7 +136,8 @@ import { NhostClient } from '@nhost/nhost-js'
 
 // highlight-start
 const nhostClient = new NhostClient({
-  backendUrl: process.env.NHOST_BACKEND_URL
+  subdomain: process.env.NHOST_SUBDOMAIN
+  region: process.env.NHOST_REGION
 })
 // highlight-end
 
@@ -175,16 +176,16 @@ const App = () => (
 
 That prop avoids having an additional request to fetch the current user.
 
-Next, make sure to create an environment variable named
-`NHOST_BACKEND_URL` to store your Nhost backend URL:
+Next, store the environment variables for `subdomain` and `region` in `.env`:
 
 ```yaml title=".env"
-NHOST_BACKEND_URL=YOUR_NHOST_BACKEND_URL
+NHOST_SUBDOMAIN=YOUR_NHOST_APP_SUBDOMAIN
+NHOST_REGION=YOUR_NHOST_APP_REGION
 ```
 
-You can find your Nhost backend URL for your project from [your dashboard](https://app.nhost.io) as shown below:
+You find your Nhost app's subdomain and region in [the app dashboard](https://app.nhost.io):
 
-![Nhost Backend URL](/img/quickstarts/app-dashboard.png)
+![Nhost App Dashboard](/img/quickstarts/app-dashboard.png)
 
 Finally, we need to customize the GraphQL Endpoint for our RedwoodJS app. Indeed, by default, RedwoodJS provides a built-in GraphQL server under the `api` side. However, as we already have our own GraphQL server through Nhost and Hasura, we do not need it.
 
@@ -194,7 +195,7 @@ So, open the RedwoodJS configuration file, `redwood.toml`, and change the GraphQ
 [web]
   apiUrl = "/.redwood/functions"
   # highlight-next-line
-  apiGraphQLUrl = "${NHOST_BACKEND_URL}/v1/graphql"
+  apiGraphQLUrl = "https://${NHOST_SUBDOMAIN}.graphql.${NHOST_REGION}.nhost.run/v1"
 ```
 
 :::caution

docs/docs/platform/quickstarts/vue.mdx

@@ -153,7 +153,8 @@ import 'uno.css'
 
 // highlight-start
 const nhost = new NhostClient({
-  backendUrl: import.meta.env.VITE_NHOST_URL
+  subdomain: import.meta.env.VITE_NHOST_SUBDOMAIN
+  region: import.meta.env.VITE_NHOST_REGION
 })
 // highlight-end
 
@@ -170,16 +171,16 @@ app
 app.mount('#app')
 ```
 
-Finally, make sure to create an environment variable named
-`VITE_NHOST_URL` to store your Nhost backend URL:
+Finally, store the environment variables for `subdomain` and `region` in `.env`:
 
-```bash title=".env"
-VITE_NHOST_URL=YOUR_NHOST_BACKEND_URL
+```yaml title=".env.development"
+VITE_NHOST_SUBDOMAIN=YOUR_NHOST_APP_SUBDOMAIN
+VITE_NHOST_REGION=YOUR_NHOST_APP_REGION
 ```
 
-You can find your Nhost backend URL for your project from [your dashboard](https://app.nhost.io) as shown below:
+You find your Nhost app's subdomain and region in [the app dashboard](https://app.nhost.io):
 
-![Nhost Backend URL](/img/quickstarts/app-dashboard.png)
+![Nhost App Dashboard](/img/quickstarts/app-dashboard.png)
 
 ## Build the app
 

docs/docs/reference/cli/up.mdx

@@ -7,7 +7,7 @@ Launch the development environment for your app. Once the environment is up, the
 
 - Apply database migrations.
 - Apply the Hasura metadata.
-- Apply seed data.
+- Apply [seed data](/platform/database#seed-data).
 
 ```bash
 nhost up

docs/docs/reference/docgen/javascript/auth/content/hasura-auth-client/content/03-sign-out.mdx

@@ -31,7 +31,7 @@ nhost.auth.signOut()
 nhost.auth.signOut()
 ```
 
-### Sign out the user from all decvices
+### Sign out the user from all devices
 
 ```ts
 nhost.auth.signOut({ all: true })

docs/docs/reference/docgen/javascript/storage/content/create-multiple-files-upload-machine.mdx

@@ -4,7 +4,7 @@ title: createMultipleFilesUploadMachine()
 sidebar_label: createMultipleFilesUploadMachine()
 slug: /reference/javascript/storage/create-multiple-files-upload-machine
 description: No description provided.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L28
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L37
 ---
 
 # `createMultipleFilesUploadMachine()`

docs/docs/reference/docgen/javascript/storage/content/upload-file-promise.mdx

@@ -27,6 +27,6 @@ custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storag
 
 ---
 
-**<span className="parameter-name">\_\_namedParameters</span>** <span className="optional-status">required</span> `Partial<StorageUploadParams>`
+**<span className="parameter-name">params</span>** <span className="optional-status">required</span> `Partial<StorageUploadParams>`
 
 ---

docs/docs/reference/docgen/javascript/storage/content/upload-multiple-files-promise.mdx

@@ -4,7 +4,7 @@ title: uploadMultipleFilesPromise()
 sidebar_label: uploadMultipleFilesPromise()
 slug: /reference/javascript/storage/upload-multiple-files-promise
 description: No description provided.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/promises/multiple-files-upload.ts#L45
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/promises/multiple-files-upload.ts#L46
 ---
 
 # `uploadMultipleFilesPromise()`
@@ -23,14 +23,15 @@ custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storag
 
 ---
 
-**<span className="parameter-name">service</span>** <span className="optional-status">required</span> `Interpreter<MultipleFilesUploadContext, any, { type: "ADD", files: File | Array<File> } | { type: "UPLOAD", url: string, bucketId: string, accessToken: string, adminSecret: string } | { type: "UPLOAD_PROGRESS", additions: number } | { type: "UPLOAD_DONE" } | { type: "UPLOAD_ERROR" } | { type: "CANCEL" } | { type: "REMOVE" } | { type: "CLEAR" }, { value: any, context: MultipleFilesUploadContext }, ResolveTypegenMeta<Typegen0, { type: "ADD", files: File | Array<File> } | { type: "UPLOAD", url: string, bucketId: string, accessToken: string, adminSecret: string } | { type: "UPLOAD_PROGRESS", additions: number } | { type: "UPLOAD_DONE" } | { type: "UPLOAD_ERROR" } | { type: "CANCEL" } | { type: "REMOVE" } | { type: "CLEAR" }, BaseActionObject, ServiceMap>>`
+**<span className="parameter-name">service</span>** <span className="optional-status">required</span> `Interpreter<MultipleFilesUploadContext, any, { type: "ADD", files: AnyFileList, bucketId: string } | { type: "UPLOAD", url: string, files: AnyFileList, bucketId: string, accessToken: string, adminSecret: string } | { type: "UPLOAD_PROGRESS", additions: number } | { type: "UPLOAD_DONE" } | { type: "UPLOAD_ERROR" } | { type: "CANCEL" } | { type: "REMOVE" } | { type: "CLEAR" }, { value: any, context: MultipleFilesUploadContext }, ResolveTypegenMeta<Typegen0, { type: "ADD", files: AnyFileList, bucketId: string } | { type: "UPLOAD", url: string, files: AnyFileList, bucketId: string, accessToken: string, adminSecret: string } | { type: "UPLOAD_PROGRESS", additions: number } | { type: "UPLOAD_DONE" } | { type: "UPLOAD_ERROR" } | { type: "CANCEL" } | { type: "REMOVE" } | { type: "CLEAR" }, BaseActionObject, ServiceMap>>`
 
 ---
 
-**<span className="parameter-name">options</span>** <span className="optional-status">required</span> [`UploadMultipleFilesActionParams`](/reference/docgen/javascript/storage/types/upload-multiple-files-action-params)
+**<span className="parameter-name">params</span>** <span className="optional-status">optional</span> [`UploadMultipleFilesActionParams`](/reference/docgen/javascript/storage/types/upload-multiple-files-action-params)
 
-| Property                                                                                     | Type     | Required | Notes |
-| :------------------------------------------------------------------------------------------- | :------- | :------: | :---- |
-| <span className="parameter-name"><span className="light-grey">options.</span>bucketId</span> | `string` |          |       |
+| Property                                                                                    | Type                                                                      | Required | Notes |
+| :------------------------------------------------------------------------------------------ | :------------------------------------------------------------------------ | :------: | :---- |
+| <span className="parameter-name"><span className="light-grey">params.</span>bucketId</span> | `string`                                                                  |          |       |
+| <span className="parameter-name"><span className="light-grey">params.</span>files</span>    | [`AnyFileList`](/reference/docgen/javascript/storage/types/any-file-list) |          |       |
 
 ---

docs/docs/reference/docgen/javascript/storage/types/any-file-list.mdx

@@ -0,0 +1,14 @@
+---
+# ⚠️ AUTO-GENERATED CONTENT. DO NOT EDIT THIS FILE DIRECTLY! ⚠️
+title: AnyFileList
+sidebar_label: AnyFileList
+description: No description provided.
+displayed_sidebar: referenceSidebar
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L9
+---
+
+# `AnyFileList`
+
+```ts
+type AnyFileList = File | Array<File> | FileList
+```

docs/docs/reference/docgen/javascript/storage/types/multiple-files-upload-context.mdx

@@ -4,7 +4,7 @@ title: MultipleFilesUploadContext
 sidebar_label: MultipleFilesUploadContext
 description: No description provided.
 displayed_sidebar: referenceSidebar
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L9
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L11
 ---
 
 # `MultipleFilesUploadContext`

docs/docs/reference/docgen/javascript/storage/types/multiple-files-upload-events.mdx

@@ -4,17 +4,18 @@ title: MultipleFilesUploadEvents
 sidebar_label: MultipleFilesUploadEvents
 description: No description provided.
 displayed_sidebar: referenceSidebar
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L16
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L18
 ---
 
 # `MultipleFilesUploadEvents`
 
 ```ts
 type MultipleFilesUploadEvents =
-  | { type: 'ADD'; files: File | Array<File> }
+  | { type: 'ADD'; files: AnyFileList; bucketId: string }
   | {
       type: 'UPLOAD'
       url: string
+      files: AnyFileList
       bucketId: string
       accessToken: string
       adminSecret: string

docs/docs/reference/docgen/javascript/storage/types/multiple-files-upload-machine.mdx

@@ -4,7 +4,7 @@ title: MultipleFilesUploadMachine
 sidebar_label: MultipleFilesUploadMachine
 description: No description provided.
 displayed_sidebar: referenceSidebar
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L26
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storage-js/src/packages/hasura-storage-js/src/machines/multiple-files-upload.ts#L35
 ---
 
 # `MultipleFilesUploadMachine`

docs/docs/reference/docgen/javascript/storage/types/upload-multiple-files-action-params.mdx

@@ -10,5 +10,5 @@ custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/hasura-storag
 # `UploadMultipleFilesActionParams`
 
 ```ts
-type UploadMultipleFilesActionParams = () => { bucketId: string }
+type UploadMultipleFilesActionParams = () => { bucketId: string, files: [AnyFileList](/reference/docgen/javascript/storage/types/any-file-list) }
 ```

docs/docs/reference/docgen/nextjs/content/use-file-upload-item.mdx

@@ -4,7 +4,7 @@ title: useFileUploadItem()
 sidebar_label: useFileUploadItem()
 slug: /reference/nextjs/use-file-upload-item
 description: Use the hook `useFileUploadItem` to control the file upload of a file in a multiple file upload.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L59
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L61
 ---
 
 # `useFileUploadItem()`

docs/docs/reference/docgen/nextjs/content/use-file-upload.mdx

@@ -4,7 +4,7 @@ title: useFileUpload()
 sidebar_label: useFileUpload()
 slug: /reference/nextjs/use-file-upload
 description: Use the hook `useFileUpload` to upload a file.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L129
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L142
 ---
 
 # `useFileUpload()`

docs/docs/reference/docgen/nextjs/content/use-multiple-files-upload.mdx

@@ -4,7 +4,7 @@ title: useMultipleFilesUpload()
 sidebar_label: useMultipleFilesUpload()
 slug: /reference/nextjs/use-multiple-files-upload
 description: Use the hook `useFileUpload` to upload multiple files.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useMultipleFilesUpload.ts#L52
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useMultipleFilesUpload.ts#L55
 ---
 
 # `useMultipleFilesUpload()`

docs/docs/reference/docgen/nextjs/types/file-upload-hook-result.mdx

@@ -4,7 +4,7 @@ title: FileUploadHookResult
 sidebar_label: FileUploadHookResult
 description: No description provided.
 displayed_sidebar: referenceSidebar
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L14
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L16
 ---
 
 # `FileUploadHookResult`
@@ -67,11 +67,11 @@ Returns the name of the file.
 
 ---
 
-**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(file: File) => void`
+**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(params: StorageUploadParams) => void`
 
 ---
 
-**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(file: File) => Promise<UploadFileHandlerResult>`
+**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(params: Partial<StorageUploadParams>) => Promise<UploadFileHandlerResult>`
 
 ---
 

docs/docs/reference/docgen/nextjs/types/multiple-files-hook-result.mdx

@@ -49,11 +49,11 @@ Returns `true` when all the files have been successfully uploaded.
 
 ---
 
-**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(files: Array<File>) => void`
+**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(params: Required<Pick<UploadMultipleFilesActionParams, "files">> & UploadMultipleFilesActionParams) => void`
 
 ---
 
-**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(options: UploadMultipleFilesActionParams) => Promise<MultipleFilesHandlerResult>`
+**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(params: UploadMultipleFilesActionParams) => Promise<MultipleFilesHandlerResult>`
 
 ---
 

docs/docs/reference/docgen/react/content/use-file-upload-item.mdx

@@ -4,7 +4,7 @@ title: useFileUploadItem()
 sidebar_label: useFileUploadItem()
 slug: /reference/react/use-file-upload-item
 description: Use the hook `useFileUploadItem` to control the file upload of a file in a multiple file upload.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L59
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L61
 ---
 
 # `useFileUploadItem()`

docs/docs/reference/docgen/react/content/use-file-upload.mdx

@@ -4,7 +4,7 @@ title: useFileUpload()
 sidebar_label: useFileUpload()
 slug: /reference/react/use-file-upload
 description: Use the hook `useFileUpload` to upload a file.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L129
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L142
 ---
 
 # `useFileUpload()`

docs/docs/reference/docgen/react/content/use-multiple-files-upload.mdx

@@ -4,7 +4,7 @@ title: useMultipleFilesUpload()
 sidebar_label: useMultipleFilesUpload()
 slug: /reference/react/use-multiple-files-upload
 description: Use the hook `useFileUpload` to upload multiple files.
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useMultipleFilesUpload.ts#L52
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useMultipleFilesUpload.ts#L55
 ---
 
 # `useMultipleFilesUpload()`

docs/docs/reference/docgen/react/types/file-upload-hook-result.mdx

@@ -4,7 +4,7 @@ title: FileUploadHookResult
 sidebar_label: FileUploadHookResult
 description: No description provided.
 displayed_sidebar: referenceSidebar
-custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L14
+custom_edit_url: https://github.com/nhost/nhost/edit/main/packages/react/src/useFileUpload.ts#L16
 ---
 
 # `FileUploadHookResult`
@@ -67,11 +67,11 @@ Returns the name of the file.
 
 ---
 
-**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(file: File) => void`
+**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(params: StorageUploadParams) => void`
 
 ---
 
-**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(file: File) => Promise<UploadFileHandlerResult>`
+**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(params: Partial<StorageUploadParams>) => Promise<UploadFileHandlerResult>`
 
 ---
 

docs/docs/reference/docgen/react/types/multiple-files-hook-result.mdx

@@ -49,11 +49,11 @@ Returns `true` when all the files have been successfully uploaded.
 
 ---
 
-**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(files: Array<File>) => void`
+**<span className="parameter-name">add</span>** <span className="optional-status">required</span> `(params: Required<Pick<UploadMultipleFilesActionParams, "files">> & UploadMultipleFilesActionParams) => void`
 
 ---
 
-**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(options: UploadMultipleFilesActionParams) => Promise<MultipleFilesHandlerResult>`
+**<span className="parameter-name">upload</span>** <span className="optional-status">required</span> `(params: UploadMultipleFilesActionParams) => Promise<MultipleFilesHandlerResult>`
 
 ---
 

docs/docs/reference/react/apollo.mdx

@@ -39,7 +39,8 @@ import { NhostApolloProvider } from '@nhost/react-apollo'
 import { NhostClient, NhostReactProvider } from '@nhost/react'
 
 const nhost = new NhostClient({
-  backendUrl: '<Your Nhost Backend URL>'
+  subdomain: '<app-subdomain>',
+  region: '<app-region>'
 })
 
 ReactDOM.render(

docs/docs/reference/react/index.mdx

@@ -35,10 +35,12 @@ After installation, initialize a single Nhost Client (`nhost`) under `src/lib/nh
 
 ```jsx title=src/lib/nhost.js
 import { NhostClient } from '@nhost/react'
+
 const nhost = new NhostClient({
   subdomain: '<your-subdomain>',
   region: '<your-region>'
 })
+
 export { nhost }
 ```
 

examples/codegen-react-apollo/.gitignore

@@ -0,0 +1,27 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.nhost
+web/node_modules
+node_modules
+functions/node_modules

examples/codegen-react-apollo/README.md

@@ -0,0 +1,46 @@
+# GraphQL Code Generator Example Repo
+
+This is an example repo for how to use GraphQL Code Generator together with:
+
+- TypeScript
+- React
+- Apollo Client
+- Nhost
+
+This repo is a reference repo for the blog post: [How to use GraphQL Code Generator with React and Apollo](https://nhost.io/blog/how-to-use-graphql-code-generator-with-react-and-apollo).
+
+## Get Started
+
+### Run npm Packages in Dev Mode
+
+In the root of the `nhost/nhost` repo:
+
+Install dependencies with `pnpm`:
+
+> It's important that you're using `pnpm` because our repo are using [PNPM Workspaces](https://pnpm.io/workspaces).
+
+```
+pnpm install
+```
+
+Running packages in development mode:
+
+```
+pnpm run dev
+```
+
+### Run Nhost
+
+In this folder:
+
+```
+nhost up
+```
+
+### Run React App
+
+In this folder:
+
+```
+pnpm run dev
+```

examples/codegen-react-apollo/graphql.config.yaml

@@ -0,0 +1,14 @@
+schema:
+  - http://localhost:1337/v1/graphql:
+      headers:
+        x-hasura-admin-secret: nhost-admin-secret
+documents:
+  - 'src/**/*.graphql'
+generates:
+  src/utils/__generated__/graphql.ts:
+    plugins:
+      - 'typescript'
+      - 'typescript-operations'
+      - 'typescript-react-apollo'
+    config:
+      withRefetchFn: true

examples/codegen-react-apollo/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>GraphQL Code Generator Example with React and Apollo Client</title>
+  </head>
+
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>

examples/codegen-react-apollo/nhost/config.yaml

@@ -0,0 +1,143 @@
+metadata_directory: metadata
+  mailhog:
+    port: 8025
+  hasura:
+    version: v2.8.0
+    environment:
+      hasura_graphql_enable_remote_schema_permissions: false
+  auth:
+    version: 0.9.1
+  storage:
+    version: 0.2.2
+  minio:
+    environment:
+      minio_root_password: minioaccesskey123123
+      minio_root_user: minioaccesskey123123
+  postgres:
+    environment:
+      postgres_password: postgres
+      postgres_user: postgres
+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:
+    enabled: false
+    passwordless:
+      enabled: false
+    signin_email_verified_required: 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: 1706
+    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
+storage:
+  force_download_for_content_types: text/html,application/javascript
+version: 3

examples/codegen-react-apollo/nhost/emails/en/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Change email
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/en/email-confirm-change/subject.txt

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

examples/codegen-react-apollo/nhost/emails/en/email-verify/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Verify Email
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/en/email-verify/subject.txt

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

examples/codegen-react-apollo/nhost/emails/en/password-reset/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Reset password
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/en/password-reset/subject.txt

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

examples/codegen-react-apollo/nhost/emails/en/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Sign In
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/en/signin-passwordless/subject.txt

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

examples/codegen-react-apollo/nhost/emails/fr/email-confirm-change/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Changer courriel
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/fr/email-confirm-change/subject.txt

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

examples/codegen-react-apollo/nhost/emails/fr/email-verify/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      V&eacute;rifier courriel
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/fr/email-verify/subject.txt

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

examples/codegen-react-apollo/nhost/emails/fr/password-reset/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      R&eacute;initializer mot de passe
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/fr/password-reset/subject.txt

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

examples/codegen-react-apollo/nhost/emails/fr/signin-passwordless/body.html

@@ -0,0 +1,18 @@
+<!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="${link}">
+      Connexion
+    </a>
+  </p>
+</body>
+
+</html>

examples/codegen-react-apollo/nhost/emails/fr/signin-passwordless/subject.txt

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

examples/codegen-react-apollo/nhost/metadata/actions.yaml

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

examples/codegen-react-apollo/nhost/metadata/allow_list.yaml

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

examples/codegen-react-apollo/nhost/metadata/cron_triggers.yaml

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

examples/codegen-react-apollo/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: 1
+      use_prepared_statements: true
+  tables: "!include default/tables/tables.yaml"

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_provider_requests.yaml

@@ -0,0 +1,17 @@
+table:
+  name: provider_requests
+  schema: auth
+configuration:
+  column_config: {}
+  custom_column_names: {}
+  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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_providers.yaml

@@ -0,0 +1,25 @@
+table:
+  name: providers
+  schema: auth
+configuration:
+  column_config: {}
+  custom_column_names: {}
+  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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_refresh_tokens.yaml

@@ -0,0 +1,33 @@
+table:
+  name: refresh_tokens
+  schema: auth
+configuration:
+  column_config:
+    created_at:
+      custom_name: createdAt
+    expires_at:
+      custom_name: expiresAt
+    refresh_token:
+      custom_name: refreshToken
+    user_id:
+      custom_name: userId
+  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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_roles.yaml

@@ -0,0 +1,32 @@
+table:
+  name: roles
+  schema: auth
+configuration:
+  column_config: {}
+  custom_column_names: {}
+  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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_user_providers.yaml

@@ -0,0 +1,45 @@
+table:
+  name: user_providers
+  schema: auth
+configuration:
+  column_config:
+    access_token:
+      custom_name: accessToken
+    created_at:
+      custom_name: createdAt
+    provider_id:
+      custom_name: providerId
+    provider_user_id:
+      custom_name: providerUserId
+    refresh_token:
+      custom_name: refreshToken
+    updated_at:
+      custom_name: updatedAt
+    user_id:
+      custom_name: userId
+  custom_column_names:
+    access_token: accessToken
+    created_at: createdAt
+    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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_user_roles.yaml

@@ -0,0 +1,30 @@
+table:
+  name: user_roles
+  schema: auth
+configuration:
+  column_config:
+    created_at:
+      custom_name: createdAt
+    user_id:
+      custom_name: userId
+  custom_column_names:
+    created_at: createdAt
+    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/codegen-react-apollo/nhost/metadata/databases/default/tables/auth_users.yaml

@@ -0,0 +1,107 @@
+table:
+  name: users
+  schema: auth
+configuration:
+  column_config:
+    active_mfa_type:
+      custom_name: activeMfaType
+    avatar_url:
+      custom_name: avatarUrl
+    created_at:
+      custom_name: createdAt
+    default_role:
+      custom_name: defaultRole
+    display_name:
+      custom_name: displayName
+    email_verified:
+      custom_name: emailVerified
+    is_anonymous:
+      custom_name: isAnonymous
+    last_seen:
+      custom_name: lastSeen
+    new_email:
+      custom_name: newEmail
+    otp_hash:
+      custom_name: otpHash
+    otp_hash_expires_at:
+      custom_name: otpHashExpiresAt
+    otp_method_last_used:
+      custom_name: otpMethodLastUsed
+    password_hash:
+      custom_name: passwordHash
+    phone_number:
+      custom_name: phoneNumber
+    phone_number_verified:
+      custom_name: phoneNumberVerified
+    ticket_expires_at:
+      custom_name: ticketExpiresAt
+    totp_secret:
+      custom_name: totpSecret
+    updated_at:
+      custom_name: updatedAt
+  custom_column_names:
+    active_mfa_type: activeMfaType
+    avatar_url: avatarUrl
+    created_at: createdAt
+    default_role: defaultRole
+    display_name: displayName
+    email_verified: emailVerified
+    is_anonymous: isAnonymous
+    last_seen: lastSeen
+    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_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: usersAggregate
+    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
+select_permissions:
+- permission:
+    columns:
+    - avatar_url
+    - display_name
+    - id
+    filter:
+      id:
+        _eq: X-Hasura-User-Id
+  role: user

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/public_customers.yaml

@@ -0,0 +1,17 @@
+table:
+  name: customers
+  schema: public
+insert_permissions:
+- permission:
+    check: {}
+    columns:
+    - name
+  role: public
+select_permissions:
+- permission:
+    columns:
+    - id
+    - name
+    - created_at
+    filter: {}
+  role: public

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/public_doc_links.yaml

@@ -0,0 +1,80 @@
+table:
+  name: doc_links
+  schema: public
+configuration:
+  column_config:
+    created_at:
+      custom_name: createdAt
+    doc_id:
+      custom_name: docId
+    download_allowed:
+      custom_name: downloadAllowed
+    is_active:
+      custom_name: isActive
+    require_email_to_view:
+      custom_name: requireEmailToView
+    updated_at:
+      custom_name: updatedAt
+  custom_column_names:
+    created_at: createdAt
+    doc_id: docId
+    download_allowed: downloadAllowed
+    is_active: isActive
+    require_email_to_view: requireEmailToView
+    updated_at: updatedAt
+  custom_root_fields:
+    insert: insertDocLinks
+    insert_one: insertDocLink
+    select: docLinks
+    select_by_pk: docLink
+object_relationships:
+- name: doc
+  using:
+    foreign_key_constraint_on: doc_id
+array_relationships:
+- name: docVisits
+  using:
+    foreign_key_constraint_on:
+      column: doc_link_id
+      table:
+        name: doc_visits
+        schema: public
+insert_permissions:
+- permission:
+    check:
+      doc:
+        user_id:
+          _eq: X-Hasura-User-Id
+    columns:
+    - doc_id
+    - download_allowed
+    - is_active
+    - passcode
+    - require_email_to_view
+  role: user
+select_permissions:
+- permission:
+    columns:
+    - download_allowed
+    - id
+    - is_active
+    - passcode
+    - require_email_to_view
+    filter: {}
+    limit: 0
+  role: public
+- permission:
+    columns:
+    - download_allowed
+    - is_active
+    - require_email_to_view
+    - passcode
+    - created_at
+    - updated_at
+    - doc_id
+    - id
+    filter:
+      doc:
+        user_id:
+          _eq: X-Hasura-User-Id
+  role: user

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/public_doc_visits.yaml

@@ -0,0 +1,35 @@
+table:
+  name: doc_visits
+  schema: public
+configuration:
+  column_config:
+    created_at:
+      custom_name: createdAt
+    doc_link_id:
+      custom_name: docLinkId
+    updated_at:
+      custom_name: updatedAt
+  custom_column_names:
+    created_at: createdAt
+    doc_link_id: docLinkId
+    updated_at: updatedAt
+  custom_root_fields: {}
+object_relationships:
+- name: docLink
+  using:
+    foreign_key_constraint_on: doc_link_id
+select_permissions:
+- permission:
+    allow_aggregations: true
+    columns:
+    - email
+    - created_at
+    - updated_at
+    - doc_link_id
+    - id
+    filter:
+      docLink:
+        doc:
+          user_id:
+            _eq: X-Hasura-User-Id
+  role: user

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/public_docs.yaml

@@ -0,0 +1,72 @@
+table:
+  name: docs
+  schema: public
+configuration:
+  column_config:
+    created_at:
+      custom_name: createdAt
+    file_id:
+      custom_name: fileId
+    updated_at:
+      custom_name: updatedAt
+    user_id:
+      custom_name: userId
+  custom_column_names:
+    created_at: createdAt
+    file_id: fileId
+    updated_at: updatedAt
+    user_id: userId
+  custom_root_fields:
+    delete: deleteDocs
+    delete_by_pk: DeleteDoc
+    insert: insertDocs
+    insert_one: insertDoc
+    select: docs
+    select_aggregate: docsAggregate
+    select_by_pk: doc
+    update: updateDocs
+    update_by_pk: updateDoc
+object_relationships:
+- name: file
+  using:
+    foreign_key_constraint_on: file_id
+- name: user
+  using:
+    foreign_key_constraint_on: user_id
+array_relationships:
+- name: docLinks
+  using:
+    foreign_key_constraint_on:
+      column: doc_id
+      table:
+        name: doc_links
+        schema: public
+insert_permissions:
+- permission:
+    check: {}
+    columns:
+    - file_id
+    - name
+    set:
+      user_id: x-hasura-user-id
+  role: user
+select_permissions:
+- permission:
+    columns:
+    - file_id
+    - id
+    filter: {}
+    limit: 0
+  role: public
+- permission:
+    columns:
+    - name
+    - created_at
+    - updated_at
+    - file_id
+    - id
+    - user_id
+    filter:
+      user_id:
+        _eq: X-Hasura-User-Id
+  role: user

examples/codegen-react-apollo/nhost/metadata/databases/default/tables/storage_buckets.yaml

@@ -0,0 +1,46 @@
+table:
+  name: buckets
+  schema: storage
+configuration:
+  column_config:
+    cache_control:
+      custom_name: cacheControl
+    created_at:
+      custom_name: createdAt
+    download_expiration:
+      custom_name: downloadExpiration
+    max_upload_file_size:
+      custom_name: maxUploadFileSize
+    min_upload_file_size:
+      custom_name: minUploadFileSize
+    presigned_urls_enabled:
+      custom_name: presignedUrlsEnabled
+    updated_at:
+      custom_name: updatedAt
+  custom_column_names:
+    cache_control: cacheControl
+    created_at: createdAt
+    download_expiration: downloadExpiration
+    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/codegen-react-apollo/nhost/metadata/databases/default/tables/storage_files.yaml

@@ -0,0 +1,45 @@
+table:
+  name: files
+  schema: storage
+configuration:
+  column_config:
+    bucket_id:
+      custom_name: bucketId
+    created_at:
+      custom_name: createdAt
+    etag:
+      custom_name: etag
+    is_uploaded:
+      custom_name: isUploaded
+    mime_type:
+      custom_name: mimeType
+    size:
+      custom_name: size
+    updated_at:
+      custom_name: updatedAt
+    uploaded_by_user_id:
+      custom_name: uploadedByUserId
+  custom_column_names:
+    bucket_id: bucketId
+    created_at: createdAt
+    etag: etag
+    is_uploaded: isUploaded
+    mime_type: mimeType
+    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/codegen-react-apollo/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_customers.yaml"
+- "!include storage_buckets.yaml"
+- "!include storage_files.yaml"

examples/codegen-react-apollo/nhost/metadata/query_collections.yaml

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

examples/codegen-react-apollo/nhost/metadata/remote_schemas.yaml

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

examples/codegen-react-apollo/nhost/metadata/rest_endpoints.yaml

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

examples/codegen-react-apollo/nhost/metadata/version.yaml

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

examples/codegen-react-apollo/nhost/migrations/default/1656419498210_create_table_public_customers/down.sql

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

examples/codegen-react-apollo/nhost/migrations/default/1656419498210_create_table_public_customers/up.sql

@@ -0,0 +1 @@
+CREATE TABLE "public"."customers" ("id" serial NOT NULL, "created_at" timestamptz NOT NULL DEFAULT now(), "name" text NOT NULL, PRIMARY KEY ("id") );

examples/codegen-react-apollo/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@nhost-examples/codegen-react-apollo",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@apollo/client": "^3.6.9",
+    "@nhost/react": "*",
+    "@nhost/react-apollo": "*",
+    "graphql": "^16.5.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "scripts": {
+    "codegen": "graphql-codegen --config graphql.config.yaml --errors-only",
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview --host localhost --port 3000"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@graphql-codegen/cli": "^2.6.2",
+    "@graphql-codegen/typescript-operations": "^2.4.2",
+    "@graphql-codegen/typescript-react-apollo": "^3.2.16",
+    "@types/node": "^16.7.13",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "eslint": "^8.0.0",
+    "eslint-config-react-app": "^7.0.1",
+    "typescript": "^4.4.2",
+    "vite": "^2.9.7"
+  }
+}

examples/codegen-react-apollo/public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

examples/codegen-react-apollo/public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

examples/codegen-react-apollo/src/App.tsx

@@ -0,0 +1,25 @@
+import { NewCustomer } from './components/new-customer'
+import { Customers } from './components/customers'
+import { NhostApolloProvider } from '@nhost/react-apollo'
+import { nhost } from './utils/nhost'
+import { NhostReactProvider } from '@nhost/react'
+
+function App() {
+  return (
+    <NhostReactProvider nhost={nhost}>
+      <NhostApolloProvider nhost={nhost}>
+        <div>
+          <h1>GraphQL Code Generator example with React and Apollo</h1>
+          <div>
+            <NewCustomer />
+          </div>
+          <div>
+            <Customers />
+          </div>
+        </div>
+      </NhostApolloProvider>
+    </NhostReactProvider>
+  )
+}
+
+export default App

examples/codegen-react-apollo/src/components/customers.tsx

@@ -0,0 +1,26 @@
+import { useGetCustomersQuery } from '../utils/__generated__/graphql'
+
+export function Customers() {
+  const { data, loading, error } = useGetCustomersQuery()
+
+  if (loading || !data) {
+    return <div>Loading</div>
+  }
+
+  if (error) {
+    return <div>Error</div>
+  }
+
+  const { customers } = data
+
+  return (
+    <div>
+      <h2>Customers</h2>
+      <ul>
+        {customers.map((customer) => (
+          <li key={customer.id}>{customer.name}</li>
+        ))}
+      </ul>
+    </div>
+  )
+}

examples/codegen-react-apollo/src/components/new-customer.tsx

@@ -0,0 +1,55 @@
+import { useState } from 'react'
+import { refetchGetCustomersQuery, useInsertCustomerMutation } from '../utils/__generated__/graphql'
+
+export function NewCustomer() {
+  const [name, setName] = useState('')
+
+  const [insertCustomer, { loading, error }] = useInsertCustomerMutation({
+    refetchQueries: [refetchGetCustomersQuery()]
+  })
+
+  const handleSubmit = async (e: React.SyntheticEvent<HTMLFormElement>) => {
+    e.preventDefault()
+
+    try {
+      await insertCustomer({
+        variables: {
+          customer: {
+            name
+          }
+        }
+      })
+    } catch (error) {
+      return console.error(error)
+    }
+
+    setName('')
+
+    alert('Customer added!')
+  }
+
+  return (
+    <div>
+      <h2>New Customer</h2>
+      <div>
+        <form onSubmit={handleSubmit}>
+          <div>
+            <input
+              type="text"
+              name="name"
+              placeholder="Name"
+              value={name}
+              onChange={(e) => setName(e.target.value)}
+            />
+          </div>
+          {error && <div>Error: {error.message}</div>}
+          <div>
+            <button type="submit" disabled={loading}>
+              Add
+            </button>
+          </div>
+        </form>
+      </div>
+    </div>
+  )
+}

examples/codegen-react-apollo/src/graphql/customers.graphql

@@ -0,0 +1,12 @@
+query GetCustomers {
+  customers {
+    id
+    name
+  }
+}
+
+mutation InsertCustomer($customer: customers_insert_input!) {
+  insert_customers_one(object: $customer) {
+    id
+  }
+}

examples/codegen-react-apollo/src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

examples/codegen-react-apollo/src/index.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import './index.css'
+import App from './App'
+
+const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+)

examples/codegen-react-apollo/src/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>

examples/codegen-react-apollo/src/utils/nhost.ts

@@ -0,0 +1,7 @@
+import { NhostClient } from '@nhost/react'
+
+const nhost = new NhostClient({
+  subdomain: 'localhost:1337'
+})
+
+export { nhost }

examples/codegen-react-apollo/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "types": ["vite/client"]
+  },
+  "include": [
+    "src"
+  ]
+}

examples/codegen-react-apollo/vite.config.js

@@ -0,0 +1,13 @@
+import { defineConfig } from 'vite'
+
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  optimizeDeps: {
+    include: ['react/jsx-runtime'],
+    // * Shim: do not optimize @nhost/react when running this example in the Nhost monorepo
+    exclude: process.env.PNPM_PACKAGE_NAME === 'nhost-root' ? ['@nhost/react'] : []
+  },
+  plugins: [react()]
+})

examples/docker-compose/README.md

@@ -20,8 +20,4 @@ The following endpoints are now exposed:
 - `http://localhost:1337/v1/functions`: Functions
 
 - `http://localhost:9090`: Traefik dashboad
-- `http://localhost:8025`: Mailhog SMTP testing dashboard
-
-## Limitations
-
-This example does not implement the custom functions that are available on the cloud-hosted Nhost offer.
+- `http://localhost:8025`: Mailhog SMTP testing dashboard 

examples/react-apollo/README.md

@@ -1,5 +1,9 @@
 # React-Apollo example
 
+## See this example live
+
+Visit our demo application on [react-apollo.example.nhost.io](https://react-apollo.example.nhost.io)
+
 ## Get started
 
 1. Clone the repository
@@ -22,7 +26,7 @@ pnpm install
 nhost dev
 ```
 
-4. Terminal 2: Start React App
+4. Terminal 2: Start the React application
 
 ```sh
 pnpm run dev

examples/react-apollo/nhost/metadata/databases/default/tables/storage_files.yaml

@@ -50,6 +50,22 @@ object_relationships:
   using:
     foreign_key_constraint_on: bucket_id
 insert_permissions:
+- permission:
+    check:
+      size:
+        _lt: 1024000
+    columns:
+    - is_uploaded
+    - size
+    - bucket_id
+    - etag
+    - mime_type
+    - name
+    - created_at
+    - updated_at
+    - id
+    - uploaded_by_user_id
+  role: anonymous
 - permission:
     check: {}
     columns:
@@ -65,6 +81,20 @@ insert_permissions:
     - uploaded_by_user_id
   role: user
 select_permissions:
+- permission:
+    columns:
+    - is_uploaded
+    - size
+    - bucket_id
+    - etag
+    - mime_type
+    - name
+    - created_at
+    - updated_at
+    - id
+    - uploaded_by_user_id
+    filter: {}
+  role: anonymous
 - permission:
     columns:
     - is_uploaded
@@ -80,6 +110,21 @@ select_permissions:
     filter: {}
   role: user
 update_permissions:
+- permission:
+    check: {}
+    columns:
+    - is_uploaded
+    - size
+    - bucket_id
+    - etag
+    - mime_type
+    - name
+    - created_at
+    - updated_at
+    - id
+    - uploaded_by_user_id
+    filter: {}
+  role: anonymous
 - permission:
     check: {}
     columns:
@@ -95,3 +140,12 @@ update_permissions:
     - uploaded_by_user_id
     filter: {}
   role: user
+delete_permissions:
+- permission:
+    backend_only: false
+    filter: {}
+  role: anonymous
+- permission:
+    backend_only: false
+    filter: {}
+  role: user

examples/react-apollo/src/Storage.tsx

@@ -131,7 +131,7 @@ export const StoragePage: React.FC = () => {
         <Dropzone
           onDrop={([file]) => {
             console.log('accepted file', file)
-            upload(file)
+            upload({ file })
           }}
           onReject={(additions) => console.log('rejected files', additions)}
           multiple={false}
@@ -163,7 +163,7 @@ export const StoragePage: React.FC = () => {
           <Dropzone
             onDrop={(additions) => {
               console.log('accepted files', additions)
-              add(additions)
+              add({ files: additions })
             }}
             onReject={(additions) => console.log('rejected files', additions)}
           >

examples/react-apollo/src/components/OauthLinks.tsx

@@ -5,7 +5,7 @@ import { useProviderLink } from '@nhost/react'
 import AuthLink from './AuthLink'
 
 export default function OauthLinks() {
-  const { github, google, facebook } = useProviderLink()
+  const { github, google, facebook } = useProviderLink({ redirectTo: window.location.origin })
   return (
     <>
       <AuthLink leftIcon={<FaGithub />} link={github} color="#333">

examples/react-apollo/src/main.tsx

@@ -16,7 +16,8 @@ if (devTools) {
 }
 
 const nhost = new NhostClient({
-  backendUrl: import.meta.env.VITE_NHOST_URL || 'http://localhost:1337',
+  subdomain: import.meta.env.VITE_NHOST_SUBDOMAIN || 'localhost:1337',
+  region: import.meta.env.VITE_NHOST_REGION,
   devTools
 })
 

examples/react-apollo/src/sign-up/email-password.tsx

@@ -18,15 +18,14 @@ export const EmailPassword: React.FC = () => {
     () => password && password !== confirmPassword && 'Should match the given password',
     [password, confirmPassword]
   )
-  const options = useMemo(
-    () => ({ displayName: `${firstName} ${lastName}`, metadata: { firstName, lastName } }),
-    [firstName, lastName]
-  )
   const navigate = useNavigate()
-  const { signUpEmailPassword } = useSignUpEmailPassword(options)
+  const { signUpEmailPassword } = useSignUpEmailPassword()
 
   const signUp = async () => {
-    const result = await signUpEmailPassword(email, password, { metadata: { firstName, lastName } })
+    const result = await signUpEmailPassword(email, password, {
+      metadata: { firstName, lastName, displayName: `${firstName} ${lastName}` },
+      redirectTo: window.location.origin
+    })
     if (result.isError) {
       showNotification({
         color: 'red',