This is an automated email from the ASF dual-hosted git repository. maximebeauchemin pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
The following commit(s) were added to refs/heads/master by this push: new 02f0616 Make VizTypeControl use metadata from plugin (#6235) 02f0616 is described below commit 02f061602527adbc9b82d1697d68cd59b4ec56a3 Author: Krist Wongsuphasawat <krist.wo...@gmail.com> AuthorDate: Thu Nov 1 11:39:24 2018 -0700 Make VizTypeControl use metadata from plugin (#6235) * Render vis type item using information from registry * adjust style * fix unit test * Remove large thumbnails * Update addSlice --- .../assets/images/viz_thumbnails_large/area.png | Bin 105237 -> 0 bytes .../assets/images/viz_thumbnails_large/bar.png | Bin 50564 -> 0 bytes .../images/viz_thumbnails_large/big_number.png | Bin 51404 -> 0 bytes .../viz_thumbnails_large/big_number_total.png | Bin 27637 -> 0 bytes .../images/viz_thumbnails_large/box_plot.png | Bin 56136 -> 0 bytes .../assets/images/viz_thumbnails_large/bubble.png | Bin 135455 -> 0 bytes .../assets/images/viz_thumbnails_large/bullet.png | Bin 8764 -> 0 bytes .../images/viz_thumbnails_large/cal_heatmap.png | Bin 31627 -> 0 bytes .../assets/images/viz_thumbnails_large/chord.png | Bin 407616 -> 0 bytes .../assets/images/viz_thumbnails_large/compare.png | Bin 258894 -> 0 bytes .../images/viz_thumbnails_large/country_map.png | Bin 303004 -> 0 bytes .../images/viz_thumbnails_large/deck_arc.png | Bin 230107 -> 0 bytes .../images/viz_thumbnails_large/deck_geojson.png | Bin 181512 -> 0 bytes .../images/viz_thumbnails_large/deck_grid.png | Bin 2125810 -> 0 bytes .../images/viz_thumbnails_large/deck_hex.png | Bin 1090997 -> 0 bytes .../images/viz_thumbnails_large/deck_multi.png | Bin 991412 -> 0 bytes .../images/viz_thumbnails_large/deck_path.png | Bin 523094 -> 0 bytes .../images/viz_thumbnails_large/deck_polygon.png | Bin 443630 -> 0 bytes .../images/viz_thumbnails_large/deck_scatter.png | Bin 795739 -> 0 bytes .../viz_thumbnails_large/deck_screengrid.png | Bin 591701 -> 0 bytes .../images/viz_thumbnails_large/directed_force.png | Bin 247382 -> 0 bytes .../images/viz_thumbnails_large/dist_bar.png | Bin 52519 -> 0 bytes .../images/viz_thumbnails_large/dual_line.png | Bin 165716 -> 0 bytes .../images/viz_thumbnails_large/event_flow.png | Bin 108626 -> 0 bytes .../images/viz_thumbnails_large/filter_box.png | Bin 49653 -> 0 bytes .../assets/images/viz_thumbnails_large/heatmap.png | Bin 435496 -> 0 bytes .../images/viz_thumbnails_large/histogram.png | Bin 64899 -> 0 bytes .../assets/images/viz_thumbnails_large/horizon.png | Bin 165253 -> 0 bytes .../assets/images/viz_thumbnails_large/iframe.png | Bin 755166 -> 0 bytes .../assets/images/viz_thumbnails_large/line.png | Bin 321509 -> 0 bytes .../images/viz_thumbnails_large/line_multi.png | Bin 116138 -> 0 bytes .../assets/images/viz_thumbnails_large/mapbox.png | Bin 225567 -> 0 bytes .../assets/images/viz_thumbnails_large/markup.png | Bin 227846 -> 0 bytes .../assets/images/viz_thumbnails_large/multi.png | Bin 761211 -> 0 bytes .../images/viz_thumbnails_large/paired_ttest.png | Bin 236049 -> 0 bytes .../assets/images/viz_thumbnails_large/para.png | Bin 471027 -> 0 bytes .../images/viz_thumbnails_large/partition.png | Bin 198125 -> 0 bytes .../assets/images/viz_thumbnails_large/pie.png | Bin 28302 -> 0 bytes .../images/viz_thumbnails_large/pivot_table.png | Bin 276020 -> 0 bytes .../assets/images/viz_thumbnails_large/rose.png | Bin 506254 -> 0 bytes .../assets/images/viz_thumbnails_large/sankey.png | Bin 205313 -> 0 bytes .../images/viz_thumbnails_large/separator.png | Bin 101451 -> 0 bytes .../images/viz_thumbnails_large/sunburst.png | Bin 173806 -> 0 bytes .../assets/images/viz_thumbnails_large/table.png | Bin 109326 -> 0 bytes .../images/viz_thumbnails_large/time_pivot.png | Bin 84481 -> 0 bytes .../images/viz_thumbnails_large/time_table.png | Bin 65153 -> 0 bytes .../assets/images/viz_thumbnails_large/treemap.png | Bin 96420 -> 0 bytes .../images/viz_thumbnails_large/word_cloud.png | Bin 117846 -> 0 bytes .../images/viz_thumbnails_large/world_map.png | Bin 136501 -> 0 bytes .../explore/components/VizTypeControl_spec.jsx | 21 +++++-- superset/assets/src/addSlice/AddSliceContainer.jsx | 22 +++++--- superset/assets/src/addSlice/App.jsx | 2 + .../explore/components/controls/VizTypeControl.css | 34 ++++++++++++ .../explore/components/controls/VizTypeControl.jsx | 61 ++++++++++++--------- superset/assets/src/explore/main.css | 26 --------- 55 files changed, 104 insertions(+), 62 deletions(-) diff --git a/superset/assets/images/viz_thumbnails_large/area.png b/superset/assets/images/viz_thumbnails_large/area.png deleted file mode 100644 index 86f1080..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/area.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/bar.png b/superset/assets/images/viz_thumbnails_large/bar.png deleted file mode 100644 index ab0e8d9..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/bar.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/big_number.png b/superset/assets/images/viz_thumbnails_large/big_number.png deleted file mode 100644 index 2420f25..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/big_number.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/big_number_total.png b/superset/assets/images/viz_thumbnails_large/big_number_total.png deleted file mode 100644 index eb4b345..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/big_number_total.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/box_plot.png b/superset/assets/images/viz_thumbnails_large/box_plot.png deleted file mode 100644 index de8f061..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/box_plot.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/bubble.png b/superset/assets/images/viz_thumbnails_large/bubble.png deleted file mode 100644 index 08de51f..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/bubble.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/bullet.png b/superset/assets/images/viz_thumbnails_large/bullet.png deleted file mode 100644 index 7a66a41..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/bullet.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/cal_heatmap.png b/superset/assets/images/viz_thumbnails_large/cal_heatmap.png deleted file mode 100644 index bf79a9e..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/cal_heatmap.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/chord.png b/superset/assets/images/viz_thumbnails_large/chord.png deleted file mode 100644 index a4a30b6..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/chord.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/compare.png b/superset/assets/images/viz_thumbnails_large/compare.png deleted file mode 100644 index 00b0a7c..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/compare.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/country_map.png b/superset/assets/images/viz_thumbnails_large/country_map.png deleted file mode 100644 index 896fd6b..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/country_map.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_arc.png b/superset/assets/images/viz_thumbnails_large/deck_arc.png deleted file mode 100644 index f79f283..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_arc.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_geojson.png b/superset/assets/images/viz_thumbnails_large/deck_geojson.png deleted file mode 100644 index acc452c..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_geojson.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_grid.png b/superset/assets/images/viz_thumbnails_large/deck_grid.png deleted file mode 100644 index cd93965..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_grid.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_hex.png b/superset/assets/images/viz_thumbnails_large/deck_hex.png deleted file mode 100644 index 31feff5..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_hex.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_multi.png b/superset/assets/images/viz_thumbnails_large/deck_multi.png deleted file mode 100644 index 21c27c0..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_multi.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_path.png b/superset/assets/images/viz_thumbnails_large/deck_path.png deleted file mode 100644 index eede9da..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_path.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_polygon.png b/superset/assets/images/viz_thumbnails_large/deck_polygon.png deleted file mode 100644 index dfae861..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_polygon.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_scatter.png b/superset/assets/images/viz_thumbnails_large/deck_scatter.png deleted file mode 100644 index 11f38cc..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_scatter.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/deck_screengrid.png b/superset/assets/images/viz_thumbnails_large/deck_screengrid.png deleted file mode 100644 index d5da29c..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/deck_screengrid.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/directed_force.png b/superset/assets/images/viz_thumbnails_large/directed_force.png deleted file mode 100644 index 1cc7ce9..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/directed_force.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/dist_bar.png b/superset/assets/images/viz_thumbnails_large/dist_bar.png deleted file mode 100644 index b410147..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/dist_bar.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/dual_line.png b/superset/assets/images/viz_thumbnails_large/dual_line.png deleted file mode 100755 index 23a7750..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/dual_line.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/event_flow.png b/superset/assets/images/viz_thumbnails_large/event_flow.png deleted file mode 100644 index 4576529..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/event_flow.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/filter_box.png b/superset/assets/images/viz_thumbnails_large/filter_box.png deleted file mode 100644 index 209259c..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/filter_box.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/heatmap.png b/superset/assets/images/viz_thumbnails_large/heatmap.png deleted file mode 100644 index ac81a45..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/heatmap.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/histogram.png b/superset/assets/images/viz_thumbnails_large/histogram.png deleted file mode 100644 index f7bbe62..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/histogram.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/horizon.png b/superset/assets/images/viz_thumbnails_large/horizon.png deleted file mode 100644 index a5d4bf3..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/horizon.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/iframe.png b/superset/assets/images/viz_thumbnails_large/iframe.png deleted file mode 100644 index d5f0f56..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/iframe.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/line.png b/superset/assets/images/viz_thumbnails_large/line.png deleted file mode 100644 index 67f8fe8..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/line.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/line_multi.png b/superset/assets/images/viz_thumbnails_large/line_multi.png deleted file mode 100644 index 473be99..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/line_multi.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/mapbox.png b/superset/assets/images/viz_thumbnails_large/mapbox.png deleted file mode 100644 index 662c163..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/mapbox.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/markup.png b/superset/assets/images/viz_thumbnails_large/markup.png deleted file mode 100644 index 675e42a..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/markup.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/multi.png b/superset/assets/images/viz_thumbnails_large/multi.png deleted file mode 100644 index be62cd4..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/multi.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/paired_ttest.png b/superset/assets/images/viz_thumbnails_large/paired_ttest.png deleted file mode 100644 index 4f8ad71..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/paired_ttest.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/para.png b/superset/assets/images/viz_thumbnails_large/para.png deleted file mode 100644 index fc1a157..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/para.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/partition.png b/superset/assets/images/viz_thumbnails_large/partition.png deleted file mode 100644 index 7cf6e13..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/partition.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/pie.png b/superset/assets/images/viz_thumbnails_large/pie.png deleted file mode 100644 index ab76749..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/pie.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/pivot_table.png b/superset/assets/images/viz_thumbnails_large/pivot_table.png deleted file mode 100644 index 37f86af..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/pivot_table.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/rose.png b/superset/assets/images/viz_thumbnails_large/rose.png deleted file mode 100644 index 763fa2b..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/rose.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/sankey.png b/superset/assets/images/viz_thumbnails_large/sankey.png deleted file mode 100644 index 981cdba..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/sankey.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/separator.png b/superset/assets/images/viz_thumbnails_large/separator.png deleted file mode 100644 index eddb59d..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/separator.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/sunburst.png b/superset/assets/images/viz_thumbnails_large/sunburst.png deleted file mode 100644 index f155363..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/sunburst.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/table.png b/superset/assets/images/viz_thumbnails_large/table.png deleted file mode 100644 index a3dd1be..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/table.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/time_pivot.png b/superset/assets/images/viz_thumbnails_large/time_pivot.png deleted file mode 100644 index 149f3da..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/time_pivot.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/time_table.png b/superset/assets/images/viz_thumbnails_large/time_table.png deleted file mode 100644 index 5eba0c2..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/time_table.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/treemap.png b/superset/assets/images/viz_thumbnails_large/treemap.png deleted file mode 100644 index 0aec60c..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/treemap.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/word_cloud.png b/superset/assets/images/viz_thumbnails_large/word_cloud.png deleted file mode 100644 index 03936e1..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/word_cloud.png and /dev/null differ diff --git a/superset/assets/images/viz_thumbnails_large/world_map.png b/superset/assets/images/viz_thumbnails_large/world_map.png deleted file mode 100644 index 82e8ad2..0000000 Binary files a/superset/assets/images/viz_thumbnails_large/world_map.png and /dev/null differ diff --git a/superset/assets/spec/javascripts/explore/components/VizTypeControl_spec.jsx b/superset/assets/spec/javascripts/explore/components/VizTypeControl_spec.jsx index d3f6fd4..a6db627 100644 --- a/superset/assets/spec/javascripts/explore/components/VizTypeControl_spec.jsx +++ b/superset/assets/spec/javascripts/explore/components/VizTypeControl_spec.jsx @@ -3,17 +3,30 @@ import sinon from 'sinon'; import { shallow } from 'enzyme'; import { Modal } from 'react-bootstrap'; import VizTypeControl from '../../../../src/explore/components/controls/VizTypeControl'; +import getChartMetadataRegistry from '../../../../src/visualizations/core/registries/ChartMetadataRegistrySingleton'; +import ChartMetadata from '../../../../src/visualizations/core/models/ChartMetadata'; const defaultProps = { name: 'viz_type', label: 'Visualization Type', - value: 'table', + value: 'vis1', onChange: sinon.spy(), }; describe('VizTypeControl', () => { let wrapper; + const registry = getChartMetadataRegistry(); + registry + .registerValue('vis1', new ChartMetadata({ + name: 'vis1', + thumbnail: '', + })) + .registerValue('vis2', new ChartMetadata({ + name: 'vis2', + thumbnail: '', + })); + beforeEach(() => { wrapper = shallow(<VizTypeControl {...defaultProps} />); }); @@ -28,8 +41,8 @@ describe('VizTypeControl', () => { expect(defaultProps.onChange.called).toBe(true); }); it('filters images based on text input', () => { - expect(wrapper.find('img').length).toBeGreaterThan(20); - wrapper.setState({ filter: 'time' }); - expect(wrapper.find('img').length).toBeLessThan(10); + expect(wrapper.find('img')).toHaveLength(2); + wrapper.setState({ filter: 'vis2' }); + expect(wrapper.find('img')).toHaveLength(1); }); }); diff --git a/superset/assets/src/addSlice/AddSliceContainer.jsx b/superset/assets/src/addSlice/AddSliceContainer.jsx index f46dbad..968856e 100644 --- a/superset/assets/src/addSlice/AddSliceContainer.jsx +++ b/superset/assets/src/addSlice/AddSliceContainer.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { Button, Panel } from 'react-bootstrap'; import Select from 'react-virtualized-select'; import { t } from '@superset-ui/translation'; -import visTypes from '../explore/visTypes'; +import getChartMetadataRegistry from '../visualizations/core/registries/ChartMetadataRegistrySingleton'; const propTypes = { datasources: PropTypes.arrayOf(PropTypes.shape({ @@ -17,11 +17,13 @@ const styleSelectWidth = { width: 300 }; export default class AddSliceContainer extends React.PureComponent { constructor(props) { super(props); - const visTypeKeys = Object.keys(visTypes); - this.vizTypeOptions = visTypeKeys.map(vt => ({ label: visTypes[vt].label, value: vt })); this.state = { visType: 'table', }; + + this.changeDatasource = this.changeDatasource.bind(this); + this.changeVisType = this.changeVisType.bind(this); + this.gotoSlice = this.gotoSlice.bind(this); } exploreUrl() { @@ -54,6 +56,12 @@ export default class AddSliceContainer extends React.PureComponent { } render() { + const types = getChartMetadataRegistry().entries() + .map(({ key, value }) => ({ + value: key, + label: value.name, + })); + return ( <div className="container"> <Panel header={<h3>{t('Create a new chart')}</h3>}> @@ -64,7 +72,7 @@ export default class AddSliceContainer extends React.PureComponent { clearable={false} style={styleSelectWidth} name="select-datasource" - onChange={this.changeDatasource.bind(this)} + onChange={this.changeDatasource} options={this.props.datasources} placeholder={t('Choose a datasource')} value={this.state.datasourceValue} @@ -86,8 +94,8 @@ export default class AddSliceContainer extends React.PureComponent { clearable={false} name="select-vis-type" style={styleSelectWidth} - onChange={this.changeVisType.bind(this)} - options={this.vizTypeOptions} + onChange={this.changeVisType} + options={types} placeholder={t('Choose a visualization type')} value={this.state.visType} /> @@ -96,7 +104,7 @@ export default class AddSliceContainer extends React.PureComponent { <Button bsStyle="primary" disabled={this.isBtnDisabled()} - onClick={this.gotoSlice.bind(this)} + onClick={this.gotoSlice} > {t('Create new chart')} </Button> diff --git a/superset/assets/src/addSlice/App.jsx b/superset/assets/src/addSlice/App.jsx index 34154a9..96122ec 100644 --- a/superset/assets/src/addSlice/App.jsx +++ b/superset/assets/src/addSlice/App.jsx @@ -1,9 +1,11 @@ import React from 'react'; import { hot } from 'react-hot-loader'; import setupApp from '../setup/setupApp'; +import setupPlugins from '../setup/setupPlugins'; import AddSliceContainer from './AddSliceContainer'; setupApp(); +setupPlugins(); const addSliceContainer = document.getElementById('js-add-slice-container'); const bootstrapData = JSON.parse(addSliceContainer.getAttribute('data-bootstrap')); diff --git a/superset/assets/src/explore/components/controls/VizTypeControl.css b/superset/assets/src/explore/components/controls/VizTypeControl.css new file mode 100644 index 0000000..d2ebbcc --- /dev/null +++ b/superset/assets/src/explore/components/controls/VizTypeControl.css @@ -0,0 +1,34 @@ +.viztype-label { + margin-top: 10px; + text-align: center; + font-size: 14px; +} + +.viztype-selector-container { + cursor: pointer; + margin-top: 10px; + margin-bottom: 10px; +} + +.viztype-selector-container:hover img { + border: 1px solid #aaa; +} + +.viztype-selector-container.selected { + cursor: not-allowed; + opacity: 1; +} + +.viztype-selector-container.selected img { + border: 1px solid #333; +} + +.viztype-selector-container img { + border: 1px solid #ddd; + border-radius: 4px; + transition: border-color .2s; +} + +.viztype-control-search-box { + margin-bottom: 10px; +} diff --git a/superset/assets/src/explore/components/controls/VizTypeControl.jsx b/superset/assets/src/explore/components/controls/VizTypeControl.jsx index 113d3c5..2f92242 100644 --- a/superset/assets/src/explore/components/controls/VizTypeControl.jsx +++ b/superset/assets/src/explore/components/controls/VizTypeControl.jsx @@ -5,8 +5,9 @@ import { Tooltip } from 'react-bootstrap'; import { t } from '@superset-ui/translation'; -import visTypes from '../../visTypes'; +import getChartMetadataRegistry from '../../../visualizations/core/registries/ChartMetadataRegistrySingleton'; import ControlHeader from '../ControlHeader'; +import './VizTypeControl.css'; const propTypes = { description: PropTypes.string, @@ -50,37 +51,47 @@ export default class VizTypeControl extends React.PureComponent { this.searchRef.focus(); } } - renderVizType(vizType) { - const vt = vizType; + renderItem(entry) { + const { value } = this.props; + const { key, value: type } = entry; + const isSelected = key === value; return ( <div - className={`viztype-selector-container ${vt === this.props.value ? 'selected' : ''}`} - onClick={this.onChange.bind(this, vt)} + className={`viztype-selector-container ${isSelected ? 'selected' : ''}`} + onClick={this.onChange.bind(this, key)} > <img - alt={`viz-type-${vt}`} + alt={type.name} width="100%" - className={`viztype-selector ${this.props.value === vt ? 'selected' : ''}`} - src={`/static/assets/images/viz_thumbnails/${vt}.png`} + className={`viztype-selector ${isSelected ? 'selected' : ''}`} + src={type.thumbnail} /> <div className="viztype-label"> - {visTypes[vt].label} + {type.name} </div> </div>); } render() { - const filter = this.state.filter; - const filteredVizTypes = Object.keys(visTypes) - .filter(vt => filter.length === 0 || visTypes[vt].label.toLowerCase().includes(filter)); + const { filter, showModal } = this.state; + const { value } = this.props; + + const registry = getChartMetadataRegistry(); + + const types = registry.entries(); + const filteredTypes = filter.length > 0 + ? types.filter(type => type.value.name.toLowerCase().includes(filter)) + : types; + + const selectedType = registry.get(value); const imgPerRow = 6; const rows = []; - for (let i = 0; i <= filteredVizTypes.length; i += imgPerRow) { + for (let i = 0; i <= filteredTypes.length; i += imgPerRow) { rows.push( <Row key={`row-${i}`}> - {filteredVizTypes.slice(i, i + imgPerRow).map(vt => ( - <Col md={12 / imgPerRow} key={`grid-col-${vt}`}> - {this.renderVizType(vt)} + {filteredTypes.slice(i, i + imgPerRow).map(entry => ( + <Col md={12 / imgPerRow} key={`grid-col-${entry.key}`}> + {this.renderItem(entry)} </Col> ))} </Row>); @@ -97,11 +108,11 @@ export default class VizTypeControl extends React.PureComponent { } > <Label onClick={this.toggleModal} style={{ cursor: 'pointer' }}> - {visTypes[this.props.value].label} + {selectedType.name} </Label> </OverlayTrigger> <Modal - show={this.state.showModal} + show={showModal} onHide={this.toggleModal} onEnter={this.focusSearch} onExit={this.setSearchRef} @@ -111,21 +122,21 @@ export default class VizTypeControl extends React.PureComponent { <Modal.Title>{t('Select a visualization type')}</Modal.Title> </Modal.Header> <Modal.Body> - <div> + <div className="viztype-control-search-box"> <FormControl - id="formControlsText" - inputRef={(ref) => { this.setSearchRef(ref); }} + inputRef={this.setSearchRef} type="text" - bsSize="sm" - value={this.state.filter} - placeholder={t('Search / Filter')} + bsSize="md" + value={filter} + placeholder={t('Search')} onChange={this.changeSearch} /> </div> {rows} </Modal.Body> </Modal> - </div>); + </div> + ); } } diff --git a/superset/assets/src/explore/main.css b/superset/assets/src/explore/main.css index c228ad1..be3a514 100644 --- a/superset/assets/src/explore/main.css +++ b/superset/assets/src/explore/main.css @@ -47,32 +47,6 @@ background-color: transparent !important; } -.viztype-label { - text-align: center; - font-size: 12px; -} - -.viztype-selector-container { - cursor: pointer; - margin-top: 10px; - margin-bottom: 10px; - padding: 5px; - border: 1px solid #aaa; -} - -.viztype-selector-container:hover { - border: 1px solid #000; -} - -.viztype-selector-container.selected { - cursor: not-allowed; - opacity: 0.5; -} -.viztype-selector-container.selected { - cursor: not-allowed; - border: 1px solid #aaa; -} - .color-scheme-container { list-style: none; margin: 0;