Backport of feat: add alert to link to hcp modal to ask a user refresh a page; up… into release/1.18.x (#20690)

backport of commit 5e1472dda6

Co-authored-by: valeriia-ruban <valeriia.ruban@hashicorp.com>
pull/20693/head
hc-github-team-consul-core 2024-02-21 13:03:23 -05:00 committed by GitHub
parent 90024f7688
commit b76388bb98
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 14 additions and 1 deletions

View File

@ -20,7 +20,7 @@
|G|>
<G.Legend>Select cluster access mode before linking</G.Legend>
<G.HelperText>Control the level of access that HCP Consul Central has to your linked cluster.
<Hds::Link::Inline @href="https://developer.hashicorp.com/consul/docs/security/acl" @isHrefExternal={{true}}
<Hds::Link::Inline @href="https://developer.hashicorp.com/hcp/docs/consul/concepts/cluster-permissions" @isHrefExternal={{true}}
@color="secondary">Learn more
</Hds::Link::Inline>
</G.HelperText>
@ -89,6 +89,9 @@
{{/if}}
</div>
{{/if}}
<Hds::Alert class="link-to-hcp-modal__refresh-page-alert" @type="compact" data-test-link-to-hcp-modal-refresh-page-alert as |A|>
<A.Description>After you link your cluster to HCP, close this modal and refresh the page.</A.Description>
</Hds::Alert>
</M.Body>
<M.Footer as |F|>
<Hds::ButtonSet>

View File

@ -7,6 +7,10 @@
&__no-acls-alert {
margin-bottom: 16px;
}
&__refresh-page-alert {
margin-top: 16px;
margin-bottom: 8px;
}
&__generate-token {
display: flex;
flex-direction: column;

View File

@ -14,6 +14,7 @@ import { BlockingEventSource as RealEventSource } from 'consul-ui/utils/dom/even
import { ACCESS_LEVEL } from 'consul-ui/components/link-to-hcp-modal';
const modalSelector = '[data-test-link-to-hcp-modal]';
const modalRefreshPageAlertSelector = '[data-test-link-to-hcp-modal-refresh-page-alert]';
const modalNoACLsAlertSelector = '[data-test-link-to-hcp-modal-no-acls-alert]';
const modalOptionReadOnlySelector = '#accessMode-readonly';
const modalOptionReadOnlyErrorSelector = '[data-test-link-to-hcp-modal-access-level-options-error]';
@ -88,6 +89,7 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
assert.dom(modalSelector).exists({ count: 1 });
assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).doesNotExist();
assert.dom(`${modalSelector} ${modalRefreshPageAlertSelector}`).isVisible();
// select read-only
await click(`${modalSelector} ${modalOptionReadOnlySelector}`);
@ -186,6 +188,8 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
assert.dom(modalSelector).exists({ count: 1 });
assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).doesNotExist();
assert.dom(`${modalSelector} ${modalRefreshPageAlertSelector}`).isVisible();
// select read-only
await click(`${modalSelector} ${modalOptionReadOnlySelector}`);
@ -213,6 +217,8 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
assert.dom(modalSelector).exists({ count: 1 });
assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).isVisible();
assert.dom(`${modalSelector} ${modalRefreshPageAlertSelector}`).isVisible();
// select read-only
await click(`${modalSelector} ${modalOptionReadOnlySelector}`);