Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

don't start loading quote again when window becomes visible/invisible #92

Merged
merged 1 commit into from
Jan 31, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions src/hooks/useDebouncedTrade.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import { useRoutingAPITrade } from 'state/routing/useRoutingAPITrade'

import useAutoRouterSupported from './useAutoRouterSupported'
import useDebounce from './useDebounce'
import useIsWindowVisible from './useIsWindowVisible'

// Prevents excessive quote requests between keystrokes.
const DEBOUNCE_TIME = 350
Expand Down Expand Up @@ -50,7 +49,6 @@ export function useDebouncedTrade(
} {
const { chainId } = useWeb3React()
const autoRouterSupported = useAutoRouterSupported()
const isWindowVisible = useIsWindowVisible()

const inputs = useMemo<[CurrencyAmount<Currency> | undefined, Currency | undefined]>(
() => [amountSpecified, otherCurrency],
Expand All @@ -69,7 +67,7 @@ export function useDebouncedTrade(

const routerPreference = RouterPreference.CLIENT

const skipBothFetches = !autoRouterSupported || !isWindowVisible || isWrap
const skipBothFetches = !autoRouterSupported || isWrap
const skipRoutingFetch = skipBothFetches || isDebouncing

const routingApiTradeResult = useRoutingAPITrade(
Expand Down
12 changes: 8 additions & 4 deletions src/state/routing/useRoutingAPITrade.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ export function useRoutingAPITrade<TTradeType extends TradeType>(
: [otherCurrency, amountSpecified?.currency],
[amountSpecified, otherCurrency, tradeType]
)
const [result, setResult] = useState<RoutingAPITradeReturn>({ state: TradeState.LOADING })
const [result, setResult] = useState<RoutingAPITradeReturn>({ state: TradeState.INVALID })
const timerIdRef = useRef<ReturnType<typeof setInterval> | null>(null)
const { provider } = useWeb3React()
const queryArgs = useRoutingAPIArguments({
Expand All @@ -67,7 +67,7 @@ export function useRoutingAPITrade<TTradeType extends TradeType>(
useEffect(() => {
const args = queryArgs
if (skipFetch) return
if (args === skipToken) return setResult({ state: TradeState.INVALID })
if (args === skipToken) return
async function updateResults(args: GetQuoteArgs) {
if (document.hidden) return
const walletProvider = provider
Expand Down Expand Up @@ -100,13 +100,17 @@ export function useRoutingAPITrade<TTradeType extends TradeType>(
}
}
const res = await makePriceQuery()
if (!active || queryArgs === skipToken) return
if (!active) return
setResult(res)
}
let active = true
setResult(TRADE_LOADING)
updateResults(args)
timerIdRef.current = setInterval(() => updateResults(args), AVERAGE_L1_BLOCK_TIME)
timerIdRef.current = setInterval(() => {
// trigger price update peridiocally but don't trigger one if the tab is not active
if ('visibilityState' in document && document.visibilityState === 'hidden') return
updateResults(args)
}, AVERAGE_L1_BLOCK_TIME)
return () => {
active = false
if (timerIdRef.current) clearInterval(timerIdRef.current)
Expand Down
Loading