[Limit Orders]: Feature Flag for SQS Active Orders

packages/web/components/complex/orders-history/index.tsx

@@ -84,7 +84,7 @@ export const OrderHistory = observer(() => {
   } = useOrderbookAllActiveOrders({
     userAddress: wallet?.address ?? "",
     pageSize: 20,
-    refetchInterval: 10000,
+    refetchInterval: featureFlags.sqsActiveOrders ? 10000 : 30000,
   });
   const groupedOrders = useMemo(() => groupOrdersByStatus(orders), [orders]);
   const groups = useMemo(
@@ -123,7 +123,7 @@ export const OrderHistory = observer(() => {
     useOrderbookClaimableOrders({
       userAddress: wallet?.address ?? "",
       disabled: isLoading || filledOrdersInDisplay.length === 0 || isRefetching,
-      refetchInterval: 10000,
+      refetchInterval: featureFlags.sqsActiveOrders ? 10000 : 30000,
     });
 
   const claimOrders = useCallback(async () => {

packages/web/hooks/limit-orders/use-orderbook.ts

@@ -10,6 +10,7 @@ import { getAssetFromAssetList } from "@osmosis-labs/utils";
 import { useCallback, useMemo } from "react";
 
 import { AssetLists } from "~/config/generated/asset-lists";
+import { useFeatureFlags } from "~/hooks/use-feature-flags";
 import { useSwapAsset } from "~/hooks/use-swap";
 import { useStore } from "~/stores";
 import { api } from "~/utils/trpc";
@@ -262,7 +263,11 @@ const useMakerFee = ({ orderbookAddress }: { orderbookAddress: string }) => {
 
 export type DisplayableLimitOrder = MappedLimitOrder;
 
-export const useOrderbookAllActiveOrders = ({
+/**
+ * Queries for all active orders for a given user.
+ * Swaps between using SQS passthrough and a direct node query based on feature flag.
+ */
+const useOrdersQuery = ({
   userAddress,
   pageSize = 10,
   refetchInterval = 5000,
@@ -271,17 +276,18 @@ export const useOrderbookAllActiveOrders = ({
   pageSize?: number;
   refetchInterval?: number;
 }) => {
+  const { sqsActiveOrders } = useFeatureFlags();
   const { orderbooks } = useOrderbooks();
   const addresses = orderbooks.map(({ contractAddress }) => contractAddress);
   const {
-    data: orders,
-    isLoading,
-    fetchNextPage,
-    isFetching,
-    isFetchingNextPage,
-    hasNextPage,
-    refetch,
-    isRefetching,
+    data: sqsOrders,
+    isLoading: isSQSOrdersLoading,
+    fetchNextPage: fetchSQSOrdersNextPage,
+    isFetching: isSQSOrdersFetching,
+    isFetchingNextPage: isSQSOrdersFetchingNextPage,
+    hasNextPage: hasSQSOrdersNextPage,
+    refetch: refetchSQSOrders,
+    isRefetching: isSQSOrdersRefetching,
   } = api.local.orderbooks.getAllOrdersSQS.useInfiniteQuery(
     {
       userOsmoAddress: userAddress,
@@ -293,7 +299,7 @@ export const useOrderbookAllActiveOrders = ({
       refetchInterval,
       cacheTime: refetchInterval,
       staleTime: refetchInterval,
-      enabled: !!userAddress && addresses.length > 0,
+      enabled: !!userAddress && addresses.length > 0 && sqsActiveOrders,
       refetchOnMount: true,
       keepPreviousData: false,
       trpc: {
@@ -305,6 +311,76 @@ export const useOrderbookAllActiveOrders = ({
     }
   );
 
+  const {
+    data: nodeOrders,
+    isLoading: isNodeOrdersLoading,
+    fetchNextPage: fetchNodeOrdersNextPage,
+    isFetching: isNodeOrdersFetching,
+    isFetchingNextPage: isNodeOrdersFetchingNextPage,
+    hasNextPage: hasNodeOrdersNextPage,
+    refetch: refetchNodeOrders,
+    isRefetching: isNodeOrdersRefetching,
+  } = api.edge.orderbooks.getAllOrders.useInfiniteQuery(
+    {
+      userOsmoAddress: userAddress,
+      limit: pageSize,
+    },
+    {
+      getNextPageParam: (lastPage) => lastPage.nextCursor,
+      initialCursor: 0,
+      refetchInterval,
+      cacheTime: refetchInterval,
+      staleTime: refetchInterval,
+      enabled: !!userAddress && addresses.length > 0 && !sqsActiveOrders,
+      refetchOnMount: true,
+      keepPreviousData: false,
+      trpc: {
+        abortOnUnmount: true,
+        context: {
+          skipBatch: true,
+        },
+      },
+    }
+  );
+
+  return {
+    data: sqsActiveOrders ? sqsOrders : nodeOrders,
+    isLoading: sqsActiveOrders ? isSQSOrdersLoading : isNodeOrdersLoading,
+    fetchNextPage: sqsActiveOrders
+      ? fetchSQSOrdersNextPage
+      : fetchNodeOrdersNextPage,
+    isFetching: sqsActiveOrders ? isSQSOrdersFetching : isNodeOrdersFetching,
+    isFetchingNextPage: sqsActiveOrders
+      ? isSQSOrdersFetchingNextPage
+      : isNodeOrdersFetchingNextPage,
+    hasNextPage: sqsActiveOrders ? hasSQSOrdersNextPage : hasNodeOrdersNextPage,
+    refetch: sqsActiveOrders ? refetchSQSOrders : refetchNodeOrders,
+    isRefetching: sqsActiveOrders
+      ? isSQSOrdersRefetching
+      : isNodeOrdersRefetching,
+  };
+};
+
+export const useOrderbookAllActiveOrders = ({
+  userAddress,
+  pageSize = 10,
+  refetchInterval = 5000,
+}: {
+  userAddress: string;
+  pageSize?: number;
+  refetchInterval?: number;
+}) => {
+  const {
+    data: orders,
+    isLoading,
+    fetchNextPage,
+    isFetching,
+    isFetchingNextPage,
+    hasNextPage,
+    refetch,
+    isRefetching,
+  } = useOrdersQuery({ userAddress, pageSize, refetchInterval });
+
   const allOrders = useMemo(() => {
     return orders?.pages.flatMap((page) => page.items) ?? [];
   }, [orders]);
@@ -326,7 +402,11 @@ export const useOrderbookAllActiveOrders = ({
   };
 };
 
-export const useOrderbookClaimableOrders = ({
+/**
+ * Queries for all claimable orders for a given user.
+ * Swaps between using SQS passthrough and a direct node query based on feature flag.
+ */
+const useClaimableOrdersQuery = ({
   userAddress,
   disabled = false,
   refetchInterval = 5000,
@@ -336,8 +416,7 @@ export const useOrderbookClaimableOrders = ({
   refetchInterval?: number;
 }) => {
   const { orderbooks } = useOrderbooks();
-  const { accountStore } = useStore();
-  const account = accountStore.getWallet(accountStore.osmosisChainId);
+  const { sqsActiveOrders } = useFeatureFlags();
   const addresses = orderbooks.map(({ contractAddress }) => contractAddress);
   const { data: claimableOrders, isLoading } =
     api.local.orderbooks.getAllOrdersSQS.useInfiniteQuery(
@@ -350,7 +429,30 @@ export const useOrderbookClaimableOrders = ({
         getNextPageParam: (lastPage) => lastPage.nextCursor,
         initialCursor: 0,
         refetchInterval,
-        enabled: !!userAddress && addresses.length > 0 && !disabled,
+        enabled:
+          !!userAddress && addresses.length > 0 && !disabled && sqsActiveOrders,
+        refetchOnMount: true,
+        keepPreviousData: false,
+        trpc: {
+          abortOnUnmount: true,
+          context: {
+            skipBatch: true,
+          },
+        },
+      }
+    );
+
+  const { data: nodeClaimableOrders, isLoading: nodeIsLoading } =
+    api.edge.orderbooks.getClaimableOrders.useQuery(
+      {
+        userOsmoAddress: userAddress,
+      },
+      {
+        enabled:
+          !!userAddress &&
+          addresses.length > 0 &&
+          !disabled &&
+          !sqsActiveOrders,
         refetchOnMount: true,
         keepPreviousData: false,
         trpc: {
@@ -363,8 +465,35 @@ export const useOrderbookClaimableOrders = ({
     );
 
   const orders = useMemo(() => {
+    if (!sqsActiveOrders) return nodeClaimableOrders;
     return claimableOrders?.pages?.flatMap((page) => page.items) ?? [];
-  }, [claimableOrders?.pages]);
+  }, [claimableOrders?.pages, nodeClaimableOrders, sqsActiveOrders]);
+
+  return {
+    data: orders,
+    isLoading: sqsActiveOrders ? isLoading : nodeIsLoading,
+  };
+};
+
+export const useOrderbookClaimableOrders = ({
+  userAddress,
+  disabled = false,
+  refetchInterval = 5000,
+}: {
+  userAddress: string;
+  disabled?: boolean;
+  refetchInterval?: number;
+}) => {
+  const { orderbooks } = useOrderbooks();
+  const { accountStore } = useStore();
+  const account = accountStore.getWallet(accountStore.osmosisChainId);
+  const addresses = orderbooks.map(({ contractAddress }) => contractAddress);
+  const { data: orders, isLoading } = useClaimableOrdersQuery({
+    userAddress,
+    disabled,
+    refetchInterval,
+  });
+
   const claimAllOrders = useCallback(async () => {
     if (!account || !orders) return;
     const msgs = addresses

packages/web/hooks/use-feature-flags.ts

@@ -30,7 +30,8 @@ export type AvailableFlags =
   | "advancedChart"
   | "cypherCard"
   | "newPortfolioPage"
-  | "inGivenOut";
+  | "inGivenOut"
+  | "sqsActiveOrders";
 
 const defaultFlags: Record<AvailableFlags, boolean> = {
   staking: true,
@@ -56,6 +57,7 @@ const defaultFlags: Record<AvailableFlags, boolean> = {
   cypherCard: false,
   newPortfolioPage: false,
   inGivenOut: false,
+  sqsActiveOrders: false,
 };
 
 const LIMIT_ORDER_COUNTRY_CODES =
@@ -67,7 +69,6 @@ export function useFeatureFlags() {
   const launchdarklyFlags: Record<AvailableFlags, boolean> = useFlags();
   const { isMobile } = useWindowSize();
   const [isInitialized, setIsInitialized] = useState(false);
-
   const client = useLDClient();
 
   const { data: levanaGeoblock } = useQuery(