From 2c8d0cb5c07b634bd7d0a49375c3a9eada788860 Mon Sep 17 00:00:00 2001
From: Mathias Oppedal Heggelund <98742460+mheggelund@users.noreply.github.com>
Date: Thu, 17 Oct 2024 09:29:46 +0200
Subject: [PATCH] feat: filter gde by equinor code (#345)

* chore: Add filter by number option to SortList.

* chore: Add equinor code to gde list name. Filter and sort Gde options by numbers.
---
 .../GdeSelect/GdeSelect.tsx                   | 45 +++++++++++++++----
 src/utils/SortList.ts                         |  4 +-
 2 files changed, 40 insertions(+), 9 deletions(-)

diff --git a/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx b/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx
index 2a95d50..5c4d7fc 100644
--- a/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx
+++ b/src/components/GrossDepositionEnviroment/GdeSelect/GdeSelect.tsx
@@ -46,16 +46,42 @@ export const GdeSelect = ({
     (g) => g.geologyGroup === 'ArchitecturalElement',
   );
 
+  const setDisplayName = (option: GeologicalStandardDto) => {
+    return option.equinorCode + ' ' + option.identifier;
+  };
+
+  const intToArray = (number: number) => {
+    return Array.from(number.toString()).map(Number);
+  };
+
+  const filterByCode = (data: GeologicalStandardDto[]) => {
+    if (gdeObject.depEnv === undefined) return [];
+
+    const equinorCodeString = gdeObject.depEnv.equinorCode.toString();
+    const firstTwoNumbersArray = intToArray(
+      parseInt(equinorCodeString.slice(0, 2)),
+    );
+    const filteredList = data.filter(
+      (d) =>
+        intToArray(d.equinorCode)[0] === firstTwoNumbersArray[0] &&
+        intToArray(d.equinorCode)[1] === firstTwoNumbersArray[1],
+    );
+
+    return filteredList;
+  };
+
   return (
     <StyledDialog.AutocompleteList>
       <Autocomplete
         label="Gross Depositional Environment (GDE)"
-        options={sortList(Gde)}
-        optionLabel={(option) => option.identifier}
+        options={sortList(Gde, true)}
+        optionLabel={(option) => setDisplayName(option)}
         onOptionsChange={(e: AutocompleteChanges<GeologicalStandardDto>) => {
           setGdeObject({
             ...gdeObject,
             grossDepEnv: e.selectedItems[0],
+            depEnv: undefined,
+            subenv: undefined,
           });
           setErrors({});
         }}
@@ -67,14 +93,16 @@ export const GdeSelect = ({
       <Autocomplete
         label="Depositional Environment"
         disabled={gdeObject.grossDepEnv?.geologicalStandardId === undefined}
-        options={sortList(De)}
-        optionLabel={(option) => option.identifier}
+        options={sortList(De, true)}
+        optionLabel={(option) => setDisplayName(option)}
         onOptionsChange={(e: AutocompleteChanges<GeologicalStandardDto>) => {
           setGdeObject({
             ...gdeObject,
             depEnv: e.selectedItems[0],
+            subenv: undefined,
           });
         }}
+        selectedOptions={gdeObject.depEnv ? [gdeObject.depEnv] : []}
         noOptionsText="No options"
         variant={
           error.DEnv && gdeObject.grossDepEnv !== undefined
@@ -91,14 +119,15 @@ export const GdeSelect = ({
       <Autocomplete
         label="Subenvironment"
         disabled={gdeObject.grossDepEnv?.geologicalStandardId === undefined}
-        options={sortList(SubEnvironment)}
-        optionLabel={(option) => option.identifier}
+        options={filterByCode(sortList(SubEnvironment, true))}
+        optionLabel={(option) => setDisplayName(option)}
         onOptionsChange={(e: AutocompleteChanges<GeologicalStandardDto>) => {
           setGdeObject({
             ...gdeObject,
             subenv: e.selectedItems[0],
           });
         }}
+        selectedOptions={gdeObject.subenv ? [gdeObject.subenv] : []}
         noOptionsText="No options"
         variant={
           error.subEnv && gdeObject.grossDepEnv !== undefined
@@ -115,8 +144,8 @@ export const GdeSelect = ({
       <Autocomplete
         label="Architectural Element"
         multiple
-        options={sortList(ArchitecturalElement)}
-        optionLabel={(option) => option.identifier}
+        options={sortList(ArchitecturalElement, true)}
+        optionLabel={(option) => setDisplayName(option)}
         onOptionsChange={(e: AutocompleteChanges<GeologicalStandardDto>) => {
           setGdeObject({
             ...gdeObject,
diff --git a/src/utils/SortList.ts b/src/utils/SortList.ts
index de0f0cb..a53ffb6 100644
--- a/src/utils/SortList.ts
+++ b/src/utils/SortList.ts
@@ -1,7 +1,9 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-export const sortList = (data: any) => {
+export const sortList = (data: any, byNmber?: boolean) => {
   if (data.length === 0) {
     return data;
+  } else if (byNmber) {
+    return data.sort((a: any, b: any) => a.equinorCode - b.equinorCode);
   } else if (data.length !== 0 && data[0]['identifier'] !== undefined) {
     return data.sort((a: any, b: any) =>
       a.identifier.localeCompare(b.identifier),