Convert number chart to aggregate chart allowing date aggregates (#15294)

- Convert number chart to aggregate chart 
- Allow date aggregates on all charts
- Only allow `EARLIEST` and `LATEST` on Aggregate chart and Gauge chart
- Various design fixes


https://github.com/user-attachments/assets/b5a2239d-7b11-48b5-93e6-98ceffae5cab
This commit is contained in:
Raphaël Bosi
2025-10-23 18:48:42 +02:00
committed by GitHub
parent 6f45c47435
commit f301f07e43
45 changed files with 205 additions and 151 deletions
@@ -14,7 +14,7 @@ describe('addWidgetToTab', () => {
title: 'Test Widget',
type: WidgetType.GRAPH,
configuration: {
graphType: GraphType.NUMBER,
graphType: GraphType.AGGREGATE,
aggregateOperation: AggregateOperations.COUNT,
aggregateFieldMetadataId: 'id',
displayDataLabel: false,
@@ -22,7 +22,7 @@ describe('convertLayoutsToWidgets', () => {
columnSpan: 2,
},
configuration: {
graphType: GraphType.NUMBER,
graphType: GraphType.AGGREGATE,
aggregateOperation: AggregateOperations.COUNT,
aggregateFieldMetadataId: 'id',
displayDataLabel: false,
@@ -29,7 +29,7 @@ describe('convertPageLayoutToTabLayouts', () => {
title: 'Widget 1',
type: WidgetType.GRAPH,
configuration: {
graphType: GraphType.NUMBER,
graphType: GraphType.AGGREGATE,
aggregateOperation: AggregateOperations.COUNT,
aggregateFieldMetadataId: 'id',
displayDataLabel: false,
@@ -135,11 +135,11 @@ describe('extractFieldMetadataIdsFromWidget', () => {
expect(result).toContain('field-2');
});
it('should extract field IDs from NumberChartConfiguration', () => {
it('should extract field IDs from AggregateChartConfiguration', () => {
const widget = createMockWidget({
configuration: {
__typename: 'NumberChartConfiguration' as const,
graphType: GraphType.NUMBER,
__typename: 'AggregateChartConfiguration' as const,
graphType: GraphType.AGGREGATE,
aggregateFieldMetadataId: 'field-1',
aggregateOperation: AggregateOperations.AVG,
displayDataLabel: false,
@@ -22,7 +22,7 @@ describe('removeWidgetFromTab', () => {
title: 'Widget 1',
type: WidgetType.GRAPH,
configuration: {
graphType: GraphType.NUMBER,
graphType: GraphType.AGGREGATE,
aggregateOperation: AggregateOperations.COUNT,
aggregateFieldMetadataId: 'id',
displayDataLabel: false,
@@ -18,13 +18,13 @@ const createDefaultGraphConfiguration = (
fieldSelection?: GraphWidgetFieldSelection,
): WidgetConfiguration | null => {
switch (graphType) {
case GraphType.NUMBER:
case GraphType.AGGREGATE:
if (!isDefined(fieldSelection?.aggregateFieldMetadataId)) {
return null;
}
return {
__typename: 'NumberChartConfiguration',
graphType: GraphType.NUMBER,
__typename: 'AggregateChartConfiguration',
graphType: GraphType.AGGREGATE,
aggregateFieldMetadataId: fieldSelection.aggregateFieldMetadataId,
aggregateOperation: AggregateOperations.COUNT,
displayDataLabel: true,
@@ -34,7 +34,7 @@ export const extractFieldMetadataIdsFromWidget = (
config.groupByFieldMetadataId,
].filter(isDefined);
case 'NumberChartConfiguration':
case 'AggregateChartConfiguration':
return [config.aggregateFieldMetadataId].filter(isDefined);
case 'GaugeChartConfiguration':
@@ -2,7 +2,7 @@ import { GraphType } from '~/generated-metadata/graphql';
export const getDefaultWidgetData = (graphType: GraphType) => {
switch (graphType) {
case GraphType.NUMBER:
case GraphType.AGGREGATE:
return {
value: '1,234',
trendPercentage: 15.2,
@@ -2,7 +2,7 @@ import { GraphType } from '~/generated/graphql';
export const getWidgetTitle = (graphType: GraphType, index: number): string => {
const baseNames: Record<GraphType, string> = {
[GraphType.NUMBER]: 'Number',
[GraphType.AGGREGATE]: 'Number',
[GraphType.GAUGE]: 'Gauge',
[GraphType.PIE]: 'Pie Chart',
[GraphType.VERTICAL_BAR]: 'Vertical Bar Chart',