mirror of https://github.com/apache/superset.git
feat(native-filter): Hide native filters (#14784)
* fix:fix get permission function * feat: support showFilters * fix: fix CR notes * fix: fix lint issues
This commit is contained in:
parent
50c5dcbb0a
commit
e43112c5f9
|
@ -27,6 +27,7 @@ import { Row, Col, Grid } from 'antd';
|
|||
import Icon from 'src/components/Icon';
|
||||
import RightMenu from './MenuRight';
|
||||
import { Languages } from './LanguagePicker';
|
||||
import { URL_PARAMS } from '../../constants';
|
||||
|
||||
interface BrandProps {
|
||||
path: string;
|
||||
|
@ -158,7 +159,7 @@ export function Menu({
|
|||
return () => window.removeEventListener('resize', windowResize);
|
||||
}, []);
|
||||
|
||||
const standalone = getUrlParam('standalone', 'boolean');
|
||||
const standalone = getUrlParam(URL_PARAMS.standalone);
|
||||
if (standalone) return <></>;
|
||||
|
||||
const renderSubMenu = ({
|
||||
|
|
|
@ -23,9 +23,19 @@ export const BOOL_TRUE_DISPLAY = 'True';
|
|||
export const BOOL_FALSE_DISPLAY = 'False';
|
||||
|
||||
export const URL_PARAMS = {
|
||||
standalone: 'standalone',
|
||||
preselectFilters: 'preselect_filters',
|
||||
};
|
||||
standalone: {
|
||||
name: 'standalone',
|
||||
type: 'number',
|
||||
},
|
||||
preselectFilters: {
|
||||
name: 'preselect_filters',
|
||||
type: 'object',
|
||||
},
|
||||
showFilters: {
|
||||
name: 'show_filters',
|
||||
type: 'boolean',
|
||||
},
|
||||
} as const;
|
||||
|
||||
/**
|
||||
* Faster debounce delay for inputs without expensive operation.
|
||||
|
|
|
@ -27,7 +27,6 @@ import {
|
|||
import { chart } from 'src/chart/chartReducer';
|
||||
import { initSliceEntities } from 'src/dashboard/reducers/sliceEntities';
|
||||
import { getInitialState as getInitialNativeFilterState } from 'src/dashboard/reducers/nativeFilters';
|
||||
import { getParam } from 'src/modules/utils';
|
||||
import { applyDefaultFormData } from 'src/explore/store';
|
||||
import { buildActiveFilters } from 'src/dashboard/util/activeDashboardFilters';
|
||||
import findPermission, {
|
||||
|
@ -54,6 +53,8 @@ import getFilterConfigsFromFormdata from 'src/dashboard/util/getFilterConfigsFro
|
|||
import getLocationHash from 'src/dashboard/util/getLocationHash';
|
||||
import newComponentFactory from 'src/dashboard/util/newComponentFactory';
|
||||
import { TIME_RANGE } from 'src/visualizations/FilterBox/FilterBox';
|
||||
import { URL_PARAMS } from 'src/constants';
|
||||
import { getUrlParam } from 'src/utils/urlUtils';
|
||||
import { FeatureFlag, isFeatureEnabled } from '../../featureFlags';
|
||||
import extractUrlParams from '../util/extractUrlParams';
|
||||
|
||||
|
@ -77,9 +78,9 @@ export const hydrateDashboard = (dashboardData, chartData, datasourcesData) => (
|
|||
});
|
||||
try {
|
||||
// allow request parameter overwrite dashboard metadata
|
||||
preselectFilters = JSON.parse(
|
||||
getParam('preselect_filters') || metadata.default_filters,
|
||||
);
|
||||
preselectFilters =
|
||||
getUrlParam(URL_PARAMS.preselectFilters) ||
|
||||
JSON.parse(metadata.default_filters);
|
||||
} catch (e) {
|
||||
//
|
||||
}
|
||||
|
|
|
@ -120,7 +120,9 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
|
|||
isFeatureEnabled(FeatureFlag.DASHBOARD_NATIVE_FILTERS) &&
|
||||
(canEdit || (!canEdit && filterValues.length !== 0));
|
||||
|
||||
const [dashboardFiltersOpen, setDashboardFiltersOpen] = useState(true);
|
||||
const [dashboardFiltersOpen, setDashboardFiltersOpen] = useState(
|
||||
getUrlParam(URL_PARAMS.showFilters) ?? true,
|
||||
);
|
||||
|
||||
const toggleDashboardFiltersOpen = (visible?: boolean) => {
|
||||
setDashboardFiltersOpen(visible ?? !dashboardFiltersOpen);
|
||||
|
@ -152,7 +154,7 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
|
|||
: undefined;
|
||||
|
||||
const hideDashboardHeader =
|
||||
getUrlParam(URL_PARAMS.standalone, 'number') ===
|
||||
getUrlParam(URL_PARAMS.standalone) ===
|
||||
DashboardStandaloneMode.HIDE_NAV_AND_TITLE;
|
||||
|
||||
const barTopOffset =
|
||||
|
|
|
@ -168,7 +168,7 @@ class HeaderActionsDropdown extends React.PureComponent {
|
|||
window.location.pathname,
|
||||
getActiveFilters(),
|
||||
window.location.hash,
|
||||
getUrlParam(URL_PARAMS.standalone, 'number'),
|
||||
getUrlParam(URL_PARAMS.standalone),
|
||||
);
|
||||
window.location.replace(url);
|
||||
break;
|
||||
|
|
|
@ -30,12 +30,12 @@ export default function getDashboardUrl(
|
|||
// convert flattened { [id_column]: values } object
|
||||
// to nested filter object
|
||||
newSearchParams.set(
|
||||
URL_PARAMS.preselectFilters,
|
||||
URL_PARAMS.preselectFilters.name,
|
||||
JSON.stringify(serializeActiveFilterValues(filters)),
|
||||
);
|
||||
|
||||
if (standalone) {
|
||||
newSearchParams.set(URL_PARAMS.standalone, standalone.toString());
|
||||
newSearchParams.set(URL_PARAMS.standalone.name, standalone.toString());
|
||||
}
|
||||
|
||||
const hashSection = hash ? `#${hash}` : '';
|
||||
|
|
|
@ -69,7 +69,7 @@ export default class EmbedCodeButton extends React.Component {
|
|||
generateEmbedHTML() {
|
||||
const srcLink = `${window.location.origin + getURIDirectory()}?r=${
|
||||
this.state.shortUrlId
|
||||
}&${URL_PARAMS.standalone}=1&height=${this.state.height}`;
|
||||
}&${URL_PARAMS.standalone.name}=1&height=${this.state.height}`;
|
||||
return (
|
||||
'<iframe\n' +
|
||||
` width="${this.state.width}"\n` +
|
||||
|
|
|
@ -191,7 +191,7 @@ function ExploreViewContainer(props) {
|
|||
const payload = { ...props.form_data };
|
||||
const longUrl = getExploreLongUrl(
|
||||
props.form_data,
|
||||
props.standalone ? URL_PARAMS.standalone : null,
|
||||
props.standalone ? URL_PARAMS.standalone.name : null,
|
||||
false,
|
||||
);
|
||||
try {
|
||||
|
|
|
@ -103,7 +103,7 @@ export function getExploreLongUrl(
|
|||
search[key] = extraSearch[key];
|
||||
});
|
||||
search.form_data = safeStringify(formData);
|
||||
if (endpointType === URL_PARAMS.standalone) {
|
||||
if (endpointType === URL_PARAMS.standalone.name) {
|
||||
search.standalone = DashboardStandaloneMode.HIDE_NAV;
|
||||
}
|
||||
const url = uri.directory(directory).search(search).toString();
|
||||
|
@ -176,7 +176,7 @@ export function getExploreUrl({
|
|||
if (endpointType === 'csv') {
|
||||
search.csv = 'true';
|
||||
}
|
||||
if (endpointType === URL_PARAMS.standalone) {
|
||||
if (endpointType === URL_PARAMS.standalone.name) {
|
||||
search.standalone = '1';
|
||||
}
|
||||
if (endpointType === 'query') {
|
||||
|
|
|
@ -26,16 +26,6 @@ export function getDatasourceParameter(datasourceId, datasourceType) {
|
|||
return `${datasourceId}__${datasourceType}`;
|
||||
}
|
||||
|
||||
export function getParam(name) {
|
||||
/* eslint no-useless-escape: 0 */
|
||||
const formattedName = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
|
||||
const regex = new RegExp(`[\\?&]${formattedName}=([^&#]*)`);
|
||||
const results = regex.exec(window.location.search);
|
||||
return results === null
|
||||
? ''
|
||||
: decodeURIComponent(results[1].replace(/\+/g, ' '));
|
||||
}
|
||||
|
||||
export function mainMetric(savedMetrics) {
|
||||
// Using 'count' as default metric if it exists, otherwise using whatever one shows up first
|
||||
let metric;
|
||||
|
|
|
@ -18,13 +18,16 @@
|
|||
*/
|
||||
import { SupersetClient } from '@superset-ui/core';
|
||||
import { getClientErrorObject } from './getClientErrorObject';
|
||||
import { URL_PARAMS } from '../constants';
|
||||
|
||||
export type UrlParamType = 'string' | 'number' | 'boolean';
|
||||
export function getUrlParam(paramName: string, type: 'string'): string;
|
||||
export function getUrlParam(paramName: string, type: 'number'): number;
|
||||
export function getUrlParam(paramName: string, type: 'boolean'): boolean;
|
||||
export function getUrlParam(paramName: string, type: UrlParamType): unknown {
|
||||
const urlParam = new URLSearchParams(window.location.search).get(paramName);
|
||||
export type UrlParamType = 'string' | 'number' | 'boolean' | 'object';
|
||||
export type UrlParam = typeof URL_PARAMS[keyof typeof URL_PARAMS];
|
||||
export function getUrlParam(param: UrlParam & { type: 'string' }): string;
|
||||
export function getUrlParam(param: UrlParam & { type: 'number' }): number;
|
||||
export function getUrlParam(param: UrlParam & { type: 'boolean' }): boolean;
|
||||
export function getUrlParam(param: UrlParam & { type: 'object' }): object;
|
||||
export function getUrlParam({ name, type }: UrlParam): unknown {
|
||||
const urlParam = new URLSearchParams(window.location.search).get(name);
|
||||
switch (type) {
|
||||
case 'number':
|
||||
if (!urlParam) {
|
||||
|
@ -40,6 +43,11 @@ export function getUrlParam(paramName: string, type: UrlParamType): unknown {
|
|||
return Number(urlParam);
|
||||
}
|
||||
return null;
|
||||
case 'object':
|
||||
if (!urlParam) {
|
||||
return null;
|
||||
}
|
||||
return JSON.parse(urlParam);
|
||||
case 'boolean':
|
||||
if (!urlParam) {
|
||||
return null;
|
||||
|
|
Loading…
Reference in New Issue