mirror of https://github.com/apache/superset.git
fix(drillby): Enable DrillBy in charts w/o filters (dimensions) (#27941)
This commit is contained in:
parent
4f363e1180
commit
35c8b7a162
|
@ -131,9 +131,9 @@ test('render disabled menu item for unsupported chart', async () => {
|
|||
);
|
||||
});
|
||||
|
||||
test('render disabled menu item for supported chart, no filters', async () => {
|
||||
test('render enabled menu item for supported chart, no filters', async () => {
|
||||
renderMenu({ drillByConfig: { filters: [], groupbyFieldName: 'groupby' } });
|
||||
await expectDrillByDisabled('Drill by is not available for this data point');
|
||||
await expectDrillByEnabled();
|
||||
});
|
||||
|
||||
test('render disabled menu item for supported chart, no columns', async () => {
|
||||
|
|
|
@ -107,9 +107,7 @@ export const DrillByMenuItems = ({
|
|||
setSearchInput('');
|
||||
}, [columns.length]);
|
||||
|
||||
const hasDrillBy =
|
||||
ensureIsArray(drillByConfig?.filters).length &&
|
||||
drillByConfig?.groupbyFieldName;
|
||||
const hasDrillBy = drillByConfig?.groupbyFieldName;
|
||||
|
||||
const handlesDimensionContextMenu = useMemo(
|
||||
() =>
|
||||
|
|
|
@ -34,8 +34,11 @@ export interface DrillByBreadcrumb {
|
|||
filters?: BinaryQueryObjectFilterClause[];
|
||||
}
|
||||
|
||||
const BreadcrumbItem = styled(AntdBreadcrumb.Item)<{ isClickable: boolean }>`
|
||||
${({ theme, isClickable }) => css`
|
||||
const BreadcrumbItem = styled(AntdBreadcrumb.Item)<{
|
||||
isClickable: boolean;
|
||||
isHidden: boolean;
|
||||
}>`
|
||||
${({ theme, isClickable, isHidden }) => css`
|
||||
cursor: ${isClickable ? 'pointer' : 'auto'};
|
||||
color: ${theme.colors.grayscale.light1};
|
||||
transition: color ease-in ${theme.transitionTiming}s;
|
||||
|
@ -45,6 +48,7 @@ const BreadcrumbItem = styled(AntdBreadcrumb.Item)<{ isClickable: boolean }>`
|
|||
&:hover {
|
||||
color: ${isClickable ? theme.colors.grayscale.dark1 : 'inherit'};
|
||||
}
|
||||
visibility: ${isHidden ? 'hidden' : 'visible'};
|
||||
`}
|
||||
`;
|
||||
|
||||
|
@ -58,6 +62,9 @@ export const useDrillByBreadcrumbs = (
|
|||
useMemo(() => {
|
||||
// the last breadcrumb is not clickable
|
||||
const isClickable = (index: number) => index < breadcrumbsData.length - 1;
|
||||
const isHidden = (breadcumb: DrillByBreadcrumb) =>
|
||||
ensureIsArray(breadcumb.groupby).length === 0 &&
|
||||
ensureIsArray(breadcumb.filters).length === 0;
|
||||
const getBreadcrumbText = (breadcrumb: DrillByBreadcrumb) =>
|
||||
`${ensureIsArray(breadcrumb.groupby)
|
||||
.map(column => column.verbose_name || column.column_name)
|
||||
|
@ -74,20 +81,23 @@ export const useDrillByBreadcrumbs = (
|
|||
margin: ${theme.gridUnit * 2}px 0 ${theme.gridUnit * 4}px;
|
||||
`}
|
||||
>
|
||||
{breadcrumbsData.map((breadcrumb, index) => (
|
||||
<BreadcrumbItem
|
||||
key={index}
|
||||
isClickable={isClickable(index)}
|
||||
onClick={
|
||||
isClickable(index)
|
||||
? () => onBreadcrumbClick(breadcrumb, index)
|
||||
: noOp
|
||||
}
|
||||
data-test="drill-by-breadcrumb-item"
|
||||
>
|
||||
{getBreadcrumbText(breadcrumb)}
|
||||
</BreadcrumbItem>
|
||||
))}
|
||||
{breadcrumbsData
|
||||
.map((breadcrumb, index) => (
|
||||
<BreadcrumbItem
|
||||
key={index}
|
||||
isClickable={isClickable(index)}
|
||||
isHidden={isHidden(breadcrumb)}
|
||||
onClick={
|
||||
isClickable(index)
|
||||
? () => onBreadcrumbClick(breadcrumb, index)
|
||||
: noOp
|
||||
}
|
||||
data-test="drill-by-breadcrumb-item"
|
||||
>
|
||||
{getBreadcrumbText(breadcrumb)}
|
||||
</BreadcrumbItem>
|
||||
))
|
||||
.filter(item => item.props.isHidden === false)}
|
||||
</AntdBreadcrumb>
|
||||
);
|
||||
}, [breadcrumbsData, onBreadcrumbClick]);
|
||||
|
|
Loading…
Reference in New Issue