nhost

Patch Changes

• 6eeb9d2: Wait for the authentication status to be known before executing auth actions
  The auth client was able to start actions such as signUp or signIn before the authentication state was ready (e.g. before initial refresh token could be processed).
  This patch solves the problem in waiting for the authentication status to be known before running these actions.
• Updated dependencies [4420c0e]
  • @nhost/[email protected]

Patch Changes

• @nhost/[email protected]

Patch Changes

• Updated dependencies [6eeb9d2]
  • @nhost/[email protected]

Patch Changes

• @nhost/[email protected]
• @nhost/[email protected]

Patch Changes

• Updated dependencies [39df4d5]
  • @nhost/[email protected]

Patch Changes

• Updated dependencies [39df4d5]
  • @nhost/[email protected]

Minor Changes

• 39df4d5: Deprecate useAuthLoading and introduce useAuthenticationStatus
  When using both useAuthLoading and useAuthenticated together, the hooks rerender independently from each other.
  As a result, when a user loads the page while he previously authenticated, the hooks values were chronologically:

  isLoading	isAuthenticated
  true	false
  false	false
  false	true

  The intermediate (false, false) is incorrect and is causing issues when using an authentication gate.

  It is therefore recommended to stop using useAuthLoading, and to use useAuthenticationStatus instead, in order to keep the loading state and the authentication in sync within the same hook.

  Usage:

  const { isLoading, isAuthenticated } = useAuthenticationStatus()
  

  Fixes this issue

Patch Changes

• @nhost/[email protected]
• @nhost/[email protected]

Patch Changes

• Updated dependencies [ab36f90]
  • @nhost/[email protected]

Patch Changes

• @nhost/[email protected]

Patch Changes

• @nhost/[email protected]
• @nhost/[email protected]

Patch Changes

• ab36f90: Correct access to user/session information through getUser/getSession/isReady function when authentication state is not ready yet
  In some cases e.g. NextJS build, auth.getUser(), auth.getSession() or auth.isReady() should be accessible without raising an error.

Minor Changes

• 744fd69: Introducing useSendVerificationEmail

  While useSignInEmailPassword automatically sends a verification email (when the backend is configured to do so), an user may sometime want to request for an verification email to be sent again. See the documentation for further information about how to use this hook.

• 744fd69: Rename hooks and their methods to make them more explicit

  • useEmailPasswordlessSignIn

    • Hook renamed to useSignInEmailPasswordless
    • signIn renamed to signInEmailPasswordless

  • useEmailPasswordSignIn

    • Hook renamed to useSignInEmailPassword
    • signIn renamed to signInEmailPassword
    • needsVerification renamed to needsEmailVerification

  • useEmailPasswordSignUp

    • Hook renamed to useSignUpEmailPassword
    • signUp renamed to signUpEmailPassword
    • needsVerification renamed to needsEmailVerification

  • useAnonymousSignIn

    • Hook renamed to useSignInAnonymous
    • renamed signIn to signInAnonymous

  • useChangeEmail

    • needsVerification renamed to needsEmailVerification

• 744fd69: Introducing useSignInAnonymous

  Anonymous Sign-In is a feature that allows users to get a temporary id without attaching yet any personal information such as an email or a passowrd.

  Anonymous users can then run GraphQL operations, with a specific public role that is distinct from the default user role. The anonymous can then "deanonymize" their account at a later stage in attaching the missing registration information and an authentication method.

  Note Anonymous Sign-In is not available out of the box yet in the Nhost cloud, but will be available in the near future.

  Note 2 The deanonymisation process is not yet available. This is also part of our roadmap.

  const { signInAnonymous, isLoading, isSuccess, isError, error } = useSignInAnonymous()
  

  Name	Type	Notes
  signInAnonymous	() => void	Registers an anonymous user
  isLoading	boolean	Returns true when the action is executing, false when it finished its execution.
  isSuccess	boolean	Returns true if the sign-up suceeded. Returns false if the new email needs to be verified first, or if an error occurred.
  isError	boolean	Returns true if an error occurred.
  error	{status: number, error: string, message: string} | undefined	Provides details about the error.

  Usage

  import { useSignInAnonymous } from '@nhost/react'
  
  const Component = () => {
    const { signInAnonymous, isSuccess } = useSignInAnonymous(email, password)
    return (
      <div>
        <button onClick={signInAnonymous}>Anonymous sign-in</button>
        {isSuccess && <div>You are now signed in anonymously</div>}
      </div>
    )
  }
  

• 744fd69: Add options to useProviderLink

  Since Hasura Auth version 0.4, it is possible to pass on options when signing up or signin in through an OAuth provider. It is now possible to determine these options in the useProviderLink, so it generates the right URL when using the provider links.

  See the React documentation for additional information.

• 744fd69: Time-based One-Time Password Multi-Factor Authentication

  Note MFA is not available out of the box yet in the Nhost cloud, but will be available in the near future.

  When enabled in the backend, users that signed up with an email and a password can opt-in for an additional authentication security measure.
  MFA can be activated in using the new useConfigMfa hook.

  Two methods has been also added to useEmailPasswordSignIn: when MFA is active, authentication won't be a success straight after signin up with an email and a password.
  The new needsMfaOtp will then appear as true, and the authentication will succeed only when the user will have sent back the OTP code with sendMfaOtp(code:string).

  const { generateQrCode, isGenerating, isGenerated, qrCodeDataUrl, activateMfa, isActivating, isActivated, isError, error } =
    useConfigMfa(code?: string)
  

  Name	Type	Notes
  generateQrCode	() => void	Generates the QR code that will be used by the MFA app e.g. Google Authenticator or Authy.
  isGenerating	boolean	Returns true if the QR code is generating but not yet available
  isGenerated	boolean	Returns true when the QR code has been successfully generated and is available
  qrCodeDataUrl	string	Returns the QR code as a Data URL
  activateMfa	(code?: string) => void	Activate MFA from the code given by the MFA authentication application
  isActivating	boolean	Returns true when the activation code has been sent to the server, and we await server response
  isActivated	boolean	Returns true when MFA has been successfully activated
  isError	boolean	Returns true if an error occurred.
  error	{status: number, error: string, message: string} | undefined	Provides details about the error.

  Usage

  import { useConfigMfa } from '@nhost/react'
  import { useState } from 'react'
  
  export const Mfa: React.FC = () => {
    const [code, setCode] = useState('')
    const { generateQrCode, activateMfa, isActivated, isGenerated, qrCodeDataUrl } =
      useConfigMfa(code)
  
    return (
      <div>
        {!isGenerated && (
          <button block appearance="primary" onClick={generateQrCode}>
            Generate
          </button>
        )}
        {isGenerated && !isActivated && (
          <div>
            <img alt="qrcode" src={qrCodeDataUrl} />
            <input value={code} onChange={onChange={(event) => setCode(event.target.value)}} placeholder="Enter activation code" />
            <button block appearance="primary" onClick={activateMfa}>
              Activate
            </button>
          </div>
        )}
        {isActivated && <div>MFA has been activated!!!</div>}
      </div>
    )
  }
  
  

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]
  • @nhost/[email protected]

Minor Changes

• 744fd69: Introducing useSendVerificationEmail

  While useSignInEmailPassword automatically sends a verification email (when the backend is configured to do so), an user may sometime want to request for an verification email to be sent again. See the documentation for further information about how to use this hook.

• 744fd69: Rename hooks and their methods to make them more explicit

  • useEmailPasswordlessSignIn

    • Hook renamed to useSignInEmailPasswordless
    • signIn renamed to signInEmailPasswordless

  • useEmailPasswordSignIn

    • Hook renamed to useSignInEmailPassword
    • signIn renamed to signInEmailPassword
    • needsVerification renamed to needsEmailVerification

  • useEmailPasswordSignUp

    • Hook renamed to useSignUpEmailPassword
    • signUp renamed to signUpEmailPassword
    • needsVerification renamed to needsEmailVerification

  • useAnonymousSignIn

    • Hook renamed to useSignInAnonymous
    • renamed signIn to signInAnonymous

  • useChangeEmail

    • needsVerification renamed to needsEmailVerification

• 744fd69: Introducing useSignInAnonymous

  Anonymous Sign-In is a feature that allows users to get a temporary id without attaching yet any personal information such as an email or a passowrd.

  Anonymous users can then run GraphQL operations, with a specific public role that is distinct from the default user role. The anonymous can then "deanonymize" their account at a later stage in attaching the missing registration information and an authentication method.

  Note Anonymous Sign-In is not available out of the box yet in the Nhost cloud, but will be available in the near future.

  Note 2 The deanonymisation process is not yet available. This is also part of our roadmap.

  const { signInAnonymous, isLoading, isSuccess, isError, error } = useSignInAnonymous()
  

  Name	Type	Notes
  signInAnonymous	() => void	Registers an anonymous user
  isLoading	boolean	Returns true when the action is executing, false when it finished its execution.
  isSuccess	boolean	Returns true if the sign-up suceeded. Returns false if the new email needs to be verified first, or if an error occurred.
  isError	boolean	Returns true if an error occurred.
  error	{status: number, error: string, message: string} | undefined	Provides details about the error.

  Usage

  import { useSignInAnonymous } from '@nhost/react'
  
  const Component = () => {
    const { signInAnonymous, isSuccess } = useSignInAnonymous(email, password)
    return (
      <div>
        <button onClick={signInAnonymous}>Anonymous sign-in</button>
        {isSuccess && <div>You are now signed in anonymously</div>}
      </div>
    )
  }
  

• 744fd69: Add options to useProviderLink

  Since Hasura Auth version 0.4, it is possible to pass on options when signing up or signin in through an OAuth provider. It is now possible to determine these options in the useProviderLink, so it generates the right URL when using the provider links.

  See the React documentation for additional information.

• 744fd69: Time-based One-Time Password Multi-Factor Authentication

  Note MFA is not available out of the box yet in the Nhost cloud, but will be available in the near future.

  When enabled in the backend, users that signed up with an email and a password can opt-in for an additional authentication security measure.
  MFA can be activated in using the new useConfigMfa hook.

  Two methods has been also added to useEmailPasswordSignIn: when MFA is active, authentication won't be a success straight after signin up with an email and a password.
  The new needsMfaOtp will then appear as true, and the authentication will succeed only when the user will have sent back the OTP code with sendMfaOtp(code:string).

  const { generateQrCode, isGenerating, isGenerated, qrCodeDataUrl, activateMfa, isActivating, isActivated, isError, error } =
    useConfigMfa(code?: string)
  

  Name	Type	Notes
  generateQrCode	() => void	Generates the QR code that will be used by the MFA app e.g. Google Authenticator or Authy.
  isGenerating	boolean	Returns true if the QR code is generating but not yet available
  isGenerated	boolean	Returns true when the QR code has been successfully generated and is available
  qrCodeDataUrl	string	Returns the QR code as a Data URL
  activateMfa	(code?: string) => void	Activate MFA from the code given by the MFA authentication application
  isActivating	boolean	Returns true when the activation code has been sent to the server, and we await server response
  isActivated	boolean	Returns true when MFA has been successfully activated
  isError	boolean	Returns true if an error occurred.
  error	{status: number, error: string, message: string} | undefined	Provides details about the error.

  Usage

  import { useConfigMfa } from '@nhost/react'
  import { useState } from 'react'
  
  export const Mfa: React.FC = () => {
    const [code, setCode] = useState('')
    const { generateQrCode, activateMfa, isActivated, isGenerated, qrCodeDataUrl } =
      useConfigMfa(code)
  
    return (
      <div>
        {!isGenerated && (
          <button block appearance="primary" onClick={generateQrCode}>
            Generate
          </button>
        )}
        {isGenerated && !isActivated && (
          <div>
            <img alt="qrcode" src={qrCodeDataUrl} />
            <input value={code} onChange={onChange={(event) => setCode(event.target.value)}} placeholder="Enter activation code" />
            <button block appearance="primary" onClick={activateMfa}>
              Activate
            </button>
          </div>
        )}
        {isActivated && <div>MFA has been activated!!!</div>}
      </div>
    )
  }
  
  

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]
  • @nhost/[email protected]

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]

Major Changes

• 744fd69: Use @nhost/core and its state machine

  @nhost/nhost-js and @nhost/hasura-auth-js now use the xstate-based state management system from @nhost/core.

  The client initiation remains the same, although the clientStorage and clientStorageType are deprecated in favor of clientStorageGetter (key:string) => string | null | Promise<string | null> and clientStorageSetter: (key: string, value: string | null) => void | Promise<void>.

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• 744fd69: remove nhost.auth.verifyEmail
  Theres's a /verify endpoint in hasura-auth, but the sdk is not even using it as
  1. the user follows the /verify link in the email
  2. hasura-auth validates the link, attaches the token and redirects to the frontend
  3. the sdk gets the refresh token from the url
  4. the sdk consumes the refresh token
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Major Changes

• 744fd69: Use @nhost/react instead of @nhost/react-auth
  This major release allows to use the latest Nhost authentication state mechanism. It wraps and exports NhostReactProvider as NhostAuthProvider and useNhostAuth from @nhost/react.

  In order to use it, you need to install @nhost/react as it is now a peer dependency:

  npm install @nhost/react
  # or
  yarn add @nhost/react
  

  It is however recommended to switch to @nhost/react and to remove this package from your dependencies.

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Major Changes

• 744fd69: Use @nhost/core and its state machine

  @nhost/nhost-js and @nhost/hasura-auth-js now use the xstate-based state management system from @nhost/core.

  The client initiation remains the same, although the clientStorage and clientStorageType are deprecated in favor of clientStorageGetter (key:string) => string | null | Promise<string | null> and clientStorageSetter: (key: string, value: string | null) => void | Promise<void>.

Minor Changes

• 744fd69: Unify vanilla, react and next APIs so they can work together
  React and NextJS libraries now works together with @nhost/nhost-js. It also means the Nhost client needs to be initiated before passing it to the React provider.
  See the React and NextJS configuration documentation for additional information.

Patch Changes

• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
• Updated dependencies [744fd69]
  • @nhost/[email protected]
  • @nhost/[email protected]