From 8ad8c70b025018b0a0e0f271f5ec226c47bf514f Mon Sep 17 00:00:00 2001
From: Lizaveta Miasayedava <effie.mias@gmail.com>
Date: Mon, 25 Aug 2025 22:15:59 +0100
Subject: [PATCH 1/2] fix: do not show insufficient gas with auto refuel
 enabled

---
 .../src/components/Messages/GasSufficiencyMessage.tsx       | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx b/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
index 188f91733..16d40f525 100644
--- a/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
+++ b/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
@@ -3,6 +3,7 @@ import { type BoxProps, Typography } from '@mui/material'
 import { useTranslation } from 'react-i18next'
 import { formatUnits } from 'viem'
 import type { GasSufficiency } from '../../hooks/useGasSufficiency.js'
+import { useSettings } from '../../stores/settings/useSettings.js'
 import { AlertMessage } from './AlertMessage.js'
 
 interface GasSufficiencyMessageProps extends BoxProps {
@@ -14,6 +15,11 @@ export const GasSufficiencyMessage: React.FC<GasSufficiencyMessageProps> = ({
   ...props
 }) => {
   const { t } = useTranslation()
+  const { enabledAutoRefuel } = useSettings(['enabledAutoRefuel'])
+  // Do not show the message if gas auto refuel is enabled
+  if (enabledAutoRefuel) {
+    return null
+  }
   return (
     <AlertMessage
       severity="warning"

From 25ab1c71fc1085ab80b710ba2f8ded6b1f8ea3de Mon Sep 17 00:00:00 2001
From: Lizaveta Miasayedava <effie.mias@gmail.com>
Date: Tue, 26 Aug 2025 15:26:47 +0100
Subject: [PATCH 2/2] fix: disable message via gas sufficiency hook

---
 .../src/components/Messages/GasSufficiencyMessage.tsx     | 6 ------
 packages/widget/src/hooks/useGasSufficiency.ts            | 8 ++++++++
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx b/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
index 16d40f525..188f91733 100644
--- a/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
+++ b/packages/widget/src/components/Messages/GasSufficiencyMessage.tsx
@@ -3,7 +3,6 @@ import { type BoxProps, Typography } from '@mui/material'
 import { useTranslation } from 'react-i18next'
 import { formatUnits } from 'viem'
 import type { GasSufficiency } from '../../hooks/useGasSufficiency.js'
-import { useSettings } from '../../stores/settings/useSettings.js'
 import { AlertMessage } from './AlertMessage.js'
 
 interface GasSufficiencyMessageProps extends BoxProps {
@@ -15,11 +14,6 @@ export const GasSufficiencyMessage: React.FC<GasSufficiencyMessageProps> = ({
   ...props
 }) => {
   const { t } = useTranslation()
-  const { enabledAutoRefuel } = useSettings(['enabledAutoRefuel'])
-  // Do not show the message if gas auto refuel is enabled
-  if (enabledAutoRefuel) {
-    return null
-  }
   return (
     <AlertMessage
       severity="warning"
diff --git a/packages/widget/src/hooks/useGasSufficiency.ts b/packages/widget/src/hooks/useGasSufficiency.ts
index 09c95fcf0..81b4f57c8 100644
--- a/packages/widget/src/hooks/useGasSufficiency.ts
+++ b/packages/widget/src/hooks/useGasSufficiency.ts
@@ -4,6 +4,7 @@ import { useAccount } from '@lifi/wallet-management'
 import { useQuery } from '@tanstack/react-query'
 import { useMemo } from 'react'
 import { useWidgetConfig } from '../providers/WidgetProvider/WidgetProvider.js'
+import { useSettings } from '../stores/settings/useSettings.js'
 import { getQueryKey } from '../utils/queries.js'
 import { useAvailableChains } from './useAvailableChains.js'
 import { useIsContractAddress } from './useIsContractAddress.js'
@@ -27,6 +28,8 @@ export const useGasSufficiency = (route?: RouteExtended) => {
   })
   const { keyPrefix } = useWidgetConfig()
 
+  const { enabledAutoRefuel } = useSettings(['enabledAutoRefuel'])
+
   const { relevantAccounts, relevantAccountsQueryKey } = useMemo(() => {
     const chainTypes = route?.steps.reduce((acc, step) => {
       const chainType = getChainById(step.action.fromChainId)?.chainType
@@ -69,6 +72,11 @@ export const useGasSufficiency = (route?: RouteExtended) => {
         return []
       }
 
+      // Do not check for gas sufficiency if auto refuel is enabled
+      if (enabledAutoRefuel) {
+        return []
+      }
+
       // Filter out steps that are relayer steps or have primaryType 'Permit' or 'Order'
       const filteredSteps = route.steps.filter(
         (step) =>