diff --git a/src/components/@shared/FormFields/FilesInput/Info.module.css b/src/components/@shared/FormFields/FilesInput/Info.module.css
index 990e0ceed..c8687873d 100644
--- a/src/components/@shared/FormFields/FilesInput/Info.module.css
+++ b/src/components/@shared/FormFields/FilesInput/Info.module.css
@@ -33,6 +33,7 @@
.hideUrl {
filter: blur(0.2rem);
+ user-select: none;
}
.warning {
diff --git a/src/components/@shared/FormFields/FilesInput/Info.tsx b/src/components/@shared/FormFields/FilesInput/Info.tsx
index d156ff3b1..6f73d9b90 100644
--- a/src/components/@shared/FormFields/FilesInput/Info.tsx
+++ b/src/components/@shared/FormFields/FilesInput/Info.tsx
@@ -6,21 +6,21 @@ import { FileInfo as FileInfoData } from '@oceanprotocol/lib'
export default function FileInfo({
file,
- handleClose,
- hideUrl
+ handleClose
}: {
file: FileInfoData
handleClose(): void
- hideUrl?: boolean
}): ReactElement {
const contentTypeCleaned = file.contentType
? cleanupContentType(file.contentType)
: null
+ const hideUrl = file.type === 'hidden' || false
+
return (
- {file.url}
+ {hideUrl ? 'https://oceanprotocol/placeholder' : file.url}
- ✓ URL confirmed
diff --git a/src/components/@shared/FormFields/FilesInput/index.tsx b/src/components/@shared/FormFields/FilesInput/index.tsx
index 417dbe8bd..8d69164e6 100644
--- a/src/components/@shared/FormFields/FilesInput/index.tsx
+++ b/src/components/@shared/FormFields/FilesInput/index.tsx
@@ -1,9 +1,9 @@
-import React, { ReactElement, useEffect, useState } from 'react'
+import React, { ReactElement, useState } from 'react'
import { useField, useFormikContext } from 'formik'
import FileInfo from './Info'
import UrlInput from '../URLInput'
import { InputProps } from '@shared/FormInput'
-import { getFileDidInfo, getFileUrlInfo } from '@utils/provider'
+import { getFileUrlInfo } from '@utils/provider'
import { FormPublishData } from 'src/components/Publish/_types'
import { LoggerInstance } from '@oceanprotocol/lib'
import { useAsset } from '@context/Asset'
@@ -11,7 +11,6 @@ import { useAsset } from '@context/Asset'
export default function FilesInput(props: InputProps): ReactElement {
const [field, meta, helpers] = useField(props.name)
const [isLoading, setIsLoading] = useState(false)
- const [hideUrl, setHideUrl] = useState(false)
const { values, setFieldError } = useFormikContext()
const { asset } = useAsset()
@@ -48,37 +47,11 @@ export default function FilesInput(props: InputProps): ReactElement {
helpers.setValue(meta.initialValue)
}
- useEffect(() => {
- if (field.name === 'links' && asset?.metadata?.links) {
- handleValidation(null, asset.metadata.links[0])
- } else if (field.name === 'files') {
- getFileDidInfo(
- asset?.id,
- asset?.services[0]?.id,
- asset?.services[0]?.serviceEndpoint
- ).then((fileDidInfo) => {
- setHideUrl(true)
- // setting placeholder for url file to avoid txs for the url file during initializing
- helpers.setValue([
- {
- url: fileDidInfo[0].valid
- ? 'http://oceanprotocol.com/placeholder'
- : '',
- ...fileDidInfo[0]
- }
- ])
- })
- }
- }, [])
-
return (
<>
- {field?.value?.[0]?.valid === true ? (
-
+ {field?.value?.[0]?.valid === true ||
+ field?.value?.[0]?.type === 'hidden' ? (
+
) : (
()
// This component is handled by Formik so it's not rendered like a "normal" react component,
// so handleTimeoutCustomOption is called only once.
@@ -41,6 +44,34 @@ export default function FormEditMetadata({
timeoutOptionsArray.push('Forever')
}
+ useEffect(() => {
+ // let's initiate files with empty url (we can't access the asset url) with type hidden (for UI frontend)
+ setFieldValue('files', [
+ {
+ url: '',
+ type: 'hidden'
+ }
+ ])
+
+ const providerUrl = values?.services
+ ? values?.services[0].providerUrl.url
+ : asset.services[0].serviceEndpoint
+ // if we have a sample file, we need to get the files' info before setting defaults links value
+ asset?.metadata?.links?.[0] &&
+ getFileUrlInfo(asset.metadata.links[0], providerUrl).then(
+ (checkedFile) => {
+ console.log(checkedFile)
+ // initiate link with values from asset metadata
+ setFieldValue('links', [
+ {
+ url: asset.metadata.links[0],
+ ...checkedFile[0]
+ }
+ ])
+ }
+ )
+ }, [])
+
return (