From 5eabbb77c166037641764ac708d78fa630b97791 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Tue, 12 Mar 2024 06:45:00 +0000
Subject: [PATCH] fix(nc-gui): add support to show base emoji if exist

---
 packages/nc-gui/components/cmd-k/index.vue             | 10 ++++++++--
 .../components/dashboard/TreeView/ProjectNode.vue      |  1 +
 .../nc-gui/components/general/BaseIconColorPicker.vue  |  7 ++++++-
 packages/nc-gui/components/workspace/ProjectList.vue   |  1 +
 .../nocodb/src/services/command-palette.service.ts     |  4 ++--
 5 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/components/cmd-k/index.vue b/packages/nc-gui/components/cmd-k/index.vue
index 948dbeee67..66b2a37dfb 100644
--- a/packages/nc-gui/components/cmd-k/index.vue
+++ b/packages/nc-gui/components/cmd-k/index.vue
@@ -386,8 +386,14 @@ defineExpose({
                   @click="fireAction(act)"
                 >
                   <div class="cmdk-action-content w-full">
-                    <template v-if="title === 'Bases' || act.icon === 'project'">
-                      <GeneralBaseIconColorPicker :key="act.iconColor" :color="act.iconColor" type="database" readonly>
+                    <template v-if="title === 'Bases'">
+                      <GeneralBaseIconColorPicker
+                        :key="act.iconColor"
+                        :model-value="act.iconColor"
+                        :emoji="typeof act.icon === 'string' ? act.icon : ''"
+                        type="database"
+                        readonly
+                      >
                       </GeneralBaseIconColorPicker>
                     </template>
                     <template v-else>
diff --git a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
index 334469dab3..1351b1aa1f 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
@@ -432,6 +432,7 @@ const projectDelete = () => {
                   :key="`${base.id}_${parseProp(base.meta).iconColor}`"
                   :type="base?.type"
                   :model-value="parseProp(base.meta).iconColor"
+                  :emoji="parseProp(base.meta).icon"
                   size="small"
                   :readonly="(base?.type && base?.type !== 'database') || !isUIAllowed('baseRename')"
                   @update:model-value="setColor($event, base)"
diff --git a/packages/nc-gui/components/general/BaseIconColorPicker.vue b/packages/nc-gui/components/general/BaseIconColorPicker.vue
index ec4e381657..4215501d79 100644
--- a/packages/nc-gui/components/general/BaseIconColorPicker.vue
+++ b/packages/nc-gui/components/general/BaseIconColorPicker.vue
@@ -7,6 +7,7 @@ const props = withDefaults(
   defineProps<{
     type?: NcProjectType | string
     modelValue?: string
+    emoji?: string
     size?: 'small' | 'medium' | 'large' | 'xlarge'
     readonly?: boolean
     iconClass?: string
@@ -73,7 +74,11 @@ watch(
           <template #title> {{ $t('tooltip.changeIconColour') }} </template>
 
           <div>
-            <GeneralProjectIcon :color="colorRef" :type="type" />
+            <LazyGeneralEmojiPicker :key="emoji" :emoji="emoji" readonly size="small">
+              <template #default>
+                <GeneralProjectIcon :color="colorRef" :type="type" />
+              </template>
+            </LazyGeneralEmojiPicker>
           </div>
         </NcTooltip>
       </div>
diff --git a/packages/nc-gui/components/workspace/ProjectList.vue b/packages/nc-gui/components/workspace/ProjectList.vue
index 5909400f33..325f59c2b6 100644
--- a/packages/nc-gui/components/workspace/ProjectList.vue
+++ b/packages/nc-gui/components/workspace/ProjectList.vue
@@ -255,6 +255,7 @@ const setColor = async (color: string, base: BaseType) => {
                 :key="`${record.id}_${parseProp(record.meta).iconColor}`"
                 :type="record?.type"
                 :model-value="parseProp(record.meta).iconColor"
+                :emoji="parseProp(record.meta).icon"
                 :readonly="(record?.type && record?.type !== 'database') || !isUIAllowed('baseRename')"
                 @update:model-value="setColor($event, record)"
               >
diff --git a/packages/nocodb/src/services/command-palette.service.ts b/packages/nocodb/src/services/command-palette.service.ts
index 6076461a02..ccb00f39a3 100644
--- a/packages/nocodb/src/services/command-palette.service.ts
+++ b/packages/nocodb/src/services/command-palette.service.ts
@@ -28,7 +28,7 @@ export class CommandPaletteService {
           cmdData.push({
             id: `p-${base.id}`,
             title: base.title,
-            icon: 'project',
+            icon: deserializeJSON(base.meta)?.icon,
             iconColor: deserializeJSON(base.meta)?.iconColor,
             section: 'Bases',
             scopePayload: {
@@ -71,7 +71,7 @@ export class CommandPaletteService {
           cmdData.push({
             id: `p-${b.id}`,
             title: b.title,
-            icon: 'project',
+            icon: deserializeJSON(b.meta)?.icon,
             iconColor: deserializeJSON(b.meta)?.iconColor,
             section: 'Bases',
           });