Feat/metadata empty options (#244)

* Core: Temp empty option. * fix: fixed the issue with autoSelect * refactor: Cleanup and small fixes. --------- Co-authored-by: Wilhelm Vold <[email protected]>
equinor · Feb 28, 2024 · f1d1b66 · f1d1b66
1 parent a21ee52
commit f1d1b66
Show file tree

Hide file tree

Showing 6 changed files with 74 additions and 59 deletions.
diff --git a/src/features/AddModel/AddModelDialog/AddModelDialog.hooks.ts b/src/features/AddModel/AddModelDialog/AddModelDialog.hooks.ts
@@ -40,35 +40,13 @@ export const validateValues = (
     errors.description = 'Description not provided';
   }
 
-  if (
-    inputValues?.metadata === undefined ||
-    inputValues?.metadata?.filter((m) => m.metadataType === 'Field').length <= 0
-  ) {
-    errors.field = 'Field not selected';
-  }
-
-  if (
-    inputValues?.metadata === undefined ||
-    inputValues?.metadata?.filter((m) => m.metadataType === 'Formation')
-      .length <= 0
-  ) {
-    errors.formation = 'Formation not selected';
-  }
-
   if (
     inputValues?.analogues === undefined ||
     inputValues?.analogues?.length <= 0
   ) {
     errors.analogues = 'Analogues not selected';
   }
 
-  if (
-    inputValues?.metadata === undefined ||
-    inputValues?.metadata?.filter((m) => m.metadataType === 'Zone').length <= 0
-  ) {
-    errors.zone = 'Zone not selected';
-  }
-
   if (!files.NC && !isEdit) {
     errors.file = 'NC file missing';
   }

diff --git a/src/features/AddModel/ModelMetadata/MetadataSelect/MetadataSelect.tsx b/src/features/AddModel/ModelMetadata/MetadataSelect/MetadataSelect.tsx
@@ -1,3 +1,6 @@
+/* eslint-disable max-lines-per-function */
+/* eslint-disable react/prop-types */
+
 import { Autocomplete, AutocompleteChanges } from '@equinor/eds-core-react';
 import { MetadataDto } from '../../../../api/generated';
 
@@ -19,30 +22,40 @@ export const MetadataSelect = ({
     type: string,
   ) => void;
 }) => {
-  const setSelectedMetadataOptions = (type: string) => {
-    if (!isLoading && data && metadata) {
-      const dataProps = data.filter((z) => z.metadataType === type);
+  const emptyOption: MetadataDto[] = [
+    {
+      metadataId: type,
+      metadataType: 'NoRelevant',
+      value: 'Not relevant',
+    },
+  ];
 
-      const selectedProps = metadata.filter((m) => m.metadataType === type);
+  const selectedOptions =
+    metadata !== undefined && metadata?.length > 0
+      ? metadata.filter((m) => m.metadataType === type)
+      : emptyOption;
+  const filteredOptions = data.filter((d) => d.metadataType === type);
+  const optionList: MetadataDto[] = filteredOptions
+    ? emptyOption.concat(filteredOptions)
+    : emptyOption;
 
-      return dataProps.filter(
-        (c) =>
-          selectedProps.findIndex((x: MetadataDto) => x.value === c.value) > -1,
-      );
-    }
-  };
+  const intersection = optionList.filter((a) =>
+    selectedOptions.some((b) => JSON.stringify(a) === JSON.stringify(b)),
+  );
 
   return (
     <Autocomplete
       variant={errors ? 'error' : undefined}
       label={type}
-      options={data.filter((d) => d.metadataType === type)}
+      options={optionList}
       optionLabel={(option) => option.value}
-      selectedOptions={setSelectedMetadataOptions(type)}
       multiple
-      onOptionsChange={(e: AutocompleteChanges<MetadataDto>) =>
-        handleAddMetadata(e, type)
+      initialSelectedOptions={
+        intersection.length === 0 ? emptyOption : intersection
       }
-    ></Autocomplete>
+      onOptionsChange={(e: AutocompleteChanges<MetadataDto>) => {
+        handleAddMetadata(e, type);
+      }}
+    />
   );
 };
diff --git a/src/features/AddModel/ModelMetadata/ModelMetadata.tsx b/src/features/AddModel/ModelMetadata/ModelMetadata.tsx
@@ -61,11 +61,22 @@ export const ModelMetadata = ({
     propType: string,
   ) {
     if (!metadata.metadata) return;
-    const metadataList: MetadataDto[] = metadata.metadata.filter(
-      (i) => i.metadataType !== propType,
+
+    // Filert out metadata of the same type as dropdown props type
+    const metadataList: MetadataDto[] = metadata.metadata
+      .filter((i) => i.metadataType !== propType)
+      .filter((n) => n.metadataId !== propType);
+
+    const removeNotSelected = e.selectedItems.filter(
+      (i) => i.metadataType === propType,
     );
+    // console.log(removeNotSelected)
+
+    const newList = [...metadataList, ...removeNotSelected];
+
+    // if (propType === 'Formation') console.log(e.selectedItems);
+    // if (propType === 'Formation') console.log(newList);
 
-    const newList = [...metadataList, ...e.selectedItems];
     setMetadata({
       ...metadata,
       metadata: [...newList],

diff --git a/src/features/ModelTable/ModelTable.tsx b/src/features/ModelTable/ModelTable.tsx
@@ -4,7 +4,11 @@ import { Button, LinearProgress } from '@equinor/eds-core-react';
 import { EdsDataGrid } from '@equinor/eds-data-grid-react';
 import { useQuery } from '@tanstack/react-query';
 import { useNavigate } from 'react-router-dom';
-import { AnalogueModelsService, OpenAPI } from '../../api/generated';
+import {
+  AnalogueModelsService,
+  MetadataDto,
+  OpenAPI,
+} from '../../api/generated';
 import { useAccessToken } from '../../hooks/useAccessToken';
 import * as Styled from './ModelTable.styled';
 
@@ -53,6 +57,10 @@ export const ModelTable = ({
     }
   };
 
+  const hasSelectedOptions = (metadata: MetadataDto[], type: string) => {
+    return metadata.filter((d) => d.metadataType === type).length > 0;
+  };
+
   return (
     <Styled.Table>
       <EdsDataGrid
@@ -87,11 +95,11 @@ export const ModelTable = ({
             size: 150,
             cell: ({ row }) => (
               <Styled.List>
-                {row.original.metadata
-                  .filter((data) => data.metadataType === 'Formation')
-                  .map((f) => (
-                    <p key={f.metadataId}>{f.value + ', '}</p>
-                  ))}
+                {hasSelectedOptions(row.original.metadata, 'Formation')
+                  ? row.original.metadata
+                      .filter((data) => data.metadataType === 'Formation')
+                      .map((f) => <p key={f.metadataId}>{f.value + ', '}</p>)
+                  : 'Not relevant'}
               </Styled.List>
             ),
           },
@@ -103,11 +111,11 @@ export const ModelTable = ({
             size: 150,
             cell: ({ row }) => (
               <Styled.List>
-                {row.original.metadata
-                  .filter((data) => data.metadataType === 'Zone')
-                  .map((z) => (
-                    <p key={z.metadataId}>{z.value + ', '}</p>
-                  ))}
+                {hasSelectedOptions(row.original.metadata, 'Zone')
+                  ? row.original.metadata
+                      .filter((data) => data.metadataType === 'Zone')
+                      .map((z) => <p key={z.metadataId}>{z.value + ', '}</p>)
+                  : 'Not relevant'}
               </Styled.List>
             ),
           },
@@ -119,11 +127,13 @@ export const ModelTable = ({
             size: 200,
             cell: ({ row }) => (
               <Styled.List>
-                {row.original.metadata
-                  .filter((data) => data.metadataType === 'Field')
-                  .map((filed) => (
-                    <p key={filed.metadataId}>{filed.value + ', '}</p>
-                  ))}
+                {hasSelectedOptions(row.original.metadata, 'Field')
+                  ? row.original.metadata
+                      .filter((data) => data.metadataType === 'Field')
+                      .map((filed) => (
+                        <p key={filed.metadataId}>{filed.value + ', '}</p>
+                      ))
+                  : 'Not relevant'}
               </Styled.List>
             ),
           },

diff --git a/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx b/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx
@@ -97,8 +97,11 @@ export const ModelMetadataView = () => {
   const analougueList: AddAnalogueDto[] = [];
 
   function addMetadataFields(metadata?: MetadataDto[]) {
-    if (!metadata) return;
-    const obj = metadata.map((x) => ({ metadataId: x.metadataId }));
+    const filteredMetadata = metadata?.filter(
+      (m) => m.metadataType !== 'NoRelevant',
+    );
+    if (!filteredMetadata) return;
+    const obj = filteredMetadata.map((x) => ({ metadataId: x.metadataId }));
     metadataList.push(...obj);
   }
 

diff --git a/src/features/ModelView/TableDataCell/TableDataCell.tsx b/src/features/ModelView/TableDataCell/TableDataCell.tsx
@@ -25,7 +25,7 @@ export const TableDataCell = ({
             <Typography key={m.metadataId}>{m.value + ', '}</Typography>
           ))
       ) : (
-        <Typography> - </Typography>
+        <Typography> Not relevant </Typography>
       )}
     </Styled.DataCell>
   );