Browse Source

fix: Icon as IconifyIcon

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>
pull/5802/head
Raju Udava 2 years ago
parent
commit
803c83a487
  1. 9
      packages/nc-gui/components/dashboard/TreeView.vue
  2. 4
      packages/nc-gui/components/general/EmojiIcons.vue
  3. 4
      packages/nc-gui/pages/[projectType]/[projectId]/index/index.vue

9
packages/nc-gui/components/dashboard/TreeView.vue

@ -1,5 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { nextTick } from '@vue/runtime-core' import { nextTick } from '@vue/runtime-core'
import { Icon as IconifyIcon } from '@iconify/vue'
import type { TableType } from 'nocodb-sdk' import type { TableType } from 'nocodb-sdk'
import type { Input } from 'ant-design-vue' import type { Input } from 'ant-design-vue'
import { Dropdown, Tooltip, message } from 'ant-design-vue' import { Dropdown, Tooltip, message } from 'ant-design-vue'
@ -734,12 +735,12 @@ const duplicateTable = async (table: TableType) => {
<div class="flex items-center" @click.stop> <div class="flex items-center" @click.stop>
<component :is="isUIAllowed('tableIconCustomisation') ? Tooltip : 'div'"> <component :is="isUIAllowed('tableIconCustomisation') ? Tooltip : 'div'">
<span v-if="table.meta?.icon" :key="table.meta?.icon" class="nc-table-icon flex items-center"> <span v-if="table.meta?.icon" :key="table.meta?.icon" class="nc-table-icon flex items-center">
<Icon <IconifyIcon
:key="table.meta?.icon" :key="table.meta?.icon"
:data-testid="`nc-icon-${table.meta?.icon}`" :data-testid="`nc-icon-${table.meta?.icon}`"
class="text-xl" class="text-xl"
:icon="table.meta?.icon" :icon="table.meta?.icon"
></Icon> ></IconifyIcon>
</span> </span>
<component <component
:is="icon(table)" :is="icon(table)"
@ -1058,12 +1059,12 @@ const duplicateTable = async (table: TableType) => {
<div class="flex items-center" @click.stop> <div class="flex items-center" @click.stop>
<component :is="isUIAllowed('tableIconCustomisation') ? Tooltip : 'div'"> <component :is="isUIAllowed('tableIconCustomisation') ? Tooltip : 'div'">
<span v-if="table.meta?.icon" :key="table.meta?.icon" class="nc-table-icon flex items-center"> <span v-if="table.meta?.icon" :key="table.meta?.icon" class="nc-table-icon flex items-center">
<Icon <IconifyIcon
:key="table.meta?.icon" :key="table.meta?.icon"
:data-testid="`nc-icon-${table.meta?.icon}`" :data-testid="`nc-icon-${table.meta?.icon}`"
class="text-xl" class="text-xl"
:icon="table.meta?.icon" :icon="table.meta?.icon"
></Icon> ></IconifyIcon>
</span> </span>
<component <component
:is="icon(table)" :is="icon(table)"

4
packages/nc-gui/components/general/EmojiIcons.vue

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import { Icon } from '@iconify/vue' import { Icon as IconifyIcon } from '@iconify/vue'
import InfiniteLoading from 'v3-infinite-loading' import InfiniteLoading from 'v3-infinite-loading'
import { emojiIcons } from '#imports' import { emojiIcons } from '#imports'
@ -48,7 +48,7 @@ const selectIcon = (icon?: string) => {
<div class="flex gap-1 flex-wrap w-full flex-shrink overflow-y-auto scrollbar-thin-dull"> <div class="flex gap-1 flex-wrap w-full flex-shrink overflow-y-auto scrollbar-thin-dull">
<div v-for="icon of filteredIcons" :key="icon" @click="selectIcon(icon)"> <div v-for="icon of filteredIcons" :key="icon" @click="selectIcon(icon)">
<span class="cursor-pointer nc-emoji-item"> <span class="cursor-pointer nc-emoji-item">
<Icon class="text-xl iconify" :icon="`emojione:${icon}`"></Icon> <IconifyIcon class="text-xl iconify" :icon="`emojione:${icon}`"></IconifyIcon>
</span> </span>
</div> </div>
<InfiniteLoading @infinite="load"><span /></InfiniteLoading> <InfiniteLoading @infinite="load"><span /></InfiniteLoading>

4
packages/nc-gui/pages/[projectType]/[projectId]/index/index.vue

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { Icon } from '@iconify/vue' import { Icon as IconifyIcon } from '@iconify/vue'
import type { TabItem } from '~/lib' import type { TabItem } from '~/lib'
import { TabType } from '~/lib' import { TabType } from '~/lib'
import { TabMetaInj, iconMap, provide, storeToRefs, useGlobal, useSidebar, useTabs } from '#imports' import { TabMetaInj, iconMap, provide, storeToRefs, useGlobal, useSidebar, useTabs } from '#imports'
@ -58,7 +58,7 @@ const hideSidebarOnClickOrTouchIfMobileMode = () => {
<template #tab> <template #tab>
<div class="flex items-center gap-2" data-testid="nc-tab-title"> <div class="flex items-center gap-2" data-testid="nc-tab-title">
<div class="flex items-center"> <div class="flex items-center">
<Icon <IconifyIcon
v-if="tab.meta?.icon" v-if="tab.meta?.icon"
:icon="tab.meta?.icon" :icon="tab.meta?.icon"
class="text-xl" class="text-xl"

Loading…
Cancel
Save