You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by di...@apache.org on 2021/09/27 15:19:58 UTC
[superset] branch master updated: chore: Select component
refactoring - TimeSeriesColumnControl - Iteration 5 (#16442)
This is an automated email from the ASF dual-hosted git repository.
diegopucci pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 667b88c chore: Select component refactoring - TimeSeriesColumnControl - Iteration 5 (#16442)
667b88c is described below
commit 667b88c8009dbd1cb6f1dd30f0de8c15e04560e1
Author: Geido <60...@users.noreply.github.com>
AuthorDate: Mon Sep 27 18:19:03 2021 +0300
chore: Select component refactoring - TimeSeriesColumnControl - Iteration 5 (#16442)
* Refactor Select
* Update superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
Co-authored-by: Michael S. Molina <70...@users.noreply.github.com>
* Update superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
Co-authored-by: Michael S. Molina <70...@users.noreply.github.com>
* Update superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
Co-authored-by: Michael S. Molina <70...@users.noreply.github.com>
* Fix tests
* Mock debounce
* Add debounce
Co-authored-by: Michael S. Molina <70...@users.noreply.github.com>
---
.../TimeSeriesColumnControl.test.tsx | 10 +++++---
.../controls/TimeSeriesColumnControl/index.jsx | 28 +++++++++++-----------
2 files changed, 21 insertions(+), 17 deletions(-)
diff --git a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/TimeSeriesColumnControl.test.tsx b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/TimeSeriesColumnControl.test.tsx
index 4383075..589ef91 100644
--- a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/TimeSeriesColumnControl.test.tsx
+++ b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/TimeSeriesColumnControl.test.tsx
@@ -21,7 +21,11 @@ import { render, screen } from 'spec/helpers/testing-library';
import userEvent from '@testing-library/user-event';
import TimeSeriesColumnControl from '.';
-jest.mock('lodash/debounce', () => jest.fn(fn => fn));
+jest.mock('lodash/debounce', () => (fn: Function & { cancel: Function }) => {
+ // eslint-disable-next-line no-param-reassign
+ fn.cancel = jest.fn();
+ return fn;
+});
test('renders with default props', () => {
render(<TimeSeriesColumnControl />);
@@ -78,7 +82,7 @@ test('triggers onChange when type changes', () => {
const onChange = jest.fn();
render(<TimeSeriesColumnControl onChange={onChange} />);
userEvent.click(screen.getByRole('button'));
- userEvent.click(screen.getByText('Select...'));
+ userEvent.click(screen.getByText('Select ...'));
userEvent.click(screen.getByText('Time comparison'));
expect(onChange).not.toHaveBeenCalled();
userEvent.click(screen.getByRole('button', { name: 'Save' }));
@@ -121,7 +125,7 @@ test('triggers onChange when time type changes', () => {
const onChange = jest.fn();
render(<TimeSeriesColumnControl colType="time" onChange={onChange} />);
userEvent.click(screen.getByRole('button'));
- userEvent.click(screen.getByText('Select...'));
+ userEvent.click(screen.getByText('Select ...'));
userEvent.click(screen.getByText('Difference'));
expect(onChange).not.toHaveBeenCalled();
userEvent.click(screen.getByRole('button', { name: 'Save' }));
diff --git a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
index aef39a4..6f4585b 100644
--- a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
+++ b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
@@ -21,7 +21,7 @@ import PropTypes from 'prop-types';
import { Row, Col, Input } from 'src/common/components';
import Button from 'src/components/Button';
import Popover from 'src/components/Popover';
-import Select from 'src/components/Select';
+import { Select } from 'src/components';
import { t, styled } from '@superset-ui/core';
import { InfoTooltipWithTrigger } from '@superset-ui/chart-controls';
import BoundsControl from '../BoundsControl';
@@ -61,17 +61,17 @@ const defaultProps = {
};
const comparisonTypeOptions = [
- { value: 'value', label: 'Actual value' },
- { value: 'diff', label: 'Difference' },
- { value: 'perc', label: 'Percentage' },
- { value: 'perc_change', label: 'Percentage change' },
+ { value: 'value', label: 'Actual value', key: 'value' },
+ { value: 'diff', label: 'Difference', key: 'diff' },
+ { value: 'perc', label: 'Percentage', key: 'perc' },
+ { value: 'perc_change', label: 'Percentage change', key: 'perc_change' },
];
const colTypeOptions = [
- { value: 'time', label: 'Time comparison' },
- { value: 'contrib', label: 'Contribution' },
- { value: 'spark', label: 'Sparkline' },
- { value: 'avg', label: 'Period average' },
+ { value: 'time', label: 'Time comparison', key: 'time' },
+ { value: 'contrib', label: 'Contribution', key: 'contrib' },
+ { value: 'spark', label: 'Sparkline', key: 'spark' },
+ { value: 'avg', label: 'Period average', key: 'avg' },
];
const StyledRow = styled(Row)`
@@ -143,7 +143,7 @@ export default class TimeSeriesColumnControl extends React.Component {
}
onSelectChange(attr, opt) {
- this.setState({ [attr]: opt.value });
+ this.setState({ [attr]: opt });
}
onTextInputChange(attr, event) {
@@ -216,8 +216,8 @@ export default class TimeSeriesColumnControl extends React.Component {
'Type of comparison, value difference or percentage',
'col-type',
<Select
- value={this.state.colType}
- clearable={false}
+ ariaLabel={t('Type')}
+ value={this.state.colType || undefined}
onChange={this.onSelectChange.bind(this, 'colType')}
options={colTypeOptions}
/>,
@@ -273,8 +273,8 @@ export default class TimeSeriesColumnControl extends React.Component {
'Type of comparison, value difference or percentage',
'comp-type',
<Select
- value={this.state.comparisonType}
- clearable={false}
+ ariaLabel={t('Type')}
+ value={this.state.comparisonType || undefined}
onChange={this.onSelectChange.bind(this, 'comparisonType')}
options={comparisonTypeOptions}
/>,