mirror of
https://github.com/apache/superset.git
synced 2026-04-19 08:04:53 +00:00
Deleted unused components in exploreV2 (#1613)
* Deleted unused components in exploreV2 * Deleted constants.js
This commit is contained in:
vera-liu
@@ -6,11 +6,6 @@ export function setFieldOptions(options) {
|
||||
return { type: SET_FIELD_OPTIONS, options };
|
||||
}
|
||||
|
||||
export const CLEAR_ALL_OPTS = 'CLEAR_ALL_OPTS';
|
||||
export function clearAllOpts() {
|
||||
return { type: CLEAR_ALL_OPTS };
|
||||
}
|
||||
|
||||
export const SET_DATASOURCE_TYPE = 'SET_DATASOURCE_TYPE';
|
||||
export function setDatasourceType(datasourceType) {
|
||||
return { type: SET_DATASOURCE_TYPE, datasourceType };
|
||||
|
||||
@@ -1,89 +0,0 @@
|
||||
import React from 'react';
|
||||
import Select from 'react-select';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
import { VIZ_TYPES } from '../constants';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
datasources: React.PropTypes.array,
|
||||
datasourceId: React.PropTypes.number,
|
||||
datasourceType: React.PropTypes.string,
|
||||
vizType: React.PropTypes.string,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
datasources: [],
|
||||
datasourceId: null,
|
||||
datasourceType: null,
|
||||
vizType: null,
|
||||
};
|
||||
|
||||
class ChartControl extends React.Component {
|
||||
componentWillMount() {
|
||||
if (this.props.datasourceId) {
|
||||
this.props.actions.setFormOpts(this.props.datasourceId, this.props.datasourceType);
|
||||
}
|
||||
}
|
||||
changeDatasource(datasourceOpt) {
|
||||
const val = (datasourceOpt) ? datasourceOpt.value : null;
|
||||
this.props.actions.setDatasource(val);
|
||||
this.props.actions.resetFormData();
|
||||
this.props.actions.setFormOpts(val, this.props.datasourceType);
|
||||
}
|
||||
changeViz(opt) {
|
||||
const val = opt ? opt.value : null;
|
||||
this.props.actions.setFormData('vizType', val);
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div className="panel">
|
||||
<div className="panel-header">Chart Options</div>
|
||||
<div className="panel-body">
|
||||
<h5 className="section-heading">Datasource</h5>
|
||||
<div className="row">
|
||||
<Select
|
||||
name="select-datasource"
|
||||
placeholder="Select a datasource"
|
||||
options={this.props.datasources.map((d) => ({ value: d[0], label: d[1] }))}
|
||||
value={this.props.datasourceId}
|
||||
autosize={false}
|
||||
onChange={this.changeDatasource.bind(this)}
|
||||
/>
|
||||
</div>
|
||||
<h5 className="section-heading">Viz Type</h5>
|
||||
<div className="row">
|
||||
<Select
|
||||
name="select-viztype"
|
||||
placeholder="Select a viz type"
|
||||
options={VIZ_TYPES}
|
||||
value={this.props.vizType}
|
||||
autosize={false}
|
||||
onChange={this.changeViz.bind(this)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
ChartControl.propTypes = propTypes;
|
||||
ChartControl.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
datasources: state.datasources,
|
||||
datasourceId: state.datasourceId,
|
||||
datasourceType: state.datasourceType,
|
||||
vizType: state.viz.formData.vizType,
|
||||
};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ChartControl);
|
||||
@@ -1,68 +0,0 @@
|
||||
import React from 'react';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
import SelectArray from './SelectArray';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
metricsOpts: React.PropTypes.array,
|
||||
metrics: React.PropTypes.array,
|
||||
groupByColumnOpts: React.PropTypes.array,
|
||||
groupByColumns: React.PropTypes.array,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
metricsOpts: [],
|
||||
metrics: [],
|
||||
groupByColumnOpts: [],
|
||||
groupByColumns: [],
|
||||
};
|
||||
|
||||
const GroupBy = (props) => {
|
||||
const selects = [
|
||||
{
|
||||
key: 'groupByColumns',
|
||||
title: 'Group By',
|
||||
options: props.groupByColumnOpts,
|
||||
value: props.groupByColumns,
|
||||
multi: true,
|
||||
width: '12',
|
||||
},
|
||||
{
|
||||
key: 'metrics',
|
||||
title: 'Metrics',
|
||||
options: props.metricsOpts,
|
||||
value: props.metrics,
|
||||
multi: true,
|
||||
width: '12',
|
||||
}];
|
||||
return (
|
||||
<div className="panel">
|
||||
<div className="panel-header">GroupBy</div>
|
||||
<div className="panel-body">
|
||||
<SelectArray selectArray={selects} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
GroupBy.propTypes = propTypes;
|
||||
GroupBy.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
metricsOpts: state.metricsOpts,
|
||||
metrics: state.viz.formData.metrics,
|
||||
groupByColumnOpts: state.groupByColumnOpts,
|
||||
groupByColumns: state.viz.formData.groupByColumns,
|
||||
};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(GroupBy);
|
||||
@@ -1,68 +0,0 @@
|
||||
import React from 'react';
|
||||
import SelectArray from './SelectArray';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
columnOpts: React.PropTypes.array,
|
||||
columns: React.PropTypes.array,
|
||||
orderingOpts: React.PropTypes.array,
|
||||
orderings: React.PropTypes.array,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
columnOpts: [],
|
||||
columns: [],
|
||||
orderingOpts: [],
|
||||
orderings: [],
|
||||
};
|
||||
|
||||
const NotGroupBy = (props) => {
|
||||
const selects = [
|
||||
{
|
||||
key: 'columns',
|
||||
title: 'Columns',
|
||||
options: props.columnOpts,
|
||||
value: props.columns,
|
||||
multi: true,
|
||||
width: '12',
|
||||
},
|
||||
{
|
||||
key: 'orderings',
|
||||
title: 'Orderings',
|
||||
options: props.orderingOpts,
|
||||
value: props.orderings,
|
||||
multi: true,
|
||||
width: '12',
|
||||
}];
|
||||
return (
|
||||
<div className="panel">
|
||||
<div className="panel-header">Not GroupBy</div>
|
||||
<div className="panel-body">
|
||||
<SelectArray selectArray={selects} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
NotGroupBy.propTypes = propTypes;
|
||||
NotGroupBy.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
columnOpts: state.columnOpts,
|
||||
columns: state.viz.formData.columns,
|
||||
orderingOpts: state.orderingOpts,
|
||||
orderings: state.viz.formData.orderings,
|
||||
};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(NotGroupBy);
|
||||
@@ -1,61 +0,0 @@
|
||||
import React from 'react';
|
||||
import SelectArray from './SelectArray';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
import { timestampOptions, rowLimitOptions } from '../constants';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
timeStampFormat: React.PropTypes.string,
|
||||
rowLimit: React.PropTypes.number,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
timeStampFormat: null,
|
||||
rowLimit: null,
|
||||
};
|
||||
|
||||
const Options = (props) => {
|
||||
const selects = [
|
||||
{
|
||||
key: 'timeStampFormat',
|
||||
title: 'Timestamp Format',
|
||||
options: timestampOptions.map((t) => ({ value: t[0], label: t[1] })),
|
||||
value: props.timeStampFormat,
|
||||
width: '12',
|
||||
},
|
||||
{
|
||||
key: 'rowLimit',
|
||||
title: 'Row Limit',
|
||||
options: rowLimitOptions.map((r) => ({ value: r, label: r })),
|
||||
value: props.rowLimit,
|
||||
width: '12',
|
||||
}];
|
||||
return (
|
||||
<div className="panel">
|
||||
<div className="panel-header">Options</div>
|
||||
<div className="panel-body">
|
||||
<SelectArray selectArray={selects} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Options.propTypes = propTypes;
|
||||
Options.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
timeStampFormat: state.viz.formData.timeStampFormat,
|
||||
rowLimit: state.viz.formData.rowLimit,
|
||||
};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(Options);
|
||||
@@ -1,74 +0,0 @@
|
||||
import React from 'react';
|
||||
import Select from 'react-select';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
selectArray: React.PropTypes.arrayOf(
|
||||
React.PropTypes.shape({
|
||||
key: React.PropTypes.string.isRequired,
|
||||
title: React.PropTypes.string.isRequired,
|
||||
options: React.PropTypes.array.isRequired,
|
||||
value: React.PropTypes.oneOfType([
|
||||
React.PropTypes.string,
|
||||
React.PropTypes.array,
|
||||
]),
|
||||
width: React.PropTypes.string,
|
||||
multi: React.PropTypes.bool,
|
||||
})
|
||||
).isRequired,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
selectArray: [],
|
||||
};
|
||||
|
||||
class SelectArray extends React.Component {
|
||||
changeSelectData(key, multi, opt) {
|
||||
if (multi) this.props.actions.setFormData(key, opt);
|
||||
else {
|
||||
const val = opt ? opt.value : null;
|
||||
this.props.actions.setFormData(key, val);
|
||||
}
|
||||
}
|
||||
render() {
|
||||
const selects = this.props.selectArray.map((obj) => (
|
||||
<div
|
||||
className={(obj.width) ? `col-sm-${obj.width}` : 'col-sm-6'}
|
||||
key={obj.key}
|
||||
>
|
||||
<h5 className="section-heading">{obj.title}</h5>
|
||||
<Select
|
||||
multi={obj.multi}
|
||||
name={`select-${obj.key}`}
|
||||
options={obj.options}
|
||||
value={obj.value}
|
||||
autosize={false}
|
||||
onChange={this.changeSelectData.bind(this, obj.key, obj.multi)}
|
||||
/>
|
||||
</div>
|
||||
));
|
||||
return (
|
||||
<div>
|
||||
{selects}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
SelectArray.propTypes = propTypes;
|
||||
SelectArray.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps() {
|
||||
return {};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(SelectArray);
|
||||
@@ -1,88 +0,0 @@
|
||||
import React from 'react';
|
||||
import { bindActionCreators } from 'redux';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { connect } from 'react-redux';
|
||||
import { sinceOptions, untilOptions } from '../constants';
|
||||
import SelectArray from './SelectArray';
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object,
|
||||
datasourceType: React.PropTypes.string,
|
||||
timeColumnOpts: React.PropTypes.array,
|
||||
timeColumn: React.PropTypes.string,
|
||||
timeGrainOpts: React.PropTypes.array,
|
||||
timeGrain: React.PropTypes.string,
|
||||
since: React.PropTypes.string,
|
||||
until: React.PropTypes.string,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
timeColumnOpts: [],
|
||||
timeColumn: null,
|
||||
timeGrainOpts: [],
|
||||
timeGrain: null,
|
||||
since: null,
|
||||
until: null,
|
||||
};
|
||||
|
||||
const TimeFilter = (props) => {
|
||||
const isDatasourceTypeTable = props.datasourceType === 'table';
|
||||
const timeColumnTitle = isDatasourceTypeTable ? 'Time Column' : 'Time Granularity';
|
||||
const timeGrainTitle = isDatasourceTypeTable ? 'Time Grain' : 'Origin';
|
||||
const selects = [
|
||||
{
|
||||
key: 'timeColumn',
|
||||
title: timeColumnTitle,
|
||||
options: props.timeColumnOpts,
|
||||
value: props.timeColumn,
|
||||
},
|
||||
{
|
||||
key: 'timeGrain',
|
||||
title: timeGrainTitle,
|
||||
options: props.timeGrainOpts,
|
||||
value: props.timeGrain,
|
||||
},
|
||||
{
|
||||
key: 'since',
|
||||
title: 'Since',
|
||||
options: sinceOptions.map((s) => ({ value: s, label: s })),
|
||||
value: props.since,
|
||||
},
|
||||
{
|
||||
key: 'until',
|
||||
title: 'Until',
|
||||
options: untilOptions.map((u) => ({ value: u, label: u })),
|
||||
value: props.until,
|
||||
}];
|
||||
return (
|
||||
<div className="panel">
|
||||
<div className="panel-header">Time Filter</div>
|
||||
<div className="panel-body">
|
||||
<SelectArray selectArray={selects} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
TimeFilter.propTypes = propTypes;
|
||||
TimeFilter.defaultProps = defaultProps;
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
datasourceType: state.datasourceType,
|
||||
timeColumnOpts: state.timeColumnOpts,
|
||||
timeColumn: state.viz.formData.timeColumn,
|
||||
timeGrainOpts: state.timeGrainOpts,
|
||||
timeGrain: state.viz.formData.timeGrain,
|
||||
since: state.viz.formData.since,
|
||||
until: state.viz.formData.until,
|
||||
};
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators(actions, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(TimeFilter);
|
||||
@@ -1,48 +0,0 @@
|
||||
import React from 'react';
|
||||
import TimeFilter from './components/TimeFilter';
|
||||
import ChartControl from './components/ChartControl';
|
||||
import GroupBy from './components/GroupBy';
|
||||
import SqlClause from './components/SqlClause';
|
||||
import Filters from './components/Filters';
|
||||
import NotGroupBy from './components/NotGroupBy';
|
||||
import Options from './components/Options';
|
||||
|
||||
export const sinceOptions = [
|
||||
'1 hour ago',
|
||||
'12 hours ago',
|
||||
'1 day ago',
|
||||
'7 days ago',
|
||||
'28 days ago',
|
||||
'90 days ago',
|
||||
'1 year ago',
|
||||
];
|
||||
|
||||
export const untilOptions = [
|
||||
'now',
|
||||
'1 day ago',
|
||||
'7 days ago',
|
||||
'28 days ago',
|
||||
'90 days ago',
|
||||
'1 year ago',
|
||||
];
|
||||
|
||||
export const DefaultControls = (
|
||||
<div>
|
||||
<ChartControl />
|
||||
<TimeFilter />
|
||||
<GroupBy />
|
||||
<SqlClause />
|
||||
<Filters />
|
||||
</div>
|
||||
);
|
||||
|
||||
export const TableVizControls = (
|
||||
<div>
|
||||
<NotGroupBy />
|
||||
<Options />
|
||||
</div>
|
||||
);
|
||||
|
||||
export const VIZ_CONTROL_MAPPING = {
|
||||
table: TableVizControls,
|
||||
};
|
||||
@@ -1,13 +1,8 @@
|
||||
import { defaultOpts } from '../stores/store';
|
||||
import * as actions from '../actions/exploreActions';
|
||||
import { addToArr, removeFromArr, alterInArr } from '../../../utils/reducerUtils';
|
||||
|
||||
export const exploreReducer = function (state, action) {
|
||||
const actionHandlers = {
|
||||
[actions.SET_DATASOURCE]() {
|
||||
return Object.assign({}, state, { datasourceId: action.datasourceId });
|
||||
},
|
||||
|
||||
[actions.FETCH_STARTED]() {
|
||||
return Object.assign({}, state, { isDatasourceMetaLoading: true });
|
||||
},
|
||||
@@ -33,10 +28,6 @@ export const exploreReducer = function (state, action) {
|
||||
return Object.assign({}, state, newState);
|
||||
},
|
||||
|
||||
[actions.TOGGLE_SEARCHBOX]() {
|
||||
return Object.assign({}, state, { searchBox: action.searchBox });
|
||||
},
|
||||
|
||||
[actions.SET_FILTER_COLUMN_OPTS]() {
|
||||
return Object.assign({}, state, { filterColumnOpts: action.filterColumnOpts });
|
||||
},
|
||||
@@ -55,9 +46,6 @@ export const exploreReducer = function (state, action) {
|
||||
[actions.CHANGE_FILTER_VALUE]() {
|
||||
return alterInArr(state, 'filters', action.filter, { value: action.value });
|
||||
},
|
||||
[actions.CLEAR_ALL_OPTS]() {
|
||||
return Object.assign({}, state, defaultOpts);
|
||||
},
|
||||
[actions.SET_FIELD_VALUE]() {
|
||||
const newFormData = Object.assign({}, state.viz.form_data);
|
||||
newFormData[action.key] = action.value ? action.value : (!state.viz.form_data[action.key]);
|
||||
|
||||
Reference in New Issue
Block a user