---
title: Interface: UseAuth<AuthClientType>
slug: chord-ui/interface-useauthlessauthclienttypegreater
docTags: 
createdAt: 2023-11-06T15:03:31.906Z
---

[react-autonomy](docId\:zoZ6W56ubpPACr0PO0GLS).UseAuth

`UseAuth` contains the data and methods returned by [useAuth](docId:2gglnT-PT0lGEVn528iqg).

## Type parameters

| Name             | Type                                                         |
| ---------------- | ------------------------------------------------------------ |
| `AuthClientType` | extends [`AuthClient`](docId\:JisGs4kxNBQanNKBxHaw-) = `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.

```javascript
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

[packages/react-autonomy/src/hooks/use-auth.ts:143](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L143)

***

### 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.



```javascript
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

[packages/react-autonomy/src/hooks/use-auth.ts:174](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L174)

***

### isFetching

• **isFetching**: `boolean`

A boolean indicating whether the user's authentication status is currently
being fetched.

### Defined in

[packages/react-autonomy/src/hooks/use-auth.ts:82](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L82)

***

### isLoggedIn

• **isLoggedIn**: `boolean`

A boolean indicating whether the user is currently logged in.

### Defined in

[packages/react-autonomy/src/hooks/use-auth.ts:86](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L86)

***

### login

• **login**: (`options`: [`Login`](docId\:sLsPGEkom9RCVDuVzV28A)) => `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.



```javascript
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` | [`Login`](docId\:sLsPGEkom9RCVDuVzV28A) |

### Returns

`Promise`\<`void`>

### Defined in

[packages/react-autonomy/src/hooks/use-auth.ts:202](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L202)

***

### logout

• **logout**: () => `Promise`\<`void`>

### Type declaration

▸ (): `Promise`\<`void`>

The `logout` function terminates the user's current session.



```javascript
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

[packages/react-autonomy/src/hooks/use-auth.ts:226](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L226)

***

### serviceClient

• **serviceClient**: `ReturnType`\<`AuthClientType`\[`"getServiceClient"`]>

The underlying instance of the AuthClient provided to [ChordProvider](docId\:iDZofWt8D2pro5pjO4Xsg).
Allows for lower level operations with the authentication provider that
might be needed.

### Defined in

[packages/react-autonomy/src/hooks/use-auth.ts:92](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L92)

***

### 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.

### Defined in

[packages/react-autonomy/src/hooks/use-auth.ts:77](https://github.com/chordcommerce/chord-ui/blob/2b105e1/packages/react-autonomy/src/hooks/use-auth.ts#L77)