From 108a990fd280d6b301798f3b7677d637d78bcd6b Mon Sep 17 00:00:00 2001
From: Florian Sommariva <florian.sommariva@makina-corpus.com>
Date: Thu, 23 Nov 2023 19:04:33 +0100
Subject: [PATCH] Use sortedByOrder for order activities

---
 frontend/src/modules/activities/adapter.ts   | 54 ++++++++++++--------
 frontend/src/modules/activities/connector.ts | 14 ++---
 frontend/src/modules/activities/interface.ts |  2 +-
 3 files changed, 38 insertions(+), 32 deletions(-)

diff --git a/frontend/src/modules/activities/adapter.ts b/frontend/src/modules/activities/adapter.ts
index 269c66fd1..46f69bce1 100644
--- a/frontend/src/modules/activities/adapter.ts
+++ b/frontend/src/modules/activities/adapter.ts
@@ -1,5 +1,6 @@
 import { PRACTICE_ID } from 'modules/filters/constant';
 import { FilterWithoutType } from 'modules/filters/interface';
+import { sortedByOrder } from 'modules/utils/array';
 import { Activity, ActivityChoices, ActivityFilter, RawListActivity } from './interface';
 
 const isCompleteRawListActivity = (
@@ -13,11 +14,14 @@ export const adaptActivityFilter = (
   rawActivities: Partial<RawListActivity>[],
 ): FilterWithoutType => ({
   id: PRACTICE_ID,
-  options: rawActivities.filter(isCompleteRawListActivity).map(rawActivity => ({
-    value: `${rawActivity.id}`,
-    label: rawActivity.name,
-    pictogramUrl: rawActivity.pictogram,
-  })),
+  options: rawActivities
+    .filter(isCompleteRawListActivity)
+    .sort(sortedByOrder)
+    .map(rawActivity => ({
+      value: `${rawActivity.id}`,
+      label: rawActivity.name,
+      pictogramUrl: rawActivity.pictogram,
+    })),
 });
 
 export const adaptActivity = (rawActivity: RawListActivity): Activity => ({
@@ -27,24 +31,30 @@ export const adaptActivity = (rawActivity: RawListActivity): Activity => ({
 });
 
 export const adaptActivities = (rawActivities: Partial<RawListActivity>[]): ActivityChoices =>
-  rawActivities.filter(isCompleteRawListActivity).reduce(
-    (activities, { name, pictogram, id }) => ({
-      ...activities,
-      [id]: {
-        label: name,
-        pictogramUri: pictogram,
-      },
-    }),
-    {} as ActivityChoices,
-  );
+  rawActivities
+    .filter(isCompleteRawListActivity)
+    .sort(sortedByOrder)
+    .reduce(
+      (activities, { name, pictogram, id }) => ({
+        ...activities,
+        [id]: {
+          label: name,
+          pictogramUri: pictogram,
+        },
+      }),
+      {} as ActivityChoices,
+    );
 
 export const adaptActivitiesFilter = (
   rawActivities: Partial<RawListActivity>[],
 ): ActivityFilter[] =>
-  rawActivities.filter(isCompleteRawListActivity).map(({ name, pictogram, id, order = null }) => ({
-    label: name,
-    pictogramUri: pictogram,
-    id: `${id}`,
-    order,
-    type: 'PRACTICE',
-  }));
+  rawActivities
+    .filter(isCompleteRawListActivity)
+    .sort(sortedByOrder)
+    .map(({ name, pictogram, id, order = null }) => ({
+      label: name,
+      pictogramUri: pictogram,
+      id: `${id}`,
+      order,
+      type: 'PRACTICE',
+    }));
diff --git a/frontend/src/modules/activities/connector.ts b/frontend/src/modules/activities/connector.ts
index 70acea7c2..f95b1d04d 100644
--- a/frontend/src/modules/activities/connector.ts
+++ b/frontend/src/modules/activities/connector.ts
@@ -1,6 +1,7 @@
 import { FilterWithoutType } from 'modules/filters/interface';
 import { adaptTouristicContentCategoryList } from 'modules/touristicContentCategory/adapter';
 import { fetchTouristicContentCategories } from 'modules/touristicContentCategory/api';
+import { sortedByOrder } from 'modules/utils/array';
 import { adaptOutdoorPracticesForActivities } from '../outdoorPractice/adapter';
 import { fetchOutdoorPractices } from '../outdoorPractice/api';
 import { adaptTouristicEventTypesForActivities } from '../touristicEventType/adapter';
@@ -37,9 +38,6 @@ export const getActivity = async (
   return adaptActivity(rawActivity);
 };
 
-const sortedActivitiesByOrder = (a: ActivityFilter, b: ActivityFilter) =>
-  (a.order ?? Infinity) - (b.order ?? Infinity);
-
 export const getActivityBarContent = async (language: string): Promise<ActivityFilter[]> => {
   const [rawPractices, rawTouristicContentCategories, rawOutdoorPractices, rawTouristicEvents] =
     await Promise.all([
@@ -50,15 +48,13 @@ export const getActivityBarContent = async (language: string): Promise<ActivityF
     ]);
 
   return [
-    ...adaptActivitiesFilter(rawPractices.results).sort(sortedActivitiesByOrder),
+    ...adaptActivitiesFilter(rawPractices.results).sort(sortedByOrder),
     ...adaptOutdoorPracticesForActivities(
       rawOutdoorPractices ? rawOutdoorPractices.results : [],
-    ).sort(sortedActivitiesByOrder),
-    ...adaptTouristicContentCategoryList(rawTouristicContentCategories.results).sort(
-      sortedActivitiesByOrder,
-    ),
+    ).sort(sortedByOrder),
+    ...adaptTouristicContentCategoryList(rawTouristicContentCategories.results).sort(sortedByOrder),
     ...adaptTouristicEventTypesForActivities(
       rawTouristicEvents ? rawTouristicEvents.results : [],
-    ).sort(sortedActivitiesByOrder),
+    ).sort(sortedByOrder),
   ];
 };
diff --git a/frontend/src/modules/activities/interface.ts b/frontend/src/modules/activities/interface.ts
index a8736e249..c7c59f821 100644
--- a/frontend/src/modules/activities/interface.ts
+++ b/frontend/src/modules/activities/interface.ts
@@ -1,6 +1,6 @@
 export interface RawActivity {
   id: number;
-  order: null;
+  order: null | number;
   pictogram: string;
 }