From eba6ef57634990273a4fe2066049e5ac905f9419 Mon Sep 17 00:00:00 2001
From: Katrin Yordanova <katrin.yordanova@crust.tech>
Date: Wed, 18 Oct 2023 12:50:44 +0300
Subject: [PATCH] Address comments

---
 .../compose/src/views/Admin/Pages/Edit.vue    | 43 ++++++++++++-------
 locale/en/corteza-webapp-compose/page.yaml    |  3 +-
 2 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/client/web/compose/src/views/Admin/Pages/Edit.vue b/client/web/compose/src/views/Admin/Pages/Edit.vue
index 2ab05161e5..a1ea653f7d 100644
--- a/client/web/compose/src/views/Admin/Pages/Edit.vue
+++ b/client/web/compose/src/views/Admin/Pages/Edit.vue
@@ -723,32 +723,34 @@
       :title="$t('icon.configure')"
       size="lg"
       label-class="text-primary"
+      footer-class="d-flex justify-content-between"
       no-fade
     >
       <template #modal-footer>
-        <b-button
-          variant="link"
-          class="text-primary"
-          @click="closeIconModal"
-        >
-          {{ $t('general:label.cancel') }}
-        </b-button>
         <c-input-confirm
-          :disabled="attachments && !selectedAttachmentID"
-          :tooltip="$t('icon.tooltip.delete')"
+          :disabled="(attachments && !selectedAttachmentID) || processing"
           size="md"
           variant="danger"
           class="py-1"
           @confirmed="deleteIcon"
         >
-          {{ $t('general:label.delete') }}
+          {{ $t('icon.delete') }}
         </c-input-confirm>
-        <b-button
-          variant="primary"
-          @click="saveIconModal"
-        >
-          {{ $t('general:label.saveAndClose') }}
-        </b-button>
+        <div>
+          <b-button
+            variant="link"
+            class="text-primary"
+            @click="closeIconModal"
+          >
+            {{ $t('general:label.cancel') }}
+          </b-button>
+          <b-button
+            variant="primary"
+            @click="saveIconModal"
+          >
+            {{ $t('general:label.saveAndClose') }}
+          </b-button>
+        </div>
       </template>
       <b-form-group
         :label="$t('icon.upload')"
@@ -1252,6 +1254,8 @@ export default {
     },
 
     async fetchAttachments () {
+      this.processing = true
+
       return this.$ComposeAPI.iconList({ sort: 'id DESC' })
         .then(({ set: attachments = [] }) => {
           const baseURL = this.$ComposeAPI.baseURL
@@ -1267,6 +1271,9 @@ export default {
           }
         })
         .catch(this.toastErrorHandler(this.$t('notification:page.iconFetchFailed')))
+        .finally(() => {
+          this.processing = false
+        })
     },
 
     addLayoutAction () {
@@ -1372,6 +1379,10 @@ export default {
 
     setCurrentIcon () {
       this.selectedAttachmentID = (this.attachments.find(a => a.url === this.icon.src) || {}).attachmentID
+
+      if (!this.selectedAttachmentID) {
+        this.icon = {}
+      }
     },
   },
 }
diff --git a/locale/en/corteza-webapp-compose/page.yaml b/locale/en/corteza-webapp-compose/page.yaml
index 96a8c92bd6..fa711db370 100644
--- a/locale/en/corteza-webapp-compose/page.yaml
+++ b/locale/en/corteza-webapp-compose/page.yaml
@@ -77,8 +77,7 @@ icon:
   page: Page icon
   upload: Upload icon
   list: Uploaded icons
-  tooltip:
-    delete: Delete selected icon
+  delete: Delete selected icon
 url:
   label: Or add URL to icon
 import: 'Import page(s):'