feat: ini upload (#375)

* feat: adding functionality to upload ini File

* feat: ini file

* chore: moved files

src/api/custom/postIniFile.ts

@@ -0,0 +1,26 @@
+import axios from 'axios';
+import { OpenAPI } from '../generated';
+import type { UploadIniFileCommandResponse } from '../generated/models/UploadIniFileCommandResponse';
+
+export const postIniFile = async (
+  modelId: string,
+  formData: FormData,
+): Promise<UploadIniFileCommandResponse> => {
+  const token = OpenAPI.TOKEN; // replace with your bearer token
+  const base = OpenAPI.BASE;
+
+  const response = await axios.post(
+    `/api/uploads/models/${modelId}/ini-file`,
+    formData,
+    {
+      headers: {
+        Authorization: `Bearer ${token}`,
+        'Content-Type': 'multipart/form-data',
+      },
+      baseURL: base,
+    },
+  );
+
+  // create an object URL for the image blob and return it
+  return response;
+};

src/api/generated/index.ts

@@ -24,6 +24,7 @@ export type { AddMetadataResponseDto } from './models/AddMetadataResponseDto';
 export type { AddParameterDto } from './models/AddParameterDto';
 export type { AddStatigraphicGroupForm } from './models/AddStatigraphicGroupForm';
 export type { AddStratigraphicGroupCommandResponse } from './models/AddStratigraphicGroupCommandResponse';
+export type { AnalogueModelConfigurationDto } from './models/AnalogueModelConfigurationDto';
 export type { AnalogueModelDetail } from './models/AnalogueModelDetail';
 export type { AnalogueModelImageDto } from './models/AnalogueModelImageDto';
 export type { AnalogueModelList } from './models/AnalogueModelList';
@@ -35,6 +36,7 @@ export type { ComputeCaseInputSettingsDto } from './models/ComputeCaseInputSetti
 export type { ComputeCaseModelAreaDto } from './models/ComputeCaseModelAreaDto';
 export { ComputeJobStatus } from './models/ComputeJobStatus';
 export { ComputeType } from './models/ComputeType';
+export type { ConfigurationParameterDto } from './models/ConfigurationParameterDto';
 export type { ConvertAnalogueModelCommand } from './models/ConvertAnalogueModelCommand';
 export type { ConvertAnalogueModelCommandResponse } from './models/ConvertAnalogueModelCommandResponse';
 export type { ConvertAnalogueModelDto } from './models/ConvertAnalogueModelDto';
@@ -154,6 +156,8 @@ export type { UploadChunkCommandResponse } from './models/UploadChunkCommandResp
 export type { UploadDetail } from './models/UploadDetail';
 export { UploadFileCategory } from './models/UploadFileCategory';
 export { UploadFileType } from './models/UploadFileType';
+export type { UploadIniFileCommandResponse } from './models/UploadIniFileCommandResponse';
+export type { UploadIniFileDto } from './models/UploadIniFileDto';
 export type { UploadList } from './models/UploadList';
 export { UploadStatus } from './models/UploadStatus';
 

src/api/generated/models/AnalogueModelConfigurationDto.ts

@@ -0,0 +1,27 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+import type { ConfigurationParameterDto } from './ConfigurationParameterDto';
+
+export type AnalogueModelConfigurationDto = {
+    analogueModelConfigurationId?: string;
+    analogueModelId?: string;
+    template?: ConfigurationParameterDto;
+    simStopTime?: ConfigurationParameterDto;
+    outputInterval?: ConfigurationParameterDto;
+    basinSlope?: ConfigurationParameterDto;
+    channelWidth?: ConfigurationParameterDto;
+    riverLength?: ConfigurationParameterDto;
+    riverDischargeIni?: ConfigurationParameterDto;
+    riverDischargeFin?: ConfigurationParameterDto;
+    tidalAmplitude?: ConfigurationParameterDto;
+    waveHeightIni?: ConfigurationParameterDto;
+    waveHeightFin?: ConfigurationParameterDto;
+    waveDirection?: ConfigurationParameterDto;
+    subsidenceLand?: ConfigurationParameterDto;
+    subsidenceSea?: ConfigurationParameterDto;
+    composition?: ConfigurationParameterDto;
+};
+

src/api/generated/models/AnalogueModelDetail.ts

@@ -3,6 +3,7 @@
 /* tslint:disable */
 /* eslint-disable */
 
+import type { AnalogueModelConfigurationDto } from './AnalogueModelConfigurationDto';
 import type { AnalogueModelImageDto } from './AnalogueModelImageDto';
 import type { AnalogueModelSourceType } from './AnalogueModelSourceType';
 import type { GeologicalGroupDto } from './GeologicalGroupDto';
@@ -32,6 +33,7 @@ export type AnalogueModelDetail = {
     geologicalGroups: Array<GeologicalGroupDto>;
     outcrops: Array<OutcropDto>;
     processingStatus: JobStatus;
-    analogueModelImage?: AnalogueModelImageDto;
+    analogueModelImage: AnalogueModelImageDto;
+    iniParameters: AnalogueModelConfigurationDto;
 };
 

src/api/generated/models/AnalogueModelList.ts

@@ -3,6 +3,7 @@
 /* tslint:disable */
 /* eslint-disable */
 
+import type { AnalogueModelConfigurationDto } from './AnalogueModelConfigurationDto';
 import type { AnalogueModelSourceType } from './AnalogueModelSourceType';
 import type { GeologicalGroupDto } from './GeologicalGroupDto';
 import type { JobStatus } from './JobStatus';
@@ -21,6 +22,7 @@ export type AnalogueModelList = {
     stratigraphicGroups: Array<StratigraphicGroupDto>;
     geologicalGroups: Array<GeologicalGroupDto>;
     outcrops: Array<OutcropDto>;
+    iniParameters: AnalogueModelConfigurationDto;
     analogueModelId: string;
     name: string;
     description: string;

src/api/generated/models/ConfigurationParameterDto.ts

@@ -0,0 +1,11 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type ConfigurationParameterDto = {
+    name?: string | null;
+    value?: string | null;
+    description?: string | null;
+};
+

src/api/generated/models/UploadFileType.ts

@@ -7,4 +7,5 @@ export enum UploadFileType {
     NET_CDF = 'NetCDF',
     RES_QMLEPC = 'ResQMLEpc',
     RES_QMLDATA = 'ResQMLData',
+    INI_DATA = 'IniData',
 }

src/api/generated/models/UploadIniFileCommandResponse.ts

@@ -0,0 +1,15 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+import type { UploadIniFileDto } from './UploadIniFileDto';
+
+export type UploadIniFileCommandResponse = {
+    success?: boolean;
+    count?: number | null;
+    message?: string | null;
+    validationErrors?: Array<string> | null;
+    data: UploadIniFileDto;
+};
+

src/api/generated/models/UploadIniFileDto.ts

@@ -0,0 +1,17 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+import type { UploadFileCategory } from './UploadFileCategory';
+import type { UploadFileType } from './UploadFileType';
+import type { UploadStatus } from './UploadStatus';
+
+export type UploadIniFileDto = {
+    uploadId: string;
+    originalFileName: string;
+    uploadStatus: UploadStatus;
+    uploadFileType: UploadFileType;
+    uploadFileCategory: UploadFileCategory;
+};
+

src/api/generated/services/UploadsService.ts

@@ -9,6 +9,7 @@ import type { PrepareChunkedUploadCommandResponse } from '../models/PrepareChunk
 import type { UploadAnalogueModelCommandResponse } from '../models/UploadAnalogueModelCommandResponse';
 import type { UploadChunkCommandResponse } from '../models/UploadChunkCommandResponse';
 import type { UploadFileType } from '../models/UploadFileType';
+import type { UploadIniFileCommandResponse } from '../models/UploadIniFileCommandResponse';
 
 import type { CancelablePromise } from '../core/CancelablePromise';
 import { OpenAPI } from '../core/OpenAPI';
@@ -155,4 +156,37 @@ export class UploadsService {
         });
     }
 
+    /**
+     * @param id
+     * @param formData
+     * @returns UploadIniFileCommandResponse Success
+     * @throws ApiError
+     */
+    public static postApiUploadsModelsIniFile(
+        id: string,
+        formData?: {
+            ContentType?: string;
+            ContentDisposition?: string;
+            Headers?: Record<string, Array<string>>;
+            Length?: number;
+            Name?: string;
+            FileName?: string;
+        },
+    ): CancelablePromise<UploadIniFileCommandResponse> {
+        return __request(OpenAPI, {
+            method: 'POST',
+            url: '/api/uploads/models/{id}/ini-file',
+            path: {
+                'id': id,
+            },
+            formData: formData,
+            mediaType: 'multipart/form-data',
+            errors: {
+                400: `Bad Request`,
+                403: `Forbidden`,
+                404: `Not Found`,
+            },
+        });
+    }
+
 }

src/components/AreaCoordinates/AreaCoordinates.tsx → src/features/AreaCoordinates/AreaCoordinates.tsx

@@ -16,8 +16,6 @@ import {
   ModelAreaTypeDto,
 } from '../../api/generated';
 import { useMutateAreaCoordinates } from '../../hooks/useMutateAreaCoordinates';
-import { ErrorMessage } from '../ErrorMessage/ErrorMessage';
-import { AnalogueModelImageView } from '../ImageView/AnalogueModelImageView';
 import * as Styled from './AreaCoordinates.styled';
 import { CoordinateInput } from './CoordinateInput/CoordinateInput';
 import {
@@ -29,6 +27,8 @@ import {
   analogueModelDefault,
   usePepmContextStore,
 } from '../../hooks/GlobalState';
+import { ErrorMessage } from './ErrorMessage/ErrorMessage';
+import { AnalogueModelImageView } from './ImageView/AnalogueModelImageView';
 
 export type AreaCoordinateType = {
   modelAreaId: string;

src/components/ErrorMessage/ErrorMessage.tsx → src/features/AreaCoordinates/ErrorMessage/ErrorMessage.tsx

@@ -1,5 +1,5 @@
 import { Typography } from '@equinor/eds-core-react';
-import { CoordinateErrorType } from '../AreaCoordinates/hooks/AreaCoordinates.hooks';
+import { CoordinateErrorType } from '../hooks/AreaCoordinates.hooks';
 
 export const ErrorMessage = ({ errors }: { errors: CoordinateErrorType }) => {
   return (

src/components/ImageView/AnalogueModelImageView.styled.tsx → src/features/AreaCoordinates/ImageView/AnalogueModelImageView.styled.tsx

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
-import { spacings } from '../../tokens/spacings';
-import { theme } from '../../tokens/theme';
+import { theme } from '../../../tokens/theme';
+import { spacings } from '../../../tokens/spacings';
 
 export const ImageWrapper = styled.div`
   display: flex;

src/components/ImageView/AnalogueModelImageView.tsx → src/features/AreaCoordinates/ImageView/AnalogueModelImageView.tsx

@@ -1,8 +1,8 @@
 import { Typography } from '@equinor/eds-core-react';
-import { AreaCoordinateType } from '../AreaCoordinates/AreaCoordinates';
+import { AreaCoordinateType } from '../../AreaCoordinates/AreaCoordinates';
 import { ModelImageCanvas } from './ModelImageCanvas/ModelImageCanvas';
 import { CanvasWrapper } from './AnalogueModelImageView.styled';
-import { usePepmContextStore } from '../../hooks/GlobalState';
+import { usePepmContextStore } from '../../../hooks/GlobalState';
 
 export const AnalogueModelImageView = ({
   coordinateBox,

src/components/ImageView/ModelImageCanvas/ModelImageCanvas.tsx → src/features/AreaCoordinates/ImageView/ModelImageCanvas/ModelImageCanvas.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from 'react';
-import { ImageMetadataDto } from '../../../api/generated';
-import { AreaCoordinateType } from '../../AreaCoordinates/AreaCoordinates';
+import { AreaCoordinateType } from '../../../AreaCoordinates/AreaCoordinates';
+import { ImageMetadataDto } from '../../../../api/generated';
 
 export const ModelImageCanvas = ({
   imageData,

src/features/HandleModel/FileColumn/FileColumn.tsx → src/features/HandleModel/FileRow/FileRow.tsx

@@ -3,7 +3,7 @@ import { delete_to_trash as deleteIcon } from '@equinor/eds-icons';
 import { ChangeEvent } from 'react';
 import IconButton from '../../../components/IconButton/IconButton';
 import { FileUploader } from '../FileUploader/FileUploader';
-import * as Styled from './FileColumn.styled';
+import * as Styled from './FileRow.styled';
 
 type FileDisplay = { isVisible: boolean; toggle: () => void };
 
@@ -15,7 +15,7 @@ interface FileColumnProps {
   fileDisplay?: FileDisplay;
   fileSize?: number;
 }
-export const FileColumn = ({
+export const FileRow = ({
   onChange,
   onDelete,
   INI,

src/features/HandleModel/FileUploader/FileUploader.tsx

@@ -27,7 +27,10 @@ export const FileUploader = ({
     <>{file.name}</>
   ) : (
     <form method="post" encType="multipart/form-data">
-      <FileUpload htmlFor="file-upload" className="custom-file-upload">
+      <FileUpload
+        htmlFor={`${acceptType.toLowerCase()}`}
+        className="custom-file-upload"
+      >
         {INI && (
           <Icon fill={theme.light.text.staticIconsTertiary} data={arrowIcon} />
         )}
@@ -36,7 +39,7 @@ export const FileUploader = ({
         </SelectFile>
         {INI && '(optional)'}
         <input
-          id="file-upload"
+          id={`${acceptType.toLowerCase()}`}
           required={!INI}
           type="file"
           accept={`.${acceptType.toLowerCase()}`}

src/features/HandleModel/HandleModelComponent/HandleModelComponent.hooks.ts

@@ -2,21 +2,9 @@ import { useEffect } from 'react';
 import { AnalogueModelDetail } from '../../../api/generated';
 import { ErrorType, FilesProps } from './HandleModelComponent';
 export const useHandleModelComponent = (
-  setFileSize: React.Dispatch<React.SetStateAction<number>>,
   setMetadata: React.Dispatch<React.SetStateAction<AnalogueModelDetail>>,
-  files: FilesProps,
-  rawFile?: File,
   existingData?: AnalogueModelDetail,
 ) => {
-  useEffect(() => {
-    if (rawFile === undefined) return;
-    setFileSize(rawFile.size);
-  }, [rawFile, setFileSize]);
-
-  useEffect(() => {
-    if (files.NC === undefined) setFileSize(0);
-  }, [files, setFileSize]);
-
   useEffect(() => {
     if (existingData) setMetadata(existingData);
   }, [existingData, setMetadata]);

src/features/HandleModel/HandleModelComponent/HandleModelComponent.styled.ts

@@ -1,6 +1,7 @@
 import styled from 'styled-components';
 import { spacings } from '../../../tokens/spacings';
 import { theme } from '../../../tokens/theme';
+import { TextField } from '@equinor/eds-core-react';
 
 export const Wrapper = styled.div`
   display: flex;
@@ -52,3 +53,9 @@ export const InfoNavigation = styled.div`
 
   row-gap: ${spacings.MEDIUM};
 `;
+
+export const IniFileTextField = styled(TextField)`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${spacings.MEDIUM};
+`;