Merge branch 'staging' of https://github.com/CrocSwap/ambient-ts-app …

…into develop
CrocSwap · Oct 12, 2024 · 3120bc4 · 3120bc4
2 parents 2bc76f1 + 26f2a85
commit 3120bc4
Show file tree

Hide file tree

Showing 6 changed files with 125 additions and 64 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "ambient-ts-app",
-    "version": "2.9.4",
+    "version": "2.9.6",
     "private": true,
     "type": "module",
     "dependencies": {

diff --git a/src/ambient-utils/constants/blacklist.ts b/src/ambient-utils/constants/blacklist.ts
@@ -162,6 +162,13 @@ export const checkBlacklist = (addr: string) => {
     return isOnBlacklist;
 };
 
+export const excludedTokenAddresses = [
+    '0xd294412741ee08aa3a35ac179ff0b4d9d7fefb27', // fake SCR
+    ...(import.meta.env.VITE_EXCLUDED_TOKEN_ADDRESSES || '')
+        .split(',')
+        .filter(Boolean),
+];
+
 // if blacklist is not already lowercase
 // export const checkBlacklist = (addr: string) => {
 //     const blacklistLowerCase = blacklist.map((addr: string) => addr.toLowerCase());

diff --git a/src/ambient-utils/dataLayer/functions/getPoolStats.ts b/src/ambient-utils/dataLayer/functions/getPoolStats.ts
@@ -4,6 +4,7 @@ import {
     GCGO_OVERRIDE_URL,
     ZERO_ADDRESS,
     ethereumMainnet,
+    excludedTokenAddresses,
     mainnetETH,
 } from '../../constants';
 import { FetchContractDetailsFn, TokenPriceFn } from '../../api';
@@ -403,6 +404,7 @@ export async function getChainStats(
     const chainStatsFreshEndpoint = GCGO_OVERRIDE_URL
         ? GCGO_OVERRIDE_URL + '/chain_stats?'
         : graphCacheUrl + '/chain_stats?';
+
     return fetch(
         chainStatsFreshEndpoint +
             new URLSearchParams({
@@ -415,10 +417,22 @@ export async function getChainStats(
             if (!json?.data) {
                 return undefined;
             }
+
+            // Filter out excluded addresses
+            const lowercaseExcludedAddresses = excludedTokenAddresses.map(
+                (addr) => addr.toLowerCase(),
+            );
+            const filteredData = json.data.filter(
+                (item: { tokenAddr: string }) =>
+                    !lowercaseExcludedAddresses.includes(
+                        item.tokenAddr.toLowerCase(),
+                    ),
+            );
+
             if (returnAs === 'expanded') {
-                return json.data;
+                return filteredData;
             } else if (returnAs === 'cumulative') {
-                const payload = json.data as DexTokenAggServerIF[];
+                const payload = filteredData as DexTokenAggServerIF[];
                 return expandChainStats(
                     payload,
                     chainId,

diff --git a/src/components/Trade/TradeModules/TradeModuleSkeleton.tsx b/src/components/Trade/TradeModules/TradeModuleSkeleton.tsx
@@ -20,7 +20,10 @@ import { UserDataContext } from '../../../contexts/UserDataContext';
 import { TradeDataContext } from '../../../contexts/TradeDataContext';
 import SmolRefuelLink from '../../Global/SmolRefuelLink/SmolRefuelLink';
 import useMediaQuery from '../../../utils/hooks/useMediaQuery';
-import { brand } from '../../../ambient-utils/constants';
+import {
+    brand,
+    excludedTokenAddresses,
+} from '../../../ambient-utils/constants';
 import { poolParamsIF } from '../../../utils/hooks/useLinkGen';
 import { openInNewTab } from '../../../ambient-utils/dataLayer';
 
@@ -83,13 +86,34 @@ export const TradeModuleSkeleton = (props: PropsIF) => {
 
     const smallScreen = useMediaQuery('(max-width: 768px)');
 
+    const lowercaseExcludedAddresses = useMemo(
+        () => excludedTokenAddresses.map((addr) => addr.toLowerCase()),
+        [excludedTokenAddresses],
+    );
+
+    const tokenAIsExcludedToken = useMemo(() => {
+        return lowercaseExcludedAddresses.includes(
+            tokenA.address.toLowerCase(),
+        );
+    }, [tokenA.address, lowercaseExcludedAddresses]);
+
+    const tokenBIsExcludedToken = useMemo(() => {
+        return lowercaseExcludedAddresses.includes(
+            tokenB.address.toLowerCase(),
+        );
+    }, [tokenB.address, lowercaseExcludedAddresses]);
+
     // token acknowledgement needed message (empty string if none needed)
     const ackTokenMessage = useMemo<string>(() => {
         // !Important   any changes to verbiage in this code block must be approved
         // !Important   ... by Doug, get in writing by email or request specific
         // !Important   ... review for a pull request on GitHub
         let text: string;
-        if (needConfirmTokenA && needConfirmTokenB) {
+        if (tokenAIsExcludedToken) {
+            text = `This ${tokenA.symbol} token has been identified as a potentially fraudulent token. Please be sure this is the actual token you want to trade. Many tokens will use the same name and symbol as other major tokens. Always conduct your own research before trading.`;
+        } else if (tokenBIsExcludedToken) {
+            text = `This ${tokenB.symbol} token has been identified as a potentially fraudulent token. Please be sure this is the actual token you want to trade. Many tokens will use the same name and symbol as other major tokens. Always conduct your own research before trading.`;
+        } else if (needConfirmTokenA && needConfirmTokenB) {
             text = `The tokens ${tokenA.symbol || tokenA.name} and ${
                 tokenB.symbol || tokenB.name
             } are not listed on any major reputable token list. Please be sure these are the actual tokens you want to trade. Many fraudulent tokens will use the same name and symbol as other major tokens. Always conduct your own research before trading.`;
@@ -108,7 +132,7 @@ export const TradeModuleSkeleton = (props: PropsIF) => {
     }, [needConfirmTokenA, needConfirmTokenB, tokenA.symbol, tokenB.symbol]);
 
     const formattedAckTokenMessage = ackTokenMessage.replace(
-        /\b(not)\b/g,
+        /\b(not|(?<!many\s)fraudulent)\b/gi,
         '<span style="color: var(--negative); text-transform: uppercase;">$1</span>',
     );
 

diff --git a/src/contexts/ExploreContext.tsx b/src/contexts/ExploreContext.tsx
@@ -38,7 +38,7 @@ export interface ExploreContextIF {
         ) => void;
         reset: () => void;
     };
-    tokens: useTokenStatsIF;
+    topTokensOnchain: useTokenStatsIF;
     isExploreDollarizationEnabled: boolean;
     setIsExploreDollarizationEnabled: Dispatch<SetStateAction<boolean>>;
 }
@@ -435,7 +435,7 @@ export const ExploreContextProvider = (props: { children: ReactNode }) => {
                 setExtraPools([]);
             },
         },
-        tokens: dexTokens,
+        topTokensOnchain: dexTokens,
         isExploreDollarizationEnabled,
         setIsExploreDollarizationEnabled,
     };

diff --git a/src/pages/platformAmbient/Explore/Explore.tsx b/src/pages/platformAmbient/Explore/Explore.tsx
@@ -12,6 +12,7 @@ import { LuRefreshCcw, LuSearch } from 'react-icons/lu';
 import useOnClickOutside from '../../../utils/hooks/useOnClickOutside';
 import TopPools from '../../../components/Global/Explore/TopPools/TopPools';
 import DexTokens from '../../../components/Global/Explore/DexTokens/DexTokens';
+import { excludedTokenAddresses } from '../../../ambient-utils/constants';
 
 interface ExploreIF {
     view: 'pools' | 'tokens';
@@ -22,7 +23,7 @@ export default function Explore(props: ExploreIF) {
     // full expanded data set
     const {
         pools,
-        tokens,
+        topTokensOnchain,
         isExploreDollarizationEnabled,
         setIsExploreDollarizationEnabled,
     } = useContext(ExploreContext);
@@ -43,8 +44,8 @@ export default function Explore(props: ExploreIF) {
     // trigger process to fetch and format token data when page loads with
     // ... gatekeeping to prevent re-fetch if data is already loaded
     useEffect(() => {
-        if (crocEnv !== undefined && tokens.data.length === 0) {
-            tokens.update();
+        if (crocEnv !== undefined && topTokensOnchain.data.length === 0) {
+            topTokensOnchain.update();
         }
     }, [crocEnv !== undefined]);
 
@@ -103,7 +104,7 @@ export default function Explore(props: ExploreIF) {
                 getAllPools();
                 break;
             case 'tokens':
-                tokens.update();
+                topTokensOnchain.update();
                 break;
         }
     }
@@ -121,9 +122,23 @@ export default function Explore(props: ExploreIF) {
     const [searchQueryPool, setSearchQueryPool] = useState<string>('');
     const [searchQueryToken, setSearchQueryToken] = useState<string>('');
 
+    // Filter out excluded addresses
+    const lowercaseExcludedAddresses = excludedTokenAddresses.map((addr) =>
+        addr.toLowerCase(),
+    );
+    const filteredPoolsNoExcludedTokens = pools.all.filter(
+        (pool) =>
+            !lowercaseExcludedAddresses.includes(
+                pool.base.address.toLowerCase(),
+            ) &&
+            !lowercaseExcludedAddresses.includes(
+                pool.quote.address.toLowerCase(),
+            ),
+    );
+
     const filteredPools =
         searchQueryPool.length >= 2
-            ? pools.all.filter((pool: PoolIF) => {
+            ? filteredPoolsNoExcludedTokens.filter((pool: PoolIF) => {
                   const lowerCaseQuery = searchQueryPool.toLowerCase();
                   return (
                       pool.base.name.toLowerCase().includes(lowerCaseQuery) ||
@@ -132,11 +147,11 @@ export default function Explore(props: ExploreIF) {
                       pool.quote.symbol.toLowerCase().includes(lowerCaseQuery)
                   );
               })
-            : pools.all;
+            : filteredPoolsNoExcludedTokens;
 
     const filteredTokens =
         searchQueryToken.length >= 2
-            ? tokens.data.filter((token) => {
+            ? topTokensOnchain.data.filter((token) => {
                   const lowerCaseQuery = searchQueryToken.toLowerCase();
                   return (
                       token.tokenMeta?.name
@@ -147,7 +162,7 @@ export default function Explore(props: ExploreIF) {
                           .includes(lowerCaseQuery)
                   );
               })
-            : tokens.data;
+            : topTokensOnchain.data;
 
     const searchInputRef = useRef<HTMLDivElement>(null);
 
@@ -189,63 +204,65 @@ export default function Explore(props: ExploreIF) {
     );
 
     const optionsContent = (
-        <div className={`${styles.options_content} ${view === 'tokens' ? styles.pools_options_content: ''}`}>
-        {inputContainer}
-        {view === 'pools' && (
+        <div
+            className={`${styles.options_content} ${view === 'tokens' ? styles.pools_options_content : ''}`}
+        >
+            {inputContainer}
+            {view === 'pools' && (
+                <DefaultTooltip
+                    interactive
+                    title={
+                        isExploreDollarizationEnabled
+                            ? 'Switch to prices in native currency'
+                            : 'Switch to prices in USD'
+                    }
+                    enterDelay={500}
+                >
+                    <div className={styles.refresh_container}>
+                        <button
+                            className={styles.refresh_button}
+                            onClick={() =>
+                                setIsExploreDollarizationEnabled(
+                                    (prev) => !prev,
+                                )
+                            }
+                        >
+                            {
+                                <AiOutlineDollarCircle
+                                    size={20}
+                                    id='trade_dollarized_prices_button'
+                                    aria-label='Toggle dollarized prices button'
+                                    style={{
+                                        color: isExploreDollarizationEnabled
+                                            ? 'var(--accent1)'
+                                            : undefined,
+                                    }}
+                                />
+                            }
+                        </button>
+                    </div>
+                </DefaultTooltip>
+            )}
             <DefaultTooltip
                 interactive
                 title={
-                    isExploreDollarizationEnabled
-                        ? 'Switch to prices in native currency'
-                        : 'Switch to prices in USD'
+                    view === 'pools'
+                        ? 'Refresh Top Pools'
+                        : 'Refresh Active Tokens'
                 }
                 enterDelay={500}
             >
                 <div className={styles.refresh_container}>
                     <button
                         className={styles.refresh_button}
-                        onClick={() =>
-                            setIsExploreDollarizationEnabled(
-                                (prev) => !prev,
-                            )
-                        }
+                        onClick={() => handleRefresh()}
                     >
-                        {
-                            <AiOutlineDollarCircle
-                                size={20}
-                                id='trade_dollarized_prices_button'
-                                aria-label='Toggle dollarized prices button'
-                                style={{
-                                    color: isExploreDollarizationEnabled
-                                        ? 'var(--accent1)'
-                                        : undefined,
-                                }}
-                            />
-                        }
+                        <LuRefreshCcw size={20} />
                     </button>
                 </div>
             </DefaultTooltip>
-        )}
-        <DefaultTooltip
-            interactive
-            title={
-                view === 'pools'
-                    ? 'Refresh Top Pools'
-                    : 'Refresh Active Tokens'
-            }
-            enterDelay={500}
-        >
-            <div className={styles.refresh_container}>
-                <button
-                    className={styles.refresh_button}
-                    onClick={() => handleRefresh()}
-                >
-                    <LuRefreshCcw size={20} />
-                </button>
-            </div>
-        </DefaultTooltip>
-    </div>
-    )
+        </div>
+    );
 
     function handleToggle() {
         changeView(view);
@@ -259,9 +276,8 @@ export default function Explore(props: ExploreIF) {
             <h2 className={styles.title_text}>{titleTextForDOM}</h2>
             </div> */}
             <div className={styles.options_wrapper}>
-
-            <h2 className={styles.title_text}>{titleTextForDOM}</h2>
-           {optionsContent}
+                <h2 className={styles.title_text}>{titleTextForDOM}</h2>
+                {optionsContent}
             </div>
 
             {view === 'pools' && (
@@ -290,4 +306,4 @@ export default function Explore(props: ExploreIF) {
             )}
         </section>
     );
-}
+}