feat(nc-gui): placeholder for table and multi field editor

packages/nc-gui/components/project/AllTables.vue

@@ -122,7 +122,6 @@ const onCreateBaseClick = () => {
       </component>
     </div>
     <template v-if="activeTables.length">
-    
       <div class="flex flex-row w-full text-gray-400 border-b-1 border-gray-50 py-3 px-2.5">
         <div class="w-2/5">{{ $t('objects.table') }}</div>
         <div class="w-1/5">{{ $t('general.source') }}</div>
@@ -162,7 +161,16 @@ const onCreateBaseClick = () => {
         </div>
       </div>
     </template>
-<template v-else>fdas</template>
+    <div v-else class="py-3 flex items-center gap-6 <lg:flex-col">
+      <img src="~assets/img/placeholder/table.png" class="!w-[23rem] flex-none" />
+      <div class="text-center lg:text-left">
+        <div class="text-2xl text-gray-800 font-bold">{{ $t('placeholder.createTable') }}</div>
+        <div class="text-sm text-gray-700 pt-6">
+          {{ $t('placeholder.createTableLabel') }}
+        </div>
+      </div>
+    </div>
+
     <ProjectImportModal v-if="defaultBase" v-model:visible="isImportModalOpen" :source="defaultBase" />
     <LazyDashboardSettingsDataSourcesCreateBase v-model:open="isNewBaseModalOpen" />
   </div>
@@ -177,7 +185,7 @@ const onCreateBaseClick = () => {
   }
 
   .label {
-    @apply text-base font-medium;
+    @apply text-base font-medium break-normal;
   }
 }
 

packages/nc-gui/components/smartsheet/details/Fields.vue

@@ -1254,7 +1254,7 @@ watch(
                 @add="onFieldAdd"
               />
               <div v-else class="w-[25rem] flex flex-col justify-center p-4 items-center">
-                <img src="~assets/img/fieldPlaceholder.svg" class="!w-[18rem]" />
+                <img src="~assets/img/placeholder/multi-field-editor.png" class="!w-[18rem]" />
                 <div class="text-2xl text-gray-600 font-bold text-center pt-6">{{ $t('labels.multiField.selectField') }}</div>
                 <div class="text-center text-sm px-2 text-gray-500 pt-6">
                   {{ $t('labels.multiField.selectFieldLabel') }}

packages/nc-gui/lang/en.json

@@ -959,7 +959,9 @@
     "decimal7": "1.0000000",
     "decimal8": "1.00000000",
     "value": "Value",
-    "key": "Key"
+    "key": "Key",
+    "createTable": "Create your First Table!",
+    "createTableLabel": "From scratch or import or connect to external database"
   },
   "msg": {
     "clickToCopyFieldId": "Click to copy Field Id",