fix: harden frontend security entrypoints

apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.test.tsx

@@ -0,0 +1,77 @@
+import React from 'react'
+
+import { HookDappType, HookToDappMatch, CowHookDetails } from '@cowprotocol/hook-dapp-lib'
+
+import { i18n } from '@lingui/core'
+import { I18nProvider } from '@lingui/react'
+import { fireEvent, render, screen } from '@testing-library/react'
+import { ThemeProvider as StyledComponentsThemeProvider } from 'styled-components/macro'
+import { getCowswapTheme } from 'theme'
+
+import { useSimulationData } from 'modules/tenderly/hooks/useSimulationData'
+
+import { HookItem } from './index'
+
+jest.mock('modules/tenderly/hooks/useSimulationData', () => ({
+  useSimulationData: jest.fn(),
+}))
+
+const mockUseSimulationData = useSimulationData as jest.MockedFunction<typeof useSimulationData>
+
+i18n.load('en-US', {})
+i18n.activate('en-US')
+
+const details: CowHookDetails = {
+  uuid: 'hook-1',
+  hook: {
+    target: '0x1111111111111111111111111111111111111111',
+    callData: '0xdeadbeef',
+    gasLimit: '100000',
+    dappId: 'test-hook',
+  },
+}
+
+const item: HookToDappMatch = {
+  dapp: {
+    id: 'test-hook',
+    name: 'Test hook',
+    descriptionShort: 'Test description',
+    type: HookDappType.IFRAME,
+    version: '1.0.0',
+    website: 'https://cow.fi',
+    image: 'https://cow.fi/icon.png',
+  },
+  hook: details.hook,
+}
+
+function renderComponent(): ReturnType<typeof render> {
+  return render(
+    <I18nProvider i18n={i18n}>
+      <StyledComponentsThemeProvider theme={getCowswapTheme(false)}>
+        <HookItem details={details} item={item} index={0} />
+      </StyledComponentsThemeProvider>
+    </I18nProvider>,
+  )
+}
+
+describe('HookItem', () => {
+  beforeEach(() => {
+    mockUseSimulationData.mockReturnValue({
+      id: 'simulation-1',
+      link: 'javascript:alert(1)',
+      status: false,
+      cumulativeBalancesDiff: {},
+      stateDiff: [],
+      gasUsed: '0',
+    })
+  })
+
+  it('renders an invalid simulation link as inert text', () => {
+    renderComponent()
+
+    fireEvent.click(screen.getByText('Test hook'))
+
+    expect(screen.queryByRole('link', { name: 'Simulation failed' })).toBeNull()
+    expect(screen.getByText('Simulation failed')).not.toBeNull()
+  })
+})

apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactNode, useState } from 'react'
 
+import { getSafeAbsoluteUrl } from '@cowprotocol/common-utils'
 import { CowHookDetails, HookToDappMatch } from '@cowprotocol/hook-dapp-lib'
 
 import { t } from '@lingui/core/macro'
@@ -28,6 +29,9 @@ export function HookItem({
   const simulationData = useSimulationData(details?.uuid)
 
   const dappName = item.dapp?.name || t`Unknown Hook`
+  const safeWebsiteUrl = item.dapp ? getSafeAbsoluteUrl(item.dapp.website) : null
+  const websiteHostname = safeWebsiteUrl ? new URL(safeWebsiteUrl).hostname : null
+  const safeSimulationUrl = simulationData ? getSafeAbsoluteUrl(simulationData.link) : null
 
   return (
     <styledEl.HookItemWrapper as="li">
@@ -66,18 +70,24 @@ export function HookItem({
                     <Trans>Simulation:</Trans>
                   </b>
                   <styledEl.SimulationLink status={simulationData.status}>
-                    <a
-                      href={simulationData.link}
-                      target="_blank"
-                      rel="noopener noreferrer"
-                      data-click-event={toCowSwapGtmEvent({
-                        category: CowSwapAnalyticsCategory.HOOKS,
-                        action: 'Click Simulation',
-                        label: `${dappName} - ${simulationData.status ? 'Success' : 'Failed'}`,
-                      })}
-                    >
-                      {simulationData.status ? <Trans>Simulation successful</Trans> : <Trans>Simulation failed</Trans>}
-                    </a>
+                    {safeSimulationUrl ? (
+                      <a
+                        href={safeSimulationUrl}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        data-click-event={toCowSwapGtmEvent({
+                          category: CowSwapAnalyticsCategory.HOOKS,
+                          action: 'Click Simulation',
+                          label: `${dappName} - ${simulationData.status ? 'Success' : 'Failed'}`,
+                        })}
+                      >
+                        {simulationData.status ? <Trans>Simulation successful</Trans> : <Trans>Simulation failed</Trans>}
+                      </a>
+                    ) : (
+                      <span>
+                        {simulationData.status ? <Trans>Simulation successful</Trans> : <Trans>Simulation failed</Trans>}
+                      </span>
+                    )}
                   </styledEl.SimulationLink>
                 </p>
               )}
@@ -97,18 +107,22 @@ export function HookItem({
                 <b>
                   <Trans>Website</Trans>:
                 </b>{' '}
-                <a
-                  href={item.dapp.website}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  data-click-event={toCowSwapGtmEvent({
-                    category: CowSwapAnalyticsCategory.HOOKS,
-                    action: 'Click Website',
-                    label: `${dappName} - ${new URL(item.dapp.website).hostname}`,
-                  })}
-                >
-                  {item.dapp.website}
-                </a>
+                {safeWebsiteUrl && websiteHostname ? (
+                  <a
+                    href={safeWebsiteUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    data-click-event={toCowSwapGtmEvent({
+                      category: CowSwapAnalyticsCategory.HOOKS,
+                      action: 'Click Website',
+                      label: `${dappName} - ${websiteHostname}`,
+                    })}
+                  >
+                    {item.dapp.website}
+                  </a>
+                ) : (
+                  item.dapp.website
+                )}
               </p>
             </>
           )}

apps/cowswap-frontend/src/legacy/state/application/localWarning.ts

@@ -1,12 +1,12 @@
-import { PINATA_API_KEY, PINATA_SECRET_API_KEY } from '@cowprotocol/common-const'
+import { PINATA_API_KEY } from '@cowprotocol/common-const'
 import { isLocal } from '@cowprotocol/common-utils'
 
 let warningMsg
 
-if ((!PINATA_SECRET_API_KEY || !PINATA_API_KEY) && isLocal) {
+if (!PINATA_API_KEY && isLocal) {
   warningMsg =
-    "Pinata env vars not set. Order appData upload won't work! " +
-    'Set REACT_APP_PINATA_API_KEY and REACT_APP_PINATA_SECRET_API_KEY'
+    "Pinata public env var not set. Order appData upload won't work! " +
+    'Set REACT_APP_PINATA_API_KEY and configure the required server-side Pinata credentials separately.'
 }
 
 export const localWarning = warningMsg

apps/cowswap-frontend/src/locales/en-US.po

@@ -144,6 +144,7 @@ msgstr "Swap anyway"
 msgid "The hash for this Safe transaction."
 msgstr "The hash for this Safe transaction."
 
+#: apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx
 #: apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx
 #: apps/cowswap-frontend/src/common/containers/OrderHooksDetails/index.tsx
 #: apps/cowswap-frontend/src/modules/hooksStore/pure/AppliedHookItem/index.tsx
@@ -5623,6 +5624,10 @@ msgstr "N/A"
 msgid "This transaction can be simulated before execution to ensure that it will be succeed, generating a detailed report of the transaction execution."
 msgstr "This transaction can be simulated before execution to ensure that it will be succeed, generating a detailed report of the transaction execution."
 
+#: apps/cowswap-frontend/src/modules/hooksStore/pure/AddCustomHookForm/constants.tsx
+msgid "Invalid website URL in manifest. Only http(s) URLs are allowed, with http limited to local development."
+msgstr "Invalid website URL in manifest. Only http(s) URLs are allowed, with http limited to local development."
+
 #: apps/cowswap-frontend/src/modules/tradeFormValidation/pure/TradeFormButtons/tradeButtonsMap.tsx
 msgid "Sell amount too small to bridge"
 msgstr "Sell amount too small to bridge"
@@ -6702,6 +6707,7 @@ msgstr "Network fees and costs"
 msgid "NEW"
 msgstr "NEW"
 
+#: apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx
 #: apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx
 #: apps/cowswap-frontend/src/modules/hooksStore/pure/AppliedHookItem/index.tsx
 msgid "Simulation successful"

apps/cowswap-frontend/src/modules/accountProxy/containers/AccountProxyRecoverPage/index.tsx

@@ -2,7 +2,7 @@ import { ReactNode, useCallback, useState } from 'react'
 
 import { useUpdateTokenBalance } from '@cowprotocol/balances-and-allowances'
 import { useComponentDestroyedRef } from '@cowprotocol/common-hooks'
-import { getIsNativeToken, isFractionFalsy } from '@cowprotocol/common-utils'
+import { getIsNativeToken, isAddress, isFractionFalsy } from '@cowprotocol/common-utils'
 import { areAddressesEqual } from '@cowprotocol/cow-sdk'
 import { TokenLogo } from '@cowprotocol/tokens'
 import { ButtonSize, CenteredDots, FiatAmount, Loader, TokenSymbol } from '@cowprotocol/ui'
@@ -37,19 +37,22 @@ export function AccountProxyRecoverPage(): ReactNode {
   const [txInProgress, setTxInProgress] = useState(false)
 
   const navigateBack = useNavigateBack()
-  const { balance, usdValue } = useTokenBalanceAndUsdValue(tokenAddress)
+  const proxies = useAccountProxies()
+  const ownedProxy = proxies?.find((p) => proxyAddress && areAddressesEqual(p.account, proxyAddress))
+  const validProxyAddress = ownedProxy?.account
+  const validTokenAddress = tokenAddress && isAddress(tokenAddress) ? tokenAddress : undefined
+  const { balance, usdValue } = useTokenBalanceAndUsdValue(validTokenAddress)
   const destroyedRef = useComponentDestroyedRef()
 
-  const proxies = useAccountProxies()
   const updateTokenBalance = useUpdateTokenBalance()
-  const proxyVersion = proxies?.find((p) => areAddressesEqual(p.account, proxyAddress))?.version
+  const proxyVersion = ownedProxy?.version
 
   const recoverFundsContext = useRecoverFundsFromProxy(
-    proxyAddress,
+    validProxyAddress,
     proxyVersion,
-    tokenAddress,
+    validTokenAddress,
     balance,
-    !!tokenAddress && getIsNativeToken(chainId, tokenAddress),
+    !!validTokenAddress && getIsNativeToken(chainId, validTokenAddress),
   )
   const { txSigningStep } = recoverFundsContext
 
@@ -70,11 +73,11 @@ export function AccountProxyRecoverPage(): ReactNode {
         // When tx is successfully mined
         () => {
           navigateBack()
-          tokenAddress && updateTokenBalance(tokenAddress, 0n)
+          validTokenAddress && updateTokenBalance(validTokenAddress, 0n)
         },
       )
     })
-  }, [recoverCallback, navigateBack, updateTokenBalance, tokenAddress, destroyedRef])
+  }, [recoverCallback, navigateBack, updateTokenBalance, validTokenAddress, destroyedRef])
 
   return (
     <Wrapper>
@@ -104,7 +107,7 @@ export function AccountProxyRecoverPage(): ReactNode {
       </TokenWrapper>
 
       <ButtonPrimaryStyled
-        disabled={isFractionFalsy(balance) || !!txSigningStep || txInProgress}
+        disabled={!validProxyAddress || !validTokenAddress || isFractionFalsy(balance) || !!txSigningStep || txInProgress}
         buttonSize={ButtonSize.BIG}
         onClick={onRecover}
       >

apps/cowswap-frontend/src/modules/application/containers/AppContainer/CowSpeechBubble/CowSpeechBubbleNotificationBanner.tsx

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react'
 
+import { getSafeSameOriginOrAbsoluteUrl } from '@cowprotocol/common-utils'
 import type { NotificationModel } from '@cowprotocol/core'
 import { UI } from '@cowprotocol/ui'
 
@@ -58,16 +59,18 @@ export function CowSpeechBubbleNotificationBanner({
   }
 
   const { title, description, url, id } = currentNotification
-  const linkTarget = url && isInternal(url) ? '_parent' : '_blank'
+  const safeLink =
+    typeof window !== 'undefined' && url ? getSafeSameOriginOrAbsoluteUrl(url, window.location.origin) : null
+  const linkTarget = safeLink?.isExternal ? '_blank' : '_parent'
 
   return (
     <CowSpeechBubble variant="notification" onClose={onClose} closeButtonAriaLabel={t`Dismiss notification`}>
       <NotificationText>
         <strong>{title}</strong>
         <NotificationDescription>{description}</NotificationDescription>
-        {url && (
+        {safeLink && (
           <NotificationLink
-            href={url}
+            href={safeLink.href}
             target={linkTarget}
             rel={linkTarget === '_blank' ? 'noopener noreferrer' : undefined}
             data-click-event={toCowSwapGtmEvent({
@@ -85,13 +88,3 @@ export function CowSpeechBubbleNotificationBanner({
     </CowSpeechBubble>
   )
 }
-
-function isInternal(href: string): boolean {
-  if (href.startsWith('/')) return true
-
-  try {
-    return new URL(href).hostname === window.location.hostname
-  } catch {
-    return false
-  }
-}

apps/cowswap-frontend/src/modules/bridge/pure/TransactionLink/TransactionLinkDisplay.tsx

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react'
 
 import iconReceiptSrc from '@cowprotocol/assets/cow-swap/icon-receipt.svg'
+import { getSafeAbsoluteUrl } from '@cowprotocol/common-utils'
 import { ExternalLink } from '@cowprotocol/ui'
 
 import { ConfirmDetailsItem } from 'modules/trade'
@@ -14,6 +15,12 @@ interface TransactionLinkDisplayProps {
 }
 
 export function TransactionLinkDisplay({ link, label, linkText }: TransactionLinkDisplayProps): ReactNode {
+  const safeLink = getSafeAbsoluteUrl(link)
+
+  if (!safeLink) {
+    return null
+  }
+
   return (
     <ConfirmDetailsItem
       label={
@@ -25,7 +32,7 @@ export function TransactionLinkDisplay({ link, label, linkText }: TransactionLin
         </>
       }
     >
-      <ExternalLink href={link}>{linkText}</ExternalLink>
+      <ExternalLink href={safeLink}>{linkText}</ExternalLink>
     </ConfirmDetailsItem>
   )
 }

apps/cowswap-frontend/src/modules/bridge/pure/contents/BridgingProgressContent/index.tsx

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react'
 
-import { isFractionFalsy } from '@cowprotocol/common-utils'
+import { getSafeAbsoluteUrl, isFractionFalsy } from '@cowprotocol/common-utils'
 import { BridgeStatusResult } from '@cowprotocol/sdk-bridging'
 
 import { FailedBridgingContent } from './FailedBridgingContent'
@@ -32,6 +32,7 @@ export function BridgingProgressContent(props: BridgingContentProps): ReactNode
     statusResult,
     explorerUrl,
   } = props
+  const safeExplorerUrl = getSafeAbsoluteUrl(explorerUrl) || undefined
 
   return (
     <QuoteBridgeContent {...props} isFinished={!isFractionFalsy(receivedAmount)}>
@@ -42,14 +43,18 @@ export function BridgingProgressContent(props: BridgingContentProps): ReactNode
           destinationChainId={destinationChainId}
           receivedAmount={receivedAmount}
           receivedAmountUsd={receivedAmountUsd}
-          explorerUrl={explorerUrl}
+          explorerUrl={safeExplorerUrl}
         />
       ) : isRefunded ? (
         <RefundedBridgingContent account={account} bridgeSendCurrencyAmount={quoteContext.sellAmount} />
       ) : isFailed ? (
         <FailedBridgingContent />
       ) : (
-        <PendingBridgingContent sourceChainId={sourceChainId} statusResult={statusResult} explorerUrl={explorerUrl} />
+        <PendingBridgingContent
+          sourceChainId={sourceChainId}
+          statusResult={statusResult}
+          explorerUrl={safeExplorerUrl}
+        />
       )}
     </QuoteBridgeContent>
   )