open-consul/ui/packages/consul-ui/app/templates/dc/acls/tokens/edit.hbs

98 lines
3.2 KiB
Handlebars
Raw Normal View History

{{#if isAuthorized }}
{{#if create}}
{{title 'New Token'}}
{{else}}
{{title 'Edit Token'}}
{{/if}}
{{else}}
{{title 'Access Controls'}}
{{/if}}
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-04-08 17:03:18 +00:00
<AppView
@authorized={{isAuthorized}}
@enabled={{isEnabled}}
>
UI Release Merge (1.8-beta-2: ui-staging merge) (#7919) * ui: Styling fixes (#7885) * Move cellHeight to ListCollection js file * Fix composite row border-top-color onHover state * Add empty health check icon to CompositeRow styling * ui: Slightly refactor %composite-rows and reuse ConsulServiceList component (#7886) * ui: Move individual component types into a single %composite-list plus 1. Removes all out separate CSS components (that match HTML components) to favour not having those separate for the moemnt at least 2. Reuses <ConsulServiceList /> component for Terminating Gateways > Linked Services * ui: Tweak breadcrumb spacing for '/' separator * Fix up the tests i.e. services per tab so we can call them all services * ui: Misc discovery chain fixes (#7892) 1. Look for a default splitter before looking for a default resolver in order to route to. 2. Delay adding svg listeners until afterRender (fixes split tooltip) 3. Make router id's consistent for highlighting default routers in when clicking the graph * ui: If an error occurs on the server, surface it in the notification (#7893) * ui: Delete old unused CSS (#7909) This commit deletes CSS that we no longer use and we definitely will not ever use. We also dedup all of our imports here as it turns out SASS doesn't dedupe imports. Strangely this increases out CSS weight by ~1kb instead of reducing but we'd rather keep things deduped as that was the intention * ui: Redesign - Exposed Paths (#7912) * Add new exposed paths icons to codebase * Redesign Exposed Paths and create copy-button hover on Composite Row * Refactor FeedbackDialog and CopyButton * Change this.element to use `{{ref }}` now we don't have an element We changed this to a tagless component with an eye to moving this to a glimmer component, without spotting that this would also remove the `this.element` property. This adds an equivalent using the ref modifier. Co-authored-by: John Cowen <jcowen@hashicorp.com> * ui: Remove box-shadow and pointer cursor from metada list hover effect (#7914) Co-authored-by: Kenia <19161242+kaxcode@users.noreply.github.com>
2020-05-19 16:18:04 +00:00
<BlockSlot @name="notification" as |status type item error|>
<Consul::Token::Notifications
@type={{type}}
@status={{status}}
@item={{item}}
@error={{error}}
/>
</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))}}
ui: UI Release Merge (ui-staging merge) (#6527) ## HTTPAdapter (#5637) ## Ember upgrade 2.18 > 3.12 (#6448) ### Proxies can no longer get away with not calling _super This means that we can't use create anymore to define dynamic methods. Therefore we dynamically make 2 extended Proxies on demand, and then create from those. Therefore we can call _super in the init method of the extended Proxies. ### We aren't allowed to reset a service anymore We never actually need to now anyway, this is a remnant of the refactor from browser based confirmations. We fix it as simply as possible here but will revisit and remove the old browser confirm functionality at a later date ### Revert classes to use ES5 style to workaround babel transp. probs Using a mixture of ES6 classes (and hence super) and arrow functions means that when babel transpiles the arrow functions down to ES5, a reference to this is moved before the call to super, hence causing a js error. Furthermore, we the testing environment no longer lets use use apply/call on the constructor. These errors only manifests during testing (only in the testing environment), the application itself runs fine with no problems without this change. Using ES5 style class definitions give us freedom to do all of the above without causing any errors, so we reverted these classes back to ES5 class definitions ### Skip test that seems to have changed due to a change in RSVP timing This test tests a usecase/area of the API that will probably never ever be used, it was more testing out the API. We've skipped the test for now as this doesn't affect the application itself, but left a note to come back here later to investigate further ### Remove enumerableContentDidChange Initial testing looks like we don't need to call this function anymore, the function no longer exists ### Rework Changeset.isSaving to take into account new ember APIs Setting/hanging a computedProperty of an instantiated object no longer works. Move to setting it on the prototype/class definition instead ### Change how we detect whether something requires listening New ember API's have changed how you can detect whether something is a computedProperty or not. It's not immediately clear if its even possible now. Therefore we change how we detect whether something should be listened to or not by just looking for presence of `addEventListener` ### Potentially temporary change of ci test scripts to ensure deps exist All our tooling scripts run through a Makefile (for people familiar with only using those), which then call yarn scripts which can be called independently (for people familar with only using yarn). The Makefile targets always check to make sure all the dependencies are installed before running anything that requires them (building, testing etc). The CI scripts/targets didn't follow this same route and called the yarn scripts directly (usually CI builds a cache of the dependencies first). For some reason this cache isn't doing what it usually does, and it looks as though, in CI, ember isn't installed. This commit makes the CI scripts consistently use the same method as all of the other tooling scripts (Makefile target > Install Deps if required > call yarn script). This should install the dependencies if for some reason the CI cache building doesn't complete/isn't successful. Potentially this commit may be reverted if, the root of the problem is elsewhere, although consistency is always good, so it might be a good idea to leave this commit as is even if we need to debug and fix things elsewhere. ### Make test-parallel consistent with the rest of the tooling scripts As we are here making changes for CI purposes (making test-ci consistent), we spotted that test-parallel is also inconsistent and also the README manual instructions won't work without `ember` installed globally. This commit makes everything consistent and changes the manual instructions to use the local ember instance that gets installed via yarn ### Re-wrangle catchable to fit with new ember 3.12 APIs In the upgrade from ember 3.8 > 3.12 the public interfaces for ComputedProperties have changed slightly. `meta` is no longer a public property of ComputedProperty but of a ComputedDecoratorImpl mixin instead. https://github.com/emberjs/ember.js/blob/7e4ba1096e3c2e3e0dde186d5ca52ff19cb8720a/packages/%40ember/-internals/metal/lib/computed.ts#L725 There seems to be no way, by just using publically available methods, to replicate this behaviour so that we can create our own 'ComputedProperty` factory via injecting the ComputedProperty class as we did previously. https://github.com/hashicorp/consul/blob/3f333bada181aaf6340523ca2268a28d1a7db214/ui-v2/app/utils/computed/factory.js#L1-L18 Instead we dynamically hang our `Catchable` `catch` method off the instantiated ComputedProperty. In doing it like this `ComputedProperty` has already has its `meta` method mixed in so we don't have to manually mix it in ourselves (which doesn't seem possible) This functionality is only used during our work in trying to ensure our EventSource/BlockingQuery work was as 'ember-like' as possible (i.e. using the traditional Route.model hooks and ember-like Controller properties). Our ongoing/upcoming work on a componentized approach to data a.k.a `<DataSource />` means we will be able to remove the majority of the code involved here now that it seems to be under an amount of flux in ember. ### Build bindata_assetfs.go with new UI changes
2019-09-30 13:47:49 +00:00
<button data-test-clone type="button" {{ action "clone" item }}>Duplicate</button>
{{/if}}
{{/if}}
</BlockSlot>
<BlockSlot @name="content">
{{#if (token/is-legacy item)}}
<Notice
@type="info"
as |notice|>
<notice.Header>
<h3>Update</h3>
</notice.Header>
<notice.Body>
<p>
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>
</notice.Body>
</Notice>
{{/if}}
{{#if (not create) }}
2020-06-17 09:25:54 +00:00
<div class="definition-table">
<dl>
<dt>AccessorID</dt>
<dd>
2020-06-17 09:25:54 +00:00
<CopyButton @value={{item.AccessorID}} @name="AccessorID" @position="top-start" /> {{item.AccessorID}}
</dd>
<dt>Token</dt>
<dd>
2020-06-17 09:25:54 +00:00
<CopyButton @value={{item.SecretID}} @name="Token" @position="top-start" /> <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>