Skip to content

Commit

Permalink
refactor: [migration] convert iframe chart into dashboard markdown co…
Browse files Browse the repository at this point in the history 
…mponent (apache#10590)

* refactor: [migration] convert iframe chart into dashboard markdown component

* remove 3 viz_types

* fix comments
  • Loading branch information
@auxten
Grace Guo authored and auxten committed Nov 20, 2020
1 parent 8f682f6 commit 2ae8b32
Show file tree
Hide file tree
Showing 10 changed files with 340 additions and 139 deletions.
2 changes: 2 additions & 0 deletions UPDATING.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@ assists people when migrating to a new version.

## Next

* [10590](https://github.com/apache/incubator-superset/pull/10590): Breaking change: this PR will convert iframe chart into dashboard markdown component, and remove all `iframe`, `separator`, and `markup` slices (and support) from Superset. If you have important data in those slices, please backup manually.

* [10562](https://github.com/apache/incubator-superset/pull/10562): EMAIL_REPORTS_WEBDRIVER is deprecated use WEBDRIVER_TYPE instead.

* [10567](https://github.com/apache/incubator-superset/pull/10567): Default WEBDRIVER_OPTION_ARGS are Chrome-specific. If you're using FF, should be `--headless` only
Expand Down
202 changes: 100 additions & 102 deletions superset-frontend/src/dashboard/reducers/getInitialState.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,118 +108,116 @@ export default function (bootstrapData) {
const sliceIds = new Set();
dashboard.slices.forEach(slice => {
const key = slice.slice_id;
if (['separator', 'markup'].indexOf(slice.form_data.viz_type) === -1) {
const form_data = {
...slice.form_data,
url_params: {
...slice.form_data.url_params,
...urlParams,
},
};
chartQueries[key] = {
...chart,
id: key,
form_data,
formData: applyDefaultFormData(form_data),
};

slices[key] = {
slice_id: key,
slice_url: slice.slice_url,
slice_name: slice.slice_name,
form_data: slice.form_data,
edit_url: slice.edit_url,
viz_type: slice.form_data.viz_type,
datasource: slice.form_data.datasource,
description: slice.description,
description_markeddown: slice.description_markeddown,
owners: slice.owners,
modified: slice.modified,
changed_on: new Date(slice.changed_on).getTime(),
};
const form_data = {
...slice.form_data,
url_params: {
...slice.form_data.url_params,
...urlParams,
},
};
chartQueries[key] = {
...chart,
id: key,
form_data,
formData: applyDefaultFormData(form_data),
};

sliceIds.add(key);
slices[key] = {
slice_id: key,
slice_url: slice.slice_url,
slice_name: slice.slice_name,
form_data: slice.form_data,
edit_url: slice.edit_url,
viz_type: slice.form_data.viz_type,
datasource: slice.form_data.datasource,
description: slice.description,
description_markeddown: slice.description_markeddown,
owners: slice.owners,
modified: slice.modified,
changed_on: new Date(slice.changed_on).getTime(),
};

// if there are newly added slices from explore view, fill slices into 1 or more rows
if (!chartIdToLayoutId[key] && layout[parentId]) {
if (
newSlicesContainerWidth === 0 ||
newSlicesContainerWidth + GRID_DEFAULT_CHART_WIDTH > GRID_COLUMN_COUNT
) {
newSlicesContainer = newComponentFactory(
ROW_TYPE,
(parent.parents || []).slice(),
);
layout[newSlicesContainer.id] = newSlicesContainer;
parent.children.push(newSlicesContainer.id);
newSlicesContainerWidth = 0;
}
sliceIds.add(key);

const chartHolder = newComponentFactory(
CHART_TYPE,
{
chartId: slice.slice_id,
},
(newSlicesContainer.parents || []).slice(),
// if there are newly added slices from explore view, fill slices into 1 or more rows
if (!chartIdToLayoutId[key] && layout[parentId]) {
if (
newSlicesContainerWidth === 0 ||
newSlicesContainerWidth + GRID_DEFAULT_CHART_WIDTH > GRID_COLUMN_COUNT
) {
newSlicesContainer = newComponentFactory(
ROW_TYPE,
(parent.parents || []).slice(),
);

layout[chartHolder.id] = chartHolder;
newSlicesContainer.children.push(chartHolder.id);
chartIdToLayoutId[chartHolder.meta.chartId] = chartHolder.id;
newSlicesContainerWidth += GRID_DEFAULT_CHART_WIDTH;
layout[newSlicesContainer.id] = newSlicesContainer;
parent.children.push(newSlicesContainer.id);
newSlicesContainerWidth = 0;
}

// build DashboardFilters for interactive filter features
if (slice.form_data.viz_type === 'filter_box') {
const configs = getFilterConfigsFromFormdata(slice.form_data);
let columns = configs.columns;
const labels = configs.labels;
if (preselectFilters[key]) {
Object.keys(columns).forEach(col => {
if (preselectFilters[key][col]) {
columns = {
...columns,
[col]: preselectFilters[key][col],
};
}
});
}
const chartHolder = newComponentFactory(
CHART_TYPE,
{
chartId: slice.slice_id,
},
(newSlicesContainer.parents || []).slice(),
);

const scopesByChartId = Object.keys(columns).reduce((map, column) => {
const scopeSettings = {
...filterScopes[key],
};
const { scope, immune } = {
...DASHBOARD_FILTER_SCOPE_GLOBAL,
...scopeSettings[column],
};
layout[chartHolder.id] = chartHolder;
newSlicesContainer.children.push(chartHolder.id);
chartIdToLayoutId[chartHolder.meta.chartId] = chartHolder.id;
newSlicesContainerWidth += GRID_DEFAULT_CHART_WIDTH;
}

return {
...map,
[column]: {
scope,
immune,
},
};
}, {});
// build DashboardFilters for interactive filter features
if (slice.form_data.viz_type === 'filter_box') {
const configs = getFilterConfigsFromFormdata(slice.form_data);
let columns = configs.columns;
const labels = configs.labels;
if (preselectFilters[key]) {
Object.keys(columns).forEach(col => {
if (preselectFilters[key][col]) {
columns = {
...columns,
[col]: preselectFilters[key][col],
};
}
});
}

const componentId = chartIdToLayoutId[key];
const directPathToFilter = (layout[componentId].parents || []).slice();
directPathToFilter.push(componentId);
dashboardFilters[key] = {
...dashboardFilter,
chartId: key,
componentId,
datasourceId: slice.form_data.datasource,
filterName: slice.slice_name,
directPathToFilter,
columns,
labels,
scopes: scopesByChartId,
isInstantFilter: !!slice.form_data.instant_filtering,
isDateFilter: Object.keys(columns).includes(TIME_RANGE),
const scopesByChartId = Object.keys(columns).reduce((map, column) => {
const scopeSettings = {
...filterScopes[key],
};
}
const { scope, immune } = {
...DASHBOARD_FILTER_SCOPE_GLOBAL,
...scopeSettings[column],
};

return {
...map,
[column]: {
scope,
immune,
},
};
}, {});

const componentId = chartIdToLayoutId[key];
const directPathToFilter = (layout[componentId].parents || []).slice();
directPathToFilter.push(componentId);
dashboardFilters[key] = {
...dashboardFilter,
chartId: key,
componentId,
datasourceId: slice.form_data.datasource,
filterName: slice.slice_name,
directPathToFilter,
columns,
labels,
scopes: scopesByChartId,
isInstantFilter: !!slice.form_data.instant_filtering,
isDateFilter: Object.keys(columns).includes(TIME_RANGE),
};
}

// sync layout names with current slice names in case a slice was edited
Expand Down
8 changes: 1 addition & 7 deletions superset-frontend/src/explore/components/SaveModal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,6 @@ import { CreatableSelect } from 'src/components/Select/SupersetStyledSelect';
import { t } from '@superset-ui/translation';
import ReactMarkdown from 'react-markdown';

import { EXPLORE_ONLY_VIZ_TYPE } from '../constants';

const propTypes = {
can_overwrite: PropTypes.bool,
onHide: PropTypes.func.isRequired,
Expand Down Expand Up @@ -134,8 +132,6 @@ class SaveModal extends React.Component {
this.setState({ alert: null });
}
render() {
const canNotSaveToDash =
EXPLORE_ONLY_VIZ_TYPE.indexOf(this.state.vizType) > -1;
return (
<Modal show onHide={this.props.onHide}>
<Modal.Header closeButton>
Expand Down Expand Up @@ -225,9 +221,7 @@ class SaveModal extends React.Component {
id="btn_modal_save_goto_dash"
bsSize="sm"
disabled={
canNotSaveToDash ||
!this.state.newSliceName ||
!this.state.newDashboardName
!this.state.newSliceName || !this.state.newDashboardName
}
onClick={this.saveOrOverwrite.bind(this, true)}
>
Expand Down
3 changes: 0 additions & 3 deletions superset-frontend/src/explore/components/controls/VizTypeControl.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,6 @@ const DEFAULT_ORDER = [
'line_multi',
'treemap',
'box_plot',
'separator',
'sunburst',
'sankey',
'word_cloud',
Expand All @@ -85,7 +84,6 @@ const DEFAULT_ORDER = [
'bubble',
'deck_geojson',
'horizon',
'markup',
'deck_multi',
'compare',
'partition',
Expand All @@ -95,7 +93,6 @@ const DEFAULT_ORDER = [
'world_map',
'paired_ttest',
'para',
'iframe',
'country_map',
];

Expand Down
2 changes: 0 additions & 2 deletions superset-frontend/src/explore/constants.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,8 +71,6 @@ export const sqlaAutoGeneratedMetricNameRegex = /^(sum|min|max|avg|count|count_d
export const sqlaAutoGeneratedMetricRegex = /^(LONG|DOUBLE|FLOAT)?(SUM|AVG|MAX|MIN|COUNT)\([A-Z0-9_."]*\)$/i;
export const druidAutoGeneratedMetricRegex = /^(LONG|DOUBLE|FLOAT)?(SUM|MAX|MIN|COUNT)\([A-Z0-9_."]*\)$/i;

export const EXPLORE_ONLY_VIZ_TYPE = ['separator', 'markup'];

export const TIME_FILTER_LABELS = {
time_range: t('Time Range'),
granularity_sqla: t('Time Column'),
Expand Down
5 changes: 0 additions & 5 deletions superset-frontend/src/visualizations/presets/MainPreset.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,7 @@ import ForceDirectedChartPlugin from '@superset-ui/legacy-plugin-chart-force-dir
import HeatmapChartPlugin from '@superset-ui/legacy-plugin-chart-heatmap';
import HistogramChartPlugin from '@superset-ui/legacy-plugin-chart-histogram';
import HorizonChartPlugin from '@superset-ui/legacy-plugin-chart-horizon';
import IframeChartPlugin from '@superset-ui/legacy-plugin-chart-iframe';
import MapBoxChartPlugin from '@superset-ui/legacy-plugin-chart-map-box';
import MarkupChartPlugin from '@superset-ui/legacy-plugin-chart-markup';
import PairedTTestChartPlugin from '@superset-ui/legacy-plugin-chart-paired-t-test';
import ParallelCoordinatesChartPlugin from '@superset-ui/legacy-plugin-chart-parallel-coordinates';
import PartitionChartPlugin from '@superset-ui/legacy-plugin-chart-partition';
Expand Down Expand Up @@ -87,12 +85,9 @@ export default class MainPreset extends Preset {
new HeatmapChartPlugin().configure({ key: 'heatmap' }),
new HistogramChartPlugin().configure({ key: 'histogram' }),
new HorizonChartPlugin().configure({ key: 'horizon' }),
new IframeChartPlugin().configure({ key: 'iframe' }),
new LineChartPlugin().configure({ key: 'line' }),
new LineMultiChartPlugin().configure({ key: 'line_multi' }),
new MapBoxChartPlugin().configure({ key: 'mapbox' }),
new MarkupChartPlugin().configure({ key: 'markup' }),
new MarkupChartPlugin().configure({ key: 'separator' }),
new PairedTTestChartPlugin().configure({ key: 'paired_ttest' }),
new ParallelCoordinatesChartPlugin().configure({ key: 'para' }),
new PartitionChartPlugin().configure({ key: 'partition' }),
Expand Down
Loading

0 comments on commit 2ae8b32

Please sign in to comment.