Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add set and clear token methods #554

Merged
merged 3 commits into from
Oct 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -168,3 +168,78 @@ await signOut(credentials, { callbackUrl: '/protected' })
await getSession(credentials, { callbackUrl: '/protected' })
```
::

## `useAuthState` Composable

The `useAuthState` composable is the underlying storage layer to access the session-state and data. Here's the main methods and properties you can use:

::code-group
```ts [authjs]
const {
status,
loading,
data,
lastRefreshedAt
} = useAuth()

// Session status, either `unauthenticated`, `loading`, `authenticated`
status.value

// Whether any http request is still pending
loading.value

// Session data, either `undefined` (= authentication not attempted), `null` (= user unauthenticated), `loading` (= session loading in progress), see https://next-auth.js.org/getting-started/client#signout
data.value

// Time at which the session was last refreshed, either `undefined` if no refresh was attempted or a `Date`-object of the time the refresh happened
lastRefreshedAt.value
```
```ts [local]
const {
status,
loading,
data,
lastRefreshedAt,
token,
rawToken,
getToken,
clearToken
} = useAuth()

// Session status, either `unauthenticated`, `loading`, `authenticated`
status.value

// Whether any http request is still pending
loading.value

// Session data, either `undefined` (= authentication not attempted), `null` (= user unauthenticated), or session / user data your `getSession`-endpoint returns
data.value

// Time at which the session was last refreshed, either `undefined` if no refresh was attempted or a `Date`-object of the time the refresh happened
lastRefreshedAt.value

// The fetched token that can be used to authenticate future requests. E.g., a JWT-Bearer token like so: `Bearer eyDFSJKLDAJ0-3249PPRFK3P5234SDFL;AFKJlkjdsjd.dsjlajhasdji89034`
token.value

// Cookie that containes the raw fetched token string. This token won't contain any modification or prefixes like `Bearer` or any other.
rawToken.value

// Helper method to quickly set a new token (alias for rawToken.value = 'xxx')
setToken('new token')

// Helper method to quickly delete the token cookie (alias for rawToken.value = null)
clearToken()
```
::

::alert{type="warning"}
(Only local provider) Note that you will have to manually call `getSession` from `useAuth` composable in order to refresh the new user state when using `setToken`, `clearToken` or manually updating `rawToken.value`:

```ts
const { getSession } = useAuth()
const { setToken } = useAuthState()
// ...
setToken('...')
await getSession()
```
::
16 changes: 14 additions & 2 deletions src/runtime/composables/local/useAuthState.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,9 @@ import type { SessionData } from '#auth'

interface UseAuthStateReturn extends CommonUseAuthStateReturn<SessionData> {
token: ComputedRef<string | null>
rawToken: CookieRef<string | null>
rawToken: CookieRef<string | null>,
setToken: (newToken: string | null) => void
clearToken: () => void
}

export const useAuthState = (): UseAuthStateReturn => {
Expand All @@ -29,14 +31,24 @@ export const useAuthState = (): UseAuthStateReturn => {
return config.token.type.length > 0 ? `${config.token.type} ${rawToken.value}` : rawToken.value
})

const setToken = (newToken: string | null) => {
rawToken.value = newToken
}

const clearToken = () => {
setToken(null)
}

const schemeSpecificState = {
token,
rawToken
}

return {
...commonAuthState,
...schemeSpecificState
...schemeSpecificState,
setToken,
clearToken
}
}
export default useAuthState