This is an automated email from the ASF dual-hosted git repository. lyndsi pushed a commit to branch lyndsi/uneditable-header in repository https://gitbox.apache.org/repos/asf/superset.git
commit 895abb4e038cd730ffdb71a48e8cfb5d51903b31 Author: lyndsiWilliams <[email protected]> AuthorDate: Tue Sep 20 11:28:31 2022 -0500 header is now uneditable and holds proper default values --- .../data/dataset/AddDataset/Header/Header.test.tsx | 47 +++++++--------------- .../CRUD/data/dataset/AddDataset/Header/index.tsx | 12 +++--- .../data/dataset/AddDataset/LeftPanel/index.tsx | 2 +- .../views/CRUD/data/dataset/AddDataset/index.tsx | 8 +++- 4 files changed, 29 insertions(+), 40 deletions(-) diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/Header.test.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/Header.test.tsx index d4058d8ca7..4c7c693619 100644 --- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/Header.test.tsx +++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/Header.test.tsx @@ -16,7 +16,6 @@ * specific language governing permissions and limitations * under the License. */ -import userEvent from '@testing-library/user-event'; import React from 'react'; import { render, screen, waitFor } from 'spec/helpers/testing-library'; import Header from 'src/views/CRUD/data/dataset/AddDataset/Header'; @@ -24,17 +23,13 @@ import Header from 'src/views/CRUD/data/dataset/AddDataset/Header'; describe('Header', () => { const mockSetDataset = jest.fn(); - const waitForRender = (datasetName: string) => - waitFor(() => - render(<Header setDataset={mockSetDataset} datasetName={datasetName} />), - ); + const waitForRender = (props?: any) => + waitFor(() => render(<Header setDataset={mockSetDataset} {...props} />)); - it('renders a blank state Header', async () => { - await waitForRender(''); + test('renders a blank state Header', async () => { + await waitForRender(); - const datasetNameTextbox = screen.getByRole('textbox', { - name: /dataset name/i, - }); + const datasetName = screen.getByTestId('editable-title'); const saveButton = screen.getByRole('button', { name: /save save/i, }); @@ -42,38 +37,26 @@ describe('Header', () => { name: /menu actions trigger/i, }); - expect(datasetNameTextbox).toBeVisible(); + expect(datasetName).toBeVisible(); expect(saveButton).toBeVisible(); expect(saveButton).toBeDisabled(); expect(menuButton).toBeVisible(); expect(menuButton).toBeDisabled(); }); - it('updates display value of dataset name textbox when Header title is changed', async () => { - await waitForRender(''); - - const datasetNameTextbox = screen.getByRole('textbox', { - name: /dataset name/i, - }); + test('displays "New dataset" when a table is not selected', async () => { + await waitForRender(); - // Textbox should start with an empty display value and placeholder text - expect(datasetNameTextbox).toHaveDisplayValue(''); - expect( - screen.getByPlaceholderText(/add the name of the dataset/i), - ).toBeVisible(); - - // Textbox should update its display value when user inputs a new value - userEvent.type(datasetNameTextbox, 'Test name'); - expect(datasetNameTextbox).toHaveDisplayValue('Test name'); + const datasetName = screen.getByTestId('editable-title'); + expect(datasetName.innerHTML).toBe('New dataset'); }); - it('passes an existing dataset title into the dataset name textbox', async () => { - await waitForRender('Existing Dataset Name'); + test('displays table name when a table is selected', async () => { + // The schema and table name are passed in through props once selected + await waitForRender({ schema: 'testSchema', title: 'testTable' }); - const datasetNameTextbox = screen.getByRole('textbox', { - name: /dataset name/i, - }); + const datasetName = screen.getByTestId('editable-title'); - expect(datasetNameTextbox).toHaveDisplayValue('Existing Dataset Name'); + expect(datasetName.innerHTML).toBe('testTable'); }); }); diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/index.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/index.tsx index b4cf81d032..bdde65967f 100644 --- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/index.tsx +++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Header/index.tsx @@ -59,21 +59,23 @@ const renderOverlay = () => ( export default function Header({ setDataset, - datasetName, + title, + schema, }: { setDataset: React.Dispatch<DSReducerActionType>; - datasetName: string; + title: string; + schema?: string; }) { const editableTitleProps = { - title: datasetName, - placeholder: t('Add the name of the dataset'), + title: schema ? title : t('New dataset'), + placeholder: t('New dataset'), onSave: (newDatasetName: string) => { setDataset({ type: DatasetActionType.changeDataset, payload: { name: 'dataset_name', value: newDatasetName }, }); }, - canEdit: true, + canEdit: false, label: t('dataset name'), }; diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx index bcc7a4a0db..a35a9f4cf0 100644 --- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx +++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx @@ -41,7 +41,7 @@ import { DatasetActionType } from '../types'; interface LeftPanelProps { setDataset: Dispatch<SetStateAction<object>>; - schema?: string | undefined | null; + schema?: string; dbId?: number; } diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/index.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/index.tsx index 5500d5ded2..37f21ffce6 100644 --- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/index.tsx +++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/index.tsx @@ -71,13 +71,17 @@ export default function AddDataset() { >(datasetReducer, null); const HeaderComponent = () => ( - <Header setDataset={setDataset} datasetName={dataset?.dataset_name ?? ''} /> + <Header + setDataset={setDataset} + title={dataset?.table_name ?? 'New dataset'} + schema={dataset?.schema ?? ''} + /> ); const LeftPanelComponent = () => ( <LeftPanel setDataset={setDataset} - schema={dataset?.schema} + schema={dataset?.schema ?? ''} dbId={dataset?.db?.id} /> );
