From 086d9da0287113717c3cc5cbb5210479e7d6251c Mon Sep 17 00:00:00 2001
From: Dharini Jeeva <dharini@hashicorp.com>
Date: Wed, 17 Apr 2024 11:40:23 -0700
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20place=20modal=20outside?=
 =?UTF-8?q?=20table=20(#2251)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../templates/scopes/scope/aliases/index.hbs  | 108 +++++++++---------
 1 file changed, 51 insertions(+), 57 deletions(-)

diff --git a/ui/admin/app/templates/scopes/scope/aliases/index.hbs b/ui/admin/app/templates/scopes/scope/aliases/index.hbs
index 8adcdffd5..41b4846fd 100644
--- a/ui/admin/app/templates/scopes/scope/aliases/index.hbs
+++ b/ui/admin/app/templates/scopes/scope/aliases/index.hbs
@@ -2,6 +2,7 @@
   Copyright (c) HashiCorp, Inc.
   SPDX-License-Identifier: MPL-2.0
 }}
+
 <Rose::Layout::Page as |page|>
   <page.breadcrumbs>
     <Breadcrumbs::Container />
@@ -25,6 +26,7 @@
     {{/if}}
   </page.actions>
   <page.body>
+
     {{#if @model}}
       <Hds::Table
         @model={{@model}}
@@ -119,63 +121,6 @@
                         @color='critical'
                         {{on 'click' (fn this.toggleModal B.data.alias)}}
                       />
-                      {{#if this.showModal}}
-                        <Hds::Modal
-                          class='alias-deletion-modal'
-                          @color='warning'
-                          @onClose={{this.toggleModal}}
-                          as |M|
-                        >
-                          <M.Header @icon='alert-triangle'>
-                            {{t 'questions.delete-confirm'}}
-                          </M.Header>
-
-                          <M.Body>
-
-                            <p
-                              class='hds-typography-body-300 hds-foreground-primary'
-                            >
-                              {{#if this.hasDestinationId}}
-                                {{t 'resources.alias.messages.clear-or-delete'}}
-                              {{else}}
-                                {{t 'resources.alias.messages.delete'}}
-                              {{/if}}
-                            </p>
-
-                          </M.Body>
-
-                          <M.Footer>
-                            <Hds::ButtonSet>
-                              <Hds::Button
-                                type='button'
-                                @text={{t 'actions.delete'}}
-                                {{on
-                                  'click'
-                                  (fn this.deleteAlias this.selectedAlias)
-                                }}
-                              />
-                              {{#if this.hasDestinationId}}
-                                <Hds::Button
-                                  type='button'
-                                  @text={{t 'actions.clear'}}
-                                  @color='secondary'
-                                  {{on
-                                    'click'
-                                    (fn this.clearAlias this.selectedAlias)
-                                  }}
-                                />
-                              {{/if}}
-                              <Hds::Button
-                                type='button'
-                                @text={{t 'actions.cancel'}}
-                                @color='secondary'
-                                {{on 'click' this.toggleModal}}
-                              />
-                            </Hds::ButtonSet>
-
-                          </M.Footer>
-                        </Hds::Modal>
-                      {{/if}}
                     {{/if}}
                   </Hds::Dropdown>
 
@@ -217,5 +162,54 @@
         </Rose::Message>
       </Rose::Layout::Centered>
     {{/if}}
+    {{#if this.showModal}}
+      <Hds::Modal
+        class='alias-deletion-modal'
+        @color='warning'
+        @onClose={{this.toggleModal}}
+        as |M|
+      >
+        <M.Header @icon='alert-triangle'>
+          {{t 'questions.delete-confirm'}}
+        </M.Header>
+
+        <M.Body>
+
+          <p class='hds-typography-body-300 hds-foreground-primary'>
+            {{#if this.hasDestinationId}}
+              {{t 'resources.alias.messages.clear-or-delete'}}
+            {{else}}
+              {{t 'resources.alias.messages.delete'}}
+            {{/if}}
+          </p>
+
+        </M.Body>
+
+        <M.Footer>
+          <Hds::ButtonSet>
+            <Hds::Button
+              type='button'
+              @text={{t 'actions.delete'}}
+              {{on 'click' (fn this.deleteAlias this.selectedAlias)}}
+            />
+            {{#if this.hasDestinationId}}
+              <Hds::Button
+                type='button'
+                @text={{t 'actions.clear'}}
+                @color='secondary'
+                {{on 'click' (fn this.clearAlias this.selectedAlias)}}
+              />
+            {{/if}}
+            <Hds::Button
+              type='button'
+              @text={{t 'actions.cancel'}}
+              @color='secondary'
+              {{on 'click' this.toggleModal}}
+            />
+          </Hds::ButtonSet>
+
+        </M.Footer>
+      </Hds::Modal>
+    {{/if}}
   </page.body>
 </Rose::Layout::Page>
\ No newline at end of file