fix: Use sorting order correctly even if there are multiple ones

visualize-admin · Nov 3, 2022 · 875aacf · 875aacf
1 parent 1632f16
commit 875aacf
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 18 deletions.
diff --git 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 {
   chartType: "area";
@@ -234,13 +237,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
@@ -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 {
   chartType: "column";
@@ -202,11 +205,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
@@ -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 {
   chartType: "column";
@@ -205,11 +208,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
@@ -27,7 +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 {
   bounds: Bounds;
   data: Observation[];
@@ -114,15 +117,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
@@ -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"
+  );
+};