Merge branch 'feature/v4-c2d' into fix/issue-1069-c2d-unsupported-networks

src/@context/Asset.tsx

@@ -27,6 +27,7 @@ export interface AssetProviderValue {
   error?: string
   isAssetNetwork: boolean
   isV3Asset: boolean
+  isOwner: boolean
   oceanConfig: Config
   loading: boolean
   fetchAsset: (token?: CancelToken) => Promise<void>
@@ -49,6 +50,7 @@ function AssetProvider({
   const [asset, setAsset] = useState<AssetExtended>()
   const [title, setTitle] = useState<string>()
   const [owner, setOwner] = useState<string>()
+  const [isOwner, setIsOwner] = useState<boolean>()
   const [error, setError] = useState<string>()
   const [loading, setLoading] = useState(false)
   const [isAssetNetwork, setIsAssetNetwork] = useState<boolean>()
@@ -140,6 +142,16 @@ function AssetProvider({
     setIsAssetNetwork(isAssetNetwork)
   }, [chainId, asset?.chainId])
 
+  // -----------------------------------
+  // Asset owner check against wallet user
+  // -----------------------------------
+  useEffect(() => {
+    if (!accountId || !owner) return
+
+    const isOwner = accountId?.toLowerCase() === owner.toLowerCase()
+    setIsOwner(isOwner)
+  }, [accountId, owner])
+
   // -----------------------------------
   // Load ocean config based on asset network
   // -----------------------------------
@@ -172,6 +184,7 @@ function AssetProvider({
           fetchAsset,
           isAssetNetwork,
           isV3Asset,
+          isOwner,
           oceanConfig
         } as AssetProviderValue
       }

src/@utils/compute.ts

@@ -151,19 +151,20 @@ export async function getComputeEnviroment(
 
 export function getQueryString(
   trustedAlgorithmList: PublisherTrustedAlgorithm[],
+  trustedPublishersList: string[],
   chainId?: number
 ): SearchQuery {
-  const algorithmDidList = trustedAlgorithmList.map((x) => x.did)
+  const algorithmDidList = trustedAlgorithmList?.map((x) => x.did)
 
   const baseParams = {
     chainIds: [chainId],
     sort: { sortBy: SortTermOptions.Created },
-    filters: [
+    filters: [getFilterTerm('metadata.type', 'algorithm')]
-      getFilterTerm('metadata.type', 'algorithm'),
-      algorithmDidList.length > 0 && getFilterTerm('_id', algorithmDidList)
-    ]
   } as BaseQueryParams
-
+  algorithmDidList?.length > 0 &&
+    baseParams.filters.push(getFilterTerm('_id', algorithmDidList))
+  trustedPublishersList?.length > 0 &&
+    baseParams.filters.push(getFilterTerm('nft.owner', trustedPublishersList))
   const query = generateBaseQuery(baseParams)
 
   return query
@@ -174,19 +175,25 @@ export async function getAlgorithmsForAsset(
   token: CancelToken
 ): Promise<Asset[]> {
   const computeService: Service = getServiceByName(asset, 'compute')
-  const publisherTrustedAlgorithms =
-    computeService.compute.publisherTrustedAlgorithms || []
 
-  let algorithms: Asset[]
+  if (
-  if (!computeService.compute) {
+    !computeService.compute ||
-    algorithms = []
+    (computeService.compute.publisherTrustedAlgorithms?.length === 0 &&
-  } else {
+      computeService.compute.publisherTrustedAlgorithmPublishers?.length === 0)
+  ) {
+    return []
+  }
+
   const gueryResults = await queryMetadata(
-      getQueryString(publisherTrustedAlgorithms, asset.chainId),
+    getQueryString(
+      computeService.compute.publisherTrustedAlgorithms,
+      computeService.compute.publisherTrustedAlgorithmPublishers,
+      asset.chainId
+    ),
     token
   )
-    algorithms = gueryResults?.results
+
-  }
+  const algorithms: Asset[] = gueryResults?.results
   return algorithms
 }
 
@@ -356,7 +363,7 @@ export async function transformComputeFormToServiceComputeOptions(
   cancelToken: CancelToken
 ): Promise<ServiceComputeOptions> {
   const publisherTrustedAlgorithms = values.allowAllPublishedAlgorithms
-    ? null
+    ? []
     : await createTrustedAlgorithmList(
         values.publisherTrustedAlgorithms,
         assetChainId,

src/@utils/order.ts

@@ -155,6 +155,55 @@ export async function reuseOrder(
   return tx
 }
 
+async function approveProviderFee(
+  asset: AssetExtended,
+  accountId: string,
+  web3: Web3,
+  providerFeeAmount: string
+): Promise<string> {
+  const baseToken =
+    asset?.accessDetails?.type === 'free'
+      ? getOceanConfig(asset.chainId).oceanTokenAddress
+      : asset?.accessDetails?.baseToken?.address
+  const txApproveWei = await approveWei(
+    web3,
+    accountId,
+    baseToken,
+    asset?.accessDetails?.datatoken?.address,
+    providerFeeAmount
+  )
+  return txApproveWei as string // thanks ocean.js
+}
+
+async function startOrder(
+  web3: Web3,
+  asset: AssetExtended,
+  orderPriceAndFees: OrderPriceAndFees,
+  accountId: string,
+  hasDatatoken: boolean,
+  initializeData: ProviderComputeInitialize,
+  computeConsumerAddress?: string
+): Promise<TransactionReceipt> {
+  if (!hasDatatoken && asset?.accessDetails.type === 'dynamic') {
+    const poolTx = await buyDtFromPool(asset?.accessDetails, accountId, web3)
+    LoggerInstance.log('[compute] Bought datatoken from pool: ', poolTx)
+    if (!poolTx) {
+      toast.error('Failed to buy datatoken from pool!')
+      return
+    }
+  }
+  const tx = await order(
+    web3,
+    asset,
+    orderPriceAndFees,
+    accountId,
+    initializeData.providerFee,
+    computeConsumerAddress
+  )
+  LoggerInstance.log('[compute] Asset ordered:', tx)
+  return tx
+}
+
 /**
  * Handles order for compute assets for the following scenarios:
  * - have validOrder and no providerFees -> then order is valid, providerFees are valid, it returns the valid order value
@@ -182,60 +231,62 @@ export async function handleComputeOrder(
     '[compute] Handle compute order for asset type: ',
     asset.metadata.type
   )
+  LoggerInstance.log('[compute] Using initializeData: ', initializeData)
 
-  if (
+  try {
-    initializeData.providerFee &&
+    // Return early when valid order is found, and no provider fees
-    initializeData.providerFee.providerFeeAmount !== '0'
+    // are to be paid
-  ) {
+    if (initializeData?.validOrder && !initializeData.providerFee) {
-    const baseToken =
+      LoggerInstance.log(
-      asset?.accessDetails?.type === 'free'
+        '[compute] Has valid order: ',
-        ? getOceanConfig(asset.chainId).oceanTokenAddress
+        initializeData.validOrder
-        : asset?.accessDetails?.baseToken?.address
-    const txApproveWei = await approveWei(
-      web3,
-      accountId,
-      baseToken,
-      asset?.accessDetails?.datatoken?.address,
-      initializeData?.providerFee?.providerFeeAmount
       )
-    if (!txApproveWei) {
+      return asset?.accessDetails?.validOrderTx
-      toast.error('Failed to approve provider fees!')
-      return
     }
+
+    // Approve potential Provider fee amount first
+    if (initializeData?.providerFee?.providerFeeAmount !== '0') {
+      const txApproveProvider = await approveProviderFee(
+        asset,
+        accountId,
+        web3,
+        initializeData.providerFee.providerFeeAmount
+      )
+
+      if (!txApproveProvider)
+        throw new Error('Failed to approve provider fees!')
+
+      LoggerInstance.log('[compute] Approved provider fees:', txApproveProvider)
     }
-  if (initializeData.validOrder && !initializeData.providerFee) {
+
-    LoggerInstance.log('[compute] Has valid order: ', initializeData.validOrder)
+    if (initializeData?.validOrder) {
-    return initializeData.validOrder
-  } else if (initializeData.validOrder) {
       LoggerInstance.log('[compute] Calling reuseOrder ...', initializeData)
-    const tx = await reuseOrder(
+      const txReuseOrder = await reuseOrder(
         web3,
         asset,
         accountId,
         initializeData.validOrder,
         initializeData.providerFee
       )
-    LoggerInstance.log('[compute] Reused order:', tx.transactionHash)
+      if (!txReuseOrder) throw new Error('Failed to reuse order!')
-    return tx.transactionHash
+      LoggerInstance.log('[compute] Reused order:', txReuseOrder)
-  } else {
+      return txReuseOrder?.transactionHash
+    }
+
     LoggerInstance.log('[compute] Calling order ...', initializeData)
-    if (!hasDatatoken && asset?.accessDetails.type === 'dynamic') {
+    const txStartOrder = await startOrder(
-      const poolTx = await buyDtFromPool(asset?.accessDetails, accountId, web3)
-      LoggerInstance.log('[compute] Buoght dt from pool: ', poolTx)
-      if (!poolTx) {
-        toast.error('Failed to buy datatoken from pool!')
-        return
-      }
-    }
-    const tx = await order(
       web3,
       asset,
       orderPriceAndFees,
       accountId,
-      initializeData.providerFee,
+      hasDatatoken,
+      initializeData,
       computeConsumerAddress
     )
-    LoggerInstance.log('[compute] Asset ordered:', tx.transactionHash)
+    LoggerInstance.log('[compute] Order succeeded', txStartOrder)
-    return tx.transactionHash
+    return txStartOrder?.transactionHash
+  } catch (error) {
+    toast.error(error.message)
+    LoggerInstance.error(`[compute] ${error.message}`)
   }
 }

src/components/Asset/AssetActions/Compute/AlgorithmDatasetsListForCompute.tsx

@@ -5,7 +5,6 @@ import { AssetSelectionAsset } from '@shared/FormFields/AssetSelection'
 import AssetComputeList from '@shared/AssetList/AssetComputeList'
 import { useCancelToken } from '@hooks/useCancelToken'
 import { getServiceByName } from '@utils/ddo'
-import { Asset } from '@oceanprotocol/lib'
 import { AssetExtended } from 'src/@types/AssetExtended'
 
 export default function AlgorithmDatasetsListForCompute({
@@ -15,9 +14,9 @@ export default function AlgorithmDatasetsListForCompute({
   asset: AssetExtended
   algorithmDid: string
 }): ReactElement {
+  const newCancelToken = useCancelToken()
   const [datasetsForCompute, setDatasetsForCompute] =
     useState<AssetSelectionAsset[]>()
-  const newCancelToken = useCancelToken()
 
   useEffect(() => {
     if (!asset) return
@@ -37,7 +36,7 @@ export default function AlgorithmDatasetsListForCompute({
       setDatasetsForCompute(datasets)
     }
     asset.metadata.type === 'algorithm' && getDatasetsAllowedForCompute()
-  }, [asset?.metadata?.type])
+  }, [asset, algorithmDid, newCancelToken])
 
   return (
     <div className={styles.datasetsContainer}>

src/components/Asset/AssetActions/Compute/index.tsx

@@ -83,6 +83,8 @@ export default function Compute({
   const [validAlgorithmOrderTx, setValidAlgorithmOrderTx] = useState('')
 
   const [isConsumablePrice, setIsConsumablePrice] = useState(true)
+  const [isConsumableaAlgorithmPrice, setIsConsumableAlgorithmPrice] =
+    useState(true)
   const [computeStatusText, setComputeStatusText] = useState('')
   const [computeEnv, setComputeEnv] = useState<ComputeEnvironment>()
   const [initializedProviderResponse, setInitializedProviderResponse] =
@@ -102,7 +104,9 @@ export default function Compute({
     isOrdering === true ||
     file === null ||
     (!validOrderTx && !hasDatatoken && !isConsumablePrice) ||
-    (!validAlgorithmOrderTx && !hasAlgoAssetDatatoken)
+    (!validAlgorithmOrderTx &&
+      !hasAlgoAssetDatatoken &&
+      !isConsumableaAlgorithmPrice)
 
   async function checkAssetDTBalance(asset: DDO): Promise<boolean> {
     if (!asset?.services[0].datatokenAddress) return
@@ -119,26 +123,25 @@ export default function Compute({
   }
 
   async function initPriceAndFees() {
+    try {
       const computeEnv = await getComputeEnviroment(asset)
-    if (!computeEnv || !computeEnv.id) {
+      if (!computeEnv || !computeEnv.id)
-      setError(`Error getting compute environments!`)
+        throw new Error(`Error getting compute environments!`)
-      return
+
-    }
       setComputeEnv(computeEnv)
       const initializedProvider = await initializeProviderForCompute(
         asset,
         selectedAlgorithmAsset,
-      accountId || ZERO_ADDRESS, // if the user is not connected, we use ZERO_ADDRESS as accountId
+        accountId,
         computeEnv
       )
       if (
         !initializedProvider ||
         !initializedProvider?.datasets ||
         !initializedProvider?.algorithm
-    ) {
+      )
-      setError(`Error initializing provider for the compute job!`)
+        throw new Error(`Error initializing provider for the compute job!`)
-      return
+
-    }
       setInitializedProviderResponse(initializedProvider)
       setProviderFeeAmount(
         await unitsToAmount(
@@ -152,6 +155,7 @@ export default function Compute({
         Math.floor(Date.now() / 1000)
       ).toString()
       setComputeValidUntil(computeDuration)
+
       if (
         asset?.accessDetails?.addressOrId !== ZERO_ADDRESS &&
         asset?.accessDetails?.type !== 'free' &&
@@ -181,17 +185,14 @@ export default function Compute({
               }
             : null
         const datasetPriceAndFees = await getOrderPriceAndFees(
-        web3 || (await getDummyWeb3(asset?.chainId)), // if the user is not connected, we need to use a dummy web3
           asset,
-        accountId || ZERO_ADDRESS, // if the user is not connected, we need to use ZERO_ADDRESS as accountId
+          ZERO_ADDRESS,
           poolParams,
           initializedProvider?.datasets?.[0]?.providerFee
         )
+        if (!datasetPriceAndFees)
+          throw new Error('Error setting dataset price and fees!')
 
-      if (!datasetPriceAndFees) {
-        setError('Error setting dataset price and fees!')
-        return
-      }
         setDatasetOrderPriceAndFees(datasetPriceAndFees)
       }
 
@@ -230,35 +231,36 @@ export default function Compute({
           }
         }
         const algorithmOrderPriceAndFees = await getOrderPriceAndFees(
-        web3 || (await getDummyWeb3(asset?.chainId)),
           selectedAlgorithmAsset,
-        accountId || ZERO_ADDRESS,
+          ZERO_ADDRESS,
           algoPoolParams,
           initializedProvider.algorithm.providerFee
         )
+        if (!algorithmOrderPriceAndFees)
+          throw new Error('Error setting algorithm price and fees!')
 
-      if (!algorithmOrderPriceAndFees) {
-        setError('Error setting algorithm price and fees!')
-        return
-      }
         setAlgoOrderPriceAndFees(algorithmOrderPriceAndFees)
       }
+    } catch (error) {
+      setError(error.message)
+      LoggerInstance.error(`[compute] ${error.message} `)
+    }
   }
 
   useEffect(() => {
     if (!asset?.accessDetails || !accountId) return
 
     setIsConsumablePrice(asset?.accessDetails?.isPurchasable)
-    // setIsOwned(asset?.accessDetails?.isOwned)
     setValidOrderTx(asset?.accessDetails?.validOrderTx)
-  }, [asset?.accessDetails])
+  }, [asset?.accessDetails, accountId])
 
   useEffect(() => {
     if (!selectedAlgorithmAsset?.accessDetails) return
 
     setIsRequestingAlgoOrderPrice(true)
-    setIsConsumablePrice(selectedAlgorithmAsset?.accessDetails?.isPurchasable)
+    setIsConsumableAlgorithmPrice(
-    // setIsAlgorithmOwned(selectedAlgorithmAsset?.accessDetails?.isOwned)
+      selectedAlgorithmAsset?.accessDetails?.isPurchasable
+    )
     setValidAlgorithmOrderTx(
       selectedAlgorithmAsset?.accessDetails?.validOrderTx
     )
@@ -271,11 +273,10 @@ export default function Compute({
     }
 
     initSelectedAlgo()
-  }, [selectedAlgorithmAsset])
+  }, [selectedAlgorithmAsset, accountId])
 
   useEffect(() => {
     if (!asset) return
-
     getAlgorithmsForAsset(asset, newCancelToken()).then((algorithmsAssets) => {
       setDdoAlgorithmList(algorithmsAssets)
       getAlgorithmAssetSelectionList(asset, algorithmsAssets).then(
@@ -293,10 +294,10 @@ export default function Compute({
     toast.error(newError)
   }, [error])
 
-  async function startJob(): Promise<string> {
+  async function startJob(): Promise<void> {
     try {
       setIsOrdering(true)
-      setIsOrdered(false) // would be nice to rename this
+      setIsOrdered(false)
       setError(undefined)
       const computeService = getServiceByName(asset, 'compute')
       const computeAlgorithm: ComputeAlgorithm = {
@@ -310,15 +311,10 @@ export default function Compute({
         selectedAlgorithmAsset
       )
       LoggerInstance.log('[compute] Is data set orderable?', allowed)
-      if (!allowed) {
+      if (!allowed)
-        setError(
+        throw new Error(
           'Data set is not orderable in combination with selected algorithm.'
         )
-        LoggerInstance.error(
-          '[compute] Error starting compute job. Dataset is not orderable in combination with selected algorithm.'
-        )
-        return
-      }
 
       setComputeStatusText(
         getComputeFeedback(
@@ -342,11 +338,8 @@ export default function Compute({
         initializedProviderResponse.datasets[0],
         computeEnv.consumerAddress
       )
-      if (!datasetOrderTx) {
+      if (!datasetOrderTx) throw new Error('Failed to order dataset.')
-        setError('Failed to order dataset.')
+
-        LoggerInstance.error('[compute] Failed to order dataset.')
-        return
-      }
       setComputeStatusText(
         getComputeFeedback(
           selectedAlgorithmAsset.accessDetails.baseToken?.symbol,
@@ -370,11 +363,7 @@ export default function Compute({
         initializedProviderResponse.algorithm,
         computeEnv.consumerAddress
       )
-      if (!algorithmOrderTx) {
+      if (!algorithmOrderTx) throw new Error('Failed to order algorithm.')
-        setError('Failed to order algorithm.')
-        LoggerInstance.error('[compute] Failed to order algorithm.')
-        return
-      }
 
       LoggerInstance.log('[compute] Starting compute job.')
       const computeAsset: ComputeAsset = {
@@ -399,17 +388,15 @@ export default function Compute({
         null,
         output
       )
-      if (!response) {
+      if (!response) throw new Error('Error starting compute job.')
-        setError('Error starting compute job.')
+
-        return
-      }
       LoggerInstance.log('[compute] Starting compute job response: ', response)
       setIsOrdered(true)
       setRefetchJobs(!refetchJobs)
       initPriceAndFees()
     } catch (error) {
-      setError('Failed to start job!')
+      setError(error.message)
-      LoggerInstance.error('[compute] Failed to start job: ', error.message)
+      LoggerInstance.error(`[compute] ${error.message} `)
     } finally {
       setIsOrdering(false)
     }

src/components/Asset/AssetContent/index.module.css

@@ -35,20 +35,7 @@
   text-align: center;
   margin-top: var(--spacer);
   margin-bottom: calc(var(--spacer) * 1.5);
-  margin-left: -2rem;
+  padding: calc(var(--spacer) / 3) var(--spacer);
-  margin-right: -2rem;
-  padding: calc(var(--spacer) / 4) var(--spacer);
   border-top: 1px solid var(--border-color);
   border-bottom: 1px solid var(--border-color);
 }
-
-.ownerActions a,
-.ownerActions button {
-  color: var(--color-secondary);
-  margin-left: calc(var(--spacer) / 4);
-  margin-right: calc(var(--spacer) / 4);
-}
-
-.separator {
-  color: var(--color-secondary);
-}

src/components/Asset/AssetContent/index.tsx

@@ -15,17 +15,15 @@ import styles from './index.module.css'
 import NetworkName from '@shared/NetworkName'
 import content from '../../../../content/purgatory.json'
 import { AssetExtended } from 'src/@types/AssetExtended'
-import { useWeb3 } from '@context/Web3'
 import Web3 from 'web3'
+import Button from '@shared/atoms/Button'
 
 export default function AssetContent({
   asset
 }: {
   asset: AssetExtended
 }): ReactElement {
-  const [isOwner, setIsOwner] = useState(false)
+  const { isInPurgatory, purgatoryData, isOwner, isAssetNetwork } = useAsset()
-  const { accountId } = useWeb3()
-  const { isInPurgatory, purgatoryData, owner, isAssetNetwork } = useAsset()
   const { debug } = useUserPreferences()
   const [receipts, setReceipts] = useState([])
   const [nftPublisher, setNftPublisher] = useState<string>()
@@ -38,20 +36,6 @@ export default function AssetContent({
     )
   }, [receipts])
 
-  useEffect(() => {
-    if (!accountId || !owner) return
-
-    const isOwner = accountId.toLowerCase() === owner.toLowerCase()
-    setIsOwner(isOwner)
-  }, [accountId, owner, asset])
-
-  useEffect(() => {
-    if (!accountId || !owner) return
-
-    const isOwner = accountId.toLowerCase() === owner.toLowerCase()
-    setIsOwner(isOwner)
-  }, [accountId, asset?.accessDetails, owner, asset])
-
   return (
     <>
       <div className={styles.networkWrap}>
@@ -91,9 +75,9 @@ export default function AssetContent({
           <AssetActions asset={asset} />
           {isOwner && isAssetNetwork && (
             <div className={styles.ownerActions}>
-              <Link href={`/asset/${asset?.id}/edit`}>
+              <Button style="text" size="small" to={`/asset/${asset?.id}/edit`}>
-                <a>Edit</a>
+                Edit Asset
-              </Link>
+              </Button>
             </div>
           )}
         </div>

src/components/Profile/History/ComputeJobs/Details.tsx

@@ -42,9 +42,11 @@ function Asset({
 
 function DetailsAssets({ job }: { job: ComputeJobMetaData }) {
   const { appConfig } = useMarketMetadata()
+  const newCancelToken = useCancelToken()
+
   const [algoName, setAlgoName] = useState<string>()
   const [algoDtSymbol, setAlgoDtSymbol] = useState<string>()
-  const newCancelToken = useCancelToken()
+
   useEffect(() => {
     async function getAlgoMetadata() {
       const ddo = await retrieveAsset(job.algoDID, newCancelToken())
@@ -52,7 +54,7 @@ function DetailsAssets({ job }: { job: ComputeJobMetaData }) {
       setAlgoName(ddo?.metadata.name)
     }
     getAlgoMetadata()
-  }, [appConfig.metadataCacheUri, job.algoDID])
+  }, [appConfig.metadataCacheUri, job.algoDID, newCancelToken])
 
   return (
     <>

src/components/Profile/History/ComputeJobs/Results.module.css

@@ -3,8 +3,10 @@
   border-bottom-left-radius: var(--border-radius) !important;
 }
 
-.results li {
+.title {
-  list-style-type: none;
+  font-size: var(--font-size-base);
+  color: var(--font-color-text);
+  margin-bottom: calc(var(--spacer) / 3);
 }
 
 .help {

src/components/Profile/History/ComputeJobs/Results.tsx

@@ -26,31 +26,32 @@ export default function Results({
 
   const [datasetProvider, setDatasetProvider] = useState<string>()
   const newCancelToken = useCancelToken()
+
   useEffect(() => {
     async function getAssetMetadata() {
       const ddo = await retrieveAsset(job.inputDID[0], newCancelToken())
       setDatasetProvider(ddo.services[0].serviceEndpoint)
     }
     getAssetMetadata()
-  }, [job.inputDID[0]])
+  }, [job.inputDID, newCancelToken])
 
   function getDownloadButtonValue(type: ComputeResultType): string {
     let buttonName
     switch (type) {
       case 'output':
-        buttonName = 'Download results'
+        buttonName = 'results'
         break
       case 'algorithmLog':
-        buttonName = 'Download algorithm logs'
+        buttonName = 'algorithm logs'
         break
       case 'configrationLog':
-        buttonName = 'Download configuration logs'
+        buttonName = 'configuration logs'
         break
       case 'publishLog':
-        buttonName = 'Download publish logs'
+        buttonName = 'publish logs'
         break
       default:
-        buttonName = 'Download results'
+        buttonName = 'results'
         break
     }
     return buttonName
@@ -78,6 +79,7 @@ export default function Results({
 
   return (
     <div className={styles.results}>
+      <h4 className={styles.title}>Results</h4>
       {isFinished ? (
         <ul>
           {job.results &&
@@ -86,10 +88,10 @@ export default function Results({
               jobResult.filename ? (
                 <ListItem key={i}>
                   <Button
-                    style="primary"
+                    style="text"
                     size="small"
                     onClick={() => downloadResults(i)}
-                    disabled={isLoading || !isFinished}
+                    download
                   >
                     {getDownloadButtonValue(jobResult.type)}
                   </Button>

src/components/Profile/History/ComputeJobs/index.tsx

@@ -1,8 +1,6 @@
 import React, { ReactElement, useEffect, useState, useCallback } from 'react'
 import Time from '@shared/atoms/Time'
-import Link from 'next/link'
 import { LoggerInstance } from '@oceanprotocol/lib'
-import Dotdotdot from 'react-dotdotdot'
 import Table from '@shared/atoms/Table'
 import Button from '@shared/atoms/Button'
 import { useWeb3 } from '@context/Web3'
@@ -15,6 +13,7 @@ import styles from './index.module.css'
 import { useAsset } from '@context/Asset'
 import { useIsMounted } from '@hooks/useIsMounted'
 import { useCancelToken } from '@hooks/useCancelToken'
+import AssetListTitle from '@shared/AssetList/AssetListTitle'
 
 export function Status({ children }: { children: string }): ReactElement {
   return <div className={styles.status}>{children}</div>
@@ -24,13 +23,7 @@ const columns = [
   {
     name: 'Data Set',
     selector: function getAssetRow(row: ComputeJobMetaData) {
-      return (
+      return <AssetListTitle did={row.inputDID[0]} title={row.assetName} />
-        <Dotdotdot clamp={2}>
-          <Link href={`/asset/${row.inputDID[0]}`}>
-            <a>{row.assetName}</a>
-          </Link>
-        </Dotdotdot>
-      )
     }
   },
   {

src/components/Publish/_constants.tsx

@@ -41,8 +41,8 @@ export const wizardSteps: StepContent[] = [
 const computeOptions: ServiceComputeOptions = {
   allowRawAlgorithm: false,
   allowNetworkAccess: true,
-  publisherTrustedAlgorithmPublishers: null,
+  publisherTrustedAlgorithmPublishers: [],
-  publisherTrustedAlgorithms: null
+  publisherTrustedAlgorithms: []
 }
 
 export const initialValues: FormPublishData = {