mirror of
https://github.com/apache/superset.git
synced 2024-09-12 00:29:39 -04:00
fix(dashboard): Cross filters badge for cols with verbose names (#23576)
This commit is contained in:
parent
61e71bb455
commit
9d2f43d312
@ -23,6 +23,7 @@ import cx from 'classnames';
|
|||||||
import {
|
import {
|
||||||
DataMaskStateWithId,
|
DataMaskStateWithId,
|
||||||
Filters,
|
Filters,
|
||||||
|
JsonObject,
|
||||||
styled,
|
styled,
|
||||||
usePrevious,
|
usePrevious,
|
||||||
} from '@superset-ui/core';
|
} from '@superset-ui/core';
|
||||||
@ -36,12 +37,7 @@ import {
|
|||||||
selectIndicatorsForChart,
|
selectIndicatorsForChart,
|
||||||
selectNativeIndicatorsForChart,
|
selectNativeIndicatorsForChart,
|
||||||
} from '../nativeFilters/selectors';
|
} from '../nativeFilters/selectors';
|
||||||
import {
|
import { Chart, DashboardLayout, RootState } from '../../types';
|
||||||
ChartsState,
|
|
||||||
DashboardInfo,
|
|
||||||
DashboardLayout,
|
|
||||||
RootState,
|
|
||||||
} from '../../types';
|
|
||||||
|
|
||||||
export interface FiltersBadgeProps {
|
export interface FiltersBadgeProps {
|
||||||
chartId: number;
|
chartId: number;
|
||||||
@ -113,10 +109,10 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
const nativeFilters = useSelector<RootState, Filters>(
|
const nativeFilters = useSelector<RootState, Filters>(
|
||||||
state => state.nativeFilters?.filters,
|
state => state.nativeFilters?.filters,
|
||||||
);
|
);
|
||||||
const dashboardInfo = useSelector<RootState, DashboardInfo>(
|
const chartConfiguration = useSelector<RootState, JsonObject>(
|
||||||
state => state.dashboardInfo,
|
state => state.dashboardInfo.metadata?.chart_configuration,
|
||||||
);
|
);
|
||||||
const charts = useSelector<RootState, ChartsState>(state => state.charts);
|
const chart = useSelector<RootState, Chart>(state => state.charts[chartId]);
|
||||||
const present = useSelector<RootState, DashboardLayout>(
|
const present = useSelector<RootState, DashboardLayout>(
|
||||||
state => state.dashboardLayout.present,
|
state => state.dashboardLayout.present,
|
||||||
);
|
);
|
||||||
@ -138,7 +134,6 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
[dispatch],
|
[dispatch],
|
||||||
);
|
);
|
||||||
|
|
||||||
const chart = charts[chartId];
|
|
||||||
const prevChart = usePrevious(chart);
|
const prevChart = usePrevious(chart);
|
||||||
const prevChartStatus = prevChart?.chartStatus;
|
const prevChartStatus = prevChart?.chartStatus;
|
||||||
const prevDashboardFilters = usePrevious(dashboardFilters);
|
const prevDashboardFilters = usePrevious(dashboardFilters);
|
||||||
@ -184,9 +179,7 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
const prevNativeFilters = usePrevious(nativeFilters);
|
const prevNativeFilters = usePrevious(nativeFilters);
|
||||||
const prevDashboardLayout = usePrevious(present);
|
const prevDashboardLayout = usePrevious(present);
|
||||||
const prevDataMask = usePrevious(dataMask);
|
const prevDataMask = usePrevious(dataMask);
|
||||||
const prevChartConfig = usePrevious(
|
const prevChartConfig = usePrevious(chartConfiguration);
|
||||||
dashboardInfo.metadata?.chart_configuration,
|
|
||||||
);
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!showIndicators && nativeIndicators.length > 0) {
|
if (!showIndicators && nativeIndicators.length > 0) {
|
||||||
setNativeIndicators(indicatorsInitialState);
|
setNativeIndicators(indicatorsInitialState);
|
||||||
@ -199,7 +192,7 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
nativeFilters !== prevNativeFilters ||
|
nativeFilters !== prevNativeFilters ||
|
||||||
present !== prevDashboardLayout ||
|
present !== prevDashboardLayout ||
|
||||||
dataMask !== prevDataMask ||
|
dataMask !== prevDataMask ||
|
||||||
prevChartConfig !== dashboardInfo.metadata?.chart_configuration
|
prevChartConfig !== chartConfiguration
|
||||||
) {
|
) {
|
||||||
setNativeIndicators(
|
setNativeIndicators(
|
||||||
selectNativeIndicatorsForChart(
|
selectNativeIndicatorsForChart(
|
||||||
@ -208,8 +201,7 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
chartId,
|
chartId,
|
||||||
chart,
|
chart,
|
||||||
present,
|
present,
|
||||||
dashboardInfo.metadata?.chart_configuration,
|
chartConfiguration,
|
||||||
datasources[chart.form_data.datasource] ?? {},
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@ -217,10 +209,9 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
|
|||||||
}, [
|
}, [
|
||||||
chart,
|
chart,
|
||||||
chartId,
|
chartId,
|
||||||
dashboardInfo.metadata?.chart_configuration,
|
chartConfiguration,
|
||||||
dataMask,
|
dataMask,
|
||||||
nativeFilters,
|
nativeFilters,
|
||||||
datasources,
|
|
||||||
nativeIndicators.length,
|
nativeIndicators.length,
|
||||||
present,
|
present,
|
||||||
prevChart?.queriesResponse,
|
prevChart?.queriesResponse,
|
||||||
|
@ -17,7 +17,12 @@
|
|||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { DataMaskStateWithId, isDefined, JsonObject } from '@superset-ui/core';
|
import {
|
||||||
|
DataMaskStateWithId,
|
||||||
|
getColumnLabel,
|
||||||
|
isDefined,
|
||||||
|
JsonObject,
|
||||||
|
} from '@superset-ui/core';
|
||||||
import { DashboardLayout } from 'src/dashboard/types';
|
import { DashboardLayout } from 'src/dashboard/types';
|
||||||
import { CrossFilterIndicator, getCrossFilterIndicator } from '../../selectors';
|
import { CrossFilterIndicator, getCrossFilterIndicator } from '../../selectors';
|
||||||
|
|
||||||
@ -37,13 +42,15 @@ export const crossFiltersSelector = (props: {
|
|||||||
id,
|
id,
|
||||||
dataMask[id],
|
dataMask[id],
|
||||||
dashboardLayout,
|
dashboardLayout,
|
||||||
verboseMaps[id],
|
|
||||||
);
|
);
|
||||||
if (
|
if (
|
||||||
isDefined(filterIndicator.column) &&
|
isDefined(filterIndicator.column) &&
|
||||||
isDefined(filterIndicator.value)
|
isDefined(filterIndicator.value)
|
||||||
) {
|
) {
|
||||||
return { ...filterIndicator, emitterId: id };
|
const verboseColName =
|
||||||
|
verboseMaps[id]?.[getColumnLabel(filterIndicator.column)] ||
|
||||||
|
filterIndicator.column;
|
||||||
|
return { ...filterIndicator, column: verboseColName, emitterId: id };
|
||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
})
|
})
|
||||||
|
@ -168,7 +168,6 @@ export const getCrossFilterIndicator = (
|
|||||||
chartId: number,
|
chartId: number,
|
||||||
dataMask: DataMask,
|
dataMask: DataMask,
|
||||||
dashboardLayout: DashboardLayout,
|
dashboardLayout: DashboardLayout,
|
||||||
verboseMap: Record<string, string> = {},
|
|
||||||
) => {
|
) => {
|
||||||
const filterState = dataMask?.filterState;
|
const filterState = dataMask?.filterState;
|
||||||
const filters = dataMask?.extraFormData?.filters;
|
const filters = dataMask?.extraFormData?.filters;
|
||||||
@ -181,7 +180,7 @@ export const getCrossFilterIndicator = (
|
|||||||
layoutItem => layoutItem?.meta?.chartId === chartId,
|
layoutItem => layoutItem?.meta?.chartId === chartId,
|
||||||
);
|
);
|
||||||
const filterObject: Indicator = {
|
const filterObject: Indicator = {
|
||||||
column: verboseMap[column] || column,
|
column,
|
||||||
name:
|
name:
|
||||||
dashboardLayoutItem?.meta?.sliceNameOverride ||
|
dashboardLayoutItem?.meta?.sliceNameOverride ||
|
||||||
dashboardLayoutItem?.meta?.sliceName ||
|
dashboardLayoutItem?.meta?.sliceName ||
|
||||||
@ -290,7 +289,6 @@ export const selectChartCrossFilters = (
|
|||||||
chartConfiguration: ChartConfiguration = defaultChartConfig,
|
chartConfiguration: ChartConfiguration = defaultChartConfig,
|
||||||
appliedColumns: Set<string>,
|
appliedColumns: Set<string>,
|
||||||
rejectedColumns: Set<string>,
|
rejectedColumns: Set<string>,
|
||||||
verboseMap?: Record<string, string>,
|
|
||||||
filterEmitter = false,
|
filterEmitter = false,
|
||||||
): Indicator[] | CrossFilterIndicator[] => {
|
): Indicator[] | CrossFilterIndicator[] => {
|
||||||
let crossFilterIndicators: any = [];
|
let crossFilterIndicators: any = [];
|
||||||
@ -312,7 +310,6 @@ export const selectChartCrossFilters = (
|
|||||||
chartConfig.id,
|
chartConfig.id,
|
||||||
dataMask[chartConfig.id],
|
dataMask[chartConfig.id],
|
||||||
dashboardLayout,
|
dashboardLayout,
|
||||||
verboseMap,
|
|
||||||
);
|
);
|
||||||
const filterStatus = getStatus({
|
const filterStatus = getStatus({
|
||||||
label: filterIndicator.value,
|
label: filterIndicator.value,
|
||||||
@ -341,7 +338,6 @@ export const selectNativeIndicatorsForChart = (
|
|||||||
chart: any,
|
chart: any,
|
||||||
dashboardLayout: Layout,
|
dashboardLayout: Layout,
|
||||||
chartConfiguration: ChartConfiguration = defaultChartConfig,
|
chartConfiguration: ChartConfiguration = defaultChartConfig,
|
||||||
datasource: Datasource,
|
|
||||||
): Indicator[] => {
|
): Indicator[] => {
|
||||||
const appliedColumns = getAppliedColumns(chart);
|
const appliedColumns = getAppliedColumns(chart);
|
||||||
const rejectedColumns = getRejectedColumns(chart);
|
const rejectedColumns = getRejectedColumns(chart);
|
||||||
@ -397,7 +393,6 @@ export const selectNativeIndicatorsForChart = (
|
|||||||
chartConfiguration,
|
chartConfiguration,
|
||||||
appliedColumns,
|
appliedColumns,
|
||||||
rejectedColumns,
|
rejectedColumns,
|
||||||
datasource.verbose_map,
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
const indicators = crossFilterIndicators.concat(nativeFilterIndicators);
|
const indicators = crossFilterIndicators.concat(nativeFilterIndicators);
|
||||||
|
Loading…
Reference in New Issue
Block a user