feat(nav): Update Tabbed Nav on CRUD Pages (#21213)

apache · Sep 21, 2022 · fb835d1 · fb835d1
1 parent cbadb87
commit fb835d1
Show file tree

Hide file tree

Showing 7 changed files with 57 additions and 17 deletions.
diff --git a/superset-frontend/src/views/CRUD/data/common.ts b/superset-frontend/src/views/CRUD/data/common.ts
@@ -19,20 +19,8 @@
 import { t } from '@superset-ui/core';
 
 export const commonMenuData = {
-  name: t('Data'),
+  name: t('SQL'),
   tabs: [
-    {
-      name: 'Databases',
-      label: t('Databases'),
-      url: '/databaseview/list/',
-      usesRouter: true,
-    },
-    {
-      name: 'Datasets',
-      label: t('Datasets'),
-      url: '/tablemodelview/list/',
-      usesRouter: true,
-    },
     {
       name: 'Saved queries',
       label: t('Saved queries'),

diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseList.test.jsx b/superset-frontend/src/views/CRUD/data/database/DatabaseList.test.jsx
@@ -139,6 +139,10 @@ describe('Admin DatabaseList', () => {
     expect(wrapper.find(SubMenu)).toExist();
   });
 
+  it('renders a SubMenu with no tabs', () => {
+    expect(wrapper.find(SubMenu).props().tabs).toBeUndefined();
+  });
+
   it('renders a DatabaseModal', () => {
     expect(wrapper.find(DatabaseModal)).toExist();
   });

diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseList.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseList.tsx
@@ -35,7 +35,6 @@ import { Tooltip } from 'src/components/Tooltip';
 import Icons from 'src/components/Icons';
 import { isUserAdmin } from 'src/dashboard/util/permissionUtils';
 import ListView, { FilterOperator, Filters } from 'src/components/ListView';
-import { commonMenuData } from 'src/views/CRUD/data/common';
 import handleResourceExport from 'src/utils/export';
 import { ExtentionConfigs } from 'src/views/components/types';
 import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
@@ -247,7 +246,7 @@ function DatabaseList({ addDangerToast, addSuccessToast }: DatabaseListProps) {
   const menuData: SubMenuProps = {
     activeChild: 'Databases',
     dropDownLinks: filteredDropDown,
-    ...commonMenuData,
+    name: t('Databases'),
   };
 
   if (canCreate) {

diff --git a/superset-frontend/src/views/CRUD/data/dataset/DatasetList.test.jsx b/superset-frontend/src/views/CRUD/data/dataset/DatasetList.test.jsx
@@ -33,6 +33,7 @@ import Button from 'src/components/Button';
 import IndeterminateCheckbox from 'src/components/IndeterminateCheckbox';
 import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
 import { act } from 'react-dom/test-utils';
+import SubMenu from 'src/views/components/SubMenu';
 
 // store needed for withToasts(DatasetList)
 const mockStore = configureStore([thunk]);
@@ -223,6 +224,14 @@ describe('DatasetList', () => {
     });
     expect(fetchMock.calls(/dataset\/duplicate/)).toHaveLength(1);
   });
+
+  it('renders a SubMenu', () => {
+    expect(wrapper.find(SubMenu)).toExist();
+  });
+
+  it('renders a SubMenu with no tabs', () => {
+    expect(wrapper.find(SubMenu).props().tabs).toBeUndefined();
+  });
 });
 
 jest.mock('react-router-dom', () => ({

diff --git a/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx b/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx
@@ -48,7 +48,6 @@ import SubMenu, {
   SubMenuProps,
   ButtonProps,
 } from 'src/views/components/SubMenu';
-import { commonMenuData } from 'src/views/CRUD/data/common';
 import Owner from 'src/types/Owner';
 import withToasts from 'src/components/MessageToasts/withToasts';
 import { Tooltip } from 'src/components/Tooltip';
@@ -585,7 +584,7 @@ const DatasetList: FunctionComponent<DatasetListProps> = ({
 
   const menuData: SubMenuProps = {
     activeChild: 'Datasets',
-    ...commonMenuData,
+    name: t('Datasets'),
   };
 
   const buttonArr: Array<ButtonProps> = [];

diff --git a/superset-frontend/src/views/CRUD/data/query/QueryList.test.tsx b/superset-frontend/src/views/CRUD/data/query/QueryList.test.tsx
@@ -32,6 +32,7 @@ import { QueryObject } from 'src/views/CRUD/types';
 import ListView from 'src/components/ListView';
 import Filters from 'src/components/ListView/Filters';
 import SyntaxHighlighter from 'react-syntax-highlighter/dist/cjs/light';
+import SubMenu from 'src/views/components/SubMenu';
 
 // store needed for withToasts
 const mockStore = configureStore([thunk]);
@@ -147,4 +148,26 @@ describe('QueryList', () => {
       `"http://localhost/api/v1/query/?q=(filters:!((col:sql,opr:ct,value:fooo)),order_column:start_time,order_direction:desc,page:0,page_size:25)"`,
     );
   });
+
+  it('renders a SubMenu', () => {
+    expect(wrapper.find(SubMenu)).toExist();
+  });
+
+  it('renders a SubMenu with Saved queries and Query History links', () => {
+    expect(wrapper.find(SubMenu).props().tabs).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({ label: 'Saved queries' }),
+        expect.objectContaining({ label: 'Query history' }),
+      ]),
+    );
+  });
+
+  it('renders a SubMenu without Databases and Datasets links', () => {
+    expect(wrapper.find(SubMenu).props().tabs).not.toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({ label: 'Databases' }),
+        expect.objectContaining({ label: 'Datasets' }),
+      ]),
+    );
+  });
 });
diff --git a/superset-frontend/src/views/CRUD/data/savedquery/SavedQueryList.test.jsx b/superset-frontend/src/views/CRUD/data/savedquery/SavedQueryList.test.jsx
@@ -153,6 +153,24 @@ describe('SavedQueryList', () => {
     expect(wrapper.find(SubMenu)).toExist();
   });
 
+  it('renders a SubMenu with Saved queries and Query History links', () => {
+    expect(wrapper.find(SubMenu).props().tabs).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({ label: 'Saved queries' }),
+        expect.objectContaining({ label: 'Query history' }),
+      ]),
+    );
+  });
+
+  it('renders a SubMenu without Databases and Datasets links', () => {
+    expect(wrapper.find(SubMenu).props().tabs).not.toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({ label: 'Databases' }),
+        expect.objectContaining({ label: 'Datasets' }),
+      ]),
+    );
+  });
+
   it('renders a ListView', () => {
     expect(wrapper.find(ListView)).toExist();
   });