From de20b984e898e7b3865aa96e4339854b24052e02 Mon Sep 17 00:00:00 2001
From: Methapon Metanipat <methapon@frappet.com>
Date: Mon, 28 Oct 2024 10:23:35 +0700
Subject: [PATCH] feat: add icon support for badge component

---
 src/components/BadgeComponent.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/BadgeComponent.vue b/src/components/BadgeComponent.vue
index 01ebbd5f..5f233ca1 100644
--- a/src/components/BadgeComponent.vue
+++ b/src/components/BadgeComponent.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
+import { Icon } from '@iconify/vue';
 defineProps<{
+  icon?: string;
   title?: string;
   titleI18n?: string;
   hslaColor?: string;
@@ -11,7 +13,8 @@ defineProps<{
     class="rounded q-px-sm flex-center"
     :style="`color: hsla(var(${!!hslaColor ? hslaColor : '--green-6-hsl'}) / 0.8);  background: hsla(var(${!!hslaColor ? hslaColor : '--green-6-hsl'}) / 0.1); `"
   >
-    &#128900;
+    <template v-if="!icon">&#128900;</template>
+    <Icon v-else :icon style="margin-right: 0.25rem" />
     {{ title || (!!titleI18n ? $t(titleI18n) : '-') }}
   </div>
 </template>