fix: clean out the panel type change attribute dependency (#5648)

* fix: clean out the panel type change attribute dependency

* fix: clean out the updater function as well

* fix: issue with rendering list panel as first and then moving around
This commit is contained in:
Vikrant Gupta 2024-08-11 16:46:18 +05:30 committed by GitHub
parent 0157b47424
commit 187927403a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -8,7 +8,7 @@ import {
listViewInitialTraceQuery, listViewInitialTraceQuery,
PANEL_TYPES_INITIAL_QUERY, PANEL_TYPES_INITIAL_QUERY,
} from 'container/NewDashboard/ComponentsSlider/constants'; } from 'container/NewDashboard/ComponentsSlider/constants';
import { isEqual, set, unset } from 'lodash-es'; import { cloneDeep, isEqual, set, unset } from 'lodash-es';
import { Widgets } from 'types/api/dashboard/getAll'; import { Widgets } from 'types/api/dashboard/getAll';
import { IBuilderQuery, Query } from 'types/api/queryBuilder/queryBuilderData'; import { IBuilderQuery, Query } from 'types/api/queryBuilder/queryBuilderData';
import { DataSource } from 'types/common/queryBuilder'; import { DataSource } from 'types/common/queryBuilder';
@ -43,54 +43,59 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'functions',
'queryName', 'stepInterval',
'expression',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'stepInterval',
'spaceAggregation',
'queryName',
'expression',
'disabled',
'legend', 'legend',
'queryName',
'disabled',
'functions',
'expression',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'queryName', 'functions',
'expression', 'stepInterval',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
@ -99,54 +104,59 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'functions',
'queryName', 'stepInterval',
'expression',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'stepInterval',
'spaceAggregation',
'queryName',
'expression',
'disabled',
'legend', 'legend',
'queryName',
'disabled',
'functions',
'expression',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'queryName', 'functions',
'expression', 'stepInterval',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
@ -155,48 +165,59 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'functions',
'stepInterval',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'stepInterval',
'spaceAggregation',
'disabled',
'legend', 'legend',
'queryName',
'disabled',
'functions',
'expression',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions',
'stepInterval',
'disabled', 'disabled',
'queryName',
'legend', 'legend',
'expression',
], ],
}, },
}, },
@ -205,18 +226,18 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'functions',
'stepInterval',
'disabled',
'queryName', 'queryName',
'expression', 'expression',
'disabled',
'reduceTo',
'legend', 'legend',
], ],
}, },
@ -224,37 +245,40 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'groupBy', 'groupBy',
'reduceTo',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'stepInterval',
'spaceAggregation', 'legend',
'queryName', 'queryName',
'expression', 'expression',
'disabled', 'disabled',
'reduceTo', 'functions',
'legend',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions',
'stepInterval',
'disabled',
'queryName', 'queryName',
'expression', 'expression',
'disabled',
'reduceTo',
'legend', 'legend',
], ],
}, },
@ -264,18 +288,18 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'reduceTo',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'functions',
'stepInterval',
'disabled',
'queryName', 'queryName',
'expression', 'expression',
'disabled',
'legend', 'legend',
], ],
}, },
@ -283,37 +307,40 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'groupBy', 'groupBy',
'reduceTo', 'reduceTo',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions', 'stepInterval',
'spaceAggregation', 'legend',
'queryName', 'queryName',
'expression', 'expression',
'disabled', 'disabled',
'legend', 'functions',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'groupBy', 'groupBy',
'reduceTo',
'limit', 'limit',
'having', 'having',
'orderBy', 'orderBy',
'functions',
'stepInterval',
'disabled',
'queryName', 'queryName',
'expression', 'expression',
'disabled',
'legend', 'legend',
], ],
}, },
@ -322,7 +349,7 @@ export const panelTypeDataSourceFormValuesMap: Record<
[PANEL_TYPES.LIST]: { [PANEL_TYPES.LIST]: {
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: ['filters', 'limit', 'orderBy'], queryData: ['filters', 'limit', 'orderBy', 'functions'],
}, },
}, },
[DataSource.METRICS]: { [DataSource.METRICS]: {
@ -332,7 +359,7 @@ export const panelTypeDataSourceFormValuesMap: Record<
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: ['filters', 'limit', 'orderBy'], queryData: ['filters', 'limit', 'orderBy', 'functions'],
}, },
}, },
}, },
@ -340,12 +367,13 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.LOGS]: { [DataSource.LOGS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'filters',
'reduceTo', 'reduceTo',
'having', 'having',
'functions', 'functions',
'stepInterval',
'queryName', 'queryName',
'expression', 'expression',
'disabled', 'disabled',
@ -356,30 +384,32 @@ export const panelTypeDataSourceFormValuesMap: Record<
[DataSource.METRICS]: { [DataSource.METRICS]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'aggregateOperator',
'timeAggregation',
'filters',
'spaceAggregation',
'having', 'having',
'reduceTo', 'reduceTo',
'functions', 'stepInterval',
'spaceAggregation', 'legend',
'queryName', 'queryName',
'expression', 'expression',
'disabled', 'disabled',
'legend', 'functions',
], ],
}, },
}, },
[DataSource.TRACES]: { [DataSource.TRACES]: {
builder: { builder: {
queryData: [ queryData: [
'filters',
'aggregateOperator',
'aggregateAttribute', 'aggregateAttribute',
'groupBy', 'aggregateOperator',
'limit', 'filters',
'reduceTo',
'having', 'having',
'orderBy', 'functions',
'stepInterval',
'queryName', 'queryName',
'expression', 'expression',
'disabled', 'disabled',
@ -399,12 +429,8 @@ export function handleQueryChange(
builder: { builder: {
...supersetQuery.builder, ...supersetQuery.builder,
queryData: supersetQuery.builder.queryData.map((query, index) => { queryData: supersetQuery.builder.queryData.map((query, index) => {
const { dataSource, expression, queryName } = query; const { dataSource } = query;
const tempQuery = { const tempQuery = cloneDeep(initialQueryBuilderFormValuesMap[dataSource]);
...initialQueryBuilderFormValuesMap[dataSource],
expression,
queryName,
};
const fieldsToSelect = const fieldsToSelect =
panelTypeDataSourceFormValuesMap[newPanelType][dataSource].builder panelTypeDataSourceFormValuesMap[newPanelType][dataSource].builder
@ -419,6 +445,8 @@ export function handleQueryChange(
set(tempQuery, 'offset', 0); set(tempQuery, 'offset', 0);
set(tempQuery, 'pageSize', 10); set(tempQuery, 'pageSize', 10);
} else if (tempQuery.aggregateOperator === 'noop') { } else if (tempQuery.aggregateOperator === 'noop') {
// this condition takes care of the part where we start with the list panel type and then shift to other panels
// because in other cases we never set list operator and other fields in superset query rather just update in the current / staged query
set(tempQuery, 'aggregateOperator', 'count'); set(tempQuery, 'aggregateOperator', 'count');
unset(tempQuery, 'offset'); unset(tempQuery, 'offset');
unset(tempQuery, 'pageSize'); unset(tempQuery, 'pageSize');