fix: filter out twap orders from limit (#3550)

* feat: add getIsComposableCowOrder to identify TWAP orders

* feat: filter out orders that don't belong based on orderType

* chore: temporarily use prod backend ⚠️ REVERT ME ⚠️

* refactor: extract constant to make if more readable

* chore: revert "chore: temporarily use prod backend ⚠️ REVERT ME ⚠️"

This reverts commit 047331e.

apps/cowswap-frontend/src/modules/ordersTable/containers/OrdersTableWidget/hooks/useOrdersTableList.ts

@@ -2,6 +2,10 @@ import { useMemo } from 'react'
 
 import { Order, PENDING_STATES } from 'legacy/state/orders/actions'
 
+import { getIsComposableCowOrder } from 'utils/orderUtils/getIsComposableCowOrder'
+import { getIsNotComposableCowOrder } from 'utils/orderUtils/getIsNotComposableCowOrder'
+
+import { TabOrderTypes } from '../../../pure/OrdersTableContainer'
 import { groupOrdersTable } from '../../../utils/groupOrdersTable'
 import { getParsedOrderFromTableItem, isParsedOrder, OrderTableItem } from '../../../utils/orderTableGroupUtils'
 
@@ -19,7 +23,7 @@ const ordersSorter = (a: OrderTableItem, b: OrderTableItem) => {
 
 const ORDERS_LIMIT = 100
 
-export function useOrdersTableList(allOrders: Order[]): OrdersTableList {
+export function useOrdersTableList(allOrders: Order[], orderType: TabOrderTypes): OrdersTableList {
   const allSortedOrders = useMemo(() => {
     return groupOrdersTable(allOrders).sort(ordersSorter)
   }, [allOrders])
@@ -29,6 +33,14 @@ export function useOrdersTableList(allOrders: Order[]): OrdersTableList {
       (acc, item) => {
         const order = isParsedOrder(item) ? item : item.parent
 
+        const advancedTabNonAdvancedOrder = orderType === TabOrderTypes.ADVANCED && getIsNotComposableCowOrder(order)
+        const limitTabNonLimitOrder = orderType === TabOrderTypes.LIMIT && getIsComposableCowOrder(order)
+
+        if (advancedTabNonAdvancedOrder || limitTabNonLimitOrder) {
+          // Skip if order type doesn't match
+          return acc
+        }
+
         if (PENDING_STATES.includes(order.status)) {
           acc.pending.push(item)
         } else {
@@ -41,5 +53,5 @@ export function useOrdersTableList(allOrders: Order[]): OrdersTableList {
     )
 
     return { pending: pending.slice(0, ORDERS_LIMIT), history: history.slice(0, ORDERS_LIMIT) }
-  }, [allSortedOrders])
+  }, [allSortedOrders, orderType])
 }

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

@@ -67,7 +67,7 @@ export function OrdersTableWidget({
   const location = useLocation()
   const navigate = useNavigate()
   const cancelOrder = useCancelOrder()
-  const ordersList = useOrdersTableList(allOrders)
+  const ordersList = useOrdersTableList(allOrders, orderType)
   const { allowsOffchainSigning } = useWalletDetails()
   const pendingOrdersPrices = useAtomValue(pendingOrdersPricesAtom)
   const ordersToCancel = useAtomValue(ordersToCancelAtom)

apps/cowswap-frontend/src/utils/orderUtils/getIsComposableCowOrder.ts

@@ -0,0 +1,15 @@
+import { getIsNotComposableCowOrder } from './getIsNotComposableCowOrder'
+
+import { ComposableCowInfo } from '../../common/types'
+
+const TWAP_ORDER_REGEX = /"orderClass":\s*"twap"/
+
+export function getIsComposableCowOrder(order?: {
+  composableCowInfo?: ComposableCowInfo
+  fullAppData?: string | null
+}): boolean {
+  return (
+    !getIsNotComposableCowOrder(order) || // this check only works for orders placed in the same device, thus orders loaded from the API will never have this
+    TWAP_ORDER_REGEX.test(order?.fullAppData || '') // this check assumes the appData is correctly filled
+  )
+}