From 615a261f57f098409edfb10286e3445faf2e0ec9 Mon Sep 17 00:00:00 2001 From: Nate Kelley Date: Tue, 23 Sep 2025 16:27:40 -0600 Subject: [PATCH 1/2] set default quarter --- .../core/plugins/chartjs-plugin-dayjs.ts | 3 +- .../stories/BusterChart.LineChart.stories.tsx | 284 ++++++++++++++++++ apps/web/src/lib/columnFormatter.ts | 1 - apps/web/src/lib/date.ts | 2 - .../src/metrics/charts/chatConfig.defaults.ts | 2 +- 5 files changed, 287 insertions(+), 5 deletions(-) diff --git a/apps/web/src/components/ui/charts/BusterChartJS/core/plugins/chartjs-plugin-dayjs.ts b/apps/web/src/components/ui/charts/BusterChartJS/core/plugins/chartjs-plugin-dayjs.ts index 16089361c..6a5fbcc86 100644 --- a/apps/web/src/components/ui/charts/BusterChartJS/core/plugins/chartjs-plugin-dayjs.ts +++ b/apps/web/src/components/ui/charts/BusterChartJS/core/plugins/chartjs-plugin-dayjs.ts @@ -1,3 +1,4 @@ +import { DEFAULT_DATE_FORMAT_QUARTER } from '@buster/server-shared/metrics'; import type { TimeUnit } from 'chart.js'; import { _adapters } from 'chart.js'; import dayjs, { type QUnitType } from 'dayjs'; @@ -31,7 +32,7 @@ const FORMATS = { day: 'MMM D', week: 'll', month: 'MMM YYYY', - quarter: '[Q]Q - YYYY', + quarter: '[Q]Q YYYY', year: 'YYYY', }; diff --git a/apps/web/src/components/ui/charts/stories/BusterChart.LineChart.stories.tsx b/apps/web/src/components/ui/charts/stories/BusterChart.LineChart.stories.tsx index 1f9731436..0796252b9 100644 --- a/apps/web/src/components/ui/charts/stories/BusterChart.LineChart.stories.tsx +++ b/apps/web/src/components/ui/charts/stories/BusterChart.LineChart.stories.tsx @@ -2346,3 +2346,287 @@ export const ProblematicChartWithBrokenChart: Story = { columnMetadata: columnMetadataForBrokenChart, }, }; + +export const WithQuarterAndYearXAxis: Story = { + args: { + selectedChartType: 'line', + barAndLineAxis: { + x: ['quarter', 'year'], + y: ['high_margin_revenue', 'low_margin_revenue'], + tooltip: null, + category: [], + }, + columnMetadata: [ + { + name: 'year', + min_value: 2022, + max_value: 2025, + unique_values: 4, + simple_type: 'number', + type: 'numeric', + }, + { + name: 'quarter', + min_value: 1, + max_value: 4, + unique_values: 4, + simple_type: 'number', + type: 'numeric', + }, + { + name: 'high_margin_units', + min_value: 452, + max_value: 23956, + unique_values: 13, + simple_type: 'number', + type: 'int8', + }, + { + name: 'low_margin_units', + min_value: 1634, + max_value: 14333, + unique_values: 13, + simple_type: 'number', + type: 'int8', + }, + { + name: 'high_margin_revenue', + min_value: 6319.35175, + max_value: 696385.260972, + unique_values: 13, + simple_type: 'number', + type: 'numeric', + }, + { + name: 'low_margin_revenue', + min_value: 1130044.903964, + max_value: 7872064.032748, + unique_values: 13, + simple_type: 'number', + type: 'numeric', + }, + ], + data: [ + { + year: 2022, + quarter: 3, + high_margin_units: 452, + low_margin_units: 1634, + high_margin_revenue: 6319.35175, + low_margin_revenue: 1130044.903964, + }, + { + year: 2022, + quarter: 4, + high_margin_units: 857, + low_margin_units: 3420, + high_margin_revenue: 12467.60825, + low_margin_revenue: 2891214.733164, + }, + { + year: 2023, + quarter: 1, + high_margin_units: 606, + low_margin_units: 3500, + high_margin_revenue: 8447.367008, + low_margin_revenue: 3327851.657924, + }, + { + year: 2023, + quarter: 2, + high_margin_units: 786, + low_margin_units: 3787, + high_margin_revenue: 11298.669564, + low_margin_revenue: 3484714.338052, + }, + { + year: 2023, + quarter: 3, + high_margin_units: 8552, + low_margin_units: 8727, + high_margin_revenue: 417365.895535, + low_margin_revenue: 5283449.213474, + }, + { + year: 2023, + quarter: 4, + high_margin_units: 9815, + low_margin_units: 8701, + high_margin_revenue: 485417.965839, + low_margin_revenue: 4944753.908742, + }, + { + year: 2024, + quarter: 1, + high_margin_units: 5680, + low_margin_units: 6534, + high_margin_revenue: 256512.303963, + low_margin_revenue: 3988084.369999, + }, + { + year: 2024, + quarter: 2, + high_margin_units: 7161, + low_margin_units: 7274, + high_margin_revenue: 331482.347283, + low_margin_revenue: 4282932.212568, + }, + { + year: 2024, + quarter: 3, + high_margin_units: 15765, + low_margin_units: 12357, + high_margin_revenue: 530755.704548, + low_margin_revenue: 6157508.203938, + }, + { + year: 2024, + quarter: 4, + high_margin_units: 23956, + low_margin_units: 14333, + high_margin_revenue: 696385.260972, + low_margin_revenue: 7413756.636498, + }, + { + year: 2025, + quarter: 1, + high_margin_units: 18953, + low_margin_units: 11676, + high_margin_revenue: 515127.214716, + low_margin_revenue: 7355026.222311, + }, + { + year: 2025, + quarter: 2, + high_margin_units: 20669, + low_margin_units: 12674, + high_margin_revenue: 566536.999903, + low_margin_revenue: 7872064.032748, + }, + { + year: 2025, + quarter: 3, + high_margin_units: 13273, + low_margin_units: 6310, + high_margin_revenue: 345994.655997, + low_margin_revenue: 3927753.259141, + }, + ], + columnLabelFormats: { + year: { + isUTC: false, + style: 'number', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: '', + compactNumbers: false, + convertNumberTo: null, + useRelativeTime: false, + numberSeparatorStyle: null, + maximumFractionDigits: 2, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + quarter: { + isUTC: false, + style: 'date', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: '', + compactNumbers: false, + convertNumberTo: 'quarter', + useRelativeTime: false, + numberSeparatorStyle: null, + maximumFractionDigits: 2, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + low_margin_units: { + isUTC: false, + style: 'number', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: 'Low Margin Units', + compactNumbers: true, + convertNumberTo: null, + useRelativeTime: false, + numberSeparatorStyle: ',', + maximumFractionDigits: 2, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + high_margin_units: { + isUTC: false, + style: 'number', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: 'High Margin Units', + compactNumbers: true, + convertNumberTo: null, + useRelativeTime: false, + numberSeparatorStyle: ',', + maximumFractionDigits: 2, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + low_margin_revenue: { + isUTC: false, + style: 'currency', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: 'Low Margin Revenue', + compactNumbers: true, + convertNumberTo: null, + useRelativeTime: false, + numberSeparatorStyle: ',', + maximumFractionDigits: 0, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + high_margin_revenue: { + isUTC: false, + style: 'currency', + prefix: '', + suffix: '', + currency: 'USD', + columnType: 'number', + dateFormat: 'auto', + multiplier: 1, + displayName: 'High Margin Revenue', + compactNumbers: true, + convertNumberTo: null, + useRelativeTime: false, + numberSeparatorStyle: ',', + maximumFractionDigits: 0, + minimumFractionDigits: 0, + makeLabelHumanReadable: true, + replaceMissingDataWith: 0, + }, + }, + }, +}; diff --git a/apps/web/src/lib/columnFormatter.ts b/apps/web/src/lib/columnFormatter.ts index c2bf26a5d..a4ae990f3 100644 --- a/apps/web/src/lib/columnFormatter.ts +++ b/apps/web/src/lib/columnFormatter.ts @@ -133,7 +133,6 @@ const formatLabelDate = ( isUTC = false, convertNumberTo, } = props; - const dateFormat = dateFormatProp === 'auto' ? autoFormats(convertNumberTo) : dateFormatProp; return formatDate({ diff --git a/apps/web/src/lib/date.ts b/apps/web/src/lib/date.ts index b5a5473df..fb8e0b3cb 100644 --- a/apps/web/src/lib/date.ts +++ b/apps/web/src/lib/date.ts @@ -15,8 +15,6 @@ import isDate from 'lodash/isDate'; import lodashIsNaN from 'lodash/isNaN'; import isNumber from 'lodash/isNumber'; import isString from 'lodash/isString'; -import { SupportedLanguages } from '@/config/languages'; -import { getBrowserLanguage } from './language'; import { isNumeric } from './numbers'; dayjs.extend(relativeTime); diff --git a/packages/server-shared/src/metrics/charts/chatConfig.defaults.ts b/packages/server-shared/src/metrics/charts/chatConfig.defaults.ts index 701ed4139..0d7568eed 100644 --- a/packages/server-shared/src/metrics/charts/chatConfig.defaults.ts +++ b/packages/server-shared/src/metrics/charts/chatConfig.defaults.ts @@ -7,7 +7,7 @@ export const MIN_DONUT_WIDTH = 15; export const DEFAULT_DAY_OF_WEEK_FORMAT = 'ddd'; export const DEFAULT_DATE_FORMAT_DAY_OF_WEEK = 'dddd'; export const DEFAULT_DATE_FORMAT_MONTH_OF_YEAR = 'MMMM'; -export const DEFAULT_DATE_FORMAT_QUARTER = 'YYYY [Q]Q'; +export const DEFAULT_DATE_FORMAT_QUARTER = '[Q]Q'; export const ENABLED_DOTS_ON_LINE_SIZE = 4; export const DEFAULT_COLUMN_METADATA: ColumnMetaData[] = []; From 5b65bb04d98a5f8201c06a12a60c1bea1590100b Mon Sep 17 00:00:00 2001 From: Nate Kelley Date: Tue, 23 Sep 2025 16:30:09 -0600 Subject: [PATCH 2/2] Update columnFormatter.test.ts --- apps/web/src/lib/columnFormatter.test.ts | 7 ------- 1 file changed, 7 deletions(-) diff --git a/apps/web/src/lib/columnFormatter.test.ts b/apps/web/src/lib/columnFormatter.test.ts index 42a6f7199..aae74c46f 100644 --- a/apps/web/src/lib/columnFormatter.test.ts +++ b/apps/web/src/lib/columnFormatter.test.ts @@ -322,13 +322,6 @@ describe('formatLabel', () => { convertNumberTo: 'day_of_week', }) ).toMatch(/Monday/); - expect( - formatLabel(1, { - columnType: 'date', - style: 'date', - convertNumberTo: 'quarter', - }) - ).toMatch(`${currentYear} QQ`); }); it('should handle null/undefined dates', () => {