Feat/download input files (#437)

* chore: generated api * feat: Added endpoint to download files. Added button to download files * chore: Removed a space
equinor · Feb 3, 2025 · 99c0fdb · 99c0fdb
1 parent d84ff24
commit 99c0fdb
Show file tree

Hide file tree

Showing 4 changed files with 203 additions and 5 deletions.
diff --git a/src/api/generated/services/DownloadsService.ts b/src/api/generated/services/DownloadsService.ts
@@ -15,12 +15,54 @@ export class DownloadsService {
      * @returns File Success
      * @throws ApiError
      */
-    public static getApiDownloads(
+    public static getApiDownloadsResqml(
         id: string,
     ): CancelablePromise<File> {
         return __request(OpenAPI, {
             method: 'GET',
-            url: '/api/downloads/{id}',
+            url: '/api/downloads/{id}/resqml',
+            path: {
+                'id': id,
+            },
+            errors: {
+                403: `Forbidden`,
+                404: `Not Found`,
+            },
+        });
+    }
+
+    /**
+     * @param id
+     * @returns File Success
+     * @throws ApiError
+     */
+    public static getApiDownloadsIni(
+        id: string,
+    ): CancelablePromise<File> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/api/downloads/{id}/ini',
+            path: {
+                'id': id,
+            },
+            errors: {
+                403: `Forbidden`,
+                404: `Not Found`,
+            },
+        });
+    }
+
+    /**
+     * @param id
+     * @returns File Success
+     * @throws ApiError
+     */
+    public static getApiDownloadsNc(
+        id: string,
+    ): CancelablePromise<File> {
+        return __request(OpenAPI, {
+            method: 'GET',
+            url: '/api/downloads/{id}/nc',
             path: {
                 'id': id,
             },

diff --git a/src/features/ModelView/ModelFilesView/ModelFilesView.tsx b/src/features/ModelView/ModelFilesView/ModelFilesView.tsx
@@ -1,16 +1,39 @@
+/* eslint-disable max-lines-per-function */
 import { Table, Typography } from '@equinor/eds-core-react';
-import { UploadList } from '../../../api/generated';
+import { UploadFileType, UploadList } from '../../../api/generated';
 import * as Styled from './ModelFilesView.styled';
 import {
   analogueModelDefault,
   usePepmContextStore,
 } from '../../../hooks/GlobalState';
+import IconButton from '../../../components/IconButton/IconButton';
+import { download } from '@equinor/eds-icons';
+import {
+  getFetchIniFileAxios,
+  getFetchNcFileAxios,
+  getFetchResqmlFileAxios,
+} from '../../../hooks/useFetchFile';
 
 export const ModelFilesView = () => {
   const { analogueModel } = usePepmContextStore();
 
   if (analogueModel === analogueModelDefault) return <p>Loading ...</p>;
 
+  const downloadFile = (fileType: UploadFileType) => {
+    switch (fileType) {
+      case UploadFileType.NET_CDF:
+        getFetchNcFileAxios(analogueModel);
+        break;
+      case UploadFileType.INI_DATA:
+        getFetchIniFileAxios(analogueModel);
+        break;
+      case UploadFileType.RES_QMLDATA:
+        getFetchResqmlFileAxios(analogueModel);
+        break;
+    }
+    return;
+  };
+
   return (
     <Styled.TableWrapper>
       <Typography variant="h3" as="h2">
@@ -21,6 +44,7 @@ export const ModelFilesView = () => {
           <Table.Row className="table-row">
             <Table.Cell>Model input files</Table.Cell>
             <Table.Cell>Size</Table.Cell>
+            <Table.Cell>Download</Table.Cell>
           </Table.Row>
         </Table.Head>
         <Table.Body>
@@ -31,6 +55,13 @@ export const ModelFilesView = () => {
               <Table.Row key={file.uploadId} className="table-row">
                 <Table.Cell>{file.originalFileName}</Table.Cell>
                 <Table.Cell>-</Table.Cell>
+                <Table.Cell>
+                  <IconButton
+                    icon={download}
+                    title="download"
+                    onClick={() => downloadFile(file.uploadFileType)}
+                  />
+                </Table.Cell>
               </Table.Row>
             ))
           ) : (
@@ -39,6 +70,23 @@ export const ModelFilesView = () => {
               <Table.Cell>-</Table.Cell>
             </Table.Row>
           )}
+          {analogueModel !== analogueModelDefault &&
+          analogueModel.isProcessed === true ? (
+            <Table.Row>
+              <Table.Cell>Resqml.zip</Table.Cell>
+              <Table.Cell>-</Table.Cell>
+              <Table.Cell>
+                {' '}
+                <IconButton
+                  icon={download}
+                  title="download"
+                  onClick={() => downloadFile(UploadFileType.RES_QMLDATA)}
+                />
+              </Table.Cell>
+            </Table.Row>
+          ) : (
+            <></>
+          )}
         </Table.Body>
       </Styled.FileTable>
     </Styled.TableWrapper>

diff --git a/src/hooks/useFetchFile.tsx b/src/hooks/useFetchFile.tsx
@@ -0,0 +1,107 @@
+import { AnalogueModelDetail, OpenAPI, UploadFileType } from '../api/generated';
+import axios from 'axios';
+
+export const getFetchIniFileAxios = async (
+  analogueModel: AnalogueModelDetail,
+): Promise<string> => {
+  const token = OpenAPI.TOKEN; // replace with your bearer token
+  const base = OpenAPI.BASE;
+
+  const response = await axios.get(
+    `/api/downloads/${analogueModel.analogueModelId}/ini`,
+    {
+      headers: { Authorization: `Bearer ${token}` },
+      responseType: 'blob', // response type of blob to handle images
+      baseURL: base,
+    },
+  );
+
+  if (response.data) {
+    const fileURL = window.URL.createObjectURL(response.data);
+
+    const link = document.createElement('a');
+    link.href = fileURL;
+    link.download =
+      analogueModel.fileUploads.find(
+        (x) => x.uploadFileType === UploadFileType.INI_DATA,
+      )?.originalFileName || 'file.ini';
+
+    document.body.appendChild(link);
+    link.click();
+
+    document.body.removeChild(link);
+    URL.revokeObjectURL(fileURL);
+  }
+
+  // create an object URL for the image blob and return it
+  return URL.createObjectURL(response.data);
+};
+
+export const getFetchNcFileAxios = async (
+  analogueModel: AnalogueModelDetail,
+): Promise<string> => {
+  const token = OpenAPI.TOKEN; // replace with your bearer token
+  const base = OpenAPI.BASE;
+
+  const response = await axios.get(
+    `/api/downloads/${analogueModel.analogueModelId}/nc`,
+    {
+      headers: { Authorization: `Bearer ${token}` },
+      responseType: 'blob', // response type of blob to handle images
+      baseURL: base,
+    },
+  );
+
+  if (response.data) {
+    const fileURL = window.URL.createObjectURL(response.data);
+
+    const link = document.createElement('a');
+    link.href = fileURL;
+    link.download =
+      analogueModel.fileUploads.find(
+        (x) => x.uploadFileType === UploadFileType.NET_CDF,
+      )?.originalFileName || 'file.nc';
+
+    document.body.appendChild(link);
+    link.click();
+
+    document.body.removeChild(link);
+    URL.revokeObjectURL(fileURL);
+  }
+
+  // create an object URL for the image blob and return it
+  return URL.createObjectURL(response.data);
+};
+
+export const getFetchResqmlFileAxios = async (
+  analogueModel: AnalogueModelDetail,
+): Promise<string> => {
+  const token = OpenAPI.TOKEN; // replace with your bearer token
+  const base = OpenAPI.BASE;
+
+  const response = await axios.get(
+    `/api/downloads/${analogueModel.analogueModelId}/resqml`,
+    {
+      headers: { Authorization: `Bearer ${token}` },
+      responseType: 'blob', // response type of blob to handle images
+      baseURL: base,
+    },
+  );
+
+  if (response.data) {
+    const fileURL = window.URL.createObjectURL(response.data);
+
+    const link = document.createElement('a');
+    link.href = fileURL;
+    link.download = 'Resqml.zip';
+
+    document.body.appendChild(link);
+    link.click();
+
+    document.body.removeChild(link);
+    URL.revokeObjectURL(fileURL);
+  }
+
+  // create an object URL for the image blob and return it
+  return URL.createObjectURL(response.data);
+};
diff --git a/src/pages/Browse/Browse.tsx b/src/pages/Browse/Browse.tsx
@@ -55,8 +55,9 @@ export const Browse = () => {
                 ? 'Export all to Excel...'
                 : 'Export to Excel...'}
             </Button>
-            {exportModels.length === 0 ? 'All ' : exportModels.length + ' '}
-            selected
+            {exportModels.length === 0
+              ? ''
+              : exportModels.length + '   selected'}
           </div>
         ) : (
           <></>