From ab9b9fa8c4aabbdfb6752b15910476deb0cca8a3 Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 20:08:18 +0300
Subject: [PATCH 1/9] feat(gui-v2): project metadata

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 .../dashboard/settings/Metadata.vue           | 110 ++++++++++++++++++
 .../dashboard/settings/SettingsModal.vue      |   3 +-
 2 files changed, 112 insertions(+), 1 deletion(-)
 create mode 100644 packages/nc-gui-v2/components/dashboard/settings/Metadata.vue

diff --git a/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue b/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue
new file mode 100644
index 0000000000..334bec0c80
--- /dev/null
+++ b/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue
@@ -0,0 +1,110 @@
+<script setup lang="ts">
+import { useToast } from 'vue-toastification'
+import { h, useNuxtApp, useProject } from '#imports'
+import MdiReload from '~icons/mdi/reload'
+import MdiDatabaseSync from '~icons/mdi/database-sync'
+
+const { $api } = useNuxtApp()
+const { project } = useProject()
+const toast = useToast()
+
+let isLoading = $ref(false)
+let isDifferent = $ref(false)
+let metadiff = $ref<Array<any>>([])
+
+async function loadMetaDiff() {
+  try {
+    if (!project.value?.id) return
+    isLoading = true
+    isDifferent = false
+    metadiff = await $api.project.metaDiffGet(project.value?.id)
+    for (const model of metadiff) {
+      if (model.detectedChanges?.length > 0) {
+        model.syncState = model.detectedChanges.map((el: any) => el?.msg).join(', ')
+        isDifferent = true
+      }
+    }
+  } catch (e) {
+    console.error(e)
+  } finally {
+    isLoading = false
+  }
+}
+
+async function syncMetaDiff() {
+  try {
+    if (!project.value?.id || !isDifferent) return
+    isLoading = true
+    await $api.project.metaDiffSync(project.value.id)
+    toast.info(`Table metadata recreated successfully`)
+    await loadMetaDiff()
+  } catch (e: any) {
+    if (e.response?.status === 402) {
+      toast.info(e.message)
+    } else {
+      toast.error(e.message)
+    }
+  } finally {
+    isLoading = false
+  }
+}
+
+onMounted(async () => {
+  if (metadiff.length === 0) {
+    await loadMetaDiff()
+  }
+})
+
+const tableHeaderRenderer = (label: string) => () => h('div', { class: 'text-gray-500' }, label)
+
+const columns = [
+  {
+    title: tableHeaderRenderer('Models'),
+    dataIndex: 'title',
+    key: 'title',
+  },
+  {
+    title: tableHeaderRenderer('Sync State'),
+    dataIndex: 'syncState',
+    key: 'syncState',
+    customRender: (value: { text: string }) =>
+      h('div', { style: { color: value.text ? 'red' : 'gray' } }, value.text || 'No change identified'),
+  },
+]
+</script>
+
+<template>
+  <div class="flex flex-row w-full">
+    <div class="flex flex-column w-3/5">
+      <div class="flex flex-row justify-end items-center w-full mb-4">
+        <a-button class="self-start" @click="loadMetaDiff">
+          <div class="flex items-center gap-2 text-gray-600 font-light">
+            <MdiReload :class="{ 'animate-infinite animate-spin !text-success': isLoading }" />
+            Reload
+          </div>
+        </a-button>
+      </div>
+      <a-table
+        class="w-full"
+        :data-source="metadiff ?? []"
+        :columns="columns"
+        :pagination="false"
+        :loading="isLoading"
+        bordered
+      />
+    </div>
+    <div class="flex place-content-center w-2/5">
+      <div v-if="isDifferent">
+        <a-button v-t="['a:proj-meta:meta-data:sync']" type="primary" @click="syncMetaDiff">
+          <div class="flex items-center gap-2">
+            <MdiDatabaseSync />
+            Sync Now
+          </div>
+        </a-button>
+      </div>
+      <div v-else>
+        <span><a-alert message="Tables metadata is in sync" type="success" show-icon /></span>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
index ddc82ef0cc..ccb6bd4974 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
@@ -2,6 +2,7 @@
 import type { FunctionalComponent, SVGAttributes } from 'vue'
 import AuditTab from './AuditTab.vue'
 import AppStore from './AppStore.vue'
+import Metadata from './Metadata.vue'
 import StoreFrontOutline from '~icons/mdi/storefront-outline'
 import TeamFillIcon from '~icons/ri/team-fill'
 import MultipleTableIcon from '~icons/mdi/table-multiple'
@@ -61,7 +62,7 @@ const tabsInfo: TabGroup = {
     subTabs: {
       metaData: {
         title: 'Metadata',
-        body: () => AuditTab,
+        body: () => Metadata,
       },
       acl: {
         title: 'UI Access Control',

From d3e11dafafc73981e58d6b91e7a264d5f22159d0 Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 20:08:30 +0300
Subject: [PATCH 2/9] feat(gui-v2): project UI ACL

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 .../dashboard/settings/SettingsModal.vue      |   3 +-
 .../components/dashboard/settings/UIAcl.vue   | 167 ++++++++++++++++++
 2 files changed, 169 insertions(+), 1 deletion(-)
 create mode 100644 packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue

diff --git a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
index ccb6bd4974..b3eb076fa7 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/SettingsModal.vue
@@ -3,6 +3,7 @@ import type { FunctionalComponent, SVGAttributes } from 'vue'
 import AuditTab from './AuditTab.vue'
 import AppStore from './AppStore.vue'
 import Metadata from './Metadata.vue'
+import UIAcl from './UIAcl.vue'
 import StoreFrontOutline from '~icons/mdi/storefront-outline'
 import TeamFillIcon from '~icons/ri/team-fill'
 import MultipleTableIcon from '~icons/mdi/table-multiple'
@@ -66,7 +67,7 @@ const tabsInfo: TabGroup = {
       },
       acl: {
         title: 'UI Access Control',
-        body: () => AuditTab,
+        body: () => UIAcl,
       },
     },
   },
diff --git a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
new file mode 100644
index 0000000000..7a2b5eeaea
--- /dev/null
+++ b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
@@ -0,0 +1,167 @@
+<script setup lang="ts">
+import { useToast } from 'vue-toastification'
+import { viewIcons } from '~/utils/viewUtils'
+import { h, useNuxtApp, useProject } from '#imports'
+import MdiReload from '~icons/mdi/reload'
+import MdiContentSave from '~icons/mdi/content-save'
+import MdiMagnify from '~icons/mdi/magnify'
+
+const { $api, $e } = useNuxtApp()
+const { project } = useProject()
+const toast = useToast()
+
+let isLoading = $ref(false)
+let tables = $ref<Array<any>>([])
+let searchInput = $ref<string>('')
+
+async function loadTableList() {
+  try {
+    if (!project.value?.id) return
+    isLoading = true
+    // TODO includeM2M
+    tables = await $api.project.modelVisibilityList(project.value?.id, {
+      includeM2M: '',
+    })
+  } catch (e) {
+    console.error(e)
+  } finally {
+    isLoading = false
+  }
+}
+
+async function saveUIAcl() {
+  try {
+    if (!project.value?.id) return
+    await $api.project.modelVisibilitySet(
+      project.value.id,
+      tables.filter((t) => t.edited),
+    )
+    toast.success('Updated UI ACL for tables successfully')
+  } catch (e: any) {
+    toast.error(e?.message)
+  }
+  $e('a:proj-meta:ui-acl')
+}
+
+onMounted(async () => {
+  if (tables.length === 0) {
+    await loadTableList()
+  }
+})
+
+const tableHeaderRenderer = (label: string) => () => h('div', { class: 'text-gray-500' }, label)
+
+const columns = [
+  {
+    title: tableHeaderRenderer('Table name'),
+    name: 'table_name',
+    onFilter: (value: string, record: any) => record._ptn.indexOf(value) === 0,
+  },
+  {
+    title: tableHeaderRenderer('View name'),
+    name: 'view_name',
+  },
+  {
+    // { icon: MdiGridIcon, color: 'blue' },
+    title: tableHeaderRenderer('Editor'),
+    name: 'editor',
+  },
+  {
+    title: tableHeaderRenderer('Commenter'),
+    name: 'commenter',
+  },
+  {
+    title: tableHeaderRenderer('Viewer'),
+    name: 'viewer',
+  },
+]
+</script>
+
+<template>
+  <div class="flex flex-row w-full">
+    <div class="flex flex-column w-full">
+      <div class="flex flex-row items-center w-full mb-4 gap-2">
+        <a-input v-model:value="searchInput" placeholder="Search models">
+          <template #prefix>
+            <MdiMagnify />
+          </template>
+        </a-input>
+        <a-button class="self-start" @click="loadTableList">
+          <div class="flex items-center gap-2 text-gray-600 font-light">
+            <MdiReload :class="{ 'animate-infinite animate-spin !text-success': isLoading }" />
+            Reload
+          </div>
+        </a-button>
+        <a-button class="self-start" @click="saveUIAcl">
+          <div class="flex items-center gap-2 text-gray-600 font-light">
+            <MdiContentSave />
+            Save
+          </div>
+        </a-button>
+      </div>
+      <a-table
+        class="w-full"
+        :data-source="
+          tables.filter(
+            (el) =>
+              (typeof el?._ptn === 'string' && el._ptn.toLowerCase().includes(searchInput.toLowerCase())) ||
+              (typeof el?.title === 'string' && el.title.toLowerCase().includes(searchInput.toLowerCase())),
+          )
+        "
+        :columns="columns"
+        :pagination="false"
+        :loading="isLoading"
+        bordered
+      >
+        <template #bodyCell="{ record, column }">
+          <div v-if="column.name === 'table_name'">{{ record._ptn }}</div>
+          <div v-if="column.name === 'view_name'">
+            <div class="flex align-center">
+              <component :is="viewIcons[record.type].icon" :class="`text-${viewIcons[record.type].color} mr-1`" />
+              {{ record.title }}
+            </div>
+          </div>
+          <div v-if="column.name === 'editor'">
+            <a-tooltip>
+              <template #title>Click to hide '{{ record.title }}' for role:Editor in UI dashboard</template>
+              <a-checkbox
+                :checked="!record.disabled.editor"
+                @change="
+                  // eslint-disable-next-line prettier/prettier
+                  record.disabled.editor = !record.disabled.editor;
+                  record.edited = true
+                "
+              ></a-checkbox>
+            </a-tooltip>
+          </div>
+          <div v-if="column.name === 'commenter'">
+            <a-tooltip>
+              <template #title>Click to hide '{{ record.title }}' for role:Commenter in UI dashboard</template>
+              <a-checkbox
+                :checked="!record.disabled.commenter"
+                @change="
+                  // eslint-disable-next-line prettier/prettier
+                  record.disabled.commenter = !record.disabled.commenter;
+                  record.edited = true
+                "
+              ></a-checkbox>
+            </a-tooltip>
+          </div>
+          <div v-if="column.name === 'viewer'">
+            <a-tooltip>
+              <template #title>Click to hide '{{ record.title }}' for role:Viewer in UI dashboard</template>
+              <a-checkbox
+                :checked="!record.disabled.viewer"
+                @change="
+                  // eslint-disable-next-line prettier/prettier
+                  record.disabled.viewer = !record.disabled.viewer;
+                  record.edited = true
+                "
+              ></a-checkbox>
+            </a-tooltip>
+          </div>
+        </template>
+      </a-table>
+    </div>
+  </div>
+</template>

From ab835aed092808526492de226d9b9dc065d24cf2 Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 20:43:41 +0300
Subject: [PATCH 3/9] fix(gui-v2): make UI ACL role columns same size

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
index 7a2b5eeaea..b361ded48f 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
@@ -55,7 +55,6 @@ const columns = [
   {
     title: tableHeaderRenderer('Table name'),
     name: 'table_name',
-    onFilter: (value: string, record: any) => record._ptn.indexOf(value) === 0,
   },
   {
     title: tableHeaderRenderer('View name'),
@@ -65,14 +64,17 @@ const columns = [
     // { icon: MdiGridIcon, color: 'blue' },
     title: tableHeaderRenderer('Editor'),
     name: 'editor',
+    width: 150,
   },
   {
     title: tableHeaderRenderer('Commenter'),
     name: 'commenter',
+    width: 150,
   },
   {
     title: tableHeaderRenderer('Viewer'),
     name: 'viewer',
+    width: 150,
   },
 ]
 </script>

From ce93117f890ceb2348ffd7da2f8b1fe3645fbb49 Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 20:44:28 +0300
Subject: [PATCH 4/9] feat(gui-v2): improved UI ACL table role handling

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 .../components/dashboard/settings/UIAcl.vue   | 53 ++++++-------------
 1 file changed, 15 insertions(+), 38 deletions(-)

diff --git a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
index b361ded48f..c50ff05a51 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
@@ -10,6 +10,7 @@ const { $api, $e } = useNuxtApp()
 const { project } = useProject()
 const toast = useToast()
 
+const roles = $ref<Array<string>>(['editor', 'commenter', 'viewer'])
 let isLoading = $ref(false)
 let tables = $ref<Array<any>>([])
 let searchInput = $ref<string>('')
@@ -123,44 +124,20 @@ const columns = [
               {{ record.title }}
             </div>
           </div>
-          <div v-if="column.name === 'editor'">
-            <a-tooltip>
-              <template #title>Click to hide '{{ record.title }}' for role:Editor in UI dashboard</template>
-              <a-checkbox
-                :checked="!record.disabled.editor"
-                @change="
-                  // eslint-disable-next-line prettier/prettier
-                  record.disabled.editor = !record.disabled.editor;
-                  record.edited = true
-                "
-              ></a-checkbox>
-            </a-tooltip>
-          </div>
-          <div v-if="column.name === 'commenter'">
-            <a-tooltip>
-              <template #title>Click to hide '{{ record.title }}' for role:Commenter in UI dashboard</template>
-              <a-checkbox
-                :checked="!record.disabled.commenter"
-                @change="
-                  // eslint-disable-next-line prettier/prettier
-                  record.disabled.commenter = !record.disabled.commenter;
-                  record.edited = true
-                "
-              ></a-checkbox>
-            </a-tooltip>
-          </div>
-          <div v-if="column.name === 'viewer'">
-            <a-tooltip>
-              <template #title>Click to hide '{{ record.title }}' for role:Viewer in UI dashboard</template>
-              <a-checkbox
-                :checked="!record.disabled.viewer"
-                @change="
-                  // eslint-disable-next-line prettier/prettier
-                  record.disabled.viewer = !record.disabled.viewer;
-                  record.edited = true
-                "
-              ></a-checkbox>
-            </a-tooltip>
+          <div v-for="role in roles" :key="role">
+            <div v-if="column.name === role">
+              <a-tooltip>
+                <template #title>Click to hide '{{ record.title }}' for role:{{ role }} in UI dashboard</template>
+                <a-checkbox
+                  :checked="!record.disabled[role]"
+                  @change="
+                    // eslint-disable-next-line prettier/prettier
+                    record.disabled[role] = !record.disabled[role];
+                    record.edited = true
+                  "
+                ></a-checkbox>
+              </a-tooltip>
+            </div>
           </div>
         </template>
       </a-table>

From bb2a0e395e12b8b9eb6cd484568d37b06ab9984e Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 21:42:03 +0300
Subject: [PATCH 5/9] fix(gui-v2): requested changes for PR

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 .../dashboard/settings/Metadata.vue           |  4 +-
 .../components/dashboard/settings/UIAcl.vue   | 45 +++++++++----------
 2 files changed, 23 insertions(+), 26 deletions(-)

diff --git a/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue b/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue
index 334bec0c80..54bbb68ebb 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/Metadata.vue
@@ -10,11 +10,12 @@ const toast = useToast()
 
 let isLoading = $ref(false)
 let isDifferent = $ref(false)
-let metadiff = $ref<Array<any>>([])
+let metadiff = $ref<any[]>([])
 
 async function loadMetaDiff() {
   try {
     if (!project.value?.id) return
+
     isLoading = true
     isDifferent = false
     metadiff = await $api.project.metaDiffGet(project.value?.id)
@@ -34,6 +35,7 @@ async function loadMetaDiff() {
 async function syncMetaDiff() {
   try {
     if (!project.value?.id || !isDifferent) return
+
     isLoading = true
     await $api.project.metaDiffSync(project.value.id)
     toast.info(`Table metadata recreated successfully`)
diff --git a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
index c50ff05a51..19efc18801 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
@@ -10,14 +10,23 @@ const { $api, $e } = useNuxtApp()
 const { project } = useProject()
 const toast = useToast()
 
-const roles = $ref<Array<string>>(['editor', 'commenter', 'viewer'])
+const roles = $ref<string[]>(['editor', 'commenter', 'viewer'])
 let isLoading = $ref(false)
-let tables = $ref<Array<any>>([])
-let searchInput = $ref<string>('')
+let tables = $ref<any[]>([])
+let searchInput = $ref('')
+
+const filteredTables = computed(() =>
+  tables.filter(
+    (el) =>
+      (typeof el?._ptn === 'string' && el._ptn.toLowerCase().includes(searchInput.toLowerCase())) ||
+      (typeof el?.title === 'string' && el.title.toLowerCase().includes(searchInput.toLowerCase())),
+  ),
+)
 
 async function loadTableList() {
   try {
     if (!project.value?.id) return
+
     isLoading = true
     // TODO includeM2M
     tables = await $api.project.modelVisibilityList(project.value?.id, {
@@ -33,6 +42,7 @@ async function loadTableList() {
 async function saveUIAcl() {
   try {
     if (!project.value?.id) return
+
     await $api.project.modelVisibilitySet(
       project.value.id,
       tables.filter((t) => t.edited),
@@ -44,6 +54,11 @@ async function saveUIAcl() {
   $e('a:proj-meta:ui-acl')
 }
 
+const onRoleCheck = (record: any, role: string) => {
+  record.disabled[role] = !record.disabled[role]
+  record.edited = true
+}
+
 onMounted(async () => {
   if (tables.length === 0) {
     await loadTableList()
@@ -102,20 +117,7 @@ const columns = [
           </div>
         </a-button>
       </div>
-      <a-table
-        class="w-full"
-        :data-source="
-          tables.filter(
-            (el) =>
-              (typeof el?._ptn === 'string' && el._ptn.toLowerCase().includes(searchInput.toLowerCase())) ||
-              (typeof el?.title === 'string' && el.title.toLowerCase().includes(searchInput.toLowerCase())),
-          )
-        "
-        :columns="columns"
-        :pagination="false"
-        :loading="isLoading"
-        bordered
-      >
+      <a-table class="w-full" :data-source="filteredTables" :columns="columns" :pagination="false" :loading="isLoading" bordered>
         <template #bodyCell="{ record, column }">
           <div v-if="column.name === 'table_name'">{{ record._ptn }}</div>
           <div v-if="column.name === 'view_name'">
@@ -128,14 +130,7 @@ const columns = [
             <div v-if="column.name === role">
               <a-tooltip>
                 <template #title>Click to hide '{{ record.title }}' for role:{{ role }} in UI dashboard</template>
-                <a-checkbox
-                  :checked="!record.disabled[role]"
-                  @change="
-                    // eslint-disable-next-line prettier/prettier
-                    record.disabled[role] = !record.disabled[role];
-                    record.edited = true
-                  "
-                ></a-checkbox>
+                <a-checkbox :checked="!record.disabled[role]" @change="onRoleCheck(record, role)"></a-checkbox>
               </a-tooltip>
             </div>
           </div>

From 07651bfdcc3b415d11e552d40b09557ff7992659 Mon Sep 17 00:00:00 2001
From: mertmit <mertmit99@gmail.com>
Date: Tue, 26 Jul 2022 21:47:11 +0300
Subject: [PATCH 6/9] chore: remove unnecessary comment

Signed-off-by: mertmit <mertmit99@gmail.com>
---
 packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
index 19efc18801..53dc342609 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/UIAcl.vue
@@ -77,7 +77,6 @@ const columns = [
     name: 'view_name',
   },
   {
-    // { icon: MdiGridIcon, color: 'blue' },
     title: tableHeaderRenderer('Editor'),
     name: 'editor',
     width: 150,

From 7f2d22ef3143d90cf1b023d4423e14ab683071fb Mon Sep 17 00:00:00 2001
From: Raju Udava <86527202+dstala@users.noreply.github.com>
Date: Wed, 27 Jul 2022 12:18:40 +0530
Subject: [PATCH 7/9] test: cypress markers on spreadsheet tab

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>
---
 packages/nc-gui-v2/components/dashboard/TreeView.vue            | 2 +-
 .../components/smartsheet-toolbar/ColumnFilterMenu.vue          | 2 +-
 packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue | 2 +-
 .../nc-gui-v2/components/smartsheet-toolbar/SortListMenu.vue    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui-v2/components/dashboard/TreeView.vue b/packages/nc-gui-v2/components/dashboard/TreeView.vue
index ab122869b1..a6e74fc257 100644
--- a/packages/nc-gui-v2/components/dashboard/TreeView.vue
+++ b/packages/nc-gui-v2/components/dashboard/TreeView.vue
@@ -218,7 +218,7 @@ const addTableTab = (table: TableType) => {
           <span class="flex-grow text-bold nc-project-tree"
             >{{ $t('objects.tables') }} <template v-if="tables?.length">({{ tables.length }})</template></span
           >
-          <MdiPlus v-t="['c:table:create:navdraw']" class="text-gray-500" @click.stop="tableCreateDlg = true" />
+          <MdiPlus v-t="['c:table:create:navdraw']" class="text-gray-500 nc-btn-tbl-add" @click.stop="tableCreateDlg = true" />
           <MdiMenuDown
             class="transition-transform !duration-100 text-gray-500"
             :class="{ 'transform rotate-180': showTableList }"
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/ColumnFilterMenu.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/ColumnFilterMenu.vue
index c27688aa71..9f83379156 100644
--- a/packages/nc-gui-v2/components/smartsheet-toolbar/ColumnFilterMenu.vue
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/ColumnFilterMenu.vue
@@ -33,7 +33,7 @@ const applyChanges = () => {}
         >
           <MdiFilterIcon class="mr-1 text-grey" />
           <!-- Filter -->
-          <span class="text-capitalize">{{ $t('activity.filter') }}</span>
+          <span class="text-capitalize nc-filter-menu-btn">{{ $t('activity.filter') }}</span>
           <MdiMenuDownIcon class="text-grey" />
         </v-btn>
       </v-badge>
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
index 73edd42973..8c397aff5c 100644
--- a/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
@@ -329,7 +329,7 @@ export default {
           <!--          <v-icon small class="mr-1" color="#777"> mdi-eye-off-outline </v-icon> -->
           <MdiEyeIcon class="mr-1 text-grey"></MdiEyeIcon>
           <!-- Fields -->
-          <span class="text-sm text-capitalize">{{ $t('objects.fields') }}</span>
+          <span class="text-sm text-capitalize nc-fields-menu-btn">{{ $t('objects.fields') }}</span>
           <MdiMenuDownIcon class="text-grey"></MdiMenuDownIcon>
         </v-btn>
       </v-badge>
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/SortListMenu.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/SortListMenu.vue
index 322d81eded..49cfeb5381 100644
--- a/packages/nc-gui-v2/components/smartsheet-toolbar/SortListMenu.vue
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/SortListMenu.vue
@@ -43,7 +43,7 @@ watch(
         >
           <MdiSortIcon class="mr-1 text-grey" />
           <!-- Sort -->
-          <span class="text-capitalize">{{ $t('activity.sort') }}</span>
+          <span class="text-capitalize nc-sort-menu-btn">{{ $t('activity.sort') }}</span>
           <MdiMenuDownIcon class="text-grey" />
         </v-btn>
       </v-badge>

From 5280d7b20d36def71454ae34953a6c2c943eaf8c Mon Sep 17 00:00:00 2001
From: Naveen MR <oof1lab@gmail.com>
Date: Wed, 27 Jul 2022 11:06:36 +0100
Subject: [PATCH 8/9] chore : setting audit table to small

---
 packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue b/packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue
index a11e763013..45a109f5fe 100644
--- a/packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue
+++ b/packages/nc-gui-v2/components/dashboard/settings/AuditTab.vue
@@ -96,6 +96,6 @@ const columns = [
       />
     </div>
 
-    <a-table class="w-full" :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" />
   </div>
 </template>

From 2a564f5d49e3bb0a2231eabaec43f6ce14798a0f Mon Sep 17 00:00:00 2001
From: Raju Udava <86527202+dstala@users.noreply.github.com>
Date: Wed, 27 Jul 2022 16:18:01 +0530
Subject: [PATCH 9/9] chore: menu resize

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>
---
 packages/nc-gui-v2/components/dlg/AirtableImport.vue | 2 +-
 packages/nc-gui-v2/components/dlg/QuickImport.vue    | 2 +-
 packages/nc-gui-v2/components/dlg/TableCreate.vue    | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/nc-gui-v2/components/dlg/AirtableImport.vue b/packages/nc-gui-v2/components/dlg/AirtableImport.vue
index 972aa300bb..5686825adb 100644
--- a/packages/nc-gui-v2/components/dlg/AirtableImport.vue
+++ b/packages/nc-gui-v2/components/dlg/AirtableImport.vue
@@ -210,7 +210,7 @@ onBeforeUnmount(() => {
 </script>
 
 <template>
-  <a-modal v-model:visible="dialogShow" width="max(90vw, 600px)" @keydown.esc="dialogShow = false">
+  <a-modal v-model:visible="dialogShow" width="max(30vw, 600px)" @keydown.esc="dialogShow = false">
     <template #footer>
       <div v-if="step === 1">
         <a-button key="back" @click="dialogShow = false">{{ $t('general.cancel') }}</a-button>
diff --git a/packages/nc-gui-v2/components/dlg/QuickImport.vue b/packages/nc-gui-v2/components/dlg/QuickImport.vue
index a21d8b1377..979f981248 100644
--- a/packages/nc-gui-v2/components/dlg/QuickImport.vue
+++ b/packages/nc-gui-v2/components/dlg/QuickImport.vue
@@ -228,7 +228,7 @@ function getAdapter(name: string, val: any) {
 </script>
 
 <template>
-  <a-modal v-model:visible="dialogShow" width="max(90vw, 600px)" @keydown.esc="dialogShow = false">
+  <a-modal v-model:visible="dialogShow" width="max(60vw, 600px)" @keydown.esc="dialogShow = false">
     <a-typography-title class="ml-5 mt-5 mb-5" type="secondary" :level="5">{{ importMeta.header }}</a-typography-title>
     <template #footer>
       <a-button v-if="templateEditorModal" key="back" @click="templateEditorModal = false">Back</a-button>
diff --git a/packages/nc-gui-v2/components/dlg/TableCreate.vue b/packages/nc-gui-v2/components/dlg/TableCreate.vue
index e4170d5199..9466bd41f4 100644
--- a/packages/nc-gui-v2/components/dlg/TableCreate.vue
+++ b/packages/nc-gui-v2/components/dlg/TableCreate.vue
@@ -85,7 +85,7 @@ onMounted(() => {
 <template>
   <a-modal
     v-model:visible="dialogShow"
-    width="max(90vw, 600px)"
+    width="max(30vw, 600px)"
     @keydown.esc="dialogShow = false"
     @keydown.enter="$emit('create', table)"
   >