open-consul/ui-v2/app/templates/dc/acls/tokens/edit.hbs
John Cowen e34c16a90c ui: Logout button (#7604)
* ui: Logout button

This commit adds an easier way to logout of the UI using a logout button

Notes:

- Added a Logout button to the main navigation when you are logged in,
meaning you have easy access to a way to log out of the UI.
- Changed all wording to use 'Log in/out' vocabulary instad of 'stop
using'.
- The logout button opens a panel to show you your current ACL
token and a logout button in order to logout.
- When using legacy ACLs we don't show the current ACL token as legacy
ACLs tokens only have secret values, whereas the new ACLs use a
non-secret ID plus a secret ID (that we don't show).
- We also added a new `<EmptyState />` component to use for all our
empty states. We currently only use this for the ACLs disabled screen to
provide more outgoing links to more readind material/documentation to
help you to understand and enable ACLs.
- The `<DataSink />` component is the sibling to our `<DataSource />`
component and whilst is much simpler (as it doesn't require polling
support), its tries to use the same code patterns for consistencies
sake.
- We had a fun problem with ember-data's `store.unloadAll` here, and in
the end went with `store.init` to empty the ember-data store instead due
to timing issues.
- We've tried to use already existing patterns in the Consul UI here
such as our preexisting `feedback` service, although these are likely to
change in the future. The thinking here is to add this feature with as
little change as possible.

Overall this is a precursor to a much larger piece of work centered on
auth in the UI. We figured this was a feature complete piece of work as
it is and thought it was worthwhile to PR as a feature on its own, which
also means the larger piece of work will be a smaller scoped PR also.
2020-05-12 17:14:24 +00:00

90 lines
3.1 KiB
Handlebars

{{#if isAuthorized }}
{{#if create}}
{{title 'New Token'}}
{{else}}
{{title 'Edit Token'}}
{{/if}}
{{else}}
{{title 'Access Controls'}}
{{/if}}
<AppView
@class={{concat "token " (if isAuthorized "edit" "list")}}
@loading={{isLoading}}
@authorized={{isAuthorized}}
@enabled={{isEnabled}}
>
<BlockSlot @name="notification" as |status type|>
{{partial 'dc/acls/tokens/notifications'}}
</BlockSlot>
<BlockSlot @name="disabled">
{{partial 'dc/acls/disabled'}}
</BlockSlot>
<BlockSlot @name="authorization">
{{partial 'dc/acls/authorization'}}
</BlockSlot>
<BlockSlot @name="breadcrumbs">
<ol>
<li><a data-test-back href={{href-to 'dc.acls.tokens'}}>All Tokens</a></li>
</ol>
</BlockSlot>
<BlockSlot @name="header">
<h1>
{{#if isAuthorized }}
{{#if create }}
New Token
{{else}}
Edit Token
{{/if}}
{{else}}
Access Controls
{{/if}}
</h1>
</BlockSlot>
<BlockSlot @name="actions">
{{#if (not create)}}
{{#if (not-eq item.AccessorID token.AccessorID)}}
<ConfirmationDialog @message="Are you sure you want to use this ACL token?">
<BlockSlot @name="action" as |confirm|>
<button data-test-use type="button" {{ action confirm 'use' item }}>Use</button>
</BlockSlot>
<BlockSlot @name="dialog" as |execute cancel message|>
<p>
{{message}}
</p>
<button type="button" class="type-delete" {{action execute}}>Confirm Use</button>
<button type="button" class="type-cancel" {{action cancel}}>Cancel</button>
</BlockSlot>
</ConfirmationDialog>
{{/if}}
{{#if (not (token/is-legacy item))}}
<button data-test-clone type="button" {{ action "clone" item }}>Duplicate</button>
{{/if}}
{{/if}}
</BlockSlot>
<BlockSlot @name="content">
{{#if (token/is-legacy item)}}
<p class="notice info"><strong>Update.</strong> We have upgraded our ACL system by allowing you to create reusable policies which you can then apply to tokens. Don't worry, even though this token was written in the old style, it is still valid. However, we do recommend upgrading your old tokens to the new style. Learn how in our <a href="{{env 'CONSUL_DOCS_URL'}}/guides/acl-migrate-tokens.html" target="_blank" rel="noopener noreferrer">documentation</a>.</p>
{{/if}}
{{#if (not create) }}
<div>
<dl>
<dt>AccessorID</dt>
<dd>
<CopyButtonFeedback @title="Copy AccessorID to the clipboard" @copy={{item.AccessorID}} @name="AccessorID" /> {{item.AccessorID}}
</dd>
<dt>Token</dt>
<dd>
<CopyButtonFeedback @title="Copy SecretID to the clipboard" @copy={{item.SecretID}} @name="Token" /> <SecretButton>{{item.SecretID}}</SecretButton>
</dd>
{{#if (and (not (token/is-legacy item)) (not create))}}
<dt>Scope</dt>
<dd>
{{if item.Local 'local' 'global' }}
</dd>
{{/if}}
</dl>
</div>
{{/if}}
{{ partial 'dc/acls/tokens/form'}}
</BlockSlot>
</AppView>