refactor(gui-v2): i18n - antd table - noData

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { Tooltip as ATooltip } from 'ant-design-vue'
+import { Tooltip as ATooltip, Empty } from 'ant-design-vue'
 import type { AuditType } from 'nocodb-sdk'
 import { timeAgo } from '~/utils/dateTimeUtils'
 import { h, useNuxtApp, useProject } from '#imports'
@@ -104,13 +104,10 @@ const columns = [
       />
     </div>
 
-    <a-table
-      class="w-full"
-      size="small"
-      :data-source="audits ?? []"
-      :columns="columns"
-      :pagination="false"
-      :loading="isLoading"
-    />
+    <a-table class="w-full" size="small" :data-source="audits ?? []" :columns="columns" :pagination="false" :loading="isLoading">
+      <template #emptyText>
+        <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+      </template>
+    </a-table>
   </div>
 </template>

packages/nc-gui-v2/components/dashboard/settings/Metadata.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { message } from 'ant-design-vue'
+import { Empty, message } from 'ant-design-vue'
 import { h, useNuxtApp, useProject } from '#imports'
 import MdiReload from '~icons/mdi/reload'
 import MdiDatabaseSync from '~icons/mdi/database-sync'
@@ -103,7 +103,9 @@ const columns = [
           :pagination="false"
           :loading="isLoading"
           bordered
-        />
+        >
+          <template #emptyText> <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" /> </template
+        ></a-table>
       </div>
     </div>
     <div class="flex place-content-center w-2/5">

packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { message } from 'ant-design-vue'
+import { Empty, message } from 'ant-design-vue'
 import { extractSdkResponseErrorMsg, viewIcons } from '~/utils'
 import { computed, h, useNuxtApp, useProject } from '#imports'
 
@@ -133,6 +133,9 @@ const columns = [
             })
           "
         >
+          <template #emptyText>
+            <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+          </template>
           <template #bodyCell="{ record, column }">
             <div v-if="column.name === 'table_name'">{{ record._ptn }}</div>
             <div v-if="column.name === 'view_name'">

packages/nc-gui-v2/components/smartsheet-toolbar/SharedViewList.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useClipboard } from '@vueuse/core'
 import { ViewTypes } from 'nocodb-sdk'
-import { message } from 'ant-design-vue'
+import { Empty, message } from 'ant-design-vue'
 import { onMounted, useSmartsheetStoreOrThrow } from '#imports'
 import { extractSdkResponseErrorMsg } from '~/utils/errorUtils'
 import MdiVisibilityOnIcon from '~icons/mdi/visibility'
@@ -90,7 +90,18 @@ const deleteLink = async (id: string) => {
 
 <template>
   <div class="w-full">
-    <a-table class="" size="small" :data-source="sharedViewList" :pagination="{ position: ['bottomCenter'] }">
+    <a-table
+      class=""
+      size="small"
+      :data-source="sharedViewList"
+      :pagination="{ position: ['bottomCenter'] }"
+      :locale="{
+        emptyText: $t('labels.noData'),
+      }"
+    >
+      <template #emptyText>
+        <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+      </template>
       <!-- View name -->
       <a-table-column key="title" :title="$t('labels.viewName')" data-index="title">
         <template #default="{ text }">

packages/nc-gui-v2/components/template/Editor.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ColumnType, TableType } from 'nocodb-sdk'
 import { UITypes, isVirtualCol } from 'nocodb-sdk'
-import { Form, message } from 'ant-design-vue'
+import { Empty, Form, message } from 'ant-design-vue'
 import { srcDestMappingColumns, tableColumns } from './utils'
 import {
   MetaInj,
@@ -537,6 +537,9 @@ onMounted(() => {
             :columns="srcDestMappingColumns"
             :pagination="false"
           >
+            <template #emptyText>
+              <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+            </template>
             <template #headerCell="{ column }">
               <span v-if="column.key === 'source_column' || column.key === 'destination_column'">
                 {{ column.name }}
@@ -618,6 +621,9 @@ onMounted(() => {
               :columns="tableColumns"
               :pagination="false"
             >
+              <template #emptyText>
+                <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+              </template>
               <template #headerCell="{ column }">
                 <template v-if="column.key === 'column_name'">
                   <span>

packages/nc-gui-v2/pages/index/index/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { Modal, message } from 'ant-design-vue'
+import { Empty, Modal, message } from 'ant-design-vue'
 import type { ProjectType } from 'nocodb-sdk'
 import { Chrome } from '@ckpack/vue-color'
 import tinycolor from 'tinycolor2'
@@ -204,6 +204,9 @@ watch(themePrimaryColors, async (nextColors) => {
         :data-source="filteredProjects"
         :pagination="{ position: ['bottomCenter'] }"
       >
+        <template #emptyText>
+          <a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" :description="$t('labels.noData')" />
+        </template>
         <!-- Title -->
         <a-table-column key="title" :title="$t('general.title')" data-index="title">
           <template #default="{ text, record }">