fix: Integrated view sidebar removal to tests

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

@@ -66,7 +66,7 @@ function onOpenModal({
 </script>
 
 <template>
-  <NcDropdown v-model:isOpen="isOpen" @click.stop="isOpen = !isOpen">
+  <NcDropdown v-model:isOpen="isOpen" destroy-popup-on-hide @click.stop="isOpen = !isOpen">
     <slot />
     <template #overlay>
       <NcMenu class="max-w-48">

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

@@ -143,7 +143,6 @@ const isTableOpened = computed(() => {
       <template #title>{{ table.table_name }}</template>
       <div
         class="table-context flex items-center gap-1 h-full"
-        :data-testid="`tree-view-table-${table.title}`"
         @contextmenu="setMenuContext('table', table)"
         @click="openTable(table)"
       >

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

@@ -32,6 +32,8 @@ const emits = defineEmits<Emits>()
 const project = inject(ProjectInj)!
 const table = inject(SidebarTableInj)!
 
+const { isUIAllowed } = useRoles()
+
 const { $e } = useNuxtApp()
 
 const isDefaultBase = computed(() => {

tests/playwright/pages/Dashboard/TreeView.ts

@@ -72,7 +72,7 @@ export class TreeViewPage extends BasePage {
 
   async getTable({ index, tableTitle }: { index: number; tableTitle?: string }) {
     if (tableTitle) {
-      return this.get().getByTestId(`tree-view-table-${tableTitle}`);
+      return this.get().getByTestId(`nc-tbl-title-${tableTitle}`);
     }
 
     return this.get().locator('.nc-tree-item').nth(index);
@@ -95,18 +95,18 @@ export class TreeViewPage extends BasePage {
       await this.rootPage.locator('.h-full > div > .nc-sidebar-left-toggle-icon').click();
     }
 
-    await this.get().getByTestId(`tree-view-table-${title}`).waitFor({ state: 'visible' });
+    await this.get().getByTestId(`nc-tbl-title-${title}`).waitFor({ state: 'visible' });
 
     if (networkResponse === true) {
       await this.waitForResponse({
-        uiAction: () => this.get().getByTestId(`tree-view-table-${title}`).click(),
+        uiAction: () => this.get().getByTestId(`nc-tbl-title-${title}`).click(),
         httpMethodsToMatch: ['GET'],
         requestUrlPathToMatch: `/api/v1/db/data/noco/`,
         responseJsonMatcher: json => json.pageInfo,
       });
       await this.dashboard.waitForTabRender({ title, mode });
     } else {
-      await this.get().getByTestId(`tree-view-table-${title}`).click();
+      await this.get().getByTestId(`nc-tbl-title-${title}`).click();
       await this.rootPage.waitForTimeout(1000);
     }
   }
@@ -148,13 +148,13 @@ export class TreeViewPage extends BasePage {
 
   async verifyTable({ title, index, exists = true }: { title: string; index?: number; exists?: boolean }) {
     if (exists) {
-      await expect(this.get().getByTestId(`tree-view-table-${title}`)).toHaveCount(1);
+      await expect(this.get().getByTestId(`nc-tbl-title-${title}`)).toHaveCount(1);
 
       if (index) {
         await expect(this.get().locator('.nc-tbl-title').nth(index)).toHaveText(title);
       }
     } else {
-      await expect(this.get().getByTestId(`tree-view-table-${title}`)).toHaveCount(0);
+      await expect(this.get().getByTestId(`nc-tbl-title-${title}`)).toHaveCount(0);
     }
   }
 
@@ -206,7 +206,7 @@ export class TreeViewPage extends BasePage {
     await this.dashboard
       .get()
       .locator(`[data-testid="tree-view-table-draggable-handle-${sourceTable}"]`)
-      .dragTo(this.get().locator(`[data-testid="tree-view-table-${destinationTable}"]`));
+      .dragTo(this.get().locator(`[data-testid="nc-tbl-title-${destinationTable}"]`));
   }
 
   async projectSettings({ title }: { title?: string }) {
@@ -261,7 +261,7 @@ export class TreeViewPage extends BasePage {
       httpMethodsToMatch: ['POST'],
       requestUrlPathToMatch: `/api/v1/db/meta/duplicate/`,
     });
-    await this.get().locator(`[data-testid="tree-view-table-${title} copy"]`).waitFor();
+    await this.get().locator(`[data-testid="nc-tbl-title-${title} copy"]`).waitFor();
   }
 
   async verifyTabIcon({ title, icon, iconDisplay }: { title: string; icon: string; iconDisplay?: string }) {

tests/playwright/tests/db/general/toolbarOperations.spec.ts

@@ -512,8 +512,9 @@ test.describe('Toolbar operations (GRID)', () => {
     await toolbar.clickGroupBy();
 
     await dashboard.viewSidebar.createGridView({ title: 'Test' });
-    await dashboard.viewSidebar.openView({ title: 'Test' });
-    await dashboard.viewSidebar.openView({ title: 'Film' });
+    await dashboard.rootPage.waitForTimeout(500);
+
+    await dashboard.treeView.openTable({ title: 'Film' });
 
     await dashboard.grid.groupPage.verifyGroupHeader({
       indexMap: [0],
@@ -529,13 +530,14 @@ test.describe('Toolbar operations (GRID)', () => {
 
   test('Duplicate View and Verify GroupBy', async () => {
     await dashboard.treeView.openTable({ title: 'Film' });
+    await dashboard.viewSidebar.createGridView({ title: 'Film Grid' });
 
     // Open GroupBy Menu
     await toolbar.clickGroupBy();
     await toolbar.groupBy.add({ title: 'Length', ascending: false, locallySaved: false });
     await toolbar.clickGroupBy();
 
-    await dashboard.viewSidebar.copyView({ title: 'Film' });
+    await dashboard.viewSidebar.copyView({ title: 'Film Grid' });
 
     await dashboard.grid.groupPage.verifyGroupHeader({
       indexMap: [0],

tests/playwright/tests/db/general/views.spec.ts

@@ -109,7 +109,7 @@ test.describe('Views CRUD Operations', () => {
     await dashboard.rootPage.waitForTimeout(1000);
     await toolbar.searchData.verify('City-CityGrid');
 
-    await dashboard.viewSidebar.openView({ title: 'City' });
+    await dashboard.treeView.openTable({ title: 'City' });
     await dashboard.rootPage.waitForTimeout(1000);
     await toolbar.searchData.verify('City-City');
 
@@ -121,7 +121,7 @@ test.describe('Views CRUD Operations', () => {
     await toolbar.searchData.get().fill('Actor-ActorGrid');
     await toolbar.searchData.verify('Actor-ActorGrid');
 
-    await dashboard.viewSidebar.openView({ title: 'Actor' });
+    await dashboard.treeView.openTable({ title: 'Actor' });
     await dashboard.rootPage.waitForTimeout(1000);
     await toolbar.searchData.verify('');
 

tests/playwright/tests/db/views/viewForm.spec.ts

@@ -385,7 +385,6 @@ test.describe('Form view with LTAR', () => {
     await dashboard.rootPage.waitForTimeout(500);
 
     await dashboard.treeView.openTable({ title: 'Country' });
-    await dashboard.viewSidebar.openView({ title: 'Country' });
 
     await dashboard.grid.cell.verify({
       index: 3,
@@ -492,7 +491,7 @@ test.describe('Form view', () => {
     // kludge- reload
     await dashboard.rootPage.reload();
 
-    await dashboard.viewSidebar.openView({ title: 'selectBased' });
+    await dashboard.treeView.openTable({ title: 'selectBased' });
 
     await dashboard.rootPage.waitForTimeout(2000);