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

chore: update versions

README.md

@@ -1,4 +1,4 @@
-![Nhost](https://i.imgur.com/FrcdOZg.png)
+![Nhost](https://i.imgur.com/ZenoUlM.png)
 
 <div align="center">
 
@@ -199,21 +199,28 @@ Here are some ways of contributing to making Nhost better:
             <sub><b>Vadim Smirnov</b></sub>
         </a>
     </td>
+    <td align="center">
+        <a href="https://github.com/macmac49">
+            <img src="https://avatars.githubusercontent.com/u/831190?v=4" width="100;" alt="macmac49"/>
+            <br />
+            <sub><b>Macmac49</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></tr>
+<tr>
     <td align="center">
         <a href="https://github.com/heygambo">
             <img src="https://avatars.githubusercontent.com/u/449438?v=4" width="100;" alt="heygambo"/>
             <br />
             <sub><b>Christian Gambardella</b></sub>
         </a>
-    </td></tr>
-<tr>
+    </td>
     <td align="center">
         <a href="https://github.com/chrtze">
             <img src="https://avatars.githubusercontent.com/u/3797215?v=4" width="100;" alt="chrtze"/>
@@ -248,15 +255,22 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Jerry Jäppinen</b></sub>
         </a>
-    </td>
+    </td></tr>
+<tr>
     <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></tr>
-<tr>
+    </td>
+    <td align="center">
+        <a href="https://github.com/nbourdin">
+            <img src="https://avatars.githubusercontent.com/u/5602476?v=4" width="100;" alt="nbourdin"/>
+            <br />
+            <sub><b>Nicolas Bourdin</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"/>
@@ -284,7 +298,8 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Anders Kjær Damgaard</b></sub>
         </a>
-    </td>
+    </td></tr>
+<tr>
     <td align="center">
         <a href="https://github.com/Sonichigo">
             <img src="https://avatars.githubusercontent.com/u/53110238?v=4" width="100;" alt="Sonichigo"/>
@@ -298,8 +313,7 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Colin Broderick</b></sub>
         </a>
-    </td></tr>
-<tr>
+    </td>
     <td align="center">
         <a href="https://github.com/dohomi">
             <img src="https://avatars.githubusercontent.com/u/489221?v=4" width="100;" alt="dohomi"/>
@@ -327,7 +341,8 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Hoang Do</b></sub>
         </a>
-    </td>
+    </td></tr>
+<tr>
     <td align="center">
         <a href="https://github.com/MelodicCrypter">
             <img src="https://avatars.githubusercontent.com/u/18341500?v=4" width="100;" alt="MelodicCrypter"/>
@@ -341,8 +356,7 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Jacob Duval</b></sub>
         </a>
-    </td></tr>
-<tr>
+    </td>
     <td align="center">
         <a href="https://github.com/leothorp">
             <img src="https://avatars.githubusercontent.com/u/12928449?v=4" width="100;" alt="leothorp"/>
@@ -357,13 +371,6 @@ Here are some ways of contributing to making Nhost better:
             <sub><b>Max Reynolds</b></sub>
         </a>
     </td>
-    <td align="center">
-        <a href="https://github.com/nbourdin">
-            <img src="https://avatars.githubusercontent.com/u/5602476?v=4" width="100;" alt="nbourdin"/>
-            <br />
-            <sub><b>Nicolas Bourdin</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"/>
@@ -377,15 +384,15 @@ Here are some ways of contributing to making Nhost better:
             <br />
             <sub><b>Quentin Decré</b></sub>
         </a>
-    </td>
+    </td></tr>
+<tr>
     <td align="center">
         <a href="https://github.com/atapas">
             <img src="https://avatars.githubusercontent.com/u/3633137?v=4" width="100;" alt="atapas"/>
             <br />
             <sub><b>Tapas Adhikary</b></sub>
         </a>
-    </td></tr>
-<tr>
+    </td>
     <td align="center">
         <a href="https://github.com/komninoschat">
             <img src="https://avatars.githubusercontent.com/u/29049104?v=4" width="100;" alt="komninoschat"/>

config/.eslintrc.vue.js

@@ -6,5 +6,8 @@ module.exports = {
   parserOptions: {
     ...base.parserOptions,
     parser: '@typescript-eslint/parser'
+  },
+  rules: {
+    'vue/html-self-closing': 'off'
   }
 }

config/vite.lib.config.js

@@ -14,9 +14,6 @@ const entry = fs.existsSync(tsEntry) ? tsEntry : tsEntry.replace('.ts', '.tsx')
 const deps = [...Object.keys(Object.assign({}, pkg.peerDependencies, pkg.dependencies))]
 
 export default defineConfig({
-  optimizeDeps: {
-    include: ['react/jsx-runtime']
-  },
   plugins: [
     tsconfigPaths(),
     dts({
@@ -44,7 +41,7 @@ export default defineConfig({
     lib: {
       entry,
       name: pkg.name,
-      fileName: (format) => (format === 'cjs' ? `index.cjs.js` : `index.mjs`),
+      fileName: (format) => (format === 'cjs' ? `index.cjs.js` : `index.esm.js`),
       formats: ['cjs', 'es']
     },
     rollupOptions: {
@@ -55,6 +52,7 @@ export default defineConfig({
           '@apollo/client': '@apollo/client',
           '@apollo/client/core': '@apollo/client/core',
           '@apollo/client/link/context': '@apollo/client/link/context',
+          '@apollo/client/react': '@apollo/client/react',
           '@apollo/client/link/subscriptions': '@apollo/client/link/subscriptions',
           '@apollo/client/utilities': '@apollo/client/utilities',
           'graphql-ws': 'graphql-ws',

config/vite.react.config.js

@@ -6,5 +6,8 @@ import baseLibConfig from './vite.lib.config'
 
 export default defineConfig({
   ...baseLibConfig,
-  plugins: [react(), ...baseLibConfig.plugins]
+  optimizeDeps: {
+    include: ['react/jsx-runtime']
+  },
+  plugins: [react({ jsxRuntime: 'classic' }), ...baseLibConfig.plugins]
 })

docs/docs/index.mdx

@@ -2,6 +2,7 @@
 title: 'Introduction to Nhost'
 sidebar_label: Introduction
 sidebar_position: 1
+image: /img/og/platform/introduction-to-nhost.png
 ---
 
 Nhost is the open source GraphQL backend (Firebase Alternative) and a development platform. Nhost is doing for the backend, what [Netlify](https://netlify.com/) and [Vercel](https://vercel.com/) are doing for the frontend.

docs/docs/platform/authentication/index.md

@@ -2,6 +2,7 @@
 title: Nhost Authentication
 sidebar_label: Authentication
 sidebar_position: 1
+image: /img/og/platform/authentication.png
 ---
 
 Nhost Authentication is a ready-to-use authentication service that is integrated with the [GraphQL API](/platform/graphql) and its permission system from Hasura.

docs/docs/platform/authentication/sign-in-methods/1-email-password.mdx

@@ -2,6 +2,7 @@
 title: Sign In with Email and Password
 sidebar_label: Email and Password
 slug: /platform/authentication/sign-in-with-email-and-password
+image: /img/og/platform/sign-in-with-email-and-password.png
 ---
 
 Follow this guide to sign in users with email and password.

docs/docs/platform/authentication/sign-in-methods/2-magic-link.mdx

@@ -2,12 +2,21 @@
 title: Sign In with Magic Link
 sidebar_label: Magic Link
 slug: /platform/authentication/sign-in-with-magic-link
+image: /img/og/platform/sign-in-with-magic-link.png
 ---
 
 Follow this guide to sign in users with Magic Link, also called passwordless email.
 
 The Magic Link sign-in method enables you to sign in users to your app using an email address, without requiring a password.
 
+## Setup
+
+Enable the Magic Link sign-in method in the Nhost dashboard under **Users** -> **Login settings** -> **Magic Link**.
+
+![Magic Link Setup with Nhost](/img/platform/authentication/sign-in-methods/magic-link/magic-link-setup.png)
+
+## Sign In
+
 To sign in users with Magic Link is a two-step process:
 
 1. Send a Magic Link to the user's email address.
@@ -20,3 +29,5 @@ nhost.auth.signIn({
   email: 'joe@example.com'
 })
 ```
+
+If you want to change the email for your magic link emails, you can do so by changing the [email templates](/platform/authentication/email-templates).

docs/docs/platform/authentication/sign-in-methods/3-phone-number.mdx

@@ -2,26 +2,58 @@
 title: Sign In with Phone Number (SMS)
 sidebar_label: Phone Number (SMS)
 slug: /platform/authentication/sign-in-with-phone-number-sms
+image: /img/og/platform/sign-in-with-phone-number-sms.png
 ---
 
 Follow this guide to sign in users with a phone number (SMS).
 
+## Setup
+
+You need a [Twilio account](https://www.twilio.com/try-twilio) to use this feature because all SMS are sent through Twilio.
+
+Enable the Phone Number (SMS) sign-in method in the Nhost dashboard under **Users** -> **Login settings** -> **Passwordless SMS**.
+
+You need to insert the following settings in the Nhost dashboard from Twilio:
+
+- Account SID
+- Auth Token
+- Messaging Service SID (or a Twilio phone number)
+
+<video width="99%" autoPlay muted loop controls="true" style={{marginBottom: '15px'}}>
+  <source src="/videos/enable-sms-sign-in.mp4" type="video/mp4" />
+</video>
+
+
 ## Sign In
 
 To sign in users with a phone number is a two-step process:
 
 1. Send a one-time password (OTP) to the user's phone number.
-2. The user uses the OTP to sign in
+2. The user uses the OTP to sign in.
 
 ```js
 // Step 1: Send OTP to the user's phone number
 await nhost.auth.signIn({
-  phoneNumber: '0011233213123'
+  phoneNumber: '+11233213123'
 })
 
 // Step 2: Sign in user using their phone number and OTP
 await nhost.auth.signIn({
-  phoneNumber: '0011233213123'
+  phoneNumber: '+11233213123'
+  // highlight-next-line
   otp: '123456',
 })
 ```
+
+The first time a user signs in using a phone number, the user is created. That means you don't need to sign up the user before signin in the user.
+
+:::info
+
+Phone numbers should start with `+` (not `00`) to follow the [E.164 formatting standard](https://en.wikipedia.org/wiki/E.164).
+
+:::
+
+
+## Other SMS Providers
+
+We only support Twilio for now. If you want support for another SMS provider, please create an issue on [GitHub](https://github.com/nhost/nhost).

docs/docs/platform/authentication/sign-in-methods/5-google.mdx

@@ -2,6 +2,7 @@
 title: Sign In with Google
 sidebar_label: Google
 slug: /platform/authentication/sign-in-with-google
+image: /img/og/platform/sign-in-with-google.png
 ---
 
 Follow this guide to sign in users with Google with your Nhost App.

docs/docs/platform/authentication/sign-in-methods/6-facebook.mdx

@@ -2,6 +2,7 @@
 title: Sign In with Facebook
 sidebar_label: Facebook
 slug: /platform/authentication/sign-in-with-facebook
+image: /img/og/platform/sign-in-with-facebook.png
 ---
 
 Follow this guide to sign in users with Facebook with your Nhost App.

docs/docs/platform/authentication/sign-in-methods/7-github.mdx

@@ -2,6 +2,7 @@
 title: Sign In with GitHub
 sidebar_label: GitHub
 slug: /platform/authentication/sign-in-with-github
+image: /img/og/platform/sign-in-with-github.png
 ---
 
 Follow this guide to sign in users with GitHub with your Nhost App.

docs/docs/platform/authentication/sign-in-methods/8-linkedin.mdx

@@ -2,6 +2,7 @@
 title: Sign In with LinkedIn
 sidebar_label: LinkedIn
 slug: /platform/authentication/sign-in-with-linkedin
+image: /img/og/platform/sign-in-with-linkedin.png
 ---
 
 Follow this guide to sign in users with LinkedIn with your Nhost App.

docs/docs/platform/authentication/sign-in-methods/9-spotify.mdx

@@ -2,6 +2,7 @@
 title: Sign In with Spotify
 sidebar_label: Spotify
 slug: /platform/authentication/sign-in-with-spotify
+image: /img/og/platform/sign-in-with-spotify.png
 ---
 
 Follow this guide to sign in users with Spotify with your Nhost App.

docs/docs/platform/authentication/sign-in-methods/index.md

@@ -1,6 +1,7 @@
 ---
 title: 'Sign-In Methods'
 slug: /platform/authentication/sign-in-methods
+image: /img/og/platform/sign-in-methods.png
 ---
 
 Nhost Authentication support the following sign-in methods:

docs/docs/platform/authentication/tokens.mdx

@@ -2,6 +2,7 @@
 title: Tokens
 sidebar_label: Tokens
 sidebar_position: 10
+image: /img/og/platform/tokens.png
 ---
 
 Nhost Authentication makes use of two types of tokens:

docs/docs/platform/authentication/users.mdx

@@ -2,6 +2,7 @@
 title: Users
 sidebar_label: Users
 sidebar_position: 1
+image: /img/og/platform/users.png
 ---
 
 Users are stored in the database in the `users` table in the `auth` schema.

docs/docs/platform/cli.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'CLI'
 sidebar_position: 11
+image: /img/og/platform/cli.png
 ---
 
 import Tabs from '@theme/Tabs'

docs/docs/platform/database/event-triggers.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Event triggers'
 sidebar_position: 2
+image: /img/og/platform/event-triggers.png
 ---
 
 Event Triggers enable you to invoke webhooks when a database event happens. Event Triggers are typically used to do post-processing tasks, using custom backend code, based on database events.

docs/docs/platform/database/index.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Database'
 sidebar_position: 1
+image: /img/og/platform/database.png
 ---
 
 import Tabs from '@theme/Tabs'

docs/docs/platform/environment-variables.md

@@ -1,6 +1,7 @@
 ---
 title: 'Environment Variables'
 sidebar_position: 9
+image: /img/og/platform/environment-variables.png
 ---
 
 Environment Variables are key-value pairs configured outside your source code. They are used to store environment-specific values such as API keys.

docs/docs/platform/github-integration.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'GitHub Integration'
 sidebar_position: 10
+image: /img/og/platform/github-integration.png
 ---
 
 The GitHub integration allows you to automatically deploy your Nhost app when on push and merge to a GitHub repository that is connected to your Nhost app.
@@ -14,7 +15,7 @@ The following things are deployed:
 - Serverless Functions
 
 :::info
-Settings in `nhost/config.yaml` are **not** deployed. That menas you need to manually sync settings between local and remote environments between the CLI and Nhost Cloud.
+Settings in `nhost/config.yaml` are **not** deployed. That means you need to manually sync settings between local and remote environments between the CLI and Nhost Cloud.
 :::
 
 ## Connecting a GitHub repository

docs/docs/platform/graphql/index.md

@@ -1,6 +1,7 @@
 ---
 title: 'GraphQL'
 sidebar_position: 1
+image: /img/og/platform/graphql.png
 ---
 
 A GraphQL API is automatically and instantly available based on the tables and columns in your [database](/platform/database).

docs/docs/platform/graphql/permissions.md

@@ -1,6 +1,7 @@
 ---
 title: 'Permissions'
 sidebar_position: 1
+image: /img/og/platform/permissions.png
 ---
 
 The GraphQL API is protected by a role-based permission system.

docs/docs/platform/overview/architecture.md

@@ -1,6 +1,7 @@
 ---
 title: 'Architecture'
 sidebar_position: 2
+image: /img/og/platform/architecture.png
 ---
 
 Nhost is a backend as a service built with open source tools to provide developers the general building blocks required to build fantastic digital apps and products.

docs/docs/platform/overview/get-started-with-nhost-cli.md

@@ -1,6 +1,7 @@
 ---
 title: 'Get Started with Nhost CLI'
 sidebar_position: 2
+image: /img/og/platform/get-started-with-nhost-cli.png
 ---
 
 # Get started with Nhost CLI

docs/docs/platform/quickstarts/nextjs.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Quickstart: Next.js'
 sidebar_position: 2
+image: /img/og/platform/quickstart-nextjs.png
 ---
 
 import Tabs from '@theme/Tabs'
@@ -672,7 +673,8 @@ export function UserProvider({ children = null }) {
   const id = useUserId()
   // highlight-start
   const { loading, error, data } = useQuery(GET_USER_QUERY, {
-    variables: { id }
+    variables: { id },
+    skip: !id
   })
   const user = data?.user
   // highlight-end

docs/docs/platform/quickstarts/react.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Quickstart: React'
 sidebar_position: 1
+image: /img/og/platform/quickstart-react.png
 ---
 
 import Tabs from '@theme/Tabs'
@@ -35,6 +36,7 @@ You'll need **Node.js** version 14 or later: [install it from here](https://node
 import CreateApp from '@site/src/components/create-nhost-app.mdx'
 
 <CreateApp />
+
 :::info
 You can also connect your Nhost app to a GitHub repository. When you do this, any updates you push to your code will automatically be deployed. [Learn more](https://docs.nhost.io/platform/github-integration).
 :::
@@ -636,7 +638,8 @@ const Layout = () => {
   const id = useUserId()
   // highlight-start
   const { loading, error, data } = useQuery(GET_USER_QUERY, {
-    variables: { id }
+    variables: { id },
+    skip: !id
   })
   const user = data?.user
   // highlight-end

docs/docs/platform/quickstarts/redwoodjs.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Quickstart: RedwoodJS'
 sidebar_position: 3
+image: /img/og/platform/quickstart-redwoodjs.png
 ---
 
 import Tabs from '@theme/Tabs'
@@ -1089,7 +1090,8 @@ export function UserProvider({ children = null }) {
   const { userMetadata } = useAuth()
 
   const { loading, error, data } = useQuery(GET_USER_QUERY, {
-    variables: { id: userMetadata?.id }
+    variables: { id: userMetadata?.id },
+    skip: !userMetadata?.id
   })
   const user = data?.user
 

docs/docs/platform/quickstarts/vue.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Quickstart: Vue'
 sidebar_position: 3
+image: /img/og/platform/quickstart-vue.png
 ---
 
 import Tabs from '@theme/Tabs'

docs/docs/platform/serverless-functions.mdx

@@ -1,6 +1,7 @@
 ---
 title: 'Serverless Functions'
 sidebar_position: 8
+image: /img/og/platform/serverless-functions.png
 ---
 
 import Tabs from '@theme/Tabs'

docs/docs/platform/storage.md

@@ -1,101 +0,0 @@
----
-title: 'Storage'
-sidebar_position: 7
----
-
-Nhost stores and serves files of any type in your backend.
-
-The metadata for files hosted on Nhost is available in the `storage.files` table of your database, and thus is also accessible in the GraphQL API. This allows you to fetch a list of files to display in your frontend, for example.
-
----
-
-## Buckets
-
-Buckets are used to organize files and group permissions for files. Buckets are stored in the `storage.buckets` table in your database, and accessible via `buckets` in your GraphQL API.
-
-Buckets are a way to segment permissions for file type, minimum and maximum file size, cache control, download expiration, and if pre-signed URLs are allowed.
-
----
-
-## Permissions
-
-Upload, read and delete permissions for files are managed through Hasura's permission system, just like other permissions.
-
-### Upload
-
-To upload a file, a user must have the `insert` permission to the `storage.files` table. The following columns must be checked:
-
-- `id`
-- `bucket_id`
-- `name`
-- `mime_type`
-
-### Select
-
-To read and download a file, a user must have the `select` permission to the `storage.files` table. Only the `id` column is required, but as a best practice you should allow reading all columns.
-
-### Delete
-
-To delete a file, a user must have the `delete` permission to the `storage.files` table.
-
-> Updating an existing file is not supported. Delete and upload a new file instead.
-
----
-
-## Accessing files
-
-To access a file, make an HTTP GET request to `/v1/storage/files/{id}` with the `Authorization` header set with the access token returned by Nhost Auth. Alternatively, you can create a pre-signed URL by making an HTTP GET request to `/v1/storage/files/{id}/presignedurl` with the `Authorization` header set with the access token returned by Nhost Auth.
-
-If the file is publicly accessible, there is no need to set the `Authorization` header. The file is publicly accessible if the permission for the `public` role is set to allow reading the file metadata in Hasura for the `storage.files` table.
-
-### Pre-signed URL
-
-A pre-signed URL is a unique URL that is used to access the file. Anyone with the pre-signed URL can access the file without exceptions. The URL is generated by Nhost Storage API and is valid for a limited time. The time limit of the pre-signed URL is determined by the `download_expiration` column in the bucket where the file is.
-
-Using pre-signed URL is a good way to share files to people who don't have access to the file directly, or to access the file without setting the `Authorization` headers, for example when displaying the file in an `img` tag.
-
-## Example with GraphQL
-
-Let's say we're building a CRM and we want to store files for each customer.
-
-In our CRM, we have the following two tables:
-
-- `customers`
-  - `id`
-  - `name`
-  - `address`
-- `customer_files`
-  - `id`
-  - `customer_id` (foreign key to `customers.id`)
-  - `file_id` (foreign key to `storage.files.id`)
-
-We also have created relationships between `customers` and `customer_files` and between `customer_files` and `storage.files`.
-
-We can now query the data with the following query:
-
-```graphql
-query {
-  customer {
-    # customer table
-    id
-    name
-    customer_files {
-      # customer_files table
-      id
-      file {
-        # storage.files table
-        id
-        name
-        size
-        mime_type
-      }
-    }
-  }
-}
-```
-
-To upload a file, this is what we do;
-
-1. Upload a file
-2. Get the `id` of the file. The server returns this.
-3. Insert the `id` of the file together with the customer's id into the `customer_files` table.

docs/docs/platform/storage.mdx

@@ -0,0 +1,244 @@
+---
+title: 'Storage'
+sidebar_position: 7
+image: /img/og/platform/storage.png
+---
+
+import Tabs from '@theme/Tabs'
+import TabItem from '@theme/TabItem'
+
+Nhost Storage enables you to let your users upload and download files. Nhost Storage is integrated with the [GraphQL API](/platform/graphql) and its permission system from Hasura.
+
+## Files
+
+Files can be of any type, such as images, documents, videos, etc.
+
+File metadata is stored in your database in the `files` table in the `storage` schema. This means that file metadata is available in your GraphQL API, which makes it easy to:
+
+- Read file metadata via GraphQL.
+- Manage file permissions (in Hasura).
+- Create GraphQL relationships between files and your database tables.
+
+:::warning
+Don't modify the database schema, nor GraphQL root fields in any of the tables in the `storage` schema. 
+:::
+
+:::tip
+You're allowed to add and modify the following:
+
+- GraphQL Relationships
+- Permissions
+:::
+
+
+### Upload File
+
+When a file is uploaded, the file metadata is inserted into the `storage.files` table and a file `id` is returned. The file's `id` is how you reference and access the file. It's recommended to create your own table to store the uploaded file `id`, to access the file in the future.
+
+<Tabs groupId="http-sdk">
+  <TabItem value="js" label="JavaScript">
+
+```js
+await nhost.storage.upload({ file })
+```
+
+Learn more about [`upload()`](/reference/javascript/storage/upload).
+
+  </TabItem>
+  <TabItem value="http" label="HTTP" default>
+
+```http
+POST /v1/storage/files HTTP/1.1
+```
+
+  </TabItem>
+</Tabs>
+
+### Download File
+
+There are two ways to download a file:
+
+- Public URL.
+- Pre-signed URL.
+
+#### Public URL
+
+Public URLs are available for both unauthenticated and authenticated users. Permissions are checked for every file request. To get a public URL for a file, you would normally use the `public` role to set **select** permissions.
+
+<Tabs groupId="http-sdk">
+  <TabItem value="js" label="JavaScript">
+
+```js
+await nhost.storage.getPublicUrl({
+  fileId: '<File-ID>'
+})
+```
+
+Learn more about [`getPublicUrl()`](/reference/javascript/storage/get-public-url).
+
+  </TabItem>
+  <TabItem value="http" label="HTTP" default>
+
+```http
+GET /v1/storage/files/{file_id} HTTP/1.1
+```
+
+  </TabItem>
+</Tabs>
+
+#### Pre-signed URL
+
+Pre-signed URLs work a bit differently from public URLs.
+
+The permission check only happens when the user requests a pre-signed URL. Once a pre-signed URL is generated, anyone with the pre-signed URL can download the file.
+
+Pre-signed URLs expire, and stop work, after a set amount of time. By default, for files in the `default` bucket, the expiration time is 30 seconds. You can change the expiration time for pre-signed URLs by changing the `download_expiration` (in seconds) field on the bucket where the file is located.
+
+<Tabs groupId="http-sdk">
+  <TabItem value="js" label="JavaScript">
+
+```js
+await nhost.storage.getPresignedUrl({
+  fileId: '<File-ID>'
+})
+```
+
+Learn more about [`getPresignedUrl()`](/reference/javascript/storage/get-presigned-url).
+
+  </TabItem>
+  <TabItem value="http" label="HTTP" default>
+
+```http
+GET /v1/storage/files/{file_id}/presignedurl HTTP/1.1
+```
+
+  </TabItem>
+</Tabs>
+
+### Delete File
+
+Delete a file and the file metadata in the database.
+
+<Tabs groupId="http-sdk">
+  <TabItem value="js" label="JavaScript">
+
+```js
+const { error } = await nhost.storage.delete({ fileId: 'uuid' })
+```
+
+Learn more about [`delete()`](/reference/javascript/storage/delete).
+
+  </TabItem>
+  <TabItem value="http" label="HTTP" default>
+
+```http
+DELETE /v1/storage/files/{file_id} HTTP/1.1
+```
+
+  </TabItem>
+</Tabs>
+
+## Buckets
+
+Buckets are used to organize files and group permissions for files. Buckets are stored in the `storage.buckets` table in your database, and accessible via `buckets` in your GraphQL API.
+
+For each bucket, you can specify file permissions for the following properties:
+
+- MIME type.
+- Minimum size.
+- Maximum size.
+- Cache control.
+- Allow pre-signed URLs.
+- Download expiration (for pre-signed URLs).
+
+There is a default bucket (`default`) that is used if no bucket is specified during file upload. It's not possible to delete the `default` bucket.
+
+## Permissions
+
+Permissions to upload, download, and delete files are managed through Hasura's permission system on the `storage.files` table.
+
+### Upload
+
+To upload a file, a user must have the **`insert` permission** to the `storage.files` table. The following columns must be allowed to insert:
+
+- `id`
+- `bucket_id`
+- `name`
+- `mime_type`
+
+### Download
+
+To download a file, a user must have the **`select` permission** to the `storage.files` table. Only the `id` column is required, but we recommend allowing to select all columns. 
+
+### Delete
+
+To delete a file, a user must have the **`delete` permission** to the `storage.files` table.
+
+Updating an existing file is not supported. If you need to update a file, delete the file and upload a new file.
+
+Just deleting the file metadata in the `storage.files` table does **not** delete the actual file. Always delete files via Nhost Storage. This way, both the file metadata and the actual file are deleted.
+
+## Image Transformation
+
+Images can be transformed, on the fly, by adding query parameters. The following query parameters are available:
+
+- `w` - Width of the image in pixels.
+- `h` - Height of the image in pixels.
+
+Image Transformation works on both public and pre-signed URLs.
+
+**Example**: Transform an image to 500px width (`?w=500`):
+
+```text
+https://[subdomain].nhost.run/v1/storage/files/08e6fa32-0880-4d0e-a832-278198acb363?w=500
+```
+
+## Example: CRM System
+
+Let's say you want to build a CRM system and you want to store files for customers. This is one way how you could do that.
+
+Start with, you would have two tables:
+
+1. `customers` - Customer data.
+2. `customer_files` - What file belongs to what customer.
+
+```text 
+- customers
+  - id
+  - name
+  - address
+customer_files
+  - id
+  - customer_id (Foreign Key to `customers.id`)
+  - file_id (Foreign Key to `storage.files.id`)
+```
+
+You would also create [Hasura Relationships](https://hasura.io/docs/latest/graphql/core/databases/postgres/schema/table-relationships/index/) (GraphQL relationships) between between `customers` and `customer_files` and between `customer_files` and `storage.files`.
+
+With the two tables and GraphQL relationships in place, you can query customers and the customer's files like this:
+
+```graphql
+query {
+  customers { # customers table
+    id
+    name
+    customer_files { # customer_files tabel
+      id
+      file { # storage.files table
+        id
+        name
+        size
+        mimeType
+      }
+    }
+  }
+}
+```
+
+The file upload process would be as follows:
+
+1. Upload a file.
+2. Get the returned file id.
+3. Insert the file `id` and the customer's `id` into the `customer_files` table.
+
+This would allow you to upload and download files belonging to specific customers in your CRM system.

docs/docs/reference/hasura-auth/environment-variables.md

@@ -43,7 +43,6 @@ sidebar_position: 3
 | 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`                      |

docs/docs/reference/javascript/index.mdx

@@ -1,12 +1,12 @@
 ---
-title: 'Overview'
+title: 'JavaScript'
 sidebar_position: 1
 ---
 
 import Tabs from '@theme/Tabs'
 import TabItem from '@theme/TabItem'
 
-The Nhost client is the primary way of interacting with your Nhost app. It exposes a standard interface for each of the following services:
+The Nhost JavaScript client is the primary way of interacting with your Nhost app. It exposes a standard interface for each of the following services:
 
 - [Authentication](/reference/javascript/auth)
 - [Storage](/reference/javascript/storage)
@@ -63,4 +63,4 @@ If the user is not signed in no authorization header is set. If no authorization
 
 ## TypeScript Support
 
-The Nhost JS SDK has TypeScript typings included. You don’t have to import types separately.
+The Nhost JavaScript client is written in TypeScript and has full TypeScript support.

docs/docs/reference/nextjs/index.mdx

@@ -1,5 +1,5 @@
 ---
-title: 'Overview'
+title: 'Next.js'
 sidebar_position: 1
 ---
 

docs/docs/reference/react/index.mdx

@@ -1,5 +1,5 @@
 ---
-title: 'Overview'
+title: 'React'
 sidebar_position: 1
 ---
 
@@ -31,20 +31,27 @@ yarn add @nhost/react graphql
 
 ## Initializing
 
-Initialize a single `nhost` instance and wrap your app with the `NhostReactProvider`.
+After installation, initialize a single Nhost Client (`nhost`) under `src/lib/nhost.js`.
+
+```jsx title=src/lib/nhost.js
+import { NhostClient } from '@nhost/react'
+const nhost = new NhostClient({
+  backendUrl: '<Your Nhost Backend URL>'
+})
+export { nhost }
+```
+
+Import `nhost` and wrap your app with the `NhostReactProvider`.
 
 ```jsx title=src/App.tsx
 import React from 'react'
 import ReactDOM from 'react-dom'
 
 import { NhostClient, NhostReactProvider } from '@nhost/react'
+import { nhost } from './lib/nhost'
 
 import App from './App'
 
-const nhost = new NhostClient({
-  backendUrl: '<Your Nhost Backend URL>'
-})
-
 ReactDOM.render(
   <React.StrictMode>
     <NhostReactProvider nhost={nhost}>
@@ -53,8 +60,11 @@ ReactDOM.render(
   </React.StrictMode>,
   document.getElementById('root')
 )
+export { nhost }
 ```
 
+
+
 :::info
 
 The `nhost` instance created with the `NhostClient` above is the same as the [JavaScript Nhost client](/reference/javascript).

docs/docs/reference/vue/index.mdx

@@ -1,5 +1,5 @@
 ---
-title: 'Overview'
+title: 'Vue'
 sidebar_position: 1
 ---
 

docs/docusaurus.config.js

@@ -4,20 +4,29 @@
 const lightCodeTheme = require('prism-react-renderer/themes/github')
 const darkCodeTheme = require('prism-react-renderer/themes/dracula')
 
+const getBaseUrl = () => {
+  if (process.env.VERCEL_ENV === 'production') {
+    return 'https://docs.nhost.io'
+  } else if (process.env.VERCEL_ENV === 'preview') {
+    return `https://${process.env.VERCEL_URL}`
+  } else {
+    return `http://localhost:3000`
+  }
+}
+
 /** @type {import('@docusaurus/types').Config} */
 const config = {
   title: 'Nhost Docs',
-  tagline:
-    'Nhost is an open-source, real-time, server-less backend platform for building reliable apps that scale with your business.',
-  url: 'https://docs.nhost.io',
+  tagline: 'Nhost is an open source Firebase alternative with GraphQL.',
+  url: getBaseUrl(),
   trailingSlash: false,
   baseUrl: '/',
   onBrokenLinks: 'throw',
   onBrokenMarkdownLinks: 'warn',
   favicon: 'img/favicon.png',
-  organizationName: 'nhost', // Usually your GitHub org/user name.
-  projectName: 'docs', // Usually your repo name.
-
+  organizationName: 'nhost',
+  projectName: 'docs',
+  plugins: [require.resolve("docusaurus-plugin-image-zoom")],
   presets: [
     [
       'classic',
@@ -33,7 +42,6 @@ const config = {
           breadcrumbs: false,
           sidebarPath: require.resolve('./sidebars.js'),
           remarkPlugins: [require('mdx-mermaid')],
-          // Please change this to your repo.
           editUrl: 'https://github.com/nhost/nhost/edit/main/docs/'
         },
         theme: {
@@ -46,17 +54,13 @@ const config = {
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
+      image: 'img/splash.png',
       colorMode: {
         defaultMode: 'light',
         disableSwitch: false,
         respectPrefersColorScheme: true
       },
-      metadata: [
-        {
-          name: 'og:image',
-          content: 'https://docs.nhost.io/img/splash.png'
-        }
-      ],
+      metadata: [{ name: 'robots', content: 'max-image-preview:large' }],
       navbar: {
         hideOnScroll: true,
         logo: {
@@ -176,6 +180,16 @@ const config = {
         apiKey: 'a76361eaed8ebcd4cf5d9ae2f0c9e746',
         indexName: 'nhost',
         contextualSearch: false
+      },
+      zoom: {
+        selector: '.markdown :not(em) > img',
+        config: {
+          // options you can specify via https://github.com/francoischalifour/medium-zoom#usage
+          background: {
+            light: 'rgb(255, 255, 255)',
+            dark: 'rgb(50, 50, 50)'
+          }
+        }
       }
     })
 }

docs/package.json

@@ -20,6 +20,7 @@
     "@docusaurus/preset-classic": "2.0.0-beta.20",
     "@mdx-js/react": "^1.6.22",
     "clsx": "^1.1.1",
+    "docusaurus-plugin-image-zoom": "^0.1.1",
     "mdx-mermaid": "^1.2.1",
     "mermaid": "^8.14.0",
     "prism-react-renderer": "^1.3.1",

examples/nextjs/components/OauthLinks.tsx

@@ -1,6 +1,6 @@
 import { FaFacebook, FaGithub, FaGoogle } from 'react-icons/fa'
 
-import { useProviderLink } from '@nhost/react'
+import { useProviderLink } from '@nhost/nextjs'
 
 import AuthLink from './AuthLink'
 

examples/vue-quickstart/.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ['../../config/.eslintrc.vue']
+}

examples/vue-quickstart/src/pages/profile.vue

@@ -18,7 +18,10 @@ const GET_USER_SUBSCRIPTION = gql`
 `
 const id = useUserId()
 
-const { result } = useSubscription(GET_USER_SUBSCRIPTION, computed(() => ({ id: id.value })))
+const { result } = useSubscription(
+  GET_USER_SUBSCRIPTION,
+  computed(() => ({ id: id.value }))
+)
 const user = computed(() => result.value?.user)
 
 const UPDATE_USER_MUTATION = gql`
@@ -42,13 +45,12 @@ const updateUserProfile = async (event: Event) => {
       displayName: `${firstName.value} ${lastName.value}`.trim(),
       metadata: {
         firstName: firstName.value,
-        lastName: lastName.value,
-      },
+        lastName: lastName.value
+      }
     })
     await nhost.auth.refreshSession()
   }
 }
-
 </script>
 
 <template>
@@ -59,15 +61,11 @@ const updateUserProfile = async (event: Event) => {
       <em text-sm op75>Quickstart</em>
     </p>
     <div v-if="user" py-4>
-      <p>
-        Hello, {{ user.displayName }}. Your email is {{ user.email }}.
-      </p>
+      <p>Hello, {{ user.displayName }}. Your email is {{ user.email }}.</p>
       <form @submit="updateUserProfile">
-        <input v-model="firstName" placeholder="First name" class="input"><br>
-        <input v-model="lastName" placeholder="Last name" class="input"><br>
-        <button class="btn-submit" :disabled="loading">
-          Save
-        </button>
+        <input v-model="firstName" placeholder="First name" class="input" /><br />
+        <input v-model="lastName" placeholder="Last name" class="input" /><br />
+        <button class="btn-submit" :disabled="loading">Save</button>
         <div v-if="error">
           {{ error.message }}
         </div>

examples/vue-quickstart/vite.config.ts

@@ -11,12 +11,12 @@ import Unocss from 'unocss/vite'
 export default defineConfig({
   resolve: {
     alias: {
-      '~/': `${path.resolve(__dirname, 'src')}/`,
-    },
+      '~/': `${path.resolve(__dirname, 'src')}/`
+    }
   },
   plugins: [
     Vue({
-      reactivityTransform: true,
+      reactivityTransform: true
     }),
 
     // https://github.com/hannoeru/vite-plugin-pages
@@ -25,21 +25,21 @@ export default defineConfig({
     // https://github.com/antfu/unplugin-auto-import
     AutoImport({
       imports: ['vue/macros', 'vue-router', '@vueuse/core'],
-      dts: true,
+      dts: true
     }),
 
     // https://github.com/antfu/vite-plugin-components
     Components({
-      dts: true,
+      dts: true
     }),
 
     // https://github.com/antfu/unocss
     // see unocss.config.ts for config
-    Unocss(),
+    Unocss()
   ],
 
   // https://github.com/vitest-dev/vitest
   test: {
-    environment: 'jsdom',
-  },
+    environment: 'jsdom'
+  }
 })

package.json

@@ -54,7 +54,6 @@
     "@typescript-eslint/parser": "^5.22.0",
     "@vitejs/plugin-react": "^1.3.2",
     "c8": "^7.11.2",
-    "cpy-cli": "^4.1.0",
     "eslint": "^8.14.0",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-flowtype": "^8.0.3",

packages/apollo/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @nhost/apollo
 
+## 0.5.13
+
+### Patch Changes
+
+- @nhost/nhost-js@1.2.4
+
+## 0.5.12
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/nhost-js@1.2.3
+
+## 0.5.11
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/nhost-js@1.2.2
+
+## 0.5.10
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/nhost-js@1.2.1
+
 ## 0.5.9
 
 ### Patch Changes

packages/apollo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/apollo",
-  "version": "0.5.9",
+  "version": "0.5.13",
   "description": "Nhost Apollo Client library",
   "license": "MIT",
   "keywords": [
@@ -22,7 +22,7 @@
     "url": "https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -32,11 +32,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -45,7 +42,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.lib.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.lib.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.lib.config.js",
     "build:umd": "vite build --config ../../config/vite.lib.umd.config.js",
     "test": "vitest run --config ../../config/vite.lib.config.js",
     "test:watch": "vitest --config ../../config/vite.lib.config.js",

packages/core/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @nhost/core
 
+## 0.6.5
+
+### Patch Changes
+
+- 08a37aae: correct rewriting options when `clientUrl` is not available
+  The client URL is set to `window.location.origin`, so it can rewrite redirection urls that are passed on to authenticaion methods. However, `clientUrl` is set to `''` when running on the server side. This fix then avoid raising an error when trying to rewrite `redirectTo` on non-browser environment, and forces `useProviderLink` to be rendered on the client side.
+
+## 0.6.4
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+
+## 0.6.3
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+
+## 0.6.2
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+
 ## 0.6.1
 
 ### Patch Changes

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/core",
-  "version": "0.6.1",
+  "version": "0.6.5",
   "description": "Nhost core client library",
   "license": "MIT",
   "keywords": [
@@ -21,7 +21,7 @@
     "url": "https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -31,11 +31,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -44,7 +41,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.lib.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.lib.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.lib.config.js",
     "build:umd": "vite build --config ../../config/vite.lib.umd.config.js",
     "test": "vitest run --config ../../config/vite.lib.config.js",
     "test:watch": "vitest --config ../../config/vite.lib.config.js",

packages/core/src/utils.ts

@@ -17,21 +17,39 @@ export const encodeQueryParameters = (baseUrl: string, parameters?: Record<strin
   else return baseUrl
 }
 
-export const rewriteRedirectTo = <T extends RedirectOption>(clientUrl: string, options?: T) => {
+/**
+ * Transform options that include a redirectTo property so the
+ * redirect url is absolute, given a base clientUrl.
+ * If no client url is given, any relative redirectUrl is removed while
+ * the other options are sent as-is.
+ * @param clientUrl base client url
+ * @param options
+ * @returns
+ */
+export const rewriteRedirectTo = <T extends RedirectOption>(
+  clientUrl?: string,
+  options?: T
+): (Omit<T, 'redirectTo'> & { redirectTo?: string }) | undefined => {
   if (!options?.redirectTo) {
     return options
   }
+  const { redirectTo, ...otherOptions } = options
+  // * If the clientUrl is not defined, we can't rewrite the redirectTo
+  if (!clientUrl) {
+    // * If redirectTo is a relative path, we therefore pull it out of the options
+    if (redirectTo.startsWith('/')) {
+      return otherOptions
+    } else {
+      return options
+    }
+  }
   const baseClientUrl = new URL(clientUrl)
   const clientParams = Object.fromEntries(new URLSearchParams(baseClientUrl.search))
-  const url = new URL(
-    options.redirectTo.startsWith('/')
-      ? baseClientUrl.origin + options.redirectTo
-      : options.redirectTo
-  )
+  const url = new URL(redirectTo.startsWith('/') ? baseClientUrl.origin + redirectTo : redirectTo)
   const additionalParams = new URLSearchParams(url.search)
   let combinedParams = Object.fromEntries(additionalParams)
 
-  if (options.redirectTo.startsWith('/')) {
+  if (redirectTo.startsWith('/')) {
     combinedParams = { ...clientParams, ...combinedParams }
   }
   let pathName = baseClientUrl.pathname
@@ -39,7 +57,7 @@ export const rewriteRedirectTo = <T extends RedirectOption>(clientUrl: string, o
     pathName += url.pathname.slice(1)
   }
   return {
-    ...options,
+    ...otherOptions,
     redirectTo: encodeQueryParameters(url.origin + pathName, combinedParams)
   }
 }

packages/core/tests/utils.test.ts

@@ -6,6 +6,18 @@ test(`should not add redirectTo when none is given`, async () => {
   expect(rewriteRedirectTo('https://frontend.com')).toBeUndefined()
 })
 
+test(`should remove redirectTo when it's relative and no clientUrl is given`, async () => {
+  const options: RedirectOption = { redirectTo: '/index' }
+  expect(rewriteRedirectTo('', options)).toEqual({})
+  expect(rewriteRedirectTo(undefined, options)).toEqual({})
+})
+
+test(`should preserve options when redirectTo is not a relative url and no clientUrl is given`, async () => {
+  const options: RedirectOption = { redirectTo: 'https://frontend.com' }
+  expect(rewriteRedirectTo('', options)).toEqual(options)
+  expect(rewriteRedirectTo(undefined, options)).toEqual(options)
+})
+
 test(`should append redirectTo with the clientUrl prefix`, async () => {
   const options: RedirectOption = { redirectTo: '/index' }
 

packages/docgen/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nhost/docgen
 
+## 0.1.2
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+
 ## 0.1.1
 
 ### Patch Changes

packages/docgen/package.json

@@ -2,7 +2,7 @@
   "name": "@nhost/docgen",
   "description": "Documentation generator for classes and functions",
   "private": true,
-  "version": "0.1.1",
+  "version": "0.1.2",
   "license": "MIT",
   "main": "dist/index.cjs.js",
   "types": "dist/index.d.ts",

packages/hasura-auth-js/CHANGELOG.md

@@ -1,5 +1,37 @@
 # @nhost/hasura-auth-js
 
+## 1.1.14
+
+### Patch Changes
+
+- Updated dependencies [08a37aae]
+  - @nhost/core@0.6.5
+
+## 1.1.13
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/core@0.6.4
+
+## 1.1.12
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/core@0.6.3
+
+## 1.1.11
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/core@0.6.2
+
 ## 1.1.10
 
 ### Patch Changes

packages/hasura-auth-js/build.js

@@ -1,31 +0,0 @@
-const esbuild = require('esbuild')
-
-// Automatically exclude all node_modules from the bundled version
-const { nodeExternalsPlugin } = require('esbuild-node-externals')
-
-esbuild
-  .build({
-    entryPoints: ['./src/index.ts'],
-    outfile: 'dist/index.cjs.js',
-    bundle: true,
-    minify: false,
-    platform: 'node',
-    format: 'cjs',
-    sourcemap: true,
-    target: 'node14',
-    plugins: [nodeExternalsPlugin()]
-  })
-  .catch(() => process.exit(1))
-
-esbuild
-  .build({
-    entryPoints: ['./src/index.ts'],
-    outfile: 'dist/index.es.js',
-    bundle: true,
-    minify: false, // TODO
-    platform: 'browser',
-    format: 'esm',
-    sourcemap: true,
-    target: 'esnext'
-  })
-  .catch(() => process.exit(1))

packages/hasura-auth-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/hasura-auth-js",
-  "version": "1.1.10",
+  "version": "1.1.14",
   "description": "Hasura-auth client",
   "license": "MIT",
   "keywords": [
@@ -20,7 +20,7 @@
     "url": "https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -30,11 +30,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -43,7 +40,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.lib.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build",
     "build:umd": "vite build --config ../../config/vite.lib.umd.config.js",
     "test": "vitest run",
     "test:watch": "vitest",

packages/hasura-storage-js/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @nhost/hasura-storage-js
 
+## 0.3.3
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+
+## 0.3.2
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+
+## 0.3.1
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+
 ## 0.3.0
 
 ### Minor Changes

packages/hasura-storage-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/hasura-storage-js",
-  "version": "0.3.0",
+  "version": "0.3.3",
   "description": "Hasura-storage client",
   "license": "MIT",
   "keywords": [
@@ -18,7 +18,7 @@
     "url": "https://github.com/nhost/hasura-storage-js.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -28,11 +28,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -41,7 +38,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.lib.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.lib.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.lib.config.js",
     "build:umd": "vite build --config ../../config/vite.lib.umd.config.js",
     "test": "vitest run --config ../../config/vite.lib.config.js",
     "test:watch": "vitest --config ../../config/vite.lib.config.js",

packages/nextjs/CHANGELOG.md

@@ -1,5 +1,47 @@
 # @nhost/nextjs
 
+## 1.2.13
+
+### Patch Changes
+
+- 08a37aae: correct rewriting options when `clientUrl` is not available
+  The client URL is set to `window.location.origin`, so it can rewrite redirection urls that are passed on to authenticaion methods. However, `clientUrl` is set to `''` when running on the server side. This fix then avoid raising an error when trying to rewrite `redirectTo` on non-browser environment, and forces `useProviderLink` to be rendered on the client side.
+- Updated dependencies [08a37aae]
+  - @nhost/core@0.6.5
+  - @nhost/react@0.7.13
+  - @nhost/nhost-js@1.2.4
+
+## 1.2.12
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/core@0.6.4
+  - @nhost/nhost-js@1.2.3
+  - @nhost/react@0.7.12
+
+## 1.2.11
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/core@0.6.3
+  - @nhost/nhost-js@1.2.2
+  - @nhost/react@0.7.11
+
+## 1.2.10
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/core@0.6.2
+  - @nhost/nhost-js@1.2.1
+  - @nhost/react@0.7.10
+
 ## 1.2.9
 
 ### Patch Changes

packages/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/nextjs",
-  "version": "1.2.9",
+  "version": "1.2.13",
   "description": "Nhost NextJS library",
   "license": "MIT",
   "keywords": [
@@ -24,7 +24,7 @@
     "url": "https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -34,11 +34,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -47,7 +44,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.react.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.react.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.react.config.js",
     "build:umd": "vite build --config ../../config/vite.react.umd.config.js",
     "test": "vitest run --config ../../config/vite.react.config.js",
     "test:watch": "vitest --config ../../config/vite.react.config.js",

packages/nhost-js/CHANGELOG.md

@@ -1,5 +1,39 @@
 # @nhost/nhost-js
 
+## 1.2.4
+
+### Patch Changes
+
+- @nhost/hasura-auth-js@1.1.14
+
+## 1.2.3
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/hasura-auth-js@1.1.13
+  - @nhost/hasura-storage-js@0.3.3
+
+## 1.2.2
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/hasura-auth-js@1.1.12
+  - @nhost/hasura-storage-js@0.3.2
+
+## 1.2.1
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/hasura-auth-js@1.1.11
+  - @nhost/hasura-storage-js@0.3.1
+
 ## 1.2.0
 
 ### Minor Changes

packages/nhost-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/nhost-js",
-  "version": "1.2.0",
+  "version": "1.2.4",
   "description": "Nhost JavaScript SDK",
   "license": "MIT",
   "keywords": [
@@ -21,7 +21,7 @@
     "url": "git+https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -31,11 +31,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -44,7 +41,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.lib.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.lib.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.lib.config.js",
     "build:umd": "vite build --config ../../config/vite.lib.umd.config.js",
     "test": "vitest run --config ../../config/vite.lib.config.js",
     "test:watch": "vitest --config ../../config/vite.lib.config.js",

packages/react-apollo/CHANGELOG.md

@@ -1,5 +1,47 @@
 # @nhost/react-apollo
 
+## 4.2.15
+
+### Patch Changes
+
+- Updated dependencies [08a37aae]
+  - @nhost/react@0.7.13
+  - @nhost/apollo@0.5.13
+
+## 4.2.14
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/apollo@0.5.12
+  - @nhost/react@0.7.12
+
+## 4.2.13
+
+### Patch Changes
+
+- ef8c8f9c: fixed imports in `@nhost/react-apollo`
+
+## 4.2.12
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/apollo@0.5.11
+  - @nhost/react@0.7.11
+
+## 4.2.11
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/apollo@0.5.10
+  - @nhost/react@0.7.10
+
 ## 4.2.10
 
 ### Patch Changes

packages/react-apollo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/react-apollo",
-  "version": "4.2.10",
+  "version": "4.2.15",
   "description": "Nhost React Apollo client",
   "license": "MIT",
   "keywords": [
@@ -23,7 +23,7 @@
     "url": "git+https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -33,11 +33,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -46,7 +43,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.react.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.react.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.react.config.js",
     "build:umd": "vite build --config ../../config/vite.react.umd.config.js",
     "test": "vitest run --config ../../config/vite.react.config.js",
     "test:watch": "vitest --config ../../config/vite.react.config.js",

packages/react-auth/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @nhost/react-auth
 
+## 3.0.11
+
+### Patch Changes
+
+- Updated dependencies [08a37aae]
+  - @nhost/react@0.7.13
+  - @nhost/hasura-auth-js@1.1.14
+
+## 3.0.10
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/hasura-auth-js@1.1.13
+  - @nhost/react@0.7.12
+
+## 3.0.9
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/hasura-auth-js@1.1.12
+  - @nhost/react@0.7.11
+
+## 3.0.8
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/hasura-auth-js@1.1.11
+  - @nhost/react@0.7.10
+
 ## 3.0.7
 
 ### Patch Changes

packages/react-auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/react-auth",
-  "version": "3.0.7",
+  "version": "3.0.11",
   "description": "Nhost React client",
   "license": "MIT",
   "keywords": [
@@ -22,9 +22,9 @@
     "url": "git+https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
-  "source": "src/index.tsx",
+  "source": "src/index.ts",
   "files": [
     "dist",
     "umd",
@@ -32,11 +32,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -45,7 +42,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.react.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.react.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.react.config.js",
     "build:umd": "vite build --config ../../config/vite.react.umd.config.js",
     "test": "vitest run --config ../../config/vite.react.config.js",
     "test:watch": "vitest --config ../../config/vite.react.config.js",

packages/react/CHANGELOG.md

@@ -1,5 +1,43 @@
 # @nhost/react
 
+## 0.7.13
+
+### Patch Changes
+
+- 08a37aae: correct rewriting options when `clientUrl` is not available
+  The client URL is set to `window.location.origin`, so it can rewrite redirection urls that are passed on to authenticaion methods. However, `clientUrl` is set to `''` when running on the server side. This fix then avoid raising an error when trying to rewrite `redirectTo` on non-browser environment, and forces `useProviderLink` to be rendered on the client side.
+- Updated dependencies [08a37aae]
+  - @nhost/core@0.6.5
+  - @nhost/nhost-js@1.2.4
+
+## 0.7.12
+
+### Patch Changes
+
+- ebad0936: reverted ESM related changes
+- Updated dependencies [ebad0936]
+  - @nhost/core@0.6.4
+  - @nhost/nhost-js@1.2.3
+
+## 0.7.11
+
+### Patch Changes
+
+- 1b37b9f6: fix: ESM import path fixes
+- Updated dependencies [1b37b9f6]
+  - @nhost/core@0.6.3
+  - @nhost/nhost-js@1.2.2
+
+## 0.7.10
+
+### Patch Changes
+
+- 78341491: fix: Next.js and React issues with ESM packages
+  chore: Updated output bundle names
+- Updated dependencies [78341491]
+  - @nhost/core@0.6.2
+  - @nhost/nhost-js@1.2.1
+
 ## 0.7.9
 
 ### Patch Changes

packages/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nhost/react",
-  "version": "0.7.9",
+  "version": "0.7.13",
   "description": "Nhost React library",
   "license": "MIT",
   "keywords": [
@@ -22,7 +22,7 @@
     "url": "https://github.com/nhost/nhost.git"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "files": [
@@ -32,11 +32,8 @@
   ],
   "exports": {
     ".": {
-      "node": {
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.cjs.js"
-      },
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
     }
   },
   "publishConfig": {
@@ -45,7 +42,7 @@
   "scripts": {
     "dev": "vite build --config ../../config/vite.react.dev.config.js",
     "build": "run-p build:lib build:umd",
-    "build:lib": "vite build --config ../../config/vite.react.config.js && cpy --flat dist/index.mjs dist --rename=index.es.js && cpy --flat dist/index.mjs.map dist --rename index.es.js.map",
+    "build:lib": "vite build --config ../../config/vite.react.config.js",
     "build:umd": "vite build --config ../../config/vite.react.umd.config.js",
     "test": "vitest run --config ../../config/vite.react.config.js",
     "test:watch": "vitest --config ../../config/vite.react.config.js",
@@ -62,7 +59,7 @@
     "@nhost/core": "workspace:*",
     "@nhost/nhost-js": "workspace:*",
     "@xstate/react": "^3.0.0",
-    "immer": "^9.0.12",
+    "immer": "^9.0.14",
     "jwt-decode": "^3.1.2",
     "xstate": "^4.31.0"
   },

packages/react/src/useProviderLink.ts

@@ -1,4 +1,4 @@
-import { useContext, useMemo } from 'react'
+import { useContext, useEffect, useState } from 'react'
 
 import { encodeQueryParameters, Provider, ProviderOptions, rewriteRedirectTo } from '@nhost/core'
 
@@ -29,13 +29,25 @@ import { NhostReactContext } from './provider'
  * ```
  */
 export const useProviderLink = (options?: ProviderOptions) => {
+  /**
+   * @internal When using Nextjs or any SSR framework, nhost.auth.client.clientUrl will be set to `undefined`
+   * as its value is set to window.location.origin.
+   * This is because the request context is not available when setting up the client `new NhostClient()` outside of
+   * the React/Nextjs context.
+   */
+  const [isSSR, setIsSSR] = useState(true)
+
+  useEffect(() => {
+    setIsSSR(false)
+  }, [])
+
   const nhost = useContext(NhostReactContext)
 
   return new Proxy({} as Record<Provider, string>, {
     get(_, provider: string) {
       return encodeQueryParameters(
         `${nhost.auth.client.backendUrl}/signin/provider/${provider}`,
-        rewriteRedirectTo(nhost.auth.client.clientUrl, options as any)
+        rewriteRedirectTo(isSSR ? undefined : nhost.auth.client.clientUrl, options as any)
       )
     }
   })