Skip to content

Commit

Permalink
Merge pull request #4301 from CrocSwap/remove-reload-on-portfolio-not…
Browse files Browse the repository at this point in the history 
…-connected

remove reload on portfolio when wallet not connected
  • Loading branch information
@benwolski
benwolski authored Nov 11, 2024
2 parents be277de + b6649ac commit 43aba65
Show file tree
Hide file tree
Showing 7 changed files with 138 additions and 89 deletions.
4 changes: 4 additions & 0 deletions src/App/components/PageHeader/PageHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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`;
}
Expand All @@ -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 {
Expand Down
16 changes: 7 additions & 9 deletions src/App/hooks/useAppChain.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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'
Expand All @@ -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 {
Expand Down
128 changes: 88 additions & 40 deletions src/components/Portfolio/PortfolioTabs/PortfolioTabs.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {
useEffect,
useState,
useContext,
useMemo,
} from 'react';
// START: Import JSX Functional Components
import Wallet from '../../Global/Account/AccountTabs/Wallet/Wallet';
Expand Down Expand Up @@ -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';
Expand Down Expand Up @@ -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({
Expand Down Expand Up @@ -165,8 +165,9 @@ export default function PortfolioTabs(props: propsIF) {
});
}
});
};

const getLookupUserLimitOrders = async (accountToSearch: string) =>
const getLookupUserLimitOrders = async (accountToSearch: string) => {
fetch(
userLimitOrdersCacheEndpoint +
new URLSearchParams({
Expand All @@ -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(
Expand Down Expand Up @@ -210,6 +210,8 @@ export default function PortfolioTabs(props: propsIF) {
});
}
});
};

const getLookupUserTransactions = async (accountToSearch: string) => {
if (crocEnv && provider) {
fetchUserRecentChanges({
Expand Down Expand Up @@ -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),
Expand All @@ -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 <Wallet/> React Element
const walletProps = {
Expand Down
3 changes: 1 addition & 2 deletions src/components/Trade/TradeTabs/Orders/Orders.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -453,9 +453,8 @@ function Orders(props: propsIF) {
showAllData,
isAccountView,
activeAccountLimitOrderData,
limitOrdersByPool,
activeUserLimitOrdersByPool,
fetchedTransactions, // infinite scroll
fetchedTransactions.limitOrders, // infinite scroll
],
);

Expand Down
8 changes: 2 additions & 6 deletions src/components/Trade/TradeTabs/Ranges/Ranges.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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
],
);

Expand Down
63 changes: 31 additions & 32 deletions src/components/Trade/TradeTabs/Transactions/Transactions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -168,6 +168,13 @@ function Transactions(props: propsIF) {
changes: [...getInitialChangesData()],
});

useEffect(() => {
setFetchedTransactions({
dataReceived: false,
changes: [...getInitialChangesData()],
});
}, [activeAccountTransactionData]);

const [hotTransactions, setHotTransactions] = useState<TransactionIF[]>([]);

const fetchedTransactionsRef = useRef<Changes>();
Expand Down Expand Up @@ -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<boolean>(!isAccountView && showAllData);
// useEffect(() => {
Expand All @@ -256,27 +278,9 @@ function Transactions(props: propsIF) {

// ----------------------------------------------------------------------------------------------

const transactionData = useMemo<TransactionIF[]>(
() =>
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,
Expand Down Expand Up @@ -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<number>(oldestTxTime);
oldestTxTimeRef.current = oldestTxTime;
Expand Down
Loading

0 comments on commit 43aba65

Please sign in to comment.