luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

ui: Move the Role remove dialog to use InformedAction (#11298)

This commit is contained in:
John Cowen 2021-10-14 13:54:27 +01:00 committed by GitHub
parent 88bd33cc6b
commit ae57fe6e1d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.changelog/11298.txt Normal file
View File

@ -0,0 +1,3 @@
```release-note:bug
ui: Fixed styling of Role remove dialog on the Token edit page
```

39
ui/packages/consul-ui/app/components/role-selector/index.hbs
View File

@ -141,24 +141,35 @@ as |modal|>
<li role="none" class="dangerous"> <li role="none" class="dangerous">
<label for={{confirm}} role="menuitem" tabindex="-1" onkeypress={{keypressClick}} data-test-delete>Remove</label> <label for={{confirm}} role="menuitem" tabindex="-1" onkeypress={{keypressClick}} data-test-delete>Remove</label>
<div role="menu"> <div role="menu">
<div class="confirmation-alert warning"> <InformedAction
<div> class="warning"
<header> >
<:header>
Confirm Remove Confirm Remove
</header> </:header>
<:body>
<p> <p>
Are you sure you want to remove this role? Are you sure you want to remove this role?
</p> </p>
</div> </:body>
<ul> <:actions as |Actions|>
<li class="dangerous"> <Actions.Action class="dangerous">
<button tabindex="-1" type="button" class="type-delete" onclick={{action send 'remove' item items}}>Remove</button> <Action
</li> tabindex="-1"
<li> {{on 'click' (action send 'remove' item items)}}
<label for={{confirm}}>Cancel</label> >
</li> Remove
</ul> </Action>
</div> </Actions.Action>
<Actions.Action>
<Action
@for={{confirm}}
>
Cancel
</Action>
</Actions.Action>
</:actions>
</InformedAction>
</div> </div>
</li> </li>
{{/if}} {{/if}}

8
ui/packages/consul-ui/app/components/role-selector/pageobject.js
View File

@ -6,9 +6,11 @@ export default (clickable, deletable, collection, alias, roleForm) => (scope = '
roles: alias('selectedOptions'), roles: alias('selectedOptions'),
selectedOptions: collection( selectedOptions: collection(
'[data-test-roles] [data-test-tabular-row]', '[data-test-roles] [data-test-tabular-row]',
deletable({ {
actions: clickable('label'), actions: clickable('label > button'),
}) delete: clickable('[data-test-delete]'),
confirmDelete: clickable('.informed-action button'),
}
), ),
}; };
}; };