a

src/store.ts

@@ -4,12 +4,16 @@ import { persist } from 'zustand/middleware';
 interface AppStore {
   slippage: number;
   setSlippage: (slippage: number) => void;
+  forceLiquidityHub: boolean;
+  setForceLiquidityHub: (forceLiquidityHub: boolean) => void;
 }
 export const useAppState = create(
   persist<AppStore>(
     (set) => ({
       slippage: 0.5,
       setSlippage: (slippage: number) => set({ slippage }),
+      forceLiquidityHub: false,
+      setForceLiquidityHub: (forceLiquidityHub: boolean) => set({ forceLiquidityHub }),
     }),
     {
       name: 'main-store',

src/trade/liquidity-hub/context.tsx

@@ -13,7 +13,6 @@ const initialState: State = {
   acceptedQuote: undefined,
   acceptedOptimalRate: undefined,
   liquidityHubDisabled: false,
-  forceLiquidityHub: false,
   confirmationModalOpen: false,
   proceedWithLiquidityHub: false,
 };
@@ -24,7 +23,6 @@ interface State {
   inputAmount: string;
   acceptedQuote: Quote | undefined;
   liquidityHubDisabled: boolean;
-  forceLiquidityHub: boolean;
   signature?: string;
   confirmationModalOpen: boolean;
   proceedWithLiquidityHub: boolean;
@@ -88,13 +86,6 @@ export const LiquidityHubSwapProvider = ({ children }: { children: ReactNode })
 
   const sdk = useMemo(() => constructSDK({ partner: 'widget', chainId }), [chainId]);
 
-  useEffect(() => {
-    const params = new URLSearchParams(window.location.search);
-    const lh = params.get('lh');
-    if (lh) {
-      updateState({ forceLiquidityHub: true });
-    }
-  }, [updateState]);
 
   return (
     <LiquidityHubContext.Provider

src/trade/liquidity-hub/useIsLiquidityHubTrade.ts

@@ -3,11 +3,13 @@ import { useLiquidityHubSwapContext } from './useLiquidityHubSwapContext';
 import { useParaswapMinAmountOut } from './hooks';
 import { useLiquidityHubQuote } from './useLiquidityHubQuote';
 import BN from 'bignumber.js';
+import { useAppState } from '@/store';
 
 export const useIsLiquidityHubTrade = () => {
   const {
-    state: { liquidityHubDisabled, proceedWithLiquidityHub, forceLiquidityHub },
+    state: { liquidityHubDisabled, proceedWithLiquidityHub },
   } = useLiquidityHubSwapContext();
+  const {forceLiquidityHub} = useAppState()
   const liquidityHubQuote = useLiquidityHubQuote().data;
   const paraswapMinAmountOut = useParaswapMinAmountOut();
 

src/trade/liquidity-hub/useLiquidityHubSwapCallback.ts

@@ -18,6 +18,12 @@ import { useLiquidityHubSwapContext } from "./useLiquidityHubSwapContext";
 import { useOptimalRate, useLiquidityHubApproval } from "./hooks";
 import { useLiquidityHubQuote } from "./useLiquidityHubQuote";
 
+export const isRejectedError = (error: any) => {
+  const message = error.message?.toLowerCase();
+  return message?.includes('rejected') || message?.includes('denied');
+};
+
+
 export function useLiquidityHubSwapCallback(
   updateSwapProgressState: (values: Partial<SwapProgressState>) => void
 ) {
@@ -118,6 +124,7 @@ export function useLiquidityHubSwapCallback(
           updateState({ signature });
         } catch (error) {
           liquidityHub.analytics.onSignatureFailed((error as Error).message);
+          throw error;
         }
 
         // Pass the liquidity provider txData if possible
@@ -150,9 +157,13 @@ export function useLiquidityHubSwapCallback(
         console.log("Swapped");
         updateSwapProgressState({ swapStatus: SwapStatus.SUCCESS });
       } catch (error) {
-        updateSwapProgressState({ swapStatus: SwapStatus.FAILED });
+        if(isRejectedError(error)) {
+          updateSwapProgressState({ swapStatus: undefined });
+        }else{
+          updateSwapProgressState({ swapStatus: SwapStatus.FAILED });
+          throw error;
+        }
 
-        throw error;
       }
     },
   });

src/trade/settings.tsx

@@ -1,16 +1,13 @@
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "@/components/ui/popover";
-import { useAppState } from "@/store";
-import { SettingsIcon } from "lucide-react";
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
+import { Switch } from '@/components/ui/switch';
+import { useAppState } from '@/store';
+import { SettingsIcon } from 'lucide-react';
 
 export const Settings = () => {
-  const { slippage, setSlippage } = useAppState();
+  const { slippage, setSlippage, forceLiquidityHub, setForceLiquidityHub } = useAppState();
   return (
     <div className="flex justify-end">
       <Popover>
@@ -35,6 +32,15 @@ export const Settings = () => {
                 <div>%</div>
               </div>
             </div>
+            <div className="flex gap-4 items-center justify-between">
+              <Label htmlFor="slippage">Liquidity Hub only</Label>
+              <div className="flex items-center gap-2">
+                <Switch
+                  checked={forceLiquidityHub}
+                  onCheckedChange={() => setForceLiquidityHub(!forceLiquidityHub)}
+                />
+              </div>
+            </div>
           </div>
         </PopoverContent>
       </Popover>