remove tabs, more rel for all links

src/components/@shared/ExplorerLink/index.tsx

@@ -31,7 +31,7 @@ export default function ExplorerLink({
       href={`${url}/${path}`}
       title={`View on ${oceanConfig?.explorerUri}`}
       target="_blank"
-      rel="noreferrer"
+      rel="noopener noreferrer"
       className={`${styles.link} ${className || ''}`}
     >
       {children} <External />

src/components/@shared/FormInput/InputElement/AssetSelection/index.tsx

@@ -94,7 +94,7 @@ export default function AssetSelection({
                       className={styles.link}
                       href={`/asset/${asset.did}`}
                       target="_blank"
-                      rel="noreferrer"
+                      rel="noopener noreferrer"
                     >
                       <External />
                     </a>

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

@@ -1,7 +1,7 @@
 import { useAsset } from '@context/Asset'
 import React from 'react'
 import { useWeb3 } from '@context/Web3'
-import { calicaUri } from 'app.config'
+import { calicaUri } from '../../../../../app.config'
 export default function CalicaIntegration() {
   const { isOwner } = useAsset()
   const { accountId } = useWeb3()
@@ -10,12 +10,10 @@ export default function CalicaIntegration() {
     <a
       href={`${calicaUri}/${accountId}`}
       target="_blank"
-      rel="noreferrer"
+      rel="noopener noreferrer"
       title="Use Calica for revenue split"
     >
       Use Calica for revenue split
     </a>
-  ) : (
+  ) : null
-    <></>
-  )
 }

src/components/Asset/AssetActions/Download.module.css

@@ -1,7 +1,6 @@
 .consume {
   width: auto;
   margin-bottom: calc(var(--spacer) / 2);
-  margin-top: -1rem;
 }
 
 .info {

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

@@ -2,5 +2,4 @@
   composes: box from '@shared/atoms/Box.module.css';
   max-width: 35rem;
   margin: auto;
-  padding: 0;
 }

src/components/Asset/AssetActions/index.tsx

@@ -2,7 +2,6 @@ import React, { ReactElement, useState, useEffect } from 'react'
 import Compute from './Compute'
 import Download from './Download'
 import { FileInfo, LoggerInstance, Datatoken } from '@oceanprotocol/lib'
-import Tabs, { TabsItem } from '@shared/atoms/Tabs'
 import { compareAsBN } from '@utils/numbers'
 import { useAsset } from '@context/Asset'
 import { useWeb3 } from '@context/Web3'
@@ -16,7 +15,7 @@ import { useFormikContext } from 'formik'
 import { FormPublishData } from '@components/Publish/_types'
 import { getTokenBalanceFromSymbol } from '@utils/web3'
 import AssetStats from './AssetStats'
-import CalicaIntegration from './CalicaIntegration'
+import Calica from './Calica'
 
 export default function AssetActions({
   asset
@@ -133,34 +132,28 @@ export default function AssetActions({
     }
   }, [balance, accountId, asset?.accessDetails, dtBalance])
 
-  const UseContent = (
-    <>
-      {isCompute ? (
-        <Compute
-          asset={asset}
-          dtBalance={dtBalance}
-          file={fileMetadata}
-          fileIsLoading={fileIsLoading}
-        />
-      ) : (
-        <Download
-          asset={asset}
-          dtBalance={dtBalance}
-          isBalanceSufficient={isBalanceSufficient}
-          file={fileMetadata}
-          fileIsLoading={fileIsLoading}
-        />
-      )}
-      <CalicaIntegration />
-      <AssetStats />
-    </>
-  )
-
-  const tabs: TabsItem[] = [{ title: 'Use', content: UseContent }]
-
   return (
     <>
-      <Tabs items={tabs} className={styles.actions} />
+      <div className={styles.actions}>
+        {isCompute ? (
+          <Compute
+            asset={asset}
+            dtBalance={dtBalance}
+            file={fileMetadata}
+            fileIsLoading={fileIsLoading}
+          />
+        ) : (
+          <Download
+            asset={asset}
+            dtBalance={dtBalance}
+            isBalanceSufficient={isBalanceSufficient}
+            file={fileMetadata}
+            fileIsLoading={fileIsLoading}
+          />
+        )}
+        <AssetStats />
+      </div>
+      <Calica />
       <Web3Feedback
         networkId={asset?.chainId}
         accountId={accountId}

src/components/Asset/AssetContent/MetaSecondary.tsx

@@ -9,7 +9,7 @@ const SampleButton = ({ url }: { url: string }) => (
   <Button
     href={url}
     target="_blank"
-    rel="noreferrer"
+    rel="noopener noreferrer"
     download
     style="text"
     size="small"

src/components/Asset/AssetContent/Nft/NftTooltip.tsx

@@ -65,7 +65,7 @@ export default function NftTooltip({
             <a
               href={openSeaUrl}
               target="_blank"
-              rel="noreferrer"
+              rel="noopener noreferrer"
               className={explorerLinkStyles.link}
             >
               View on OpenSea <External />

src/components/Footer/BuildId.tsx

@@ -14,7 +14,7 @@ export default function BuildId(): ReactElement {
         isMainBranch ? commitId : commitBranch
       }`}
       target="_blank"
-      rel="noreferrer"
+      rel="noopener noreferrer"
       title="Build ID referring to the linked commit hash."
     >
       {isMainBranch ? commitId.substring(0, 7) : commitBranch}

src/components/Footer/Footer.tsx

@@ -26,6 +26,7 @@ export default function Footer(): ReactElement {
             size="small"
             href="https://oceanprotocol.com"
             target="_blank"
+            rel="noopener noreferrer"
           >
             Ocean Protocol <External className={styles.svg} />
           </Button>

src/components/Footer/Links.tsx

@@ -17,7 +17,13 @@ export default function Links() {
     <div className={styles.links}>
       {content.links.map(({ name, url }) => (
         <Fragment key={name}>
-          <Button style="text" size="small" href={url} target="_blank">
+          <Button
+            style="text"
+            size="small"
+            href={url}
+            target="_blank"
+            rel="noopener noreferrer"
+          >
             {name} <External />
           </Button>
           {' — '}

src/components/Profile/Header/PublisherLinks.tsx

@@ -59,7 +59,7 @@ export default function PublisherLinks({
           href={getLinkData(link).href}
           key={link.key}
           target="_blank"
-          rel="noreferrer"
+          rel="noopener noreferrer"
         >
           {getLinkData(link).label}{' '}
           <External className={styles.linksExternal} />

src/components/Profile/Header/index.tsx

@@ -13,7 +13,7 @@ const isDescriptionTextClamped = () => {
 
 const LinkExternal = ({ url, text }: { url: string; text: string }) => {
   return (
-    <a href={url} target="_blank" rel="noreferrer">
+    <a href={url} target="_blank" rel="noopener noreferrer">
       {text}
     </a>
   )

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

@@ -26,8 +26,7 @@ function Asset({
         <a
           className={styles.assetLink}
           href={`/asset/${did}`}
-          target="_blank"
+          rel="noopener noreferrer"
-          rel="noreferrer"
         >
           <External />
         </a>