From 7b2ef1e8ea71a975b4ecbe8ef414817736746e3e Mon Sep 17 00:00:00 2001 From: Patrick Browne Date: Thu, 3 Nov 2022 13:37:20 +0100 Subject: [PATCH 1/2] fix: Order for sorting is position / identifier --- app/utils/sorting-values.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/utils/sorting-values.ts b/app/utils/sorting-values.ts index a9d46cca0..7376ec788 100644 --- a/app/utils/sorting-values.ts +++ b/app/utils/sorting-values.ts @@ -56,7 +56,7 @@ export const makeDimensionValueSorters = ( dv: DimensionValue["label"] ) => string | undefined | number)[] = []; - const defaultSorters = [getIdentifier, getPosition, getLabel]; + const defaultSorters = [getPosition, getIdentifier, getLabel]; switch (sortingType) { case "byDimensionLabel": @@ -69,7 +69,7 @@ export const makeDimensionValueSorters = ( sorters = [getMeasure]; break; case "byAuto": - sorters = [getIdentifier, getPosition]; + sorters = [getPosition, getIdentifier]; break; default: sorters = defaultSorters; From f56f925e046c4cf0bfa3f4f8a04206f8e3d613f4 Mon Sep 17 00:00:00 2001 From: Patrick Browne Date: Thu, 3 Nov 2022 16:06:35 +0100 Subject: [PATCH 2/2] fix: Use sorting order correctly even if there are multiple ones --- app/charts/area/areas-state.tsx | 8 +++++--- app/charts/column/columns-grouped-state.tsx | 11 +++++------ app/charts/column/columns-stacked-state.tsx | 12 ++++++------ app/charts/pie/pie-state.tsx | 11 +++++++---- app/utils/sorting-values.ts | 9 +++++++++ 5 files changed, 32 insertions(+), 19 deletions(-) diff --git a/app/charts/area/areas-state.tsx b/app/charts/area/areas-state.tsx index e386c6384..2c3535097 100644 --- a/app/charts/area/areas-state.tsx +++ b/app/charts/area/areas-state.tsx @@ -50,7 +50,10 @@ import { import { getPalette } from "@/palettes"; import { sortByIndex } from "@/utils/array"; import { estimateTextWidth } from "@/utils/estimate-text-width"; -import { makeDimensionValueSorters } from "@/utils/sorting-values"; +import { + getSortingOrders, + makeDimensionValueSorters, +} from "@/utils/sorting-values"; export interface AreasState extends CommonChartState { chartType: "area"; @@ -228,13 +231,12 @@ const useAreasState = ( return orderBy( uniqueSegments, sorters, - segmentSortingOrder === "desc" ? "desc" : "asc" + getSortingOrders(sorters, segmentSorting) ); }, [ plottableSortedData, dimensions, segmentSorting, - segmentSortingOrder, getY, getSegment, fields.segment?.componentIri, diff --git a/app/charts/column/columns-grouped-state.tsx b/app/charts/column/columns-grouped-state.tsx index 7e8167e39..48919b27d 100644 --- a/app/charts/column/columns-grouped-state.tsx +++ b/app/charts/column/columns-grouped-state.tsx @@ -53,7 +53,10 @@ import { isTemporalDimension, Observation } from "@/domain/data"; import { useFormatNumber, formatNumberWithUnit } from "@/formatters"; import { getPalette } from "@/palettes"; import { sortByIndex } from "@/utils/array"; -import { makeDimensionValueSorters } from "@/utils/sorting-values"; +import { + getSortingOrders, + makeDimensionValueSorters, +} from "@/utils/sorting-values"; export interface GroupedColumnsState extends CommonChartState { chartType: "column"; @@ -197,11 +200,7 @@ const useGroupedColumnsState = ( sumsBySegment, }); - return orderBy( - uniqueSegments, - sorters, - sorting?.sortingOrder === "desc" ? "desc" : "asc" - ); + return orderBy(uniqueSegments, sorters, getSortingOrders(sorters, sorting)); }, [ plottableSortedData, dimensions, diff --git a/app/charts/column/columns-stacked-state.tsx b/app/charts/column/columns-stacked-state.tsx index eafe45268..0684cbfd2 100644 --- a/app/charts/column/columns-stacked-state.tsx +++ b/app/charts/column/columns-stacked-state.tsx @@ -53,7 +53,10 @@ import { isTemporalDimension, Observation } from "@/domain/data"; import { formatNumberWithUnit, useFormatNumber } from "@/formatters"; import { getPalette } from "@/palettes"; import { sortByIndex } from "@/utils/array"; -import { makeDimensionValueSorters } from "@/utils/sorting-values"; +import { + getSortingOrders, + makeDimensionValueSorters, +} from "@/utils/sorting-values"; export interface StackedColumnsState extends CommonChartState { chartType: "column"; @@ -201,11 +204,8 @@ const useColumnsStackedState = ( sorting, sumsBySegment, }); - return orderBy( - uniqueSegments, - sorters, - sorting?.sortingOrder === "desc" ? "desc" : "asc" - ); + + return orderBy(uniqueSegments, sorters, getSortingOrders(sorters, sorting)); }, [ plottableSortedData, dimensions, diff --git a/app/charts/pie/pie-state.tsx b/app/charts/pie/pie-state.tsx index dbf3bfcf6..4f7ca3772 100644 --- a/app/charts/pie/pie-state.tsx +++ b/app/charts/pie/pie-state.tsx @@ -27,8 +27,10 @@ import { PieFields } from "@/configurator"; import { DimensionValue, Observation } from "@/domain/data"; import { formatNumberWithUnit, useFormatNumber } from "@/formatters"; import { getPalette } from "@/palettes"; -import { makeDimensionValueSorters } from "@/utils/sorting-values"; - +import { + getSortingOrders, + makeDimensionValueSorters, +} from "@/utils/sorting-values"; export interface PieState extends CommonChartState { chartType: "pie"; allData: Observation[]; @@ -114,15 +116,16 @@ const usePieState = ( .filter((x) => typeof x[1] === "number") .map((x) => x[0]); + const sorting = fields.segment.sorting; const sorters = makeDimensionValueSorters(segmentDimension, { - sorting: fields.segment.sorting, + sorting: sorting, measureBySegment, }); const segments = orderBy( uniqueSegments, sorters, - sortingOrder === "desc" ? "desc" : "asc" + getSortingOrders(sorters, sorting) ); if (fields.segment && segmentDimension && fields.segment.colorMapping) { diff --git a/app/utils/sorting-values.ts b/app/utils/sorting-values.ts index 7376ec788..2be71892d 100644 --- a/app/utils/sorting-values.ts +++ b/app/utils/sorting-values.ts @@ -90,3 +90,12 @@ export const valueComparator = (locale: string) => (a: Value, b: Value) => { return a.label.localeCompare(b.label, locale); } }; + +export const getSortingOrders = ( + sorters: ((...args: any[]) => any)[], + sorting: SortingField["sorting"] +) => { + return Array(sorters.length).fill( + sorting?.sortingOrder === "desc" ? "desc" : "asc" + ); +};