Interface: UseAuth<AuthClientType>
react-autonomyreact-autonomy.UseAuth
UseAuth contains the data and methods returned by useAuthuseAuth.
Type parameters
Name | Type |
|---|---|
AuthClientType | extends AuthClientAuthClient = any |
Properties
getToken
• getToken: () => Promise<string>
Type declaration
▸ (): Promise<string>
The getToken function retrieves an authentication token for the current user session, and adds it the Redux store. While you are unlikely to need the token directly, since the SDK automatically appends it to relevant Chord API requests, you can use this function to check whether the user's session is still active. If the user's session has expired, getToken will throw an error.
You may choose to call getToken on page load or when a user visits a protected route (like an account page) to check that their session has not expired since the last time you checked.
Here is how to use getToken to create a route that is only accessible if the user is logged in in a Next.js app.
import { useEffect } from 'react'
import { useRouter } from 'next/router'
import { useAuth } from '@chordcommerce/react-autonomy'
const PrivateRoute = ({ children }) => {
const { getToken, isLoggedIn, isFetching } = useAuth()
const router = useRouter()
useEffect(() => {
const checkStatus = async () => {
try {
await getToken()
} catch (error) {
router.push('/login')
}
}
if (!isLoggedIn) checkStatus()
}, [isLoggedIn, getToken, router])
if (!isLoggedIn && isFetching) {
// return loading animation
}
if (!isLoggedIn && !isFetching) {
//return null
}
return children
}Returns
Promise<string>
Defined in
handleCallback
• handleCallback: () => Promise<void>
Type declaration
▸ (): Promise<void>
The handleCallback function completes the login process, when the user is redirected back to the site after clicking a link in their email. The SDK calls this function automatically when the Magic url parameter is detected on page load, so you are unlikely to need to call this function.
import { useEffect } from 'react'
import { useAuth } from '@chordcommerce/react-autonomy'
const Page = ({ children }) => {
const { handleCallback } = useAuth()
useEffect(() => {
const handle = async () => {
try {
await handleCallback()
} catch (error) {
console.error('Invalid callback token.')
}
}
handle()
}, [])
// return page
}Returns
Promise<void>
Defined in
isFetching
• isFetching: boolean
A boolean indicating whether the user's authentication status is currently being fetched.
Defined in
isLoggedIn
• isLoggedIn: boolean
A boolean indicating whether the user is currently logged in.
Defined in
login
• login: (options: LoginLogin) => Promise<void>
Type declaration
▸ (options): Promise<void>
The login function should be called when a user submits a login form. It will trigger an email to the user for verification.
import { useRouter } from 'next/router'
import { useAuth } from '@chordcommerce/react-autonomy'
const LoginForm = () => {
const { login } = useAuth()
const router = useRouter()
const onSubmit = async ({ email }) => {
try {
await login({ email })
router.push('/some-private-route')
} catch (error) {
console.error('Login unsuccessful.')
}
}
// return login form
}Parameters
Name | Type |
|---|---|
options | LoginLogin |
Returns
Promise<void>
Defined in
logout
• logout: () => Promise<void>
Type declaration
▸ (): Promise<void>
The logout function terminates the user's current session.
import { useAuth } from '@chordcommerce/react-autonomy'
const LogoutButton = () => {
const { logout } = useAuth()
const handleLogout = async () => {
try {
await logout()
} catch(error) {
console.error('Logout unsuccessful.')
}
}
return <button onClick={handleLogout}>Logout</button>
}Returns
Promise<void>
Defined in
serviceClient
• serviceClient: ReturnType<AuthClientType["getServiceClient"]>
The underlying instance of the AuthClient provided to ChordProviderChordProvider. Allows for lower level operations with the authentication provider that might be needed.
Defined in
token
• token: string
A string representing the user's authentication token. This token is automatically appended to Chord OMS API requests when the user has an active session.