fix: do not suggest TWAP when cross-chain swap (#6607)

Author: shoom3301

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

@@ -32,8 +32,8 @@ msgid "Signature is undefined!"
 msgstr "Signature is undefined!"
 
 #: apps/cowswap-frontend/src/modules/orderProgressBar/pure/BenefitComponents.tsx
-msgid "I just received surplus on"
-msgstr "I just received surplus on"
+#~ msgid "I just received surplus on"
+#~ msgstr "I just received surplus on"
 
 #: apps/cowswap-frontend/src/modules/twap/utils/deadlinePartsDisplay.ts
 msgid "years"
@@ -613,6 +613,10 @@ msgstr "If your order has not been filled by this date & time, it will expire. D
 msgid "Only proceed if you trust this provider."
 msgstr "Only proceed if you trust this provider."
 
+#: apps/cowswap-frontend/src/modules/orderProgressBar/pure/BenefitComponents.tsx
+msgid "I received surplus on"
+msgstr "I received surplus on"
+
 #: apps/cowswap-frontend/src/modules/application/containers/App/CowSpeechBubble.tsx
 msgid "View jobs"
 msgstr "View jobs"
@@ -2202,6 +2206,10 @@ msgstr "Failed to fetch manifest from {manifestUrl}. Please verify the URL and t
 msgid "Order executes at"
 msgstr "Order executes at"
 
+#: apps/cowswap-frontend/src/modules/notifications/containers/NotificationSidebar/index.tsx
+msgid "Trade alert settings"
+msgstr "Trade alert settings"
+
 #: apps/cowswap-frontend/src/modules/orderProgressBar/pure/steps/SolvingStep.tsx
 msgid "There may be a network issue (such as a gas spike) that is delaying your order. You can wait for the issue to resolve{cancellationModal}"
 msgstr "There may be a network issue (such as a gas spike) that is delaying your order. You can wait for the issue to resolve{cancellationModal}"
@@ -3738,6 +3746,10 @@ msgstr "Transaction expiration"
 msgid "CowSwap no connection"
 msgstr "CowSwap no connection"
 
+#: apps/cowswap-frontend/src/modules/application/containers/App/CowSpeechBubble.tsx
+msgid "View jobs (opens in a new tab)"
+msgstr "View jobs (opens in a new tab)"
+
 #: apps/cowswap-frontend/src/modules/account/containers/Transaction/ActivityDetails.tsx
 #: apps/cowswap-frontend/src/modules/bridge/pure/BridgeActivitySummary/BridgeSummaryHeader.tsx
 #: apps/cowswap-frontend/src/modules/ordersTable/containers/OrderRow/EstimatedExecutionPrice.tsx
@@ -6068,8 +6080,8 @@ msgid "Dark mode"
 msgstr "Dark mode"
 
 #: apps/cowswap-frontend/src/common/pure/ReceiveAmountInfo/index.tsx
-#~ msgid "Bridge costs"
-#~ msgstr "Bridge costs"
+msgid "Bridge costs"
+msgstr "Bridge costs"
 
 #: apps/cowswap-frontend/src/modules/account/containers/Transaction/StatusDetails.tsx
 msgid "View cancellation"
@@ -6285,10 +6297,3 @@ msgstr "Learn more"
 #: apps/cowswap-frontend/src/modules/tradeWidgetAddons/containers/HighFeeWarning/highFeeWarningHelpers.ts
 msgid "Swap and bridge costs are at least {formattedFeePercentage}% of the swap amount"
 msgstr "Swap and bridge costs are at least {formattedFeePercentage}% of the swap amount"
-
-# Notifications / jobs aria labels
-msgid "Trade alert settings"
-msgstr "Trade alert settings"
-
-msgid "View jobs (opens in a new tab)"
-msgstr "View jobs (opens in a new tab)"

apps/cowswap-frontend/src/modules/swap/containers/Warnings/index.tsx

@@ -1,11 +1,11 @@
-import React from 'react'
+import React, { ReactNode } from 'react'
 
 import { useWalletInfo } from '@cowprotocol/wallet'
 import { TradeType } from '@cowprotocol/widget-lib'
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'
 
 import { useInjectedWidgetParams } from 'modules/injectedWidget'
-import { useTradePriceImpact, useTradeRouteContext } from 'modules/trade'
+import { useIsCurrentTradeBridging, useTradePriceImpact, useTradeRouteContext } from 'modules/trade'
 import { BundleTxWrapBanner, HighFeeWarning, MetamaskTransactionWarning } from 'modules/tradeWidgetAddons'
 import { SellNativeWarningBanner } from 'modules/tradeWidgetAddons'
 
@@ -17,19 +17,19 @@ interface WarningsProps {
   buyingFiatAmount: CurrencyAmount<Currency> | null
 }
 
-// TODO: Add proper return type annotation
-// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
-export function Warnings({ buyingFiatAmount }: WarningsProps) {
+export function Warnings({ buyingFiatAmount }: WarningsProps): ReactNode {
   const { chainId } = useWalletInfo()
   const { inputCurrency, inputCurrencyAmount } = useSwapDerivedState()
   const formState = useSwapFormState()
   const tradeUrlParams = useTradeRouteContext()
+  const isCurrentTradeBridging = useIsCurrentTradeBridging()
   const isNativeSellInHooksStore = formState === SwapFormState.SellNativeInHooks
 
   const priceImpactParams = useTradePriceImpact()
   const widgetParams = useInjectedWidgetParams()
   const { enabledTradeTypes } = widgetParams
-  const showTwapSuggestionBanner = !enabledTradeTypes || enabledTradeTypes.includes(TradeType.ADVANCED)
+  const showTwapSuggestionBanner =
+    (!enabledTradeTypes || enabledTradeTypes.includes(TradeType.ADVANCED)) && !isCurrentTradeBridging
 
   return (
     <>

apps/cowswap-frontend/src/modules/swap/pure/TwapSuggestionBanner.tsx

@@ -1,3 +1,5 @@
+import { ReactNode } from 'react'
+
 import { getIsNativeToken } from '@cowprotocol/common-utils'
 import { mapSupportedNetworks, OrderKind, SupportedChainId } from '@cowprotocol/cow-sdk'
 import { InlineBanner, StatusColorVariant } from '@cowprotocol/ui'
@@ -36,16 +38,13 @@ const AMOUNT_LIMIT: Record<SupportedChainId, number> = {
   [SupportedChainId.MAINNET]: 50_000, // $50,000 for mainnet
 }
 
-// TODO: Add proper return type annotation
-// TODO: Reduce function complexity by extracting logic
-// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 export function TwapSuggestionBanner({
   priceImpact,
   buyingFiatAmount,
   tradeUrlParams,
   chainId,
   sellAmount,
-}: TwapSuggestionBannerProps) {
+}: TwapSuggestionBannerProps): ReactNode {
   if (!priceImpact || priceImpact.lessThan(0)) return null
 
   const isSellNative = !!sellAmount?.currency && getIsNativeToken(sellAmount?.currency)