From 31c65437f7736a5ba838b406bf65a2cfdd7cc142 Mon Sep 17 00:00:00 2001
From: Manjiri Tapaswi <manjiri.tapaswi@konghq.com>
Date: Thu, 12 Dec 2024 12:13:15 -0800
Subject: [PATCH] fix(*): fix imports and styles

---
 .../sandbox/pages/EntityEmptyStatePage.vue    |  2 +
 .../entity-empty-state/EntityEmptyState.vue   | 83 ++++++++++---------
 2 files changed, 44 insertions(+), 41 deletions(-)

diff --git a/packages/entities/entities-shared/sandbox/pages/EntityEmptyStatePage.vue b/packages/entities/entities-shared/sandbox/pages/EntityEmptyStatePage.vue
index 1716c5a961..b0d5beef25 100644
--- a/packages/entities/entities-shared/sandbox/pages/EntityEmptyStatePage.vue
+++ b/packages/entities/entities-shared/sandbox/pages/EntityEmptyStatePage.vue
@@ -6,6 +6,8 @@
         action-button-text="Create a gateway"
         description="Lorem ipsum dolor sit amet consectetur adipisicing elit. Id quidem aperiam similique vitae beatae. Repellat quam voluptas vitae, maxime consequuntur praesentium suscipit. Numquam aliquid nulla vel esse accusantium reiciendis error?"
         :features="features"
+        learn-more-link="https://konghq.com"
+        pricing="Lorem ipsum dolor sit amet consectetur adipisicing elit."
         title="Gateway Manager"
       >
         <template #icon>
diff --git a/packages/entities/entities-shared/src/components/entity-empty-state/EntityEmptyState.vue b/packages/entities/entities-shared/src/components/entity-empty-state/EntityEmptyState.vue
index b79e8ae121..bbaffd05e5 100644
--- a/packages/entities/entities-shared/src/components/entity-empty-state/EntityEmptyState.vue
+++ b/packages/entities/entities-shared/src/components/entity-empty-state/EntityEmptyState.vue
@@ -53,54 +53,55 @@
     >
       <slot name="message" />
     </div>
-  </div>
-  <div
-    v-if="(actionButtonText) || $slots.action"
-    class="entity-empty-state-action"
-  >
-    <KButton
-      appearance="primary"
-      @click="$emit('click-action')"
-    >
-      {{ actionButtonText }}
-    </KButton>
-    <KButton
-      v-if="learnMoreLink"
-      appearance="secondary"
-      :to="learnMoreLink"
-    >
-      <BookIcon decorative />
-      {{ t('emptyState.learnMore') }}
-    </KButton>
-  </div>
-  <div class="entity-empty-state-card-container">
-    <template
-      v-for="feature in features"
-      :key="feature"
+    <div
+      v-if="(actionButtonText) || $slots.action"
+      class="entity-empty-state-action"
     >
-      <KCard
-        class="entity-empty-state-card"
-        :title="feature.title"
+      <KButton
+        appearance="primary"
+        @click="$emit('click-action')"
       >
-        <template #title>
-          <component
-            :is="feature.iconVariant"
-            :color="`var(--kui-color-text-neutral-stronger, ${KUI_COLOR_TEXT_NEUTRAL_STRONGER})`"
-            :size="KUI_ICON_SIZE_30"
-          />
-          <div>{{ feature.title }}</div>
-        </template>
-        <template #default>
-          {{ feature.description }}
-        </template>
-      </KCard>
-    </template>
+        {{ actionButtonText }}
+      </KButton>
+      <KButton
+        v-if="learnMoreLink"
+        appearance="secondary"
+        :to="learnMoreLink"
+      >
+        <BookIcon decorative />
+        {{ t('emptyState.learnMore') }}
+      </KButton>
+    </div>
+    <div class="entity-empty-state-card-container">
+      <template
+        v-for="feature in features"
+        :key="feature"
+      >
+        <KCard
+          class="entity-empty-state-card"
+          :title="feature.title"
+        >
+          <template #title>
+            <component
+              :is="feature.iconVariant"
+              :color="`var(--kui-color-text-neutral-stronger, ${KUI_COLOR_TEXT_NEUTRAL_STRONGER})`"
+              :size="KUI_ICON_SIZE_30"
+            />
+            <div>{{ feature.title }}</div>
+          </template>
+          <template #default>
+            {{ feature.description }}
+          </template>
+        </KCard>
+      </template>
+    </div>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { type PropType } from 'vue'
-import KButton from '@kong/kongponents'
+import { KButton } from '@kong/kongponents'
+import { BookIcon } from '@kong/icons'
 import composables from '../../composables'
 import type { EmptyStateFeature } from 'src/types/entity-empty-state'
 import { KUI_ICON_SIZE_30, KUI_COLOR_TEXT_NEUTRAL_STRONGER } from '@kong/design-tokens'