The Open Source Firebase Alternative with GraphQL.
MIT License
Bot releases are visible (Hide)
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
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
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
Published by github-actions[bot] over 2 years ago
auth.getUser()
, auth.getSession()
or auth.isReady()
should be accessible without raising an error.Published by github-actions[bot] over 2 years ago
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
useSignInEmailPasswordless
signIn
renamed to signInEmailPasswordless
useEmailPasswordSignIn
useSignInEmailPassword
signIn
renamed to signInEmailPassword
needsVerification
renamed to needsEmailVerification
useEmailPasswordSignUp
useSignUpEmailPassword
signUp
renamed to signUpEmailPassword
needsVerification
renamed to needsEmailVerification
useAnonymousSignIn
useSignInAnonymous
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. |
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. |
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.
Published by github-actions[bot] over 2 years ago
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
useSignInEmailPasswordless
signIn
renamed to signInEmailPasswordless
useEmailPasswordSignIn
useSignInEmailPassword
signIn
renamed to signInEmailPassword
needsVerification
renamed to needsEmailVerification
useEmailPasswordSignUp
useSignUpEmailPassword
signUp
renamed to signUpEmailPassword
needsVerification
renamed to needsEmailVerification
useAnonymousSignIn
useSignInAnonymous
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. |
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. |
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.
Published by github-actions[bot] over 2 years ago
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.Published by github-actions[bot] over 2 years ago
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.Published by github-actions[bot] over 2 years ago
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>
.
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.nhost.auth.verifyEmail
Published by github-actions[bot] over 2 years ago
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.Published by github-actions[bot] over 2 years ago
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.
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.Published by github-actions[bot] over 2 years ago
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>
.
@nhost/nhost-js
. It also means the Nhost client needs to be initiated before passing it to the React provider.