Skip to content

Commit

Permalink
feat: add main datetime column to dataset editor (apache#17739)
Browse files Browse the repository at this point in the history
* feat: add main dttm col to dataset editor

* Add tests
  • Loading branch information
betodealmeida authored and bwang221 committed Feb 10, 2022
1 parent 72b95a0 commit 5985b1c
Show file tree
Hide file tree
Showing 4 changed files with 77 additions and 8 deletions.
1 change: 1 addition & 0 deletions superset-frontend/spec/fixtures/mockDatasource.js
Original file line number Diff line number Diff line change
Expand Up @@ -167,6 +167,7 @@ export default {
column_types: [0, 1, 2],
id,
granularity_sqla: [['ds', 'ds']],
main_dttm_col: 'ds',
name: 'birth_names',
owners: [{ first_name: 'joe', last_name: 'man', id: 1 }],
database: {
Expand Down
56 changes: 49 additions & 7 deletions superset-frontend/src/components/Datasource/DatasourceEditor.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -156,7 +156,9 @@ CollectionTabTitle.propTypes = {

function ColumnCollectionTable({
columns,
onChange,
datasource,
onColumnsChange,
onDatasourceChange,
editableColumnName,
showExpression,
allowAddItem,
Expand All @@ -166,8 +168,22 @@ function ColumnCollectionTable({
return (
<CollectionTable
collection={columns}
tableColumns={['column_name', 'type', 'is_dttm', 'filterable', 'groupby']}
sortColumns={['column_name', 'type', 'is_dttm', 'filterable', 'groupby']}
tableColumns={[
'column_name',
'type',
'is_dttm',
'main_dttm_col',
'filterable',
'groupby',
]}
sortColumns={[
'column_name',
'type',
'is_dttm',
'main_dttm_col',
'filterable',
'groupby',
]}
allowDeletes
allowAddItem={allowAddItem}
itemGenerator={itemGenerator}
Expand Down Expand Up @@ -284,9 +300,10 @@ function ColumnCollectionTable({
type: t('Data type'),
groupby: t('Is dimension'),
is_dttm: t('Is temporal'),
main_dttm_col: t('Default datetime'),
filterable: t('Is filterable'),
}}
onChange={onChange}
onChange={onColumnsChange}
itemRenderers={{
column_name: (v, onItemChange, _, record) =>
editableColumnName ? (
Expand All @@ -310,6 +327,25 @@ function ColumnCollectionTable({
{v}
</StyledLabelWrapper>
),
main_dttm_col: (value, _onItemChange, _label, record) => {
const checked = datasource.main_dttm_col === record.column_name;
const disabled = !columns.find(
column => column.column_name === record.column_name,
).is_dttm;
return (
<Radio
data-test={`radio-default-dttm-${record.column_name}`}
checked={checked}
disabled={disabled}
onChange={() =>
onDatasourceChange({
...datasource,
main_dttm_col: record.column_name,
})
}
/>
);
},
type: d => (d ? <Label>{d}</Label> : null),
is_dttm: checkboxGenerator,
filterable: checkboxGenerator,
Expand All @@ -320,7 +356,9 @@ function ColumnCollectionTable({
}
ColumnCollectionTable.propTypes = {
columns: PropTypes.array.isRequired,
onChange: PropTypes.func.isRequired,
datasource: PropTypes.object.isRequired,
onColumnsChange: PropTypes.func.isRequired,
onDatasourceChange: PropTypes.func.isRequired,
editableColumnName: PropTypes.bool,
showExpression: PropTypes.bool,
allowAddItem: PropTypes.bool,
Expand Down Expand Up @@ -1227,9 +1265,11 @@ class DatasourceEditor extends React.PureComponent {
<ColumnCollectionTable
className="columns-table"
columns={this.state.databaseColumns}
onChange={databaseColumns =>
datasource={datasource}
onColumnsChange={databaseColumns =>
this.setColumns({ databaseColumns })
}
onDatasourceChange={this.onDatasourceChange}
/>
{this.state.metadataLoading && <Loading />}
</div>
Expand All @@ -1245,9 +1285,11 @@ class DatasourceEditor extends React.PureComponent {
>
<ColumnCollectionTable
columns={this.state.calculatedColumns}
onChange={calculatedColumns =>
onColumnsChange={calculatedColumns =>
this.setColumns({ calculatedColumns })
}
onDatasourceChange={this.onDatasourceChange}
datasource={datasource}
editableColumnName
showExpression
allowAddItem
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -230,4 +230,30 @@ describe('DatasourceEditor RTL', () => {
userEvent.type(certificationDetails, 'I am typing something new');
expect(certificationDetails.value).toEqual('I am typing something new');
});
it('shows the default datetime column', async () => {
render(<DatasourceEditor {...props} />, { useRedux: true });
const metricButton = screen.getByTestId('collection-tab-Columns');
userEvent.click(metricButton);

const dsDefaultDatetimeRadio = screen.getByTestId('radio-default-dttm-ds');
expect(dsDefaultDatetimeRadio).toBeChecked();

const genderDefaultDatetimeRadio = screen.getByTestId(
'radio-default-dttm-gender',
);
expect(genderDefaultDatetimeRadio).not.toBeChecked();
});
it('allows choosing only temporal columns as the default datetime', async () => {
render(<DatasourceEditor {...props} />, { useRedux: true });
const metricButton = screen.getByTestId('collection-tab-Columns');
userEvent.click(metricButton);

const dsDefaultDatetimeRadio = screen.getByTestId('radio-default-dttm-ds');
expect(dsDefaultDatetimeRadio).toBeEnabled();

const genderDefaultDatetimeRadio = screen.getByTestId(
'radio-default-dttm-gender',
);
expect(genderDefaultDatetimeRadio).toBeDisabled();
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
# specific language governing permissions and limitations
# under the License.
table_name: cleaned_sales_data
main_dttm_col: OrderDate
main_dttm_col: order_date
description: null
default_endpoint: null
offset: 0
Expand Down

0 comments on commit 5985b1c

Please sign in to comment.