fix: sorting overview table

Vizzuality · Jan 14, 2025 · 469adc0 · 469adc0
1 parent 5a956a4
commit 469adc0
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 15 deletions.
diff --git a/client/src/containers/overview/table/utils.ts b/client/src/containers/overview/table/utils.ts
@@ -1,3 +1,5 @@
+import { Project } from "@shared/entities/projects.entity";
+import { Column } from "@tanstack/react-table";
 import { z } from "zod";
 
 import { filtersSchema } from "@/app/(overview)/url-store";
@@ -30,3 +32,26 @@ export const filtersToQueryParams = (
       {},
     );
 };
+
+export const getColumnSortTitle = (column: Column<Partial<Project>>) => {
+  if (!column.getCanSort()) {
+    return undefined;
+  }
+
+  const nextSortOrder = column.getNextSortingOrder();
+
+  if (nextSortOrder === "asc") {
+    return "Sort ascending";
+  }
+
+  if (nextSortOrder === "desc") {
+    return "Sort descending";
+  }
+
+  // If column is projectName, then we want to toggle between asc/desc
+  if (column.id === "projectName") {
+    return "Sort ascending";
+  }
+
+  return "Clear sort";
+};
diff --git a/client/src/containers/overview/table/view/overview/index.tsx b/client/src/containers/overview/table/view/overview/index.tsx
@@ -35,6 +35,7 @@ import { useTablePaginationReset } from "@/hooks/use-table-pagination-reset";
 import ProjectDetails from "@/containers/overview/project-details";
 import {
   filtersToQueryParams,
+  getColumnSortTitle,
   NO_DATA,
 } from "@/containers/overview/table/utils";
 import { columns } from "@/containers/overview/table/view/overview/columns";
@@ -66,7 +67,7 @@ export interface TableStateWithMaximums extends TableState {
 const DEFAULT_SORTING: SortingState = [
   {
     id: "projectName",
-    desc: true,
+    desc: false,
   },
 ];
 
@@ -113,7 +114,7 @@ export function OverviewTable() {
         ) as filterFields,
         ...(sorting.length > 0 && {
           sort: sorting.map(
-            (sort) => `${sort.desc ? "" : "-"}${sort.id}`,
+            (sort) => `${sort.desc ? "-" : ""}${sort.id}`,
           ) as sortFields,
         }),
         costRange: filters.costRange,
@@ -187,15 +188,7 @@ export function OverviewTable() {
                             header.column.getCanSort(),
                         })}
                         onClick={header.column.getToggleSortingHandler()}
-                        title={
-                          header.column.getCanSort()
-                            ? header.column.getNextSortingOrder() === "asc"
-                              ? "Sort ascending"
-                              : header.column.getNextSortingOrder() === "desc"
-                                ? "Sort descending"
-                                : "Clear sort"
-                            : undefined
-                        }
+                        title={getColumnSortTitle(header.column)}
                       >
                         {flexRender(
                           header.column.columnDef.header,

diff --git a/shared/schemas/query-param.schema.ts b/shared/schemas/query-param.schema.ts
@@ -1,5 +1,5 @@
-import { z } from 'zod';
-import { getMetadataArgsStorage } from 'typeorm';
+import { z } from "zod";
+import { getMetadataArgsStorage } from "typeorm";
 
 const generateQuerySchema = <
   FIELDS extends string,
@@ -22,7 +22,7 @@ const generateQuerySchema = <
       z.enum(config.filter as [FILTERS, ...FILTERS[]]),
       z.union([
         z.string().transform((value) => {
-          return value.split(',');
+          return value.split(",");
         }),
         z.array(z.string()),
       ]),
@@ -124,4 +124,4 @@ export function generateEntityQuerySchema<T extends object>(
   } as const;
 
   return generateQuerySchema(mergedEntityConfig);
-}
+}