chore: wip

apps/cowswap-frontend/src/modules/ordersTable/containers/OrdersTableWidget/index.tsx

@@ -28,12 +28,12 @@ import { OrdersTableList, useOrdersTableList } from './hooks/useOrdersTableList'
 import { useOrdersTableTokenApprove } from './hooks/useOrdersTableTokenApprove'
 import { useValidatePageUrlParams } from './hooks/useValidatePageUrlParams'
 
-import { OPEN_TAB, ORDERS_TABLE_TABS, ALL_ORDERS_TAB } from '../../const/tabs'
+import { ALL_ORDERS_TAB, OPEN_TAB, ORDERS_TABLE_TABS } from '../../const/tabs'
 import { OrdersTableContainer } from '../../pure/OrdersTableContainer'
 import { OrderActions } from '../../pure/OrdersTableContainer/types'
 import { TabOrderTypes } from '../../types'
 import { buildOrdersTableUrl } from '../../utils/buildOrdersTableUrl'
-import { OrderTableItem, tableItemsToOrders, getParsedOrderFromTableItem } from '../../utils/orderTableGroupUtils'
+import { getParsedOrderFromTableItem, OrderTableItem, tableItemsToOrders } from '../../utils/orderTableGroupUtils'
 import { parseOrdersTableUrl } from '../../utils/parseOrdersTableUrl'
 import { MultipleCancellationMenu } from '../MultipleCancellationMenu'
 import { OrdersReceiptModal } from '../OrdersReceiptModal'
@@ -142,15 +142,13 @@ interface OrdersTableWidgetProps {
   orders: Order[]
   orderType: TabOrderTypes
   isTwapTable?: boolean
-  displayOrdersOnlyForSafeApp?: boolean
   children?: ReactNode
 }
 
 export function OrdersTableWidget({
   orders: allOrders,
   orderType,
   children,
-  displayOrdersOnlyForSafeApp = false,
   isTwapTable = false,
 }: OrdersTableWidgetProps) {
   const { chainId, account } = useWalletInfo()
@@ -353,8 +351,6 @@ export function OrdersTableWidget({
         chainId={chainId}
         tabs={tabs}
         orders={filteredOrders}
-        displayOrdersOnlyForSafeApp={displayOrdersOnlyForSafeApp}
-        isSafeViaWc={isSafeViaWc}
         currentPageNumber={currentPageNumber}
         pendingOrdersPrices={pendingOrdersPrices}
         balancesAndAllowances={balancesAndAllowances}

apps/cowswap-frontend/src/modules/ordersTable/pure/OrdersTableContainer/index.cosmos.tsx

@@ -59,13 +59,11 @@ const orderActions: OrderActions = {
 export default (
   <OrdersTableContainer
     pendingActivities={[]}
-    displayOrdersOnlyForSafeApp={false}
     pendingOrdersPrices={{}}
     chainId={1}
     currentPageNumber={1}
     orders={ordersMock}
     tabs={tabs}
-    isSafeViaWc={false}
     allowsOffchainSigning={true}
     isWalletConnected={true}
     selectedOrders={[]}

apps/cowswap-frontend/src/modules/ordersTable/pure/OrdersTableContainer/index.tsx

@@ -3,7 +3,6 @@ import { ReactNode, useMemo } from 'react'
 import cowMeditatingV2 from '@cowprotocol/assets/cow-swap/meditating-cow-v2.svg'
 import imageConnectWallet from '@cowprotocol/assets/cow-swap/wallet-plus.svg'
 import { isInjectedWidget } from '@cowprotocol/common-utils'
-import { CowSwapSafeAppLink } from '@cowprotocol/ui'
 import type { CowSwapWidgetAppParams } from '@cowprotocol/widget-lib'
 
 import { Trans } from '@lingui/macro'
@@ -21,14 +20,12 @@ import * as styledEl from './OrdersTableContainer.styled'
 import { OrdersTabs } from './OrdersTabs'
 import { OrderActions } from './types'
 
-import { ALL_ORDERS_TAB, HISTORY_TAB, OPEN_TAB, UNFILLABLE_TAB } from '../../const/tabs'
+import { ALL_ORDERS_TAB, OPEN_TAB, UNFILLABLE_TAB } from '../../const/tabs'
 import { TabOrderTypes } from '../../types'
 import { OrderTableItem } from '../../utils/orderTableGroupUtils'
 
 interface OrdersTableContainerProps {
   isWalletConnected: boolean
-  isSafeViaWc: boolean
-  displayOrdersOnlyForSafeApp: boolean
   pendingActivities: string[]
   children?: ReactNode
   orderType: TabOrderTypes
@@ -52,8 +49,6 @@ export function OrdersTableContainer({
   orders,
   tabs,
   isWalletConnected,
-  isSafeViaWc,
-  displayOrdersOnlyForSafeApp,
   selectedOrders,
   allowsOffchainSigning,
   balancesAndAllowances,
@@ -125,11 +120,7 @@ export function OrdersTableContainer({
             </Trans>
           </h3>
           <p>
-            {displayOrdersOnlyForSafeApp && isSafeViaWc ? (
-              <Trans>
-                Use the <CowSwapSafeAppLink /> to see {currentTab === HISTORY_TAB.id ? 'orders history' : 'your orders'}
-              </Trans>
-            ) : searchTerm ? (
+            {searchTerm ? (
               <Trans>Try adjusting your search term or clearing the filter</Trans>
             ) : (
               <>

apps/cowswap-frontend/src/modules/twap/containers/SetupFallbackHandlerWarning/index.tsx

@@ -3,7 +3,7 @@ import { useSetAtom } from 'jotai/index'
 import { useEffect } from 'react'
 
 import { usePrevious } from '@cowprotocol/common-hooks'
-import { ButtonPrimary, InlineBanner, Loader, BannerOrientation, UI } from '@cowprotocol/ui'
+import { BannerOrientation, ButtonPrimary, InlineBanner, Loader, UI } from '@cowprotocol/ui'
 import { useWalletInfo } from '@cowprotocol/wallet'
 
 import styled from 'styled-components/macro'

apps/cowswap-frontend/src/modules/twap/containers/TwapFormWarnings/index.tsx

@@ -75,7 +75,9 @@ export function TwapFormWarnings({ localFormValidation, isConfirmationModal }: T
     <>
       {(() => {
         if (localFormValidation === TwapFormState.NOT_SAFE) {
-          return <UnsupportedWalletWarning isSafeViaWc={isSafeViaWc} />
+          return (
+            <UnsupportedWalletWarning isSafeViaWc={isSafeViaWc} isFallbackHandlerRequired={isFallbackHandlerRequired} />
+          )
         }
 
         if (primaryFormValidation === TradeFormValidation.SellNativeToken) {

apps/cowswap-frontend/src/modules/twap/containers/TwapFormWarnings/warnings/UnsupportedWalletWarning.tsx

@@ -2,14 +2,21 @@ import { CowSwapSafeAppLink, ExternalLink, InlineBanner } from '@cowprotocol/ui'
 
 import { UNSUPPORTED_WALLET_LINK } from 'modules/twap/const'
 
-export function UnsupportedWalletWarning({ isSafeViaWc }: { isSafeViaWc: boolean }) {
-  if (isSafeViaWc) {
+export type UnsupportedWalletWarningProps = {
+  isSafeViaWc: boolean
+  isFallbackHandlerRequired: boolean
+}
+
+export function UnsupportedWalletWarning({ isSafeViaWc, isFallbackHandlerRequired }: UnsupportedWalletWarningProps) {
+  if (isSafeViaWc && isFallbackHandlerRequired) {
     return (
       <InlineBanner bannerType="information">
         <strong>Use Safe web app</strong>
         <p>
-          Use the Safe web app for advanced trading. <br />
-          Only available in the <CowSwapSafeAppLink />
+          TWAPs require a Safe with a special fallback handler. <br />
+          For a one time setup, switch to the Safe web app. <CowSwapSafeAppLink />
+          <br />
+          Afterwards you can use the Safe via WalletConnect to manage your TWAPs.
         </p>
       </InlineBanner>
     )

apps/cowswap-frontend/src/modules/twap/hooks/useTwapFormState.ts

@@ -1,7 +1,7 @@
 import { useAtomValue } from 'jotai'
 import { useMemo } from 'react'
 
-import { useIsSafeApp, useWalletInfo } from '@cowprotocol/wallet'
+import { useIsSafeWallet, useWalletInfo } from '@cowprotocol/wallet'
 
 import { useReceiveAmountInfo } from 'modules/trade'
 import { useUsdAmount } from 'modules/usdAmount'
@@ -22,16 +22,16 @@ export function useTwapFormState(): TwapFormState | null {
   const partTime = useAtomValue(twapTimeIntervalAtom)
 
   const verification = useFallbackHandlerVerification()
-  const isSafeApp = useIsSafeApp()
+  const isSafeWallet = useIsSafeWallet()
 
   return useMemo(() => {
     return getTwapFormState({
-      isSafeApp,
+      isSafeWallet,
       verification,
       twapOrder,
       sellAmountPartFiat,
       chainId,
       partTime,
     })
-  }, [isSafeApp, verification, twapOrder, sellAmountPartFiat, chainId, partTime])
+  }, [isSafeWallet, verification, twapOrder, sellAmountPartFiat, chainId, partTime])
 }

apps/cowswap-frontend/src/modules/twap/pure/PrimaryActionButton/getTwapFormState.test.ts

@@ -24,7 +24,7 @@ describe('getTwapFormState()', () => {
   describe('When sell fiat amount is under threshold', () => {
     it('And order has buy amount, then should return SELL_AMOUNT_TOO_SMALL', () => {
       const result = getTwapFormState({
-        isSafeApp: true,
+        isSafeWallet: true,
         verification: ExtensibleFallbackVerification.HAS_DOMAIN_VERIFIER,
         twapOrder: { ...twapOrder },
         sellAmountPartFiat: CurrencyAmount.fromRawAmount(WETH_SEPOLIA, 10000000),
@@ -37,7 +37,7 @@ describe('getTwapFormState()', () => {
 
     it('And order does NOT have buy amount, then should return null', () => {
       const result = getTwapFormState({
-        isSafeApp: true,
+        isSafeWallet: true,
         verification: ExtensibleFallbackVerification.HAS_DOMAIN_VERIFIER,
         twapOrder: { ...twapOrder, buyAmount: CurrencyAmount.fromRawAmount(COW_SEPOLIA, 0) },
         sellAmountPartFiat: CurrencyAmount.fromRawAmount(WETH_SEPOLIA, 10000000),

apps/cowswap-frontend/src/modules/twap/pure/PrimaryActionButton/getTwapFormState.tsx

@@ -11,7 +11,7 @@ import { isPartTimeIntervalTooShort } from '../../utils/isPartTimeIntervalTooSho
 import { isSellAmountTooSmall } from '../../utils/isSellAmountTooSmall'
 
 export interface TwapFormStateParams {
-  isSafeApp: boolean
+  isSafeWallet: boolean
   verification: ExtensibleFallbackVerification | null
   twapOrder: TWAPOrder | null
   sellAmountPartFiat: Nullish<CurrencyAmount<Currency>>
@@ -28,9 +28,9 @@ export enum TwapFormState {
 }
 
 export function getTwapFormState(props: TwapFormStateParams): TwapFormState | null {
-  const { twapOrder, isSafeApp, verification, sellAmountPartFiat, chainId, partTime } = props
+  const { twapOrder, isSafeWallet, verification, sellAmountPartFiat, chainId, partTime } = props
 
-  if (!isSafeApp) return TwapFormState.NOT_SAFE
+  if (!isSafeWallet) return TwapFormState.NOT_SAFE
 
   if (verification === null) return TwapFormState.LOADING_SAFE_INFO
 

apps/cowswap-frontend/src/modules/twap/updaters/FallbackHandlerVerificationUpdater.tsx

@@ -18,7 +18,7 @@ export function FallbackHandlerVerificationUpdater() {
   const { account } = useWalletInfo()
   const update = useSetAtom(updateFallbackHandlerVerificationAtom)
   const verification = useFallbackHandlerVerification()
-  const isFallbackHandlerRequired = verification !== ExtensibleFallbackVerification.HAS_DOMAIN_VERIFIER
+  const isFallbackHandlerRequired = !verification || verification !== ExtensibleFallbackVerification.HAS_DOMAIN_VERIFIER
 
   const fallbackHandlerUpdateTime = localStorage.getItem(FB_UPDATE_TIME_KEY)
   const isCacheOutdated = !fallbackHandlerUpdateTime || Date.now() - +fallbackHandlerUpdateTime > FB_CACHE_TIME

apps/cowswap-frontend/src/modules/twap/updaters/FallbackHandlerVerificationUpdater2.ts

@@ -0,0 +1,25 @@
+import { useSetAtom } from 'jotai'
+import { useEffect } from 'react'
+
+import { useWalletInfo } from '@cowprotocol/wallet'
+
+import { useExtensibleFallbackContext } from '../hooks/useExtensibleFallbackContext'
+import { verifyExtensibleFallback } from '../services/verifyExtensibleFallback'
+import { updateFallbackHandlerVerificationAtom } from '../state/fallbackHandlerVerificationAtom'
+
+export function FallbackHandlerVerificationUpdater2() {
+  const { account } = useWalletInfo()
+  const updateFallbackHandlerVerification = useSetAtom(updateFallbackHandlerVerificationAtom)
+
+  const extensibleFallbackContext = useExtensibleFallbackContext()
+
+  useEffect(() => {
+    if (!extensibleFallbackContext || !account) return
+
+    verifyExtensibleFallback(extensibleFallbackContext).then((result) => {
+      updateFallbackHandlerVerification({ [account]: result })
+    })
+  }, [account, extensibleFallbackContext, updateFallbackHandlerVerification])
+
+  return null
+}

apps/cowswap-frontend/src/modules/twap/updaters/index.tsx

@@ -1,5 +1,5 @@
 import { percentToBps } from '@cowprotocol/common-utils'
-import { useIsSafeApp, useWalletInfo } from '@cowprotocol/wallet'
+import { useIsSafeWallet, useWalletInfo } from '@cowprotocol/wallet'
 
 import { useComposableCowContract } from 'modules/advancedOrders/hooks/useComposableCowContract'
 import { AppDataUpdater } from 'modules/appData'
@@ -16,11 +16,11 @@ import { useTwapSlippage } from '../hooks/useTwapSlippage'
 
 export function TwapUpdaters() {
   const { account } = useWalletInfo()
-  const isSafeApp = useIsSafeApp()
+  const isSafeWallet = useIsSafeWallet()
   const { contract: composableCowContract, chainId: composableCowChainId } = useComposableCowContract()
   const twapOrderSlippage = useTwapSlippage()
 
-  const shouldLoadTwapOrders = !!(isSafeApp && account && composableCowContract)
+  const shouldLoadTwapOrders = !!(isSafeWallet && account && composableCowContract)
 
   return (
     <>
@@ -32,6 +32,7 @@ export function TwapUpdaters() {
         <>
           <FullAmountQuoteUpdater />
           <FallbackHandlerVerificationUpdater />
+          {/*<FallbackHandlerVerificationUpdater2 />*/}
           <PartOrdersUpdater />
           <TwapOrdersUpdater
             composableCowContract={composableCowContract}

apps/cowswap-frontend/src/pages/AdvancedOrders/index.tsx

@@ -72,12 +72,7 @@ export default function AdvancedOrdersPage() {
 
         {!hideOrdersTable && (
           <styledEl.SecondaryWrapper>
-            <OrdersTableWidget
-              isTwapTable
-              displayOrdersOnlyForSafeApp
-              orderType={TabOrderTypes.ADVANCED}
-              orders={allEmulatedOrders}
-            />
+            <OrdersTableWidget isTwapTable orderType={TabOrderTypes.ADVANCED} orders={allEmulatedOrders} />
           </styledEl.SecondaryWrapper>
         )}
       </styledEl.PageWrapper>