From 3e9f84c2c79017a1a6f8a83b611fbed363a2422d Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Tue, 30 Jan 2024 09:46:20 +0100
Subject: [PATCH] refactor: Refactor VariogramResult component to match data
 structure.

---
 .../CaseResultView/CaseResultView.tsx         |  2 +-
 .../VariogramCaseResult.tsx                   | 53 +++++--------------
 .../VariogramResultTable.tsx                  | 51 ++++++++++++++++++
 .../VariogramResults/VariogramResults.tsx     | 19 -------
 4 files changed, 64 insertions(+), 61 deletions(-)
 create mode 100644 src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramResultTable.tsx

diff --git a/src/features/Results/CaseResult/CaseResultView/CaseResultView.tsx b/src/features/Results/CaseResult/CaseResultView/CaseResultView.tsx
index a2d1e30c..f7944e35 100644
--- a/src/features/Results/CaseResult/CaseResultView/CaseResultView.tsx
+++ b/src/features/Results/CaseResult/CaseResultView/CaseResultView.tsx
@@ -21,7 +21,7 @@ export const CaseResultView = ({
       <Styled.CaseResultList>
         {caseType === 'Variogram' && (
           <VariogramCaseResult
-            caseList={[]}
+            resultList={resultList}
             img={ResultIMG}
           ></VariogramCaseResult>
         )}
diff --git a/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramCaseResult.tsx b/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramCaseResult.tsx
index 8ced63dd..7e09fd8b 100644
--- a/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramCaseResult.tsx
+++ b/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramCaseResult.tsx
@@ -1,55 +1,26 @@
-import { Table } from '@equinor/eds-core-react';
+import { GetResultDto } from '../../../../../api/generated';
 import { CaseCardComponent } from '../../../../../components/CaseCardComponent/CaseCardComponent';
 import { ImageView } from '../../../../../components/ImageView/ImageView';
-import { VariogramResultListType } from '../../../../../pages/ModelPages/Results/VariogramResults/VariogramResults';
 import * as Styled from './VariogramCaseResult.styled';
+import { VariogramResultTable } from './VariogramResultTable';
 
 export const VariogramCaseResult = ({
-  caseList,
+  resultList,
   img,
 }: {
-  caseList: VariogramResultListType[];
+  resultList: GetResultDto[];
   img: string;
 }) => {
   return (
     <>
-      {caseList.map((caseItem) => (
-        <CaseCardComponent key={caseItem.caseId} title={caseItem.title}>
-          {caseItem.resultList.map((item) => (
-            <Styled.CaseResultCard key={item.identifier}>
-              <ImageView text="run" img={img} altText="run"></ImageView>
-              <Styled.CaseLeftDiv>
-                <Table>
-                  <Table.Body>
-                    <Table.Row>
-                      <Table.Cell>Quality factor</Table.Cell>
-                      <Table.Cell>{item.quality}</Table.Cell>
-                    </Table.Row>
-                    <Table.Row>
-                      <Table.Cell>Model area</Table.Cell>
-                      <Table.Cell>{item.modelArea}</Table.Cell>
-                    </Table.Row>
-                    <Table.Row>
-                      <Table.Cell>Compute method</Table.Cell>
-                      <Table.Cell>{item.computeMethod}</Table.Cell>
-                    </Table.Row>
-                    <Table.Row>
-                      <Table.Cell>Attribute</Table.Cell>
-                      <Table.Cell>{item.attribute}</Table.Cell>
-                    </Table.Row>
-                    <Table.Row>
-                      <Table.Cell>Variogram model</Table.Cell>
-                      <Table.Cell>{item.family}</Table.Cell>
-                    </Table.Row>
-                    <Table.Row>
-                      <Table.Cell>Sigma</Table.Cell>
-                      <Table.Cell>{item.sigma}</Table.Cell>
-                    </Table.Row>
-                  </Table.Body>
-                </Table>
-              </Styled.CaseLeftDiv>
-            </Styled.CaseResultCard>
-          ))}
+      {resultList.map((item) => (
+        <CaseCardComponent key={item.computeCaseId} title={item.resultType}>
+          <Styled.CaseResultCard>
+            <ImageView text="run" img={img} altText="run"></ImageView>
+            <Styled.CaseLeftDiv>
+              <VariogramResultTable data={item}></VariogramResultTable>
+            </Styled.CaseLeftDiv>
+          </Styled.CaseResultCard>
         </CaseCardComponent>
       ))}
     </>
diff --git a/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramResultTable.tsx b/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramResultTable.tsx
new file mode 100644
index 00000000..fee64d25
--- /dev/null
+++ b/src/features/Results/CaseResult/CaseResultView/VariogramCaseResult/VariogramResultTable.tsx
@@ -0,0 +1,51 @@
+/* eslint-disable max-lines-per-function */
+import { Table } from '@equinor/eds-core-react';
+
+import { GetResultDto } from '../../../../../api/generated';
+
+// const NumberOfDecimals = 2;
+
+export const VariogramResultTable = ({ data }: { data: GetResultDto }) => {
+  //   const filterValues = (name: string) => {
+  //     return data.resultValues.filter((d) => d.name === name);
+  //   };
+
+  //   const roundResultString = (value: string) => {
+  //     return parseFloat(value).toFixed(NumberOfDecimals);
+  //   };
+
+  //   const channelHeightCount = filterValues('channel-height_count');
+  //   const channelHeightMean = filterValues('channel-height_mean');
+  //   const channelHeightSD = filterValues('channel-height_sd');
+
+  return (
+    <Table>
+      <Table.Body>
+        <Table.Row>
+          <Table.Cell>Quality factor</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+        <Table.Row>
+          <Table.Cell>Model area</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+        <Table.Row>
+          <Table.Cell>Compute method</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+        <Table.Row>
+          <Table.Cell>Attribute</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+        <Table.Row>
+          <Table.Cell>Variogram model</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+        <Table.Row>
+          <Table.Cell>Sigma</Table.Cell>
+          <Table.Cell>--Data--</Table.Cell>
+        </Table.Row>
+      </Table.Body>
+    </Table>
+  );
+};
diff --git a/src/pages/ModelPages/Results/VariogramResults/VariogramResults.tsx b/src/pages/ModelPages/Results/VariogramResults/VariogramResults.tsx
index 3e34c4ee..81c42341 100644
--- a/src/pages/ModelPages/Results/VariogramResults/VariogramResults.tsx
+++ b/src/pages/ModelPages/Results/VariogramResults/VariogramResults.tsx
@@ -4,23 +4,6 @@ import { NoResults } from '../../../../features/Results/NoResults/NoResults';
 import { useFetchCases } from '../../../../hooks/useFetchCases';
 import { useFetchResults } from '../../../../hooks/useFetchResultts';
 
-export interface VariogramResultListType {
-  caseId: number;
-  title: string;
-  resultList: VariogramResultType[];
-}
-
-export interface VariogramResultType {
-  identifier: number;
-  family: string;
-  computeMethod: string;
-  modelArea: string;
-  attribute: string;
-  quality: GLfloat;
-  sigma: GLfloat;
-  approved: string;
-}
-
 export const VariogramResults = () => {
   const { data } = useFetchResults();
   const cases = useFetchCases();
@@ -29,8 +12,6 @@ export const VariogramResults = () => {
     (res) => res.resultType === 'Variogram',
   );
 
-  console.log(variogramResults);
-
   return (
     <>
       {variogramResults !== undefined && variogramResults?.length > 0 ? (