From 704b52a3c4d53e48a18cae352f68a759f245f0b4 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Thu, 11 Nov 2021 13:40:38 +0000 Subject: [PATCH] more publish flow preparation * consolidate scattered methods into publish utils * new encrypt method * remove DDO File typings --- src/@types/DDO/File.d.ts | 18 ----- src/@utils/ddo.ts | 27 ------- src/@utils/provider.ts | 68 ++-------------- src/components/@shared/FileIcon/index.tsx | 1 + .../Form/FormFields/FilesInput/Info.tsx | 3 +- .../Form/FormFields/FilesInput/index.tsx | 4 +- .../Asset/AssetActions/Compute/index.tsx | 1 + src/components/Asset/AssetActions/Consume.tsx | 1 + .../AssetActions/Edit/FormEditMetadata.tsx | 1 - src/components/Asset/AssetActions/index.tsx | 4 +- src/components/Publish/Actions/index.tsx | 8 +- src/components/Publish/Debug.tsx | 8 +- src/components/Publish/Navigation/index.tsx | 12 +-- src/components/Publish/Preview/index.tsx | 1 - src/components/Publish/Steps.tsx | 13 +-- src/components/Publish/_constants.tsx | 16 ++-- src/components/Publish/_types.ts | 7 +- src/components/Publish/_utils.ts | 81 +++++++++++++------ src/components/Publish/index.tsx | 32 +++++--- 19 files changed, 126 insertions(+), 180 deletions(-) delete mode 100644 src/@types/DDO/File.d.ts diff --git a/src/@types/DDO/File.d.ts b/src/@types/DDO/File.d.ts deleted file mode 100644 index 79ba55e53..000000000 --- a/src/@types/DDO/File.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -// This is all super questionable, -// but we most likely need something to represent what we get -// back from fileinfo endpoint in Provider. But then should be moved out of DDO typings. - -interface FileMetadata { - url: string - contentType: string - name?: string - checksum?: string - checksumType?: string - contentLength?: string - encoding?: string - compression?: string - encrypted?: boolean - encryptionMode?: string - resourceId?: string - attributes?: { [key: string]: any } -} diff --git a/src/@utils/ddo.ts b/src/@utils/ddo.ts index 27d7e03df..1046b70a0 100644 --- a/src/@utils/ddo.ts +++ b/src/@utils/ddo.ts @@ -1,5 +1,3 @@ -import slugify from 'slugify' - export function getServiceByName( ddo: Asset | DDO, name: 'access' | 'compute' @@ -10,16 +8,6 @@ export function getServiceByName( return service } -export function dateToStringNoMS(date: Date): string { - return date.toISOString().replace(/\.[0-9]{3}Z/, 'Z') -} - -export function transformTags(value: string): string[] { - const originalTags = value?.split(',') - const transformedTags = originalTags?.map((tag) => slugify(tag).toLowerCase()) - return transformedTags -} - export function mapTimeoutStringToSeconds(timeout: string): number { switch (timeout) { case 'Forever': @@ -68,18 +56,3 @@ export function secondsToString(numberOfSeconds: number): string { ? `${seconds} second${numberEnding(seconds)}` : 'less than a second' } - -export function checkIfTimeoutInPredefinedValues( - timeout: string, - timeoutOptions: string[] -): boolean { - if (timeoutOptions.indexOf(timeout) > -1) { - return true - } - return false -} - -export function getUrlFileExtension(fileUrl: string): string { - const splitedFileUrl = fileUrl.split('.') - return splitedFileUrl[splitedFileUrl.length - 1] -} diff --git a/src/@utils/provider.ts b/src/@utils/provider.ts index f5812f0ed..27ff5a5b2 100644 --- a/src/@utils/provider.ts +++ b/src/@utils/provider.ts @@ -1,70 +1,16 @@ import axios, { CancelToken, AxiosResponse } from 'axios' -import { toast } from 'react-toastify' import { DID, Logger } from '@oceanprotocol/lib' -export async function fileinfo( - url: string, - providerUri: string, - cancelToken: CancelToken -): Promise { - try { - const response = (await axios.post( - `${providerUri}/api/v1/services/fileinfo`, - { - url, - cancelToken - } - )) as AxiosResponse< - { valid: boolean; contentLength: string; contentType: string }[] - > - - if (!response || response.status !== 200 || !response.data) { - toast.error('Could not connect to File API') - return - } - if (!response.data[0] || !response.data[0].valid) { - toast.error( - 'The data file URL you entered apears to be invalid. Please check URL and try again', - { - autoClose: false, - hideProgressBar: false, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined - } - ) - return - } else { - toast.dismiss() // Remove any existing error message - toast.success('Great! That file looks good. 🐳', { - position: 'bottom-right', - autoClose: 5000, - hideProgressBar: false, - closeOnClick: true, - pauseOnHover: true, - draggable: true, - progress: undefined - }) - } - - const { contentLength, contentType } = response.data[0] - - return { - contentLength: contentLength || '', - contentType: contentType || '', // need to do that cause lib-js File interface requires contentType - url - } - } catch (error) { - Logger.error(error.message) - } +export interface FileMetadata { + contentType: string + contentLength: string } export async function getFileInfo( url: string | DID, providerUri: string, cancelToken: CancelToken -): Promise { +): Promise { let postBody try { if (url instanceof DID) @@ -75,10 +21,12 @@ export async function getFileInfo( postBody = { url } - const response = await axios.post( + const response: AxiosResponse = await axios.post( `${providerUri}/api/v1/services/fileinfo`, postBody, - { cancelToken } + { + cancelToken + } ) if (!response || response.status !== 200 || !response.data) return diff --git a/src/components/@shared/FileIcon/index.tsx b/src/components/@shared/FileIcon/index.tsx index b0afc17b0..40748ad7b 100644 --- a/src/components/@shared/FileIcon/index.tsx +++ b/src/components/@shared/FileIcon/index.tsx @@ -4,6 +4,7 @@ import classNames from 'classnames/bind' import cleanupContentType from '@utils/cleanupContentType' import styles from './index.module.css' import Loader from '@shared/atoms/Loader' +import { FileMetadata } from '@utils/provider' const cx = classNames.bind(styles) diff --git a/src/components/@shared/Form/FormFields/FilesInput/Info.tsx b/src/components/@shared/Form/FormFields/FilesInput/Info.tsx index 356041681..5d54fd961 100644 --- a/src/components/@shared/Form/FormFields/FilesInput/Info.tsx +++ b/src/components/@shared/Form/FormFields/FilesInput/Info.tsx @@ -3,6 +3,7 @@ import { prettySize } from './utils' import cleanupContentType from '@utils/cleanupContentType' import styles from './Info.module.css' import { useField, useFormikContext } from 'formik' +import { FileMetadata } from '@utils/provider' export default function FileInfo({ name, @@ -21,7 +22,7 @@ export default function FileInfo({ return (
-

{file.url}

+ {/*

{file}

*/}
  • URL confirmed
    • {file.contentLength &&
  • {prettySize(+file.contentLength)}
    • } diff --git a/src/components/@shared/Form/FormFields/FilesInput/index.tsx b/src/components/@shared/Form/FormFields/FilesInput/index.tsx index 461c435e9..2d0a05a0e 100644 --- a/src/components/@shared/Form/FormFields/FilesInput/index.tsx +++ b/src/components/@shared/Form/FormFields/FilesInput/index.tsx @@ -4,7 +4,7 @@ import { toast } from 'react-toastify' import FileInfo from './Info' import CustomInput from '../URLInput/Input' import { InputProps } from '@shared/Form/Input' -import { fileinfo } from '@utils/provider' +import { getFileInfo } from '@utils/provider' import { useWeb3 } from '@context/Web3' import { getOceanConfig } from '@utils/ocean' import { useCancelToken } from '@hooks/useCancelToken' @@ -22,7 +22,7 @@ export default function FilesInput(props: InputProps): ReactElement { async function validateUrl() { try { setIsLoading(true) - const checkedFile = await fileinfo( + const checkedFile = await getFileInfo( fileUrl, config?.providerUri, newCancelToken() diff --git a/src/components/Asset/AssetActions/Compute/index.tsx b/src/components/Asset/AssetActions/Compute/index.tsx index 3955ea607..8aa849719 100644 --- a/src/components/Asset/AssetActions/Compute/index.tsx +++ b/src/components/Asset/AssetActions/Compute/index.tsx @@ -34,6 +34,7 @@ import ComputeJobs from '../../../Profile/History/ComputeJobs' import { useCancelToken } from '@hooks/useCancelToken' import { useIsMounted } from '@hooks/useIsMounted' import { SortTermOptions } from '../../../../@types/aquarius/SearchQuery' +import { FileMetadata } from '@utils/provider' export default function Compute({ dtBalance, diff --git a/src/components/Asset/AssetActions/Consume.tsx b/src/components/Asset/AssetActions/Consume.tsx index db9c6a481..d6acf3e80 100644 --- a/src/components/Asset/AssetActions/Consume.tsx +++ b/src/components/Asset/AssetActions/Consume.tsx @@ -17,6 +17,7 @@ import { secondsToString } from '@utils/ddo' import AlgorithmDatasetsListForCompute from './Compute/AlgorithmDatasetsListForCompute' import styles from './Consume.module.css' import { useIsMounted } from '@hooks/useIsMounted' +import { FileMetadata } from '@utils/provider' const previousOrderQuery = gql` query PreviousOrder($id: String!, $account: String!) { diff --git a/src/components/Asset/AssetActions/Edit/FormEditMetadata.tsx b/src/components/Asset/AssetActions/Edit/FormEditMetadata.tsx index 4651053f6..dda38a942 100644 --- a/src/components/Asset/AssetActions/Edit/FormEditMetadata.tsx +++ b/src/components/Asset/AssetActions/Edit/FormEditMetadata.tsx @@ -2,7 +2,6 @@ import React, { ChangeEvent, ReactElement } from 'react' import { Field, Form, FormikContextType, useFormikContext } from 'formik' import { useOcean } from '@context/Ocean' import Input, { InputProps } from '@shared/Form/Input' -import { checkIfTimeoutInPredefinedValues } from '@utils/ddo' import FormActions from './FormActions' import styles from './FormEditMetadata.module.css' import { FormPublishData } from '../../../Publish/_types' diff --git a/src/components/Asset/AssetActions/index.tsx b/src/components/Asset/AssetActions/index.tsx index cd76e83dc..a1ca0c08c 100644 --- a/src/components/Asset/AssetActions/index.tsx +++ b/src/components/Asset/AssetActions/index.tsx @@ -10,7 +10,7 @@ import { useAsset } from '@context/Asset' import { useOcean } from '@context/Ocean' import { useWeb3 } from '@context/Web3' import Web3Feedback from '@shared/Web3Feedback' -import { getFileInfo } from '@utils/provider' +import { FileMetadata, getFileInfo } from '@utils/provider' import { getOceanConfig } from '@utils/ocean' import { useCancelToken } from '@hooks/useCancelToken' import { useIsMounted } from '@hooks/useIsMounted' @@ -23,7 +23,7 @@ export default function AssetActions(): ReactElement { const [isBalanceSufficient, setIsBalanceSufficient] = useState() const [dtBalance, setDtBalance] = useState() - const [fileMetadata, setFileMetadata] = useState(Object) + const [fileMetadata, setFileMetadata] = useState() const [fileIsLoading, setFileIsLoading] = useState(false) const isCompute = Boolean( ddo?.services.filter((service) => service.type === 'compute')[0] diff --git a/src/components/Publish/Actions/index.tsx b/src/components/Publish/Actions/index.tsx index c3404ee43..d24b164e5 100644 --- a/src/components/Publish/Actions/index.tsx +++ b/src/components/Publish/Actions/index.tsx @@ -21,21 +21,21 @@ export default function Actions({ function handleNext(e: FormEvent) { e.preventDefault() - setFieldValue('step', values.step + 1) + setFieldValue('stepCurrent', values.stepCurrent + 1) scrollToRef.current.scrollIntoView() } function handlePrevious(e: FormEvent) { e.preventDefault() - setFieldValue('step', values.step - 1) + setFieldValue('stepCurrent', values.stepCurrent - 1) scrollToRef.current.scrollIntoView() } return (