From cd510a6d7cdb65d1a1895a9225ff5e82b413039a Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 14:30:40 +0100
Subject: [PATCH 01/10] fix: Logo click navigates to "/"

---
 src/features/AppBar/AppBar.styled.ts |  7 ++++++-
 src/features/AppBar/AppBar.tsx       | 11 ++++++++++-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/features/AppBar/AppBar.styled.ts b/src/features/AppBar/AppBar.styled.ts
index f446cd47..289c771c 100644
--- a/src/features/AppBar/AppBar.styled.ts
+++ b/src/features/AppBar/AppBar.styled.ts
@@ -5,4 +5,9 @@ import { spacings } from '../../tokens/spacings';
 const StyledTopBar = styled(TopBar)`
   column-gap: ${spacings.X_LARGE};
 `;
-export { StyledTopBar as TopBar };
+
+const StyledHeader = styled(TopBar.Header)`
+  cursor: pointer;
+`;
+
+export { StyledHeader as Header, StyledTopBar as TopBar };
diff --git a/src/features/AppBar/AppBar.tsx b/src/features/AppBar/AppBar.tsx
index 5adb361c..96ff67f5 100644
--- a/src/features/AppBar/AppBar.tsx
+++ b/src/features/AppBar/AppBar.tsx
@@ -1,12 +1,21 @@
 import { TopBar } from '@equinor/eds-core-react';
+import { useNavigate } from 'react-router-dom';
 import * as Styled from './AppBar.styled';
 import { Icons } from './Icons/Icons';
 import { Navigation } from './Navigation/Navigation';
 
 const AppBar = ({ title }: { title: string }) => {
+  const navigate = useNavigate();
+
   return (
     <Styled.TopBar>
-      <TopBar.Header>{title}</TopBar.Header>
+      <Styled.Header
+        onClick={() => {
+          navigate('');
+        }}
+      >
+        {title}
+      </Styled.Header>
       <Navigation />
       <TopBar.Actions>
         <Icons />

From 6d67af33c660c2114bb02608b5798ddbb2c34ec8 Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 15:20:28 +0100
Subject: [PATCH 02/10] refactor: Resize and fix style for ModelMetadataView.

---
 .../ModelMetadataView.styled.tsx              | 47 ++++++++++---------
 .../ModelMetadataView/ModelMetadataView.tsx   | 42 ++++++++---------
 src/features/ModelView/ModelView.styled.tsx   |  4 --
 .../ModelView/TableDataCell/TableDataCell.tsx |  8 ++--
 4 files changed, 48 insertions(+), 53 deletions(-)

diff --git a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
index d93bcb71..3afc5ff8 100644
--- a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
+++ b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
@@ -1,34 +1,35 @@
+import { Table } from '@equinor/eds-core-react';
 import styled from 'styled-components';
 import { spacings } from '../../../tokens/spacings';
 
 export const Metadata = styled.div`
-  width: 100%;
-  min-width: 256px;
+  display: flex;
+  flex-direction: column;
+  row-gap: ${spacings.LARGE};
+
+  > button {
+    width: fit-content;
+  }
 `;
-export const MetadataTable = styled.div`
-  width: 100%;
-  min-width: 256px;
 
-  > table {
-    width: 85%;
+const DataTable = styled(Table)`
+  min-width: 256px;
+  width: 65%;
+`;
 
-    > tbody {
-      > tr {
-        > .table-first-col {
-          width: 20%;
-          padding-right: ${spacings.X_LARGE};
-        }
+export const NameCell = styled(Table.Cell)`
+  width: 20%;
+  padding-right: ${spacings.X_LARGE};
+`;
 
-        > .table-second-col {
-          display: flex;
-          flex-direction: row;
-          align-items: center;
+export const DataCell = styled(Table.Cell)`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
 
-          > p {
-            padding-right: 10px;
-          }
-        }
-      }
-    }
+  > p {
+    padding-right: 10px;
   }
 `;
+
+export { DataTable as Table };
diff --git a/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx b/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx
index c0d9704f..1b03a0cc 100644
--- a/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx
+++ b/src/features/ModelView/ModelMetadataView/ModelMetadataView.tsx
@@ -149,28 +149,26 @@ export const ModelMetadataView = () => {
     <Styled.Metadata>
       <Typography variant="h3">Description and metadata</Typography>
       {data.data.description && <div>{data.data.description}</div>}
-      <Styled.MetadataTable>
-        <Table>
-          <Table.Body>
-            <Table.Row>
-              <Table.Cell className="table-first-col">Field</Table.Cell>
-              <TableDataCell data={data.data} type="Field" />
-            </Table.Row>
-            <Table.Row>
-              <Table.Cell className="table-first-col">Fomation</Table.Cell>
-              <TableDataCell data={data.data} type="Formation" />
-            </Table.Row>
-            <Table.Row>
-              <Table.Cell className="table-first-col">Analouge</Table.Cell>
-              <TableDataCell data={data.data} type="Analouge" />
-            </Table.Row>
-            <Table.Row>
-              <Table.Cell className="table-first-col">Zone</Table.Cell>
-              <TableDataCell data={data.data} type="Zone" />
-            </Table.Row>
-          </Table.Body>
-        </Table>
-      </Styled.MetadataTable>
+      <Styled.Table>
+        <Table.Body>
+          <Table.Row>
+            <Styled.NameCell>Field</Styled.NameCell>
+            <TableDataCell data={data.data} type="Field" />
+          </Table.Row>
+          <Table.Row>
+            <Styled.NameCell>Fomation</Styled.NameCell>
+            <TableDataCell data={data.data} type="Formation" />
+          </Table.Row>
+          <Table.Row>
+            <Styled.NameCell>Analouge</Styled.NameCell>
+            <TableDataCell data={data.data} type="Analouge" />
+          </Table.Row>
+          <Table.Row>
+            <Styled.NameCell>Zone</Styled.NameCell>
+            <TableDataCell data={data.data} type="Zone" />
+          </Table.Row>
+        </Table.Body>
+      </Styled.Table>
 
       <Button
         onClick={toggleDialog}
diff --git a/src/features/ModelView/ModelView.styled.tsx b/src/features/ModelView/ModelView.styled.tsx
index 584b641b..ab611535 100644
--- a/src/features/ModelView/ModelView.styled.tsx
+++ b/src/features/ModelView/ModelView.styled.tsx
@@ -21,10 +21,6 @@ export const InnerMetadataWrapper = styled.div`
   row-gap: ${spacings.XXX_LARGE};
   width: 80%;
 
-  .edit-metadata-button {
-    margin-top: ${spacings.MEDIUM_SMALL};
-  }
-
   .source-view {
     width: 100%;
     min-width: 256px;
diff --git a/src/features/ModelView/TableDataCell/TableDataCell.tsx b/src/features/ModelView/TableDataCell/TableDataCell.tsx
index 517ed762..de1e7da3 100644
--- a/src/features/ModelView/TableDataCell/TableDataCell.tsx
+++ b/src/features/ModelView/TableDataCell/TableDataCell.tsx
@@ -1,6 +1,6 @@
-import { Table, Typography } from '@equinor/eds-core-react';
+import { Typography } from '@equinor/eds-core-react';
 import { AnalogueModelDetail } from '../../../api/generated';
-
+import * as Styled from '../ModelMetadataView/ModelMetadataView.styled';
 export const TableDataCell = ({
   data,
   type,
@@ -9,7 +9,7 @@ export const TableDataCell = ({
   type: string;
 }) => {
   return (
-    <Table.Cell className="table-second-col">
+    <Styled.DataCell>
       {type === 'Analouge' ? (
         data.analogues && data.analogues.length > 0 ? (
           data.analogues.map((m) => (
@@ -27,6 +27,6 @@ export const TableDataCell = ({
       ) : (
         <Typography> - </Typography>
       )}
-    </Table.Cell>
+    </Styled.DataCell>
   );
 };

From 12518e0e69724bf1c378dd671167bcb5a9a50815 Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 15:34:03 +0100
Subject: [PATCH 03/10] refactor: Resize and fix style for ModelSourceView.

---
 .../ModelMetadataView.styled.tsx              |  2 +-
 .../ModelSourceView.styled.tsx                | 32 ++++++++-----------
 .../ModelSourceView/ModelSourceView.tsx       | 19 ++++-------
 src/features/ModelView/ModelView.styled.tsx   | 25 +--------------
 4 files changed, 23 insertions(+), 55 deletions(-)

diff --git a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
index 3afc5ff8..fb359daf 100644
--- a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
+++ b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
@@ -14,7 +14,7 @@ export const Metadata = styled.div`
 
 const DataTable = styled(Table)`
   min-width: 256px;
-  width: 65%;
+  width: 75%;
 `;
 
 export const NameCell = styled(Table.Cell)`
diff --git a/src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx b/src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx
index 520c33fc..a4e6eb84 100644
--- a/src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx
+++ b/src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx
@@ -1,25 +1,21 @@
+import { Table } from '@equinor/eds-core-react';
 import styled from 'styled-components';
 import { spacings } from '../../../tokens/spacings';
 
-export const FileTable = styled.div`
-  width: 100%;
-  min-width: 256px;
-  max-width: 100%;
+export const TableWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${spacings.LARGE};
 
-  > table {
-    width: 85%;
+  width: 75%;
+`;
 
-    > thead,
-    tbody {
-      > tr {
-        > .table-row {
-        }
+export const FileTable = styled(Table)`
+  width: 100%;
+  min-width: 256px;
+`;
 
-        > .table-first-col {
-          width: 80%;
-          padding-right: ${spacings.X_LARGE};
-        }
-      }
-    }
-  }
+export const TableCell = styled(Table.Cell)`
+  width: 80%;
+  padding-right: ${spacings.X_LARGE};
 `;
diff --git a/src/features/ModelView/ModelSourceView/ModelSourceView.tsx b/src/features/ModelView/ModelSourceView/ModelSourceView.tsx
index 4cbd03f2..e5921e73 100644
--- a/src/features/ModelView/ModelSourceView/ModelSourceView.tsx
+++ b/src/features/ModelView/ModelSourceView/ModelSourceView.tsx
@@ -9,15 +9,12 @@ export const ModelSourceView = () => {
   if (isLoading || !data?.success) return <p>Loading ...</p>;
 
   return (
-    <Styled.FileTable>
-      <Typography variant="h3">Source</Typography>
-      <p>Uploaded by ABCD@equinor.com on Sep 13, 2023</p>
-      <Table>
+    <Styled.TableWrapper>
+      <Typography variant="h3">Files</Typography>
+      <Styled.FileTable>
         <Table.Head>
           <Table.Row className="table-row">
-            <Table.Cell className="table-first-col">
-              Model input files
-            </Table.Cell>
+            <Styled.TableCell>Model input files</Styled.TableCell>
             <Table.Cell>Size</Table.Cell>
           </Table.Row>
         </Table.Head>
@@ -27,9 +24,7 @@ export const ModelSourceView = () => {
             data.data.fileUploads?.length > 0) ? (
             data.data.fileUploads?.map((file: UploadList) => (
               <Table.Row key={file.uploadId} className="table-row">
-                <Table.Cell className="table-first-col">
-                  {file.originalFileName}
-                </Table.Cell>
+                <Styled.TableCell>{file.originalFileName}</Styled.TableCell>
                 <Table.Cell>**Size**</Table.Cell>
               </Table.Row>
             ))
@@ -40,7 +35,7 @@ export const ModelSourceView = () => {
             </Table.Row>
           )}
         </Table.Body>
-      </Table>
-    </Styled.FileTable>
+      </Styled.FileTable>
+    </Styled.TableWrapper>
   );
 };
diff --git a/src/features/ModelView/ModelView.styled.tsx b/src/features/ModelView/ModelView.styled.tsx
index ab611535..fff4e8b3 100644
--- a/src/features/ModelView/ModelView.styled.tsx
+++ b/src/features/ModelView/ModelView.styled.tsx
@@ -19,28 +19,5 @@ export const InnerMetadataWrapper = styled.div`
   display: flex;
   flex-direction: column;
   row-gap: ${spacings.XXX_LARGE};
-  width: 80%;
-
-  .source-view {
-    width: 100%;
-    min-width: 256px;
-    max-width: 100%;
-
-    > table {
-      width: 85%;
-
-      > thead,
-      tbody {
-        > tr {
-          > .table-row {
-          }
-
-          > .table-first-col {
-            width: 80%;
-            padding-right: ${spacings.X_LARGE};
-          }
-        }
-      }
-    }
-  }
+  width: 70%;
 `;

From 05f3a1f177874ab38f1b4d130ca779b7b3ab3bef Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 15:37:35 +0100
Subject: [PATCH 04/10] refactor: Renamed ModelFilesView files and folder.

---
 .../ModelFilesView.styled.tsx}                                | 0
 .../ModelSourceView.tsx => ModelFilesView/ModelFilesView.tsx} | 4 ++--
 src/features/ModelView/ModelView.tsx                          | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)
 rename src/features/ModelView/{ModelSourceView/ModelSourceView.styled.tsx => ModelFilesView/ModelFilesView.styled.tsx} (100%)
 rename src/features/ModelView/{ModelSourceView/ModelSourceView.tsx => ModelFilesView/ModelFilesView.tsx} (93%)

diff --git a/src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx b/src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx
similarity index 100%
rename from src/features/ModelView/ModelSourceView/ModelSourceView.styled.tsx
rename to src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx
diff --git a/src/features/ModelView/ModelSourceView/ModelSourceView.tsx b/src/features/ModelView/ModelFilesView/ModelFilesView.tsx
similarity index 93%
rename from src/features/ModelView/ModelSourceView/ModelSourceView.tsx
rename to src/features/ModelView/ModelFilesView/ModelFilesView.tsx
index e5921e73..4ab42ae4 100644
--- a/src/features/ModelView/ModelSourceView/ModelSourceView.tsx
+++ b/src/features/ModelView/ModelFilesView/ModelFilesView.tsx
@@ -1,9 +1,9 @@
 import { Table, Typography } from '@equinor/eds-core-react';
 import { UploadList } from '../../../api/generated';
 import { useFetchModel } from '../../../hooks/useFetchModel';
-import * as Styled from './ModelSourceView.styled';
+import * as Styled from './ModelFilesView.styled';
 
-export const ModelSourceView = () => {
+export const ModelFilesView = () => {
   const { isLoading, data } = useFetchModel();
 
   if (isLoading || !data?.success) return <p>Loading ...</p>;
diff --git a/src/features/ModelView/ModelView.tsx b/src/features/ModelView/ModelView.tsx
index 9a030484..51e954a1 100644
--- a/src/features/ModelView/ModelView.tsx
+++ b/src/features/ModelView/ModelView.tsx
@@ -1,6 +1,6 @@
 import { ImageView } from '../../components/ImageView/ImageView';
 import { ModelMetadataView } from '../../features/ModelView/ModelMetadataView/ModelMetadataView';
-import { ModelSourceView } from '../../features/ModelView/ModelSourceView/ModelSourceView';
+import { ModelFilesView } from './ModelFilesView/ModelFilesView';
 import * as Styled from './ModelView.styled';
 import Img from './image.png';
 
@@ -9,7 +9,7 @@ export const ModelView = () => {
     <Styled.MetadataWrapper>
       <Styled.InnerMetadataWrapper>
         <ModelMetadataView />
-        <ModelSourceView />
+        <ModelFilesView />
       </Styled.InnerMetadataWrapper>
       <ImageView
         text="Model placeholder image"

From c256494a3251be2b95393ac45640bd231e28e619 Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 15:53:27 +0100
Subject: [PATCH 05/10] refactor: Resize and fix style for ImageView.

---
 src/components/ImageView/ImageView.styled.tsx                 | 4 ++--
 src/components/ImageView/ImageView.tsx                        | 3 ++-
 .../ModelView/ModelFilesView/ModelFilesView.styled.tsx        | 2 +-
 .../ModelView/ModelMetadataView/ModelMetadataView.styled.tsx  | 2 +-
 src/features/ModelView/ModelView.styled.tsx                   | 2 +-
 5 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/ImageView/ImageView.styled.tsx b/src/components/ImageView/ImageView.styled.tsx
index 74d22980..4a046d93 100644
--- a/src/components/ImageView/ImageView.styled.tsx
+++ b/src/components/ImageView/ImageView.styled.tsx
@@ -10,9 +10,9 @@ export const ImageWrapper = styled.div`
   border-style: solid;
   border-width: 1px;
   border-color: ${theme.light.ui.background.medium};
+  width: 100%;
 
-  max-width: 100%;
-
+  max-width: fit-content;
   height: fit-content;
 
   > h5 {
diff --git a/src/components/ImageView/ImageView.tsx b/src/components/ImageView/ImageView.tsx
index 5d525baf..f40b0db4 100644
--- a/src/components/ImageView/ImageView.tsx
+++ b/src/components/ImageView/ImageView.tsx
@@ -1,3 +1,4 @@
+import { Typography } from '@equinor/eds-core-react';
 import * as Styled from './ImageView.styled';
 
 export const ImageView = ({
@@ -12,7 +13,7 @@ export const ImageView = ({
   return (
     <Styled.ImageWrapper>
       <img className="image" alt={altText} src={img} />
-      <h5>{text}</h5>
+      <Typography variant="h5">{text}</Typography>
     </Styled.ImageWrapper>
   );
 };
diff --git a/src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx b/src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx
index a4e6eb84..6c165f01 100644
--- a/src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx
+++ b/src/features/ModelView/ModelFilesView/ModelFilesView.styled.tsx
@@ -7,7 +7,7 @@ export const TableWrapper = styled.div`
   flex-direction: column;
   row-gap: ${spacings.LARGE};
 
-  width: 75%;
+  width: 85%;
 `;
 
 export const FileTable = styled(Table)`
diff --git a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
index fb359daf..94e09ab4 100644
--- a/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
+++ b/src/features/ModelView/ModelMetadataView/ModelMetadataView.styled.tsx
@@ -14,7 +14,7 @@ export const Metadata = styled.div`
 
 const DataTable = styled(Table)`
   min-width: 256px;
-  width: 75%;
+  width: 85%;
 `;
 
 export const NameCell = styled(Table.Cell)`
diff --git a/src/features/ModelView/ModelView.styled.tsx b/src/features/ModelView/ModelView.styled.tsx
index fff4e8b3..13469d51 100644
--- a/src/features/ModelView/ModelView.styled.tsx
+++ b/src/features/ModelView/ModelView.styled.tsx
@@ -19,5 +19,5 @@ export const InnerMetadataWrapper = styled.div`
   display: flex;
   flex-direction: column;
   row-gap: ${spacings.XXX_LARGE};
-  width: 70%;
+  width: 50vw;
 `;

From f0fdaa9283987af2dd5dde0648ca782be639c2fc Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Wed, 24 Jan 2024 16:11:08 +0100
Subject: [PATCH 06/10] refactor: Set max widt on compute page. Styled files
 cleanup.

---
 .../Compute/CaseGroup/CaseGroup.styled.tsx     | 18 ------------------
 .../ModelPages/Compute/Compute.styled.tsx      |  6 +-----
 2 files changed, 1 insertion(+), 23 deletions(-)

diff --git a/src/features/Compute/CaseGroup/CaseGroup.styled.tsx b/src/features/Compute/CaseGroup/CaseGroup.styled.tsx
index 4347fa1a..8393fea8 100644
--- a/src/features/Compute/CaseGroup/CaseGroup.styled.tsx
+++ b/src/features/Compute/CaseGroup/CaseGroup.styled.tsx
@@ -1,23 +1,5 @@
 import styled from 'styled-components';
 import { spacings } from '../../../tokens/spacings';
-import { theme } from '../../../tokens/theme';
-
-export const Parameters = styled.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${spacings.MEDIUM};
-
-  padding: ${spacings.LARGE};
-  background-color: ${theme.light.ui.background.light};
-  border-radius: 0 0 ${spacings.CARD_ROUNDED} 0;
-`;
-
-export const Wrapper = styled.div`
-  border-left: solid;
-  border-width: ${spacings.SMALL};
-  border-color: ${theme.light.primary.resting};
-  border-radius: ${spacings.BORDER_ROUNDED};
-`;
 
 export const CaseList = styled.div`
   display: flex;
diff --git a/src/pages/ModelPages/Compute/Compute.styled.tsx b/src/pages/ModelPages/Compute/Compute.styled.tsx
index e1c2ba4e..747da511 100644
--- a/src/pages/ModelPages/Compute/Compute.styled.tsx
+++ b/src/pages/ModelPages/Compute/Compute.styled.tsx
@@ -1,4 +1,3 @@
-import { Button } from '@equinor/eds-core-react';
 import styled from 'styled-components';
 import { spacings } from '../../../tokens/spacings';
 import { theme } from '../../../tokens/theme';
@@ -12,6 +11,7 @@ export const Case = styled.div`
   row-gap: ${spacings.XXX_LARGE};
 
   width: 70vw;
+  max-width: 1400px;
 
   @media (max-width: 1725px) {
     width: 100%;
@@ -20,10 +20,6 @@ export const Case = styled.div`
   border-left: solid ${spacings.XX_SMALL} ${theme.light.ui.background.medium};
 `;
 
-export const AddCaseButton = styled(Button)`
-  width: fit-content;
-`;
-
 export const ButtonDiv = styled.div`
   display: flex;
   flex-direction: row;

From e0f8ae310b9cc81a52d027c147e6f4a4a12cc21e Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Thu, 25 Jan 2024 07:57:37 +0100
Subject: [PATCH 07/10] refactor: Set max widt on object result table.

---
 .../ChannelResultTable.styled.tsx             |  3 +
 .../ObjectCaseResult/ChannelResultTable.tsx   | 78 ++++++++++---------
 .../ModelPages/Results/Results.styled.tsx     | 10 ---
 3 files changed, 43 insertions(+), 48 deletions(-)
 delete mode 100644 src/pages/ModelPages/Results/Results.styled.tsx

diff --git a/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.styled.tsx b/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.styled.tsx
index 83aefb6f..c5d7c4a0 100644
--- a/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.styled.tsx
+++ b/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.styled.tsx
@@ -3,6 +3,9 @@ import { Table } from '@equinor/eds-core-react';
 import styled from 'styled-components';
 import { theme } from '../../../../../tokens/theme';
 
+export const Wrapper = styled.div`
+  max-width: 950px;
+`;
 export const ColumnCell = styled(Table.Cell)`
   background: ${theme.light.ui.background.light};
   border: solid 0.5px ${theme.light.ui.background.medium};
diff --git a/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.tsx b/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.tsx
index b80a4706..dd47335c 100644
--- a/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.tsx
+++ b/src/features/Results/CaseResult/CaseResultView/ObjectCaseResult/ChannelResultTable.tsx
@@ -42,43 +42,45 @@ export const ChannelResultTable = ({
   const channelWidthSD = filterValues('channel-width_sd');
 
   return (
-    <CaseCardComponent
-      title={data.resultType + ' Case'}
-      subTitle={modelArea}
-      resultCard={true}
-    >
-      <Table>
-        <Table.Head>
-          <Table.Row>
-            <Styled.DataCell></Styled.DataCell>
-            <Styled.DataCell>Mean</Styled.DataCell>
-            <Styled.DataCell>Standard deviation (SD)</Styled.DataCell>
-            <Styled.DataCell>Count</Styled.DataCell>
-          </Table.Row>
-        </Table.Head>
-        <Table.Body key={data.computeCaseId}>
-          <Table.Row>
-            <Styled.ColumnCell>Channel width</Styled.ColumnCell>
-            <Styled.DataCell>
-              {roundResultString(channelWidthMean[0].value)}
-            </Styled.DataCell>
-            <Styled.DataCell>
-              {roundResultString(channelWidthSD[0].value)}
-            </Styled.DataCell>
-            <Styled.DataCell>{channelWidthCount[0].value}</Styled.DataCell>
-          </Table.Row>
-          <Table.Row>
-            <Styled.ColumnCell>Channel height</Styled.ColumnCell>
-            <Styled.DataCell>
-              {roundResultString(channelHeightMean[0].value)}
-            </Styled.DataCell>
-            <Styled.DataCell>
-              {roundResultString(channelHeightSD[0].value)}
-            </Styled.DataCell>
-            <Styled.DataCell>{channelHeightCount[0].value}</Styled.DataCell>
-          </Table.Row>
-        </Table.Body>
-      </Table>
-    </CaseCardComponent>
+    <Styled.Wrapper>
+      <CaseCardComponent
+        title={data.resultType + ' Case'}
+        subTitle={modelArea}
+        resultCard={true}
+      >
+        <Table>
+          <Table.Head>
+            <Table.Row>
+              <Styled.DataCell></Styled.DataCell>
+              <Styled.DataCell>Mean</Styled.DataCell>
+              <Styled.DataCell>Standard deviation (SD)</Styled.DataCell>
+              <Styled.DataCell>Count</Styled.DataCell>
+            </Table.Row>
+          </Table.Head>
+          <Table.Body key={data.computeCaseId}>
+            <Table.Row>
+              <Styled.ColumnCell>Channel width</Styled.ColumnCell>
+              <Styled.DataCell>
+                {roundResultString(channelWidthMean[0].value)}
+              </Styled.DataCell>
+              <Styled.DataCell>
+                {roundResultString(channelWidthSD[0].value)}
+              </Styled.DataCell>
+              <Styled.DataCell>{channelWidthCount[0].value}</Styled.DataCell>
+            </Table.Row>
+            <Table.Row>
+              <Styled.ColumnCell>Channel height</Styled.ColumnCell>
+              <Styled.DataCell>
+                {roundResultString(channelHeightMean[0].value)}
+              </Styled.DataCell>
+              <Styled.DataCell>
+                {roundResultString(channelHeightSD[0].value)}
+              </Styled.DataCell>
+              <Styled.DataCell>{channelHeightCount[0].value}</Styled.DataCell>
+            </Table.Row>
+          </Table.Body>
+        </Table>
+      </CaseCardComponent>
+    </Styled.Wrapper>
   );
 };
diff --git a/src/pages/ModelPages/Results/Results.styled.tsx b/src/pages/ModelPages/Results/Results.styled.tsx
deleted file mode 100644
index 6303e2e2..00000000
--- a/src/pages/ModelPages/Results/Results.styled.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import styled from 'styled-components';
-import { spacings } from '../../../tokens/spacings';
-
-export const TextDiv = styled.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-
-  row-gap: ${spacings.MEDIUM};
-`;

From a5df28af0500be609fad5e5016914c8f5f497498 Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Thu, 25 Jan 2024 08:12:29 +0100
Subject: [PATCH 08/10] fix: Refetch case data every 30 secunds.

---
 src/hooks/useFetchCases.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/hooks/useFetchCases.ts b/src/hooks/useFetchCases.ts
index e578c77d..10064124 100644
--- a/src/hooks/useFetchCases.ts
+++ b/src/hooks/useFetchCases.ts
@@ -17,6 +17,7 @@ export const useFetchCases = () => {
         modelId as string,
       ),
     enabled: !!token,
+    refetchInterval: 30000,
   });
 
   return query;

From 0df46e9a39326c3f447659daf88a67be8e66054c Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Thu, 25 Jan 2024 08:25:51 +0100
Subject: [PATCH 09/10] fix: Model table column cell adjustments.

---
 src/features/ModelTable/ModelTable.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/features/ModelTable/ModelTable.tsx b/src/features/ModelTable/ModelTable.tsx
index 7676f3d1..64e1a32d 100644
--- a/src/features/ModelTable/ModelTable.tsx
+++ b/src/features/ModelTable/ModelTable.tsx
@@ -145,6 +145,7 @@ export const ModelTable = ({
             id: 'isProcessed',
             header: 'Status',
             enableColumnFilter: false,
+            size: 50,
             cell: ({ row }) => (
               <>
                 {isActiveModel(row.original.analogueModelId) ? (
@@ -173,8 +174,8 @@ export const ModelTable = ({
             id: 'navigate',
             enableColumnFilter: false,
             enableResizing: false,
+            maxSize: 220,
             size: 200,
-            minSize: 200,
             cell: ({ row }) => (
               <Styled.Buttons>
                 <Button

From c9f7baec490a11305bfa980f5cdabf1afadf6965 Mon Sep 17 00:00:00 2001
From: mheggelund <maohe@equinor.com>
Date: Thu, 25 Jan 2024 11:56:56 +0100
Subject: [PATCH 10/10] fix: Rename state, set dismissable on outside click.

---
 src/features/ModelTable/ModelTable.tsx | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/features/ModelTable/ModelTable.tsx b/src/features/ModelTable/ModelTable.tsx
index 64e1a32d..4387cf1f 100644
--- a/src/features/ModelTable/ModelTable.tsx
+++ b/src/features/ModelTable/ModelTable.tsx
@@ -29,7 +29,7 @@ export const ModelTable = ({
   if (token) OpenAPI.TOKEN = token;
   const navigate = useNavigate();
 
-  const [toggle, setToggle] = useState<boolean>(false);
+  const [open, setOpen] = useState<boolean>(false);
   const [activeModel, setActiveModel] = useState<string>();
   const { isLoading, data } = useQuery({
     queryKey: ['analogue-models'],
@@ -192,7 +192,7 @@ export const ModelTable = ({
                   disabled={isActiveModel(row.original.analogueModelId)}
                   onClick={() => {
                     setActiveModel(row.original.analogueModelId);
-                    setToggle(!toggle);
+                    setOpen(!open);
                   }}
                 >
                   Set Areas
@@ -202,13 +202,11 @@ export const ModelTable = ({
           },
         ]}
       />
-      {activeModel && (
-        <Scrim open={toggle}>
-          <SideSheet open={toggle} onClose={() => setToggle(!toggle)}>
-            <AreaCoordinates modelId={activeModel} />
-          </SideSheet>
-        </Scrim>
-      )}
+      <Scrim open={open} isDismissable>
+        <SideSheet onClose={() => setOpen(!open)}>
+          {activeModel && <AreaCoordinates modelId={activeModel} />}
+        </SideSheet>
+      </Scrim>
     </Styled.Table>
   );
 };