Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: Use AntD table in FilterableTable #23035

Merged
merged 10 commits into from
May 12, 2023
Merged

feat: Use AntD table in FilterableTable #23035

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
f915aac
Use antd table in FilterableTable
EugeneTorap Feb 19, 2023
c972f1c
update package-lock
justinpark May 4, 2023
70139fb
replace to getByRole
justinpark May 4, 2023
91c67bb
update comments
justinpark May 4, 2023
51c2302
clean up addressed issues including debounced search
justinpark May 4, 2023
8cf23a4
remove unused
justinpark May 4, 2023
7e5aa70
update FAST_DEBOUNCE reference
justinpark May 5, 2023
f905e20
change describe wrapper to test
justinpark May 5, 2023
455a9e2
remove unnessassary styles
justinpark May 5, 2023
daa6ee5
Fix Table spec related to AntD Table
justinpark May 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
66 changes: 10 additions & 56 deletions superset-frontend/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 0 additions & 2 deletions superset-frontend/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -196,7 +196,6 @@
"react-table": "^7.8.0",
"react-transition-group": "^2.5.3",
"react-ultimate-pagination": "^1.3.0",
"react-virtualized": "9.19.1",
"react-virtualized-auto-sizer": "^1.0.7",
"react-window": "^1.8.8",
"redux": "^4.2.1",
Expand Down Expand Up @@ -267,7 +266,6 @@
"@types/react-select": "^3.0.19",
"@types/react-table": "^7.0.19",
"@types/react-ultimate-pagination": "^1.2.0",
"@types/react-virtualized": "^9.21.10",
"@types/react-window": "^1.8.5",
"@types/redux-localstorage": "^1.0.8",
"@types/redux-mock-store": "^1.0.2",
Expand Down
6 changes: 3 additions & 3 deletions superset-frontend/src/SqlLab/components/ResultSet/ResultSet.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,13 +225,13 @@ describe('ResultSet', () => {

test('renders if there is no limit in query.results but has queryLimit', async () => {
const { getByRole } = setup(mockedProps, mockStore(initialState));
expect(getByRole('grid')).toBeInTheDocument();
expect(getByRole('table')).toBeInTheDocument();
});

test('renders if there is a limit in query.results but not queryLimit', async () => {
const props = { ...mockedProps, query: queryWithNoQueryLimit };
const { getByRole } = setup(props, mockStore(initialState));
expect(getByRole('grid')).toBeInTheDocument();
expect(getByRole('table')).toBeInTheDocument();
});

test('Async queries - renders "Fetch data preview" button when data preview has no results', () => {
michael-s-molina marked this conversation as resolved.
Show resolved Hide resolved
Expand All @@ -256,7 +256,7 @@ describe('ResultSet', () => {

test('Async queries - renders on the first call', () => {
setup(asyncQueryProps, mockStore(initialState));
expect(screen.getByRole('grid')).toBeVisible();
expect(screen.getByRole('table')).toBeVisible();
expect(
screen.queryByRole('button', {
name: /fetch data preview/i,
Expand Down
13 changes: 3 additions & 10 deletions superset-frontend/src/SqlLab/components/ResultSet/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,9 +42,7 @@ import { mountExploreUrl } from 'src/explore/exploreUtils';
import { postFormData } from 'src/explore/exploreUtils/formData';
import ProgressBar from 'src/components/ProgressBar';
import Loading from 'src/components/Loading';
import FilterableTable, {
MAX_COLUMNS_FOR_TABLE,
} from 'src/components/FilterableTable';
import FilterableTable from 'src/components/FilterableTable';
import CopyToClipboard from 'src/components/CopyToClipboard';
import { addDangerToast } from 'src/components/MessageToasts/actions';
import { prepareCopyToClipboardTabularData } from 'src/utils/common';
Expand Down Expand Up @@ -282,12 +280,7 @@ const ResultSet = ({
onChange={changeSearch}
value={searchText}
className="form-control input-sm"
disabled={columns.length > MAX_COLUMNS_FOR_TABLE}
placeholder={
columns.length > MAX_COLUMNS_FOR_TABLE
? t('Too many columns to filter')
: t('Filter results')
}
placeholder={t('Filter results')}
/>
)}
</ResultSetControls>
Expand Down Expand Up @@ -486,7 +479,7 @@ const ResultSet = ({
// We need to calculate the height of this.renderRowsReturned()
// if we want results panel to be proper height because the
// FilterTable component needs an explicit height to render
// react-virtualized Table component
// the Table component
const rowsHeight = alertIsOpen
? height - alertContainerHeight
: height - rowMessageHeight;
Expand Down
22 changes: 0 additions & 22 deletions superset-frontend/src/components/FilterableTable/FilterableTable.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import React from 'react';
import { ReactWrapper } from 'enzyme';
import { styledMount as mount } from 'spec/helpers/theming';
import FilterableTable, {
MAX_COLUMNS_FOR_TABLE,
convertBigIntStrToNumber,
} from 'src/components/FilterableTable';
import { render, screen } from 'spec/helpers/testing-library';
Expand Down Expand Up @@ -49,27 +48,6 @@ describe('FilterableTable', () => {
expect(wrapper.find('.ReactVirtualized__Grid')).toExist();
expect(wrapper.find('.ReactVirtualized__Table__row')).toHaveLength(3);
});
it('renders a grid with 2 Grid rows for wide tables', () => {
const wideTableColumns = MAX_COLUMNS_FOR_TABLE + 1;
const wideTableMockedProps = {
orderedColumnKeys: Array.from(
Array(wideTableColumns),
(_, x) => `col_${x}`,
),
data: [
{
...Array.from(Array(wideTableColumns)).map((val, x) => ({
[`col_${x}`]: x,
})),
},
],
height: 500,
};
const wideTableWrapper = mount(
<FilterableTable {...wideTableMockedProps} />,
);
expect(wideTableWrapper.find('.ReactVirtualized__Grid')).toHaveLength(2);
});
it('filters on a string', () => {
const props = {
...mockedProps,
Expand Down
Loading