diff --git a/src/App/components/PageHeader/PageHeader.tsx b/src/App/components/PageHeader/PageHeader.tsx
index b9ee01f819..cc676b6376 100644
--- a/src/App/components/PageHeader/PageHeader.tsx
+++ b/src/App/components/PageHeader/PageHeader.tsx
@@ -230,6 +230,8 @@ const PageHeader = function () {
document.title = `${ensNameOrAddressTruncated} Wallet Balances ~ Ambient`;
} else if (pathNoLeadingSlash.includes('exchange-balances')) {
document.title = `${ensNameOrAddressTruncated} Exchange Balances ~ Ambient`;
+ } else if (pathNoLeadingSlash.includes('xp')) {
+ document.title = `${ensNameOrAddressTruncated} XP ~ Ambient`;
} else {
document.title = `${ensNameOrAddressTruncated} ~ Ambient`;
}
@@ -252,6 +254,8 @@ const PageHeader = function () {
} else {
document.title = 'Explore ~ Ambient';
}
+ } else if (pathNoLeadingSlash.includes('xp-leaderboard')) {
+ document.title = 'XP Leaderboard ~ Ambient';
} else if (location.pathname.includes('404')) {
document.title = '404 ~ Ambient';
} else {
diff --git a/src/App/hooks/useAppChain.ts b/src/App/hooks/useAppChain.ts
index ad20b788d5..6c814aa2ba 100644
--- a/src/App/hooks/useAppChain.ts
+++ b/src/App/hooks/useAppChain.ts
@@ -210,13 +210,16 @@ export const useAppChain = (): {
// ... else in this file responds to changes in the browser environment
function chooseNetwork(network: NetworkIF): void {
localStorage.setItem(CHAIN_LS_KEY, network.chainId);
- const { pathname } = window.location;
-
setActiveNetwork(network);
+
+ const { pathname } = window.location;
const isPathENS = pathname.slice(1)?.includes('.eth');
const isPathHexEoaAddress = checkEoaHexAddress(pathname);
const isPathUserAddress = isPathENS || isPathHexEoaAddress;
const isPathUserXpOrLeaderboard = pathname.includes('/xp');
+ const shouldStayOnCurrentExactPath =
+ isPathUserAddress || isPathUserXpOrLeaderboard;
+
if (
linkGenCurrent.currentPage === 'initpool' ||
linkGenCurrent.currentPage === 'reposition'
@@ -226,16 +229,11 @@ export const useAppChain = (): {
linkGenSwap.navigate(`chain=${network.chainId}`);
} else if (pathname.includes('chain')) {
linkGenCurrent.navigate(`chain=${network.chainId}`);
- } else if (isPathUserAddress || isPathUserXpOrLeaderboard) {
- // this one is specific to user account pages
- // !IMPORTANT: not this one
- window.location.reload();
+ } else if (shouldStayOnCurrentExactPath) {
+ // do not navigate away from current path
} else {
linkGenCurrent.navigate();
}
- // this one seems to be necessary for chain switching, when disabled
- // ... the app appears to switch chains but doesn't get any pool data
- // window.location.reload();
}
return {
diff --git a/src/components/Portfolio/PortfolioTabs/PortfolioTabs.tsx b/src/components/Portfolio/PortfolioTabs/PortfolioTabs.tsx
index cbcee1f51e..d011e310af 100644
--- a/src/components/Portfolio/PortfolioTabs/PortfolioTabs.tsx
+++ b/src/components/Portfolio/PortfolioTabs/PortfolioTabs.tsx
@@ -3,6 +3,7 @@ import {
useEffect,
useState,
useContext,
+ useMemo,
} from 'react';
// START: Import JSX Functional Components
import Wallet from '../../Global/Account/AccountTabs/Wallet/Wallet';
@@ -36,7 +37,6 @@ import Transactions from '../../Trade/TradeTabs/Transactions/Transactions';
import {
CACHE_UPDATE_FREQ_IN_MS,
GCGO_OVERRIDE_URL,
- IS_LOCAL_ENV,
} from '../../../ambient-utils/constants';
import { CrocEnvContext } from '../../../contexts/CrocEnvContext';
import { TokenContext } from '../../../contexts/TokenContext';
@@ -120,7 +120,7 @@ export default function PortfolioTabs(props: propsIF) {
? GCGO_OVERRIDE_URL + '/user_limit_orders?'
: graphCacheUrl + '/user_limit_orders?';
- const getLookupUserPositions = async (accountToSearch: string) =>
+ const getLookupUserPositions = async (accountToSearch: string) => {
fetch(
userPositionsCacheEndpoint +
new URLSearchParams({
@@ -165,8 +165,9 @@ export default function PortfolioTabs(props: propsIF) {
});
}
});
+ };
- const getLookupUserLimitOrders = async (accountToSearch: string) =>
+ const getLookupUserLimitOrders = async (accountToSearch: string) => {
fetch(
userLimitOrdersCacheEndpoint +
new URLSearchParams({
@@ -176,7 +177,6 @@ export default function PortfolioTabs(props: propsIF) {
)
.then((response) => response?.json())
.then((json) => {
- // temporarily skip ENS fetch
const userLimitOrderStates = json?.data;
if (userLimitOrderStates && crocEnv && provider) {
Promise.all(
@@ -210,6 +210,8 @@ export default function PortfolioTabs(props: propsIF) {
});
}
});
+ };
+
const getLookupUserTransactions = async (accountToSearch: string) => {
if (crocEnv && provider) {
fetchUserRecentChanges({
@@ -242,17 +244,25 @@ export default function PortfolioTabs(props: propsIF) {
useEffect(() => {
(async () => {
if (
- isServerEnabled &&
!connectedAccountActive &&
- !!tokens.tokenUniv &&
resolvedAddress &&
- !!crocEnv
+ isServerEnabled &&
+ crocEnv &&
+ (await crocEnv.context).chain.chainId === chainId &&
+ !!tokens.tokenUniv
) {
- IS_LOCAL_ENV &&
- console.debug(
- 'querying user tx/order/positions because address changed',
- );
-
+ setDataLoadingStatus({
+ datasetName: 'isLookupUserRangeDataLoading',
+ loadingStatus: true,
+ });
+ setDataLoadingStatus({
+ datasetName: 'isLookupUserOrderDataLoading',
+ loadingStatus: true,
+ });
+ setDataLoadingStatus({
+ datasetName: 'isLookupUserTxDataLoading',
+ loadingStatus: true,
+ });
await Promise.all([
getLookupUserTransactions(resolvedAddress),
getLookupUserLimitOrders(resolvedAddress),
@@ -263,39 +273,77 @@ export default function PortfolioTabs(props: propsIF) {
}, [
resolvedAddress,
connectedAccountActive,
+ !!tokens.tokenUniv,
+ crocEnv,
+ chainId,
+ provider,
+ isServerEnabled,
+ ]);
+
+ // update without loading indicator on an interval
+ useEffect(() => {
+ (async () => {
+ if (
+ !connectedAccountActive &&
+ resolvedAddress &&
+ isServerEnabled &&
+ crocEnv &&
+ (await crocEnv.context).chain.chainId === chainId &&
+ !!tokens.tokenUniv
+ ) {
+ await Promise.all([
+ getLookupUserTransactions(resolvedAddress),
+ getLookupUserLimitOrders(resolvedAddress),
+ getLookupUserPositions(resolvedAddress),
+ ]);
+ }
+ })();
+ }, [
isUserIdle
? Math.floor(Date.now() / (2 * CACHE_UPDATE_FREQ_IN_MS))
: Math.floor(Date.now() / CACHE_UPDATE_FREQ_IN_MS),
- !!tokens.tokenUniv,
- !!crocEnv,
- !!provider,
-
- isServerEnabled,
]);
- const activeAccountPositionData = connectedAccountActive
- ? _positionsByUser
- : lookupAccountPositionData;
- // eslint-disable-next-line
- const activeAccountLimitOrderData = connectedAccountActive
- ? _limitsByUser
- : lookupAccountLimitOrderData;
-
- const activeAccountTransactionData = connectedAccountActive
- ? _txsByUser?.filter((tx) => {
- if (tx.changeType !== 'fill' && tx.changeType !== 'cross') {
- return true;
- } else {
- return false;
- }
- })
- : lookupAccountTransactionData?.filter((tx) => {
- if (tx.changeType !== 'fill' && tx.changeType !== 'cross') {
- return true;
- } else {
- return false;
- }
- });
+ const activeAccountPositionData = useMemo(
+ () =>
+ connectedAccountActive
+ ? _positionsByUser
+ : lookupAccountPositionData,
+ [connectedAccountActive, _positionsByUser, lookupAccountPositionData],
+ );
+ const activeAccountLimitOrderData = useMemo(
+ () =>
+ connectedAccountActive
+ ? _limitsByUser
+ : lookupAccountLimitOrderData,
+ [connectedAccountActive, _limitsByUser, lookupAccountLimitOrderData],
+ );
+
+ const activeAccountTransactionData = useMemo(
+ () =>
+ connectedAccountActive
+ ? _txsByUser?.filter((tx) => {
+ if (
+ tx.changeType !== 'fill' &&
+ tx.changeType !== 'cross'
+ ) {
+ return true;
+ } else {
+ return false;
+ }
+ })
+ : lookupAccountTransactionData?.filter((tx) => {
+ if (
+ tx.changeType !== 'fill' &&
+ tx.changeType !== 'cross'
+ ) {
+ return true;
+ } else {
+ return false;
+ }
+ }),
+ [connectedAccountActive, _txsByUser, lookupAccountTransactionData],
+ );
// props for React Element
const walletProps = {
diff --git a/src/components/Trade/TradeTabs/Orders/Orders.tsx b/src/components/Trade/TradeTabs/Orders/Orders.tsx
index 8afc244b38..bdf63d173a 100644
--- a/src/components/Trade/TradeTabs/Orders/Orders.tsx
+++ b/src/components/Trade/TradeTabs/Orders/Orders.tsx
@@ -453,9 +453,8 @@ function Orders(props: propsIF) {
showAllData,
isAccountView,
activeAccountLimitOrderData,
- limitOrdersByPool,
activeUserLimitOrdersByPool,
- fetchedTransactions, // infinite scroll
+ fetchedTransactions.limitOrders, // infinite scroll
],
);
diff --git a/src/components/Trade/TradeTabs/Ranges/Ranges.tsx b/src/components/Trade/TradeTabs/Ranges/Ranges.tsx
index 4695362f80..432e1c8fc1 100644
--- a/src/components/Trade/TradeTabs/Ranges/Ranges.tsx
+++ b/src/components/Trade/TradeTabs/Ranges/Ranges.tsx
@@ -618,17 +618,13 @@ function Ranges(props: propsIF) {
? activeAccountPositionData || []
: !showAllData
? activeUserPositionsByPool
- : // : positionsByPool.positions.filter(
- // (position) => position.positionLiq != 0,
- // ),
- fetchedTransactions.positions,
+ : fetchedTransactions.positions,
[
showAllData,
isAccountView,
activeAccountPositionData,
- positionsByPool,
activeUserPositionsByPool,
- fetchedTransactions, // infinite scroll
+ fetchedTransactions.positions, // infinite scroll
],
);
diff --git a/src/components/Trade/TradeTabs/Transactions/Transactions.tsx b/src/components/Trade/TradeTabs/Transactions/Transactions.tsx
index 312ee97e7b..722d3cf984 100644
--- a/src/components/Trade/TradeTabs/Transactions/Transactions.tsx
+++ b/src/components/Trade/TradeTabs/Transactions/Transactions.tsx
@@ -168,6 +168,13 @@ function Transactions(props: propsIF) {
changes: [...getInitialChangesData()],
});
+ useEffect(() => {
+ setFetchedTransactions({
+ dataReceived: false,
+ changes: [...getInitialChangesData()],
+ });
+ }, [activeAccountTransactionData]);
+
const [hotTransactions, setHotTransactions] = useState([]);
const fetchedTransactionsRef = useRef();
@@ -229,25 +236,40 @@ function Transactions(props: propsIF) {
useEffect(() => {
// clear fetched transactions when switching pools
- if (!isAccountView && showAllData && transactionsByPool.changes.length === 0) {
+ if (
+ !isAccountView &&
+ showAllData &&
+ transactionsByPool.changes.length === 0
+ ) {
setFetchedTransactions({
dataReceived: true,
changes: [],
});
- }
- else if(!isAccountView && !showAllData && userAddressRef.current && userTransactionsByPool.changes.length === 0){
+ } else if (
+ !isAccountView &&
+ !showAllData &&
+ userAddressRef.current &&
+ userTransactionsByPool.changes.length === 0
+ ) {
setFetchedTransactions({
dataReceived: true,
changes: [],
});
- }
- else if(isAccountView && (accountAddressRef.current || userAddressRef.current) && activeAccountTransactionData?.length === 0){
+ } else if (
+ isAccountView &&
+ (accountAddressRef.current || userAddressRef.current) &&
+ activeAccountTransactionData?.length === 0
+ ) {
setFetchedTransactions({
dataReceived: true,
changes: [],
});
}
- }, [transactionsByPool.changes, userTransactionsByPool.changes, activeAccountTransactionData]);
+ }, [
+ transactionsByPool.changes,
+ userTransactionsByPool.changes,
+ activeAccountTransactionData,
+ ]);
// const [showInfiniteScroll, setShowInfiniteScroll] = useState(!isAccountView && showAllData);
// useEffect(() => {
@@ -256,27 +278,9 @@ function Transactions(props: propsIF) {
// ----------------------------------------------------------------------------------------------
- const transactionData = useMemo(
- () =>
- isAccountView
- ? // ? activeAccountTransactionData || []
- fetchedTransactions.changes
- : !showAllData
- ? fetchedTransactions.changes
- : fetchedTransactions.changes,
- [
- activeAccountTransactionData,
- userTransactionsByPool,
- transactionsByPool,
- showAllData,
- fetchedTransactions,
- isAccountView,
- ],
- );
-
const txDataToDisplay: TransactionIF[] = isCandleSelected
? candleTransactionData
- : transactionData;
+ : fetchedTransactions.changes;
const [
sortBy,
@@ -373,18 +377,13 @@ function Transactions(props: propsIF) {
}, [pagesVisible[0]]);
const oldestTxTime = useMemo(() => {
- const dataToFilter = transactionData;
+ const dataToFilter = fetchedTransactions.changes;
return dataToFilter.length > 0
? dataToFilter.reduce((min, transaction) => {
return transaction.txTime < min ? transaction.txTime : min;
}, dataToFilter[0].txTime)
: 0;
- }, [
- transactionData,
- fetchedTransactions.changes,
- showAllData,
- isAccountView,
- ]);
+ }, [fetchedTransactions.changes, showAllData, isAccountView]);
const oldestTxTimeRef = useRef(oldestTxTime);
oldestTxTimeRef.current = oldestTxTime;
diff --git a/src/pages/platformAmbient/Portfolio/Portfolio.tsx b/src/pages/platformAmbient/Portfolio/Portfolio.tsx
index 74d514b48b..4a148bcb53 100644
--- a/src/pages/platformAmbient/Portfolio/Portfolio.tsx
+++ b/src/pages/platformAmbient/Portfolio/Portfolio.tsx
@@ -293,6 +293,11 @@ function Portfolio(props: propsIF) {
chainId &&
!connectedAccountActive
) {
+ if (
+ !crocEnv ||
+ (await crocEnv.context).chain.chainId !== chainId
+ )
+ return;
try {
setResolvedAddressTokens([]);
const combinedBalances: TokenIF[] = [];