feat: configure number of column values in pivot table

Author: nextchamp-saqib

frontend/src2/charts/chart.ts

@@ -220,6 +220,7 @@ function makeChart(workbookChart: WorkbookChart) {
 		let rows = config.rows.filter((r) => r.column_name)
 		let columns = config.columns.filter((c) => c.column_name)
 		let values = config.values.filter((v) => v.measure_name)
+		values = values.length ? values : [count()]
 
 		if (!rows.length) {
 			console.warn('Rows are required')
@@ -237,7 +238,8 @@ function makeChart(workbookChart: WorkbookChart) {
 			chart.dataQuery.addPivotWider({
 				rows: rows,
 				columns: columns,
-				values: values || [count()],
+				values: values,
+				max_column_values: config.max_column_values || 10,
 			})
 		}
 

frontend/src2/charts/components/DimensionPicker.vue

@@ -98,6 +98,8 @@ function selectDimension(option?: DimensionOption) {
 						/>
 					</InlineFormControlLabel>
 
+					<slot name="config-fields" />
+
 					<div class="flex gap-1">
 						<Button class="w-full" @click="emit('remove')" theme="red">
 							<template #prefix>

frontend/src2/charts/components/TableChartConfigForm.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { watchEffect } from 'vue'
 import DraggableList from '../../components/DraggableList.vue'
+import InlineFormControlLabel from '../../components/InlineFormControlLabel.vue'
 import { TableChartConfig } from '../../types/chart.types'
 import { ColumnOption, DimensionOption } from '../../types/query.types'
 import CollapsibleSection from './CollapsibleSection.vue'
@@ -56,23 +57,34 @@ watchEffect(() => {
 	</CollapsibleSection>
 
 	<CollapsibleSection title="Columns">
-		<div>
-			<DraggableList v-model:items="config.columns" group="columns">
-				<template #item="{ item, index }">
-					<DimensionPicker
-						:options="props.dimensions"
-						:model-value="item"
-						@update:model-value="Object.assign(item, $event || {})"
-						@remove="config.columns.splice(index, 1)"
-					/>
-				</template>
-			</DraggableList>
-			<button
-				class="mt-1.5 text-left text-xs text-gray-600 hover:underline"
-				@click="config.columns.push({} as any)"
-			>
-				+ Add column
-			</button>
+		<div class="flex flex-col gap-3">
+			<div>
+				<DraggableList v-model:items="config.columns" group="columns">
+					<template #item="{ item, index }">
+						<DimensionPicker
+							:options="props.dimensions"
+							:model-value="item"
+							@update:model-value="Object.assign(item, $event || {})"
+							@remove="config.columns.splice(index, 1)"
+						/>
+					</template>
+				</DraggableList>
+				<button
+					class="mt-1.5 text-left text-xs text-gray-600 hover:underline"
+					@click="config.columns.push({} as any)"
+				>
+					+ Add column
+				</button>
+			</div>
+
+			<InlineFormControlLabel class="!w-1/2" label="Max Column Values">
+				<FormControl
+					type="number"
+					autocomplete="off"
+					:modelValue="config.max_column_values || 10"
+					@update:modelValue="config.max_column_values = $event"
+				/>
+			</InlineFormControlLabel>
 		</div>
 	</CollapsibleSection>
 

frontend/src2/types/chart.types.ts

@@ -100,6 +100,7 @@ export type TableChartConfig = {
 	rows: Dimension[]
 	columns: Dimension[]
 	values: Measure[]
+	max_column_values?: number
 	show_filter_row?: boolean
 	show_row_totals?: boolean
 	show_column_totals?: boolean

frontend/src2/types/query.types.ts

@@ -137,6 +137,7 @@ export type PivotWiderArgs = {
 	rows: Dimension[]
 	columns: Dimension[]
 	values: Measure[]
+	max_column_values?: number
 }
 export type PivotWider = { type: 'pivot_wider' } & PivotWiderArgs
 

insights/insights/doctype/insights_data_source_v3/ibis_utils.py

@@ -402,11 +402,14 @@ def apply_pivot(self, pivot_args, pivot_type):
                 )
 
             names_from = [col.get_name() for col in columns]
+            max_names = pivot_args.get("max_column_values", 10)
+            max_names = int(max_names)
+            max_names = max(1, min(max_names, 100))
             names = (
                 self.query.select(names_from)
                 .order_by(names_from)
                 .distinct()
-                .limit(10)
+                .limit(max_names)
                 .execute()
             )
             names = names.fillna("null").values