This is an automated email from the ASF dual-hosted git repository.
rusackas 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 4f363e1180 feat: add option to disable rendering of html in sql lab
and table chart (#27969)
4f363e1180 is described below
commit 4f363e11801572e7737b9c475bba58bd0a5dbca8
Author: soniagtm <[email protected]>
AuthorDate: Fri Apr 12 01:46:34 2024 +0700
feat: add option to disable rendering of html in sql lab and table chart
(#27969)
Co-authored-by: Sonia <[email protected]>
---
.../plugins/plugin-chart-table/src/TableChart.tsx | 3 ++-
.../plugins/plugin-chart-table/src/controlPanel.tsx | 12 ++++++++++++
.../plugins/plugin-chart-table/src/transformProps.ts | 2 ++
.../plugins/plugin-chart-table/src/types.ts | 1 +
.../src/SqlLab/components/ResultSet/index.tsx | 6 ++++++
.../src/SqlLab/components/SqlEditor/index.tsx | 16 ++++++++++++++++
.../src/components/Chart/DrillDetail/DrillDetailPane.tsx | 4 +++-
superset-frontend/src/utils/localStorageHelpers.ts | 2 ++
8 files changed, 44 insertions(+), 2 deletions(-)
diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
index ed2d9319c5..8b361c614d 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -237,6 +237,7 @@ export default function TableChart<D extends DataRecord =
DataRecord>(
sticky = true, // whether to use sticky header
columnColorFormatters,
allowRearrangeColumns = false,
+ allowRenderHtml = true,
onContextMenu,
emitCrossFilters,
} = props;
@@ -469,7 +470,7 @@ export default function TableChart<D extends DataRecord =
DataRecord>(
accessor: ((datum: D) => datum[key]) as never,
Cell: ({ value, row }: { value: DataRecordValue; row: Row<D> }) => {
const [isHtml, text] = formatColumnValue(column, value);
- const html = isHtml ? { __html: text } : undefined;
+ const html = isHtml && allowRenderHtml ? { __html: text } :
undefined;
let backgroundColor;
if (hasColumnColorFormatters) {
diff --git a/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
b/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
index ad39b504cb..6cce125f36 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
@@ -451,6 +451,18 @@ const config: ControlPanelConfig = {
},
},
],
+ [
+ {
+ name: 'allow_render_html',
+ config: {
+ type: 'CheckboxControl',
+ label: t('Render columns in HTML format'),
+ renderTrigger: true,
+ default: true,
+ description: t('Render data in HTML format if applicable.'),
+ },
+ },
+ ],
[
{
name: 'column_config',
diff --git a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
index 0a2a3449c6..92b23307ad 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
@@ -238,6 +238,7 @@ const transformProps = (
show_totals: showTotals,
conditional_formatting: conditionalFormatting,
allow_rearrange_columns: allowRearrangeColumns,
+ allow_render_html: allowRenderHtml,
} = formData;
const timeGrain = extractTimegrain(formData);
@@ -291,6 +292,7 @@ const transformProps = (
columnColorFormatters,
timeGrain,
allowRearrangeColumns,
+ allowRenderHtml,
onContextMenu,
};
};
diff --git a/superset-frontend/plugins/plugin-chart-table/src/types.ts
b/superset-frontend/plugins/plugin-chart-table/src/types.ts
index 02bae809fe..639b525d4f 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/types.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/types.ts
@@ -130,6 +130,7 @@ export interface TableChartTransformedProps<D extends
DataRecord = DataRecord> {
onChangeFilter?: ChartProps['hooks']['onAddFilter'];
columnColorFormatters?: ColorFormatters;
allowRearrangeColumns?: boolean;
+ allowRenderHtml?: boolean;
onContextMenu?: (
clientX: number,
clientY: number,
diff --git a/superset-frontend/src/SqlLab/components/ResultSet/index.tsx
b/superset-frontend/src/SqlLab/components/ResultSet/index.tsx
index 87ba0370ed..a6bbb84bac 100644
--- a/superset-frontend/src/SqlLab/components/ResultSet/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ResultSet/index.tsx
@@ -53,6 +53,7 @@ import FilterableTable from 'src/components/FilterableTable';
import CopyToClipboard from 'src/components/CopyToClipboard';
import { addDangerToast } from 'src/components/MessageToasts/actions';
import { prepareCopyToClipboardTabularData } from 'src/utils/common';
+import { getItem, LocalStorageKeys } from 'src/utils/localStorageHelpers';
import {
addQueryEditor,
clearQueryResults,
@@ -579,6 +580,10 @@ const ResultSet = ({
const expandedColumns = results.expanded_columns
? results.expanded_columns.map(col => col.column_name)
: [];
+ const allowHTML = getItem(
+ LocalStorageKeys.SqllabIsRenderHtmlEnabled,
+ false,
+ );
return (
<ResultContainer>
{renderControls()}
@@ -626,6 +631,7 @@ const ResultSet = ({
height={rowsHeight}
filterText={searchText}
expandedColumns={expandedColumns}
+ allowHTML={allowHTML}
/>
</ResultContainer>
);
diff --git a/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
b/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
index 1590726953..0c69e20fc6 100644
--- a/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
+++ b/superset-frontend/src/SqlLab/components/SqlEditor/index.tsx
@@ -284,6 +284,9 @@ const SqlEditor: React.FC<Props> = ({
const [autocompleteEnabled, setAutocompleteEnabled] = useState(
getItem(LocalStorageKeys.SqllabIsAutocompleteEnabled, true),
);
+ const [renderHTMLEnabled, setRenderHTMLEnabled] = useState(
+ getItem(LocalStorageKeys.SqllabIsRenderHtmlEnabled, false),
+ );
const [showCreateAsModal, setShowCreateAsModal] = useState(false);
const [createAs, setCreateAs] = useState('');
const [showEmptyState, setShowEmptyState] = useState(false);
@@ -607,6 +610,11 @@ const SqlEditor: React.FC<Props> = ({
setAutocompleteEnabled(!autocompleteEnabled);
};
+ const handleToggleRenderHTMLEnabled = () => {
+ setItem(LocalStorageKeys.SqllabIsRenderHtmlEnabled, !renderHTMLEnabled);
+ setRenderHTMLEnabled(!renderHTMLEnabled);
+ };
+
const createTableAs = () => {
startQuery(true, CtasEnum.Table);
setShowCreateAsModal(false);
@@ -631,6 +639,14 @@ const SqlEditor: React.FC<Props> = ({
: t('You must run the query successfully first');
return (
<Menu css={{ width: theme.gridUnit * 50 }}>
+ <Menu.Item css={{ display: 'flex', justifyContent: 'space-between' }}>
+ {' '}
+ <span>{t('Render HTML')}</span>{' '}
+ <AntdSwitch
+ checked={renderHTMLEnabled}
+ onChange={handleToggleRenderHTMLEnabled}
+ />{' '}
+ </Menu.Item>
<Menu.Item css={{ display: 'flex', justifyContent: 'space-between' }}>
{' '}
<span>{t('Autocomplete')}</span>{' '}
diff --git
a/superset-frontend/src/components/Chart/DrillDetail/DrillDetailPane.tsx
b/superset-frontend/src/components/Chart/DrillDetail/DrillDetailPane.tsx
index 8bea9ddaa3..2b5c87b272 100644
--- a/superset-frontend/src/components/Chart/DrillDetail/DrillDetailPane.tsx
+++ b/superset-frontend/src/components/Chart/DrillDetail/DrillDetailPane.tsx
@@ -265,6 +265,8 @@ export default function DrillDetailPane({
(!responseError && !resultsPages.size) ||
metadataBarStatus === ResourceStatus.Loading;
+ const allowHTML = formData.allow_render_html ?? true;
+
let tableContent = null;
if (responseError) {
// Render error if page download failed
@@ -301,7 +303,7 @@ export default function DrillDetailPane({
}
resizable
virtualize
- allowHTML
+ allowHTML={allowHTML}
/>
</Resizable>
);
diff --git a/superset-frontend/src/utils/localStorageHelpers.ts
b/superset-frontend/src/utils/localStorageHelpers.ts
index 4d8d35a490..61e1bbc350 100644
--- a/superset-frontend/src/utils/localStorageHelpers.ts
+++ b/superset-frontend/src/utils/localStorageHelpers.ts
@@ -50,6 +50,7 @@ export enum LocalStorageKeys {
* sqllab__is_autocomplete_enabled
*/
SqllabIsAutocompleteEnabled = 'sqllab__is_autocomplete_enabled',
+ SqllabIsRenderHtmlEnabled = 'sqllab__is_render_html_enabled',
ExploreDataTableOriginalFormattedTimeColumns =
'explore__data_table_original_formatted_time_columns',
DashboardCustomFilterBarWidths = 'dashboard__custom_filter_bar_widths',
DashboardExploreContext = 'dashboard__explore_context',
@@ -69,6 +70,7 @@ export type LocalStorageValues = {
datasetname_set_successful: boolean;
homepage_activity_filter: TableTab | null;
sqllab__is_autocomplete_enabled: boolean;
+ sqllab__is_render_html_enabled: boolean;
explore__data_table_original_formatted_time_columns: Record<string,
string[]>;
dashboard__custom_filter_bar_widths: Record<string, number>;
dashboard__explore_context: Record<string, DashboardContextForExplore>;
