From 9d712ccfc7a67193423f1a102ac2b9d3c6dc3733 Mon Sep 17 00:00:00 2001
From: Valeriia Ruban <valeriia.ruban@hashicorp.com>
Date: Tue, 13 Feb 2024 14:00:04 -0800
Subject: [PATCH] =?UTF-8?q?chor:=20adds=20informative=20error=20message=20?=
 =?UTF-8?q?when=20acls=20disabled=20and=20read-only=E2=80=A6=20(#20600)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* adds informative error message when acls disabled and read-only selected

* adds alert to the modal when there is no acls enabled
---
 .../components/link-to-hcp-modal/index.hbs    | 11 +++++-
 .../components/link-to-hcp-modal/index.scss   |  3 ++
 .../components/link-to-hcp-modal-test.js      | 35 +++++++++++++++++++
 3 files changed, 48 insertions(+), 1 deletion(-)

diff --git a/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.hbs b/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.hbs
index bd29b2423fb9..bdabe3b2e52e 100644
--- a/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.hbs
+++ b/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.hbs
@@ -10,6 +10,12 @@
       Link to HCP Consul Central
     </M.Header>
     <M.Body>
+      {{#if (not (can "read acls"))}}
+        <Hds::Alert class="link-to-hcp-modal__no-acls-alert" @type="inline" @color="critical" data-test-link-to-hcp-modal-no-acls-alert as |A|>
+          <A.Title>ACLs are disabled on this cluster.</A.Title>
+          <A.Description>The cluster can only be linked with read/write access.</A.Description>
+        </Hds::Alert>
+      {{/if}}
       <Hds::Form::Radio::Group data-test-link-to-hcp-modal-access-level-options @layout="vertical" @name="accessMode" as
                                |G|>
         <G.Legend>Select cluster access mode before linking</G.Legend>
@@ -33,8 +39,11 @@
             with the “builtin/global-read-only” policy in the next step.
           </F.HelperText>
         </G.Radio::Field>
+        {{#if (and this.isReadOnlyAccessLevelSelected (not (can "read acls")))}}
+          <G.Error data-test-link-to-hcp-modal-access-level-options-error>ACLs are disabled on this cluster and are required for read-only access.</G.Error>
+        {{/if}}
       </Hds::Form::Radio::Group>
-      {{#if (and this.isReadOnlyAccessLevelSelected (can "create tokens"))}}
+      {{#if (and this.isReadOnlyAccessLevelSelected (can "read acls") (can "create tokens"))}}
         <div class="link-to-hcp-modal__generate-token">
           {{#if  globalReadonlyPolicy.data}}
             <p class="hds-typography-display-100 hds-font-weight-medium font-family-sans-display">
diff --git a/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.scss b/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.scss
index f28aa8ecde57..9850cac56bfc 100644
--- a/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.scss
+++ b/ui/packages/consul-ui/app/components/link-to-hcp-modal/index.scss
@@ -4,6 +4,9 @@
  */
 
 .link-to-hcp-modal {
+  &__no-acls-alert {
+    margin-bottom: 16px;
+  }
   &__generate-token {
     display: flex;
     flex-direction: column;
diff --git a/ui/packages/consul-ui/tests/integration/components/link-to-hcp-modal-test.js b/ui/packages/consul-ui/tests/integration/components/link-to-hcp-modal-test.js
index 1aee8c7cbe22..f71c183f5fec 100644
--- a/ui/packages/consul-ui/tests/integration/components/link-to-hcp-modal-test.js
+++ b/ui/packages/consul-ui/tests/integration/components/link-to-hcp-modal-test.js
@@ -14,7 +14,9 @@ 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 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]';
 const modalGenerateTokenCardSelector = '[data-test-link-to-hcp-modal-generate-token-card]';
 const modalGenerateTokenCardValueSelector =
   '[data-test-link-to-hcp-modal-generate-token-card-value]';
@@ -60,6 +62,9 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
           if (permission === 'create tokens') {
             return true;
           }
+          if (permission === 'read acls') {
+            return true;
+          }
         }
       }
     );
@@ -85,6 +90,8 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
                                      @partition="-" />`);
 
     assert.dom(modalSelector).exists({ count: 1 });
+    assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).doesNotExist();
+
     // select read-only
     await click(`${modalSelector} ${modalOptionReadOnlySelector}`);
 
@@ -181,6 +188,7 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
                                      @partition="-" />`);
 
     assert.dom(modalSelector).exists({ count: 1 });
+    assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).doesNotExist();
     // select read-only
     await click(`${modalSelector} ${modalOptionReadOnlySelector}`);
 
@@ -189,4 +197,31 @@ module('Integration | Component | link-to-hcp-modal', function (hooks) {
     // Missed policy alert is visible
     assert.dom(`${modalSelector} ${modalGenerateTokenMissedPolicyAlertSelector}`).isVisible();
   });
+
+  test('it shows an error wher read-only selected and acls are disabled', async function (assert) {
+    this.owner.register(
+      'service:abilities',
+      class Stub extends Service {
+        can(permission) {
+          if (permission === 'read acls') {
+            return false;
+          }
+        }
+      }
+    );
+
+    await render(hbs`<LinkToHcpModal @dc="dc-1"
+                                     @nspace="default"
+                                     @partition="-" />`);
+
+    assert.dom(modalSelector).exists({ count: 1 });
+    assert.dom(`${modalSelector} ${modalNoACLsAlertSelector}`).isVisible();
+    // select read-only
+    await click(`${modalSelector} ${modalOptionReadOnlySelector}`);
+
+    // when read-only selected and no policy, it doesn't show the generate token button
+    assert.dom(`${modalSelector} ${modalGenerateTokenButtonSelector}`).doesNotExist();
+    // No acls enabled error is presented
+    assert.dom(`${modalSelector} ${modalOptionReadOnlyErrorSelector}`).isVisible();
+  });
 });