---
class: ember
---
# AuthDialog
```hbs preview-template
<AuthDialog @dc={{'dc-1'}} @nspace={{'default'}} @onchange={{action (noop)}} as |api components|>
{{#let components.AuthForm components.AuthProfile as |AuthForm AuthProfile|}}
<BlockSlot @name="unauthorized">
Here's the login form:
<AuthForm />
</BlockSlot>
<BlockSlot @name="authorized">
Here's your profile:
<AuthProfile />
<button onclick={{action api.logout}}>Logout</button>
</BlockSlot>
{{/let}}
</AuthDialog>
```
### Arguments
A component to help orchestrate a login/logout flow.
| Argument | Type | Default | Description |
| --- | --- | --- | --- |
| `dc` | `String` | | The name of the current datacenter |
| `nspace` | `String` | | The name of the current namespace |
| `onchange` | `Function` | | An action to fire when the users token has changed (logged in/logged out/token changed) |
### Methods/Actions/api
| Method/Action | Description |
| --- | --- |
| `login` | Login with a specified token |
| `logout` | Logout (delete token) |
| `token` | The current token itself (as a property not a method) |
### Components
| Name | Description |
| --- | --- |
| [`AuthForm`](../auth-form/README.mdx) | Renders an Authorization form |
| [`AuthProfile`](../auth-profile/README.mdx) | Renders a User Profile |
### Slots
| Name | Description |
| --- | --- |
| `unauthorized` | This slot is only rendered when the user doesn't have a token |
| `authorized` | This slot is only rendered whtn the user has a token.|
### See
- [Component Source Code](./index.js)
- [Template Source Code](./index.hbs)
---
