suddjian commented on a change in pull request #15424:
URL: https://github.com/apache/superset/pull/15424#discussion_r660068657
##########
File path: superset-frontend/src/dashboard/components/FiltersBadge/index.tsx
##########
@@ -16,29 +16,132 @@
* specific language governing permissions and limitations
* under the License.
*/
-import React from 'react';
+import React, { useCallback, useMemo } from 'react';
import cx from 'classnames';
import Icon from 'src/components/Icon';
import Icons from 'src/components/Icons';
+import { uniqWith } from 'lodash';
+import { useDispatch, useSelector } from 'react-redux';
import DetailsPanelPopover from './DetailsPanel';
import { Pill } from './Styles';
-import { Indicator } from './selectors';
+import {
+ Indicator,
+ IndicatorStatus,
+ selectIndicatorsForChart,
+ selectNativeIndicatorsForChart,
+} from './selectors';
+import { setDirectPathToChild } from '../../actions/dashboardState';
+import {
+ ChartsState,
+ DashboardInfo,
+ DashboardLayout,
+ RootState,
+} from '../../types';
+import { Filters } from '../../reducers/types';
+import { DataMaskStateWithId } from '../../../dataMask/types';
export interface FiltersBadgeProps {
- appliedCrossFilterIndicators: Indicator[];
- appliedIndicators: Indicator[];
- unsetIndicators: Indicator[];
- incompatibleIndicators: Indicator[];
- onHighlightFilterSource: (path: string[]) => void;
+ chartId: number;
}
-const FiltersBadge = ({
- appliedCrossFilterIndicators,
- appliedIndicators,
- unsetIndicators,
- incompatibleIndicators,
- onHighlightFilterSource,
-}: FiltersBadgeProps) => {
+const sortByStatus = (indicators: Indicator[]): Indicator[] => {
+ const statuses = [
+ IndicatorStatus.Applied,
+ IndicatorStatus.Unset,
+ IndicatorStatus.Incompatible,
+ ];
+ return indicators.sort(
+ (a, b) =>
+ statuses.indexOf(a.status as IndicatorStatus) -
+ statuses.indexOf(b.status as IndicatorStatus),
+ );
+};
+
+export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
+ const dispatch = useDispatch();
+ const datasources = useSelector<RootState, any>(state => state.datasources);
+ const dashboardFilters = useSelector<RootState, any>(
+ state => state.dashboardFilters,
+ );
+ const nativeFilters = useSelector<RootState, Filters>(
+ state => state.nativeFilters?.filters,
+ );
+ const dashboardInfo = useSelector<RootState, DashboardInfo>(
+ state => state.dashboardInfo,
+ );
+ const charts = useSelector<RootState, ChartsState>(state => state.charts);
+ const present = useSelector<RootState, DashboardLayout>(
+ state => state.dashboardLayout.present,
+ );
+ const dataMask = useSelector<RootState, DataMaskStateWithId>(
+ state => state.dataMask,
+ );
+
+ const onHighlightFilterSource = useCallback(
+ (path: string[]) => {
+ dispatch(setDirectPathToChild(path));
+ },
+ [dispatch],
+ );
+
+ const chart = charts[chartId];
+ const dashboardIndicators = useMemo(
+ () =>
+ selectIndicatorsForChart(chartId, dashboardFilters, datasources, chart),
+ [
+ chartId,
+ JSON.stringify(chart),
Review comment:
Interesting dependency trick! Do we need to suppress linter warnings
here?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
