Skip to content

Commit

Permalink
Fix/swap history loop & mob event opt ok-34383 ok-34377 ok-34378 (#6354)
Browse files Browse the repository at this point in the history
  • Loading branch information
@ezailWang
ezailWang authored Dec 17, 2024
1 parent 513ca95 commit 5a9ea61
Show file tree
Hide file tree
Showing 9 changed files with 109 additions and 80 deletions.
34 changes: 25 additions & 9 deletions packages/kit-bg/src/services/ServiceSwap.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,8 @@ export default class ServiceSwap extends ServiceBase {
private historyStateIntervals: Record<string, ReturnType<typeof setTimeout>> =
{};

private historyCurrentStateIntervalIds: string[] = [];

private historyStateIntervalCountMap: Record<string, number> = {};

private _crossChainReceiveTxBlockNotificationMap: Record<string, boolean> =
Expand Down Expand Up @@ -1021,13 +1023,18 @@ export default class ServiceSwap extends ServiceBase {
@backgroundMethod()
async cleanHistoryStateIntervals(historyId?: string) {
if (!historyId) {
Object.values(this.historyStateIntervals).forEach((interval) => {
clearInterval(interval);
});
this.historyStateIntervals = {};
this.historyStateIntervalCountMap = {};
this.historyCurrentStateIntervalIds = [];
await Promise.all(
Object.keys(this.historyStateIntervals).map(async (id) => {
clearInterval(this.historyStateIntervals[id]);
delete this.historyStateIntervals[id];
delete this.historyStateIntervalCountMap[id];
}),
);
} else if (this.historyStateIntervals[historyId]) {
clearInterval(this.historyStateIntervals[historyId]);
this.historyCurrentStateIntervalIds =
this.historyCurrentStateIntervalIds.filter((id) => id !== historyId);
delete this.historyStateIntervals[historyId];
delete this.historyStateIntervalCountMap[historyId];
}
Expand Down Expand Up @@ -1074,7 +1081,10 @@ export default class ServiceSwap extends ServiceBase {
const error = e as { message?: string };
console.error('Swap History Status Fetch Error', error?.message);
} finally {
if (enableInterval) {
if (
enableInterval &&
this.historyCurrentStateIntervalIds.includes(swapTxHistory.txInfo.txId)
) {
this.historyStateIntervalCountMap[swapTxHistory.txInfo.txId] =
(this.historyStateIntervalCountMap[swapTxHistory.txInfo.txId] ?? 0) +
1;
Expand All @@ -1101,10 +1111,16 @@ export default class ServiceSwap extends ServiceBase {
item.status === ESwapTxHistoryStatus.PENDING ||
item.status === ESwapTxHistoryStatus.CANCELING,
);
await this.cleanHistoryStateIntervals();
if (!statusPendingList.length) return;
const newHistoryStatePendingList = statusPendingList.filter(
(item) => !this.historyCurrentStateIntervalIds.includes(item.txInfo.txId),
);
if (!newHistoryStatePendingList.length) return;
await Promise.all(
statusPendingList.map(async (swapTxHistory) => {
newHistoryStatePendingList.map(async (swapTxHistory) => {
this.historyCurrentStateIntervalIds = [
...this.historyCurrentStateIntervalIds,
swapTxHistory.txInfo.txId,
];
await this.swapHistoryStatusRunFetch(swapTxHistory);
}),
);
Expand Down
3 changes: 0 additions & 3 deletions packages/kit/src/provider/Container/InAppNotification/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,6 @@ const InAppNotification = () => {

useEffect(() => {
void backgroundApiProxy.serviceSwap.swapHistoryStatusFetchLoop();
return () => {
void backgroundApiProxy.serviceSwap.cleanHistoryStateIntervals();
};
}, [swapHistoryPendingList]);
return null;
};
Expand Down
72 changes: 23 additions & 49 deletions packages/kit/src/states/jotai/contexts/swap/actions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -318,7 +318,6 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
return;
}
await backgroundApiProxy.serviceSwap.setApprovingTransaction(undefined);
// let enableInterval = true;
try {
if (!loadingDelayEnable) {
set(swapQuoteFetchingAtom(), true);
Expand All @@ -336,43 +335,26 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
if (!loadingDelayEnable) {
set(swapQuoteFetchingAtom(), false);
set(swapQuoteListAtom(), res);
set(swapQuoteEventTotalCountAtom(), res.length);
set(swapQuoteEventTotalCountAtom(), {
count: res.length,
});
} else {
set(swapSilenceQuoteLoading(), true);
setTimeout(() => {
set(swapSilenceQuoteLoading(), false);
set(swapQuoteListAtom(), res);
set(swapQuoteEventTotalCountAtom(), res.length);
set(swapQuoteEventTotalCountAtom(), {
count: res.length,
});
}, 800);
}
} catch (e: any) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
if (e?.cause !== ESwapFetchCancelCause.SWAP_QUOTE_CANCEL) {
set(swapQuoteFetchingAtom(), false);
}
// } else {
// // enableInterval = false;
// }
} finally {
set(swapQuoteActionLockAtom(), (v) => ({ ...v, actionLock: false }));
// if (enableInterval) {
// const quoteIntervalCount = get(swapQuoteIntervalCountAtom());
// if (quoteIntervalCount <= swapQuoteIntervalMaxCount) {
// void this.recoverQuoteInterval.call(
// set,
// {
// key: autoSlippage
// ? ESwapSlippageSegmentKey.AUTO
// : ESwapSlippageSegmentKey.CUSTOM,
// value: slippagePercentage,
// },
// address,
// accountId,
// true,
// );
// }
// set(swapQuoteIntervalCountAtom(), quoteIntervalCount + 1);
// }
}
},
);
Expand All @@ -391,8 +373,6 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
) => {
switch (event.type) {
case 'open': {
// set(swapQuoteListAtom(), []);
// set(swapQuoteEventTotalCountAtom(), 0);
break;
}
case 'message': {
Expand Down Expand Up @@ -445,7 +425,10 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
(dataJson as ISwapQuoteEventInfo).totalQuoteCount === 0
) {
const { totalQuoteCount } = dataJson as ISwapQuoteEventInfo;
set(swapQuoteEventTotalCountAtom(), totalQuoteCount);
set(swapQuoteEventTotalCountAtom(), {
eventId: (dataJson as ISwapQuoteEventInfo).eventId,
count: totalQuoteCount,
});
if (totalQuoteCount === 0) {
set(swapQuoteListAtom(), [
{
Expand All @@ -461,7 +444,11 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
const swapAutoSlippageSuggestedValue = get(
swapAutoSlippageSuggestedValueAtom(),
);
if (quoteResultData.data?.length) {
const quoteEventTotalCount = get(swapQuoteEventTotalCountAtom());
if (
quoteResultData.data?.length &&
quoteEventTotalCount.eventId === quoteResultData.data[0].eventId
) {
const quoteResultsUpdateSlippage = quoteResultData.data.map(
(quote) => {
if (
Expand Down Expand Up @@ -518,9 +505,10 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
?.filter(
(q) =>
!q.eventId ||
(q.eventId &&
(quoteEventTotalCount.eventId &&
quoteResultData?.data?.[0]?.eventId &&
q.eventId === quoteResultData.data[0].eventId),
quoteEventTotalCount.eventId ===
quoteResultData.data[0].eventId),
);
set(swapQuoteListAtom(), [...newQuoteList]);
}
Expand All @@ -531,22 +519,6 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
}
case 'done': {
set(swapQuoteActionLockAtom(), (v) => ({ ...v, actionLock: false }));
// const quoteIntervalCount = get(swapQuoteIntervalCountAtom());
// if (quoteIntervalCount <= swapQuoteIntervalMaxCount) {
// void this.recoverQuoteInterval.call(
// set,
// {
// key: event.params.autoSlippage
// ? ESwapSlippageSegmentKey.AUTO
// : ESwapSlippageSegmentKey.CUSTOM,
// value: event.params.slippagePercentage,
// },
// event.params.userAddress,
// event.accountId,
// true,
// );
// }
// set(swapQuoteIntervalCountAtom(), quoteIntervalCount + 1);
this.closeQuoteEvent();
break;
}
Expand Down Expand Up @@ -647,7 +619,9 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
);
} else {
set(swapQuoteFetchingAtom(), false);
set(swapQuoteEventTotalCountAtom(), 0);
set(swapQuoteEventTotalCountAtom(), {
count: 0,
});
set(swapQuoteListAtom(), []);
set(swapQuoteActionLockAtom(), (v) => ({ ...v, actionLock: false }));
}
Expand Down Expand Up @@ -896,8 +870,8 @@ class ContentJotaiActionsSwap extends ContextJotaiActionsBase {
if (
!networks.length ||
!swapFromAddressInfo.accountInfo?.ready ||
(quoteEventTotalCount > 0 &&
quoteResultList.length < quoteEventTotalCount)
(quoteEventTotalCount.count > 0 &&
quoteResultList.length < quoteEventTotalCount.count)
) {
return;
}
Expand Down
4 changes: 3 additions & 1 deletion packages/kit/src/states/jotai/contexts/swap/atoms.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,7 +156,9 @@ export const {
export const {
atom: swapQuoteEventTotalCountAtom,
use: useSwapQuoteEventTotalCountAtom,
} = contextAtom<number>(0);
} = contextAtom<{ eventId?: string; count: number }>({
count: 0,
});

export const {
atom: swapShouldRefreshQuoteAtom,
Expand Down
52 changes: 42 additions & 10 deletions packages/kit/src/views/Swap/components/SwapRefreshButton.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { memo, useCallback, useEffect, useRef } from 'react';

import { debounce } from 'lodash';
import { Animated } from 'react-native';

import { LottieView, XStack } from '@onekeyhq/components';
Expand All @@ -20,35 +21,56 @@ const SwapRefreshButton = ({
const themeVariant = useThemeVariant();
const lottieRef = useRef<any>(null);
const isFocused = useRouteIsFocused();
const { isRefreshQuote } = useSwapActionState();
const { isRefreshQuote, isLoading } = useSwapActionState();
const isRefreshQuoteRef = useRef(isRefreshQuote);
if (isRefreshQuoteRef.current !== isRefreshQuote) {
isRefreshQuoteRef.current = isRefreshQuote;
}
const listenerRef = useRef<string | null>(null);
const isFocusedRef = useRef(isFocused);
if (isFocusedRef.current !== isFocused) {
isFocusedRef.current = isFocused;
}
const loadingAnimRef = useRef(loadingAnim);
if (loadingAnimRef.current !== loadingAnim) {
loadingAnimRef.current = loadingAnim;
}
const refreshActionRef = useRef(refreshAction);
if (refreshActionRef.current !== refreshAction) {
refreshActionRef.current = refreshAction;
}
// eslint-disable-next-line react-hooks/exhaustive-deps
const onRefresh = useCallback(
(manual?: boolean) => {
if (!isFocused) return;
loadingAnim.setValue(0);
Animated.timing(loadingAnim, {
debounce((manual?: boolean) => {
if (!isFocusedRef.current) return;
loadingAnimRef.current.setValue(0);
Animated.timing(loadingAnimRef.current, {
toValue: -1,
duration: 500,
useNativeDriver: true,
}).start((finished) => {
if (finished) {
refreshAction(manual);
refreshActionRef.current(manual);
}
});
},
[isFocused, loadingAnim, refreshAction],
}, 10),
[],
);

useEffect(() => {
const fn = processAnim.addListener(({ value }) => {
if (listenerRef.current) return;
listenerRef.current = processAnim.addListener(({ value }) => {
// mobile will trigger twice, so we need to debounce it , when max value
if (value === swapRefreshInterval) {
onRefresh();
}
});
return () => processAnim.removeListener(fn);
return () => {
if (listenerRef.current) {
processAnim.removeListener(listenerRef.current);
listenerRef.current = null;
}
};
}, [onRefresh, processAnim]);

useEffect(() => {
Expand All @@ -67,6 +89,16 @@ const SwapRefreshButton = ({
}
}, [processAnim, isRefreshQuote]);

useEffect(() => {
if (isFocusedRef.current) {
if (isLoading) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
lottieRef.current?.reset();
processAnimRef.current?.reset();
}
}
}, [isLoading]);

useEffect(() => {
if (isFocused) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
Expand Down
7 changes: 4 additions & 3 deletions packages/kit/src/views/Swap/hooks/useSwapAccount.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -292,9 +292,10 @@ export function useSwapRecipientAddressInfo(enable: boolean) {
swapToAnotherAccountSwitchOn
) {
if (
getToNetWorkAddressFromAccountId?.result?.accountAddress &&
getToNetWorkAddressFromAccountId?.result?.accountAddress !==
swapToAnotherAddressInfo.address &&
((getToNetWorkAddressFromAccountId?.result?.accountAddress &&
getToNetWorkAddressFromAccountId?.result?.accountAddress !==
swapToAnotherAddressInfo.address) ||
!getToNetWorkAddressFromAccountId?.result?.accountAddress) &&
swapToAnotherAddressInfo.networkId ===
currentQuoteRes?.toTokenInfo.networkId
) {
Expand Down
4 changes: 3 additions & 1 deletion packages/kit/src/views/Swap/hooks/useSwapBuiltTx.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,9 @@ export function useSwapBuildTx() {
if (data?.[0]) {
setSwapFromTokenAmount(''); // send success, clear from token amount
setSwapQuoteResultList([]);
setSwapQuoteEventTotalCount(0);
setSwapQuoteEventTotalCount({
count: 0,
});
setSettings((v) => ({
// reset account switch for reset swap receive address
...v,
Expand Down
8 changes: 5 additions & 3 deletions packages/kit/src/views/Swap/hooks/useSwapQuote.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -275,13 +275,15 @@ export function useSwapQuote() {
} else if (isHiddenModel) {
if (
swapQuoteFetchingRef.current ||
(swapQuoteEventTotalCountRef.current > 0 &&
(swapQuoteEventTotalCountRef.current.count > 0 &&
swapQuoteResultListRef.current.length <
swapQuoteEventTotalCountRef.current)
swapQuoteEventTotalCountRef.current.count)
) {
// reset tab quote data when swap modal is open and tab quote data is fetching
closeQuoteEvent();
setSwapQuoteEventTotalCount(0);
setSwapQuoteEventTotalCount({
count: 0,
});
setSwapQuoteResultList([]);
setFromTokenAmount('');
}
Expand Down
5 changes: 4 additions & 1 deletion packages/kit/src/views/Swap/hooks/useSwapState.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,10 @@ export function useSwapQuoteLoading() {
export function useSwapQuoteEventFetching() {
const [quoteEventTotalCount] = useSwapQuoteEventTotalCountAtom();
const [quoteResult] = useSwapQuoteListAtom();
return quoteEventTotalCount > 0 && quoteResult.length < quoteEventTotalCount;
return (
quoteEventTotalCount.count > 0 &&
quoteResult.length < quoteEventTotalCount.count
);
}

export function useSwapActionState() {
Expand Down

0 comments on commit 5a9ea61

Please sign in to comment.