From c56565993f06e0ce98774997c6472e4737b9e7a8 Mon Sep 17 00:00:00 2001 From: geido Date: Sat, 9 Jan 2021 19:50:47 +0100 Subject: [PATCH 1/7] Closes #12389 --- .../src/datasource/ChangeDatasourceModal.tsx | 32 +++++++++++-------- superset-frontend/src/explore/exploreUtils.js | 5 +-- 2 files changed, 21 insertions(+), 16 deletions(-) diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx index 8e0bad30c997..682e83c65c92 100644 --- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx +++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx @@ -118,20 +118,24 @@ const ChangeDatasourceModal: FunctionComponent = ({ setConfirmedDataset(datasource); }, []); - useDebouncedEffect(() => { - if (filter) { - fetchData({ - ...emptyRequest, - filters: [ - { - id: 'table_name', - operator: 'ct', - value: filter, - }, - ], - }); - } - }, 1000); + useDebouncedEffect( + () => { + if (filter) { + fetchData({ + ...emptyRequest, + filters: [ + { + id: 'table_name', + operator: 'ct', + value: filter, + }, + ], + }); + } + }, + 1000, + [filter], + ); useEffect(() => { const onEnterModal = async () => { diff --git a/superset-frontend/src/explore/exploreUtils.js b/superset-frontend/src/explore/exploreUtils.js index 68c5a6fd2956..4304f93d6b22 100644 --- a/superset-frontend/src/explore/exploreUtils.js +++ b/superset-frontend/src/explore/exploreUtils.js @@ -288,8 +288,9 @@ export const exploreChart = formData => { postForm(url, formData); }; -export const useDebouncedEffect = (effect, delay) => { - const callback = useCallback(effect, [effect]); +export const useDebouncedEffect = (effect, delay, deps) => { + // eslint-disable-next-line react-hooks/exhaustive-deps + const callback = useCallback(effect, deps); useEffect(() => { const handler = setTimeout(() => { From d3ae8eadb9cc49bb7e7717958514ee5537630022 Mon Sep 17 00:00:00 2001 From: geido Date: Sat, 9 Jan 2021 22:46:13 +0100 Subject: [PATCH 2/7] Search empty string --- .../src/datasource/ChangeDatasourceModal.tsx | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx index 682e83c65c92..4dabb1761029 100644 --- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx +++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx @@ -22,6 +22,7 @@ import React, { useRef, useEffect, useCallback, + useMemo, } from 'react'; import { Alert, FormControl, FormControlProps } from 'react-bootstrap'; import { SupersetClient, t, styled } from '@superset-ui/core'; @@ -31,6 +32,7 @@ import Button from 'src/components/Button'; import { useListViewResource } from 'src/views/CRUD/hooks'; import Dataset from 'src/types/Dataset'; import { useDebouncedEffect } from 'src/explore/exploreUtils'; +import debounce from 'lodash/debounce'; import { getClientErrorObject } from '../utils/getClientErrorObject'; import Loading from '../components/Loading'; import withToasts from '../messageToasts/enhancers/withToasts'; @@ -120,9 +122,9 @@ const ChangeDatasourceModal: FunctionComponent = ({ useDebouncedEffect( () => { - if (filter) { - fetchData({ - ...emptyRequest, + fetchData({ + ...emptyRequest, + ...(filter && { filters: [ { id: 'table_name', @@ -130,8 +132,8 @@ const ChangeDatasourceModal: FunctionComponent = ({ value: filter, }, ], - }); - } + }), + }); }, 1000, [filter], @@ -142,9 +144,6 @@ const ChangeDatasourceModal: FunctionComponent = ({ if (searchRef && searchRef.current) { searchRef.current.focus(); } - - // Fetch initial datasets for tableview - await fetchData(emptyRequest); }; if (show) { From 1928f94f92a04da22359cbe5d67dbba4692ebadb Mon Sep 17 00:00:00 2001 From: geido Date: Sat, 9 Jan 2021 22:49:50 +0100 Subject: [PATCH 3/7] Remove unused imports --- superset-frontend/src/datasource/ChangeDatasourceModal.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx index 4dabb1761029..22fa90fb08f0 100644 --- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx +++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx @@ -22,7 +22,6 @@ import React, { useRef, useEffect, useCallback, - useMemo, } from 'react'; import { Alert, FormControl, FormControlProps } from 'react-bootstrap'; import { SupersetClient, t, styled } from '@superset-ui/core'; @@ -32,7 +31,6 @@ import Button from 'src/components/Button'; import { useListViewResource } from 'src/views/CRUD/hooks'; import Dataset from 'src/types/Dataset'; import { useDebouncedEffect } from 'src/explore/exploreUtils'; -import debounce from 'lodash/debounce'; import { getClientErrorObject } from '../utils/getClientErrorObject'; import Loading from '../components/Loading'; import withToasts from '../messageToasts/enhancers/withToasts'; From ab535641a29c5cb4970afdb7c1d9f68d1cb6769d Mon Sep 17 00:00:00 2001 From: geido Date: Sat, 9 Jan 2021 23:39:09 +0100 Subject: [PATCH 4/7] Fix tests --- .../javascripts/datasource/ChangeDatasourceModal_spec.jsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx b/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx index fcca1a789895..b68785be6591 100644 --- a/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx +++ b/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx @@ -28,6 +28,7 @@ import Modal from 'src/common/components/Modal'; import ChangeDatasourceModal from 'src/datasource/ChangeDatasourceModal'; import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint'; import mockDatasource from 'spec/fixtures/mockDatasource'; +import { waitFor } from 'spec/helpers/testing-library'; const mockStore = configureStore([thunk]); const store = mockStore({}); @@ -81,19 +82,24 @@ describe('ChangeDatasourceModal', () => { }); it('fetches datasources', async () => { - expect(fetchMock.calls(/api\/v1\/dataset/)).toHaveLength(6); + expect(fetchMock.calls(/api\/v1\/dataset/)).toHaveLength(3); }); it('renders confirmation message', async () => { + await waitForComponentToPaint(wrapper, 1000); + act(() => { wrapper.find('[data-test="datasource-link"]').at(0).props().onClick(); }); + await waitForComponentToPaint(wrapper); expect(wrapper.find('.proceed-btn')).toExist(); }); it('changes the datasource', async () => { + await waitForComponentToPaint(wrapper, 1000); + act(() => { wrapper.find('[data-test="datasource-link"]').at(0).props().onClick(); }); From 5e09c72d815b6b686bb40594ea02310755a924f8 Mon Sep 17 00:00:00 2001 From: geido Date: Sat, 9 Jan 2021 23:50:29 +0100 Subject: [PATCH 5/7] Remove unused import --- .../spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx b/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx index b68785be6591..efa39e032afa 100644 --- a/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx +++ b/superset-frontend/spec/javascripts/datasource/ChangeDatasourceModal_spec.jsx @@ -28,7 +28,6 @@ import Modal from 'src/common/components/Modal'; import ChangeDatasourceModal from 'src/datasource/ChangeDatasourceModal'; import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint'; import mockDatasource from 'spec/fixtures/mockDatasource'; -import { waitFor } from 'spec/helpers/testing-library'; const mockStore = configureStore([thunk]); const store = mockStore({}); From 1bd8d53cb53046916771b6201d2aa19d288654c0 Mon Sep 17 00:00:00 2001 From: geido Date: Mon, 11 Jan 2021 15:34:52 +0100 Subject: [PATCH 6/7] Fix height --- superset-frontend/src/common/components/Modal/Modal.tsx | 3 +++ superset-frontend/src/datasource/ChangeDatasourceModal.tsx | 4 +++- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/superset-frontend/src/common/components/Modal/Modal.tsx b/superset-frontend/src/common/components/Modal/Modal.tsx index de20419f30ac..c4b640c09fa7 100644 --- a/superset-frontend/src/common/components/Modal/Modal.tsx +++ b/superset-frontend/src/common/components/Modal/Modal.tsx @@ -41,11 +41,13 @@ interface ModalProps { centered?: boolean; footer?: React.ReactNode; wrapProps?: object; + height?: number; } interface StyledModalProps extends SupersetThemeProps { maxWidth?: string; responsive?: boolean; + height?: number; } export const StyledModal = styled(BaseModal)` @@ -87,6 +89,7 @@ export const StyledModal = styled(BaseModal)` .ant-modal-body { padding: ${({ theme }) => theme.gridUnit * 4}px; overflow: auto; + ${({ height }) => height && `height: ${height};`} } .ant-modal-footer { diff --git a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx index 22fa90fb08f0..1ab82492e891 100644 --- a/superset-frontend/src/datasource/ChangeDatasourceModal.tsx +++ b/superset-frontend/src/datasource/ChangeDatasourceModal.tsx @@ -25,7 +25,7 @@ import React, { } from 'react'; import { Alert, FormControl, FormControlProps } from 'react-bootstrap'; import { SupersetClient, t, styled } from '@superset-ui/core'; -import TableView from 'src/components/TableView'; +import TableView, { EmptyWrapperType } from 'src/components/TableView'; import StyledModal from 'src/common/components/Modal'; import Button from 'src/components/Button'; import { useListViewResource } from 'src/views/CRUD/hooks'; @@ -221,6 +221,7 @@ const ChangeDatasourceModal: FunctionComponent = ({ onHide={onHide} responsive title={t('Change Dataset')} + height="350px" footer={ <> {confirmChange && ( @@ -265,6 +266,7 @@ const ChangeDatasourceModal: FunctionComponent = ({ data={renderTableView()} pageSize={20} className="table-condensed" + emptyWrapperType={EmptyWrapperType.Small} /> )} From 9ce5d979b246c93868d3b42430bc760bd3004969 Mon Sep 17 00:00:00 2001 From: geido Date: Mon, 11 Jan 2021 19:32:39 +0100 Subject: [PATCH 7/7] Correct height type --- superset-frontend/src/common/components/Modal/Modal.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/superset-frontend/src/common/components/Modal/Modal.tsx b/superset-frontend/src/common/components/Modal/Modal.tsx index c4b640c09fa7..64fad2b27ae7 100644 --- a/superset-frontend/src/common/components/Modal/Modal.tsx +++ b/superset-frontend/src/common/components/Modal/Modal.tsx @@ -41,13 +41,13 @@ interface ModalProps { centered?: boolean; footer?: React.ReactNode; wrapProps?: object; - height?: number; + height?: string; } interface StyledModalProps extends SupersetThemeProps { maxWidth?: string; responsive?: boolean; - height?: number; + height?: string; } export const StyledModal = styled(BaseModal)`