[{"_1":2,"_126":-5,"_127":-5},"loaderData",{"_3":4,"_10":11},"root",{"_5":-5,"_6":7,"_8":9},"user","appId","cm7twdhs6009l11ml868xhxld","wsEndpoint","https://dev.fun","routes/app.$appId",{"_12":13},"appDetail",{"_14":15,"_16":17,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":31,"_32":33,"_34":35,"_36":37,"_38":39,"_5":40,"_51":52,"_53":54,"_55":54,"_56":57,"_58":54,"_59":17,"_60":17,"_61":62,"_63":64,"_65":66,"_67":68,"_86":-5,"_87":17,"_88":89,"_123":27,"_124":125},"id","d313166867b7b6695e85","isMyApp",false,"name","avalanche","description","The ultimate DEX aggregator that surfs the liquidity waves across multiple exchanges, finding the absolute cheapest and fastest routes for $AVA AI holders with such precision it feels like the app can predict the future. Watch as your trades slice through blockchain congestion like a hot knife through butter!","isLive",true,"tags",[],"cover","https://cdn.dev.fun/snapshot/d313166867b7b6695e85/40873_dd144464.webp","cdnUrl","https://cdn.dev.fun/app/d313166867b7b6695e85/40873","createdAt",["D",1743336316291],"updatedAt",["D",1743336706926],"lastCommitId",["B","40873"],"tier",1,"credits",43,{"_14":41,"_42":43,"_44":-5,"_45":43,"_46":47,"_48":-5,"_49":50},"e00d4cb7-9398-413f-b101-a06145fd4fc5","uniqueId","AAyaAj2q8HaDHcBNVjZJeS9vZbJp21NhKSiGC1xvraAs","username","solanaWallet","displayName","AAy...aAs","bio","avatar","/avatar.svg","commitCount",2,"forkCount",0,"likeCount","runsCount",11,"visitorCount","isArchived","isRenamed","contractAddress","DKu9kykSfbN5LBfFXtNNDPaX35o4Fv6vJ9FKk7pZpump","code","import { useState, useEffect, useRef } from 'react';\nimport { motion, AnimatePresence } from 'framer-motion';\nimport { ArrowRight, ArrowDown, BarChart2, Zap, Settings, Info, Clock, DollarSign, TrendingUp, RefreshCw, Check, Activity, Bell, Radio, Globe } from 'lucide-react';\nimport { io } from 'socket.io-client';\nconst socket = io('wss://ws.dev.fun/app-d313166867b7b6695e85');\nexport default function App() {\n const [inputAmount, setInputAmount] = useState('');\n const [outputAmount, setOutputAmount] = useState('');\n const [selectedInputToken, setSelectedInputToken] = useState('ETH');\n const [selectedOutputToken, setSelectedOutputToken] = useState('AVA');\n const [isRouteExpanded, setIsRouteExpanded] = useState(false);\n const [isConnected, setIsConnected] = useState(false);\n const [liveEvents, setLiveEvents] = useState([]);\n const [marketUpdates, setMarketUpdates] = useState([]);\n const [isSettingsOpen, setIsSettingsOpen] = useState(false);\n const [slippage, setSlippage] = useState(0.5);\n const [isProcessing, setIsProcessing] = useState(false);\n const [showSuccessMessage, setShowSuccessMessage] = useState(false);\n const [activeTab, setActiveTab] = useState('swap');\n const dexes = [{\n name: 'Uniswap',\n fee: 0.3,\n priceImpact: 0.12,\n gas: 42,\n liquidity: 2430000\n }, {\n name: 'SushiSwap',\n fee: 0.25,\n priceImpact: 0.18,\n gas: 48,\n liquidity: 1820000\n }, {\n name: 'PancakeSwap',\n fee: 0.2,\n priceImpact: 0.22,\n gas: 53,\n liquidity: 3150000\n }, {\n name: 'TraderJoe',\n fee: 0.3,\n priceImpact: 0.15,\n gas: 39,\n liquidity: 980000\n }];\n const routes = [{\n id: 1,\n name: 'Optimal',\n paths: [{\n dex: 'Uniswap',\n percentage: 60,\n gasEstimate: 42\n }, {\n dex: 'SushiSwap',\n percentage: 40,\n gasEstimate: 48\n }],\n totalGas: 89,\n executionTime: '~12 seconds',\n savings: '4.2%',\n output: '1,432.12 AVA'\n }, {\n id: 2,\n name: 'Fastest',\n paths: [{\n dex: 'Uniswap',\n percentage: 100,\n gasEstimate: 42\n }],\n totalGas: 42,\n executionTime: '~8 seconds',\n savings: '2.1%',\n output: '1,425.47 AVA'\n }, {\n id: 3,\n name: 'Lowest Gas',\n paths: [{\n dex: 'PancakeSwap',\n percentage: 75,\n gasEstimate: 53\n }, {\n dex: 'SushiSwap',\n percentage: 25,\n gasEstimate: 48\n }],\n totalGas: 38,\n executionTime: '~15 seconds',\n savings: '3.8%',\n output: '1,429.31 AVA'\n }];\n const [selectedRoute, setSelectedRoute] = useState(routes[0]);\n const [marketData, setMarketData] = useState({\n price: 1.42,\n change24h: 8.4,\n volume24h: '32.4M',\n marketCap: '142.6M',\n circulatingSupply: '100.4M',\n lastUpdate: new Date()\n });\n const [userCount, setUserCount] = useState(0);\n const [liveActivity, setLiveActivity] = useState(true);\n const tokens = [{\n symbol: 'ETH',\n name: 'Ethereum',\n balance: '2.354',\n price: 3420\n }, {\n symbol: 'AVA',\n name: 'AVA AI',\n balance: '3,421.54',\n price: 1.42\n }, {\n symbol: 'USDC',\n name: 'USD Coin',\n balance: '5,430.21',\n price: 1\n }, {\n symbol: 'WBTC',\n name: 'Wrapped Bitcoin',\n balance: '0.125',\n price: 61250\n }, {\n symbol: 'USDT',\n name: 'Tether',\n balance: '2,100.00',\n price: 1\n }];\n useEffect(() => {\n function onConnect() {\n setIsConnected(true);\n }\n function onDisconnect() {\n setIsConnected(false);\n }\n function onUserCount(count) {\n setUserCount(count);\n }\n function onPriceUpdate(data) {\n setMarketData(prev => ({\n ...prev,\n price: parseFloat(data.price).toFixed(2),\n change24h: parseFloat(data.change24h).toFixed(1),\n lastUpdate: new Date()\n }));\n setMarketUpdates(prev => {\n const newUpdates = [...prev, {\n id: Date.now(),\n type: 'price',\n value: data.price,\n change: data.change24h,\n timestamp: new Date()\n }];\n return newUpdates.slice(-10);\n });\n }\n function onTradeEvent(data) {\n setLiveEvents(prev => {\n const newEvents = [...prev, {\n id: Date.now(),\n type: data.type || 'swap',\n amount: data.amount,\n from: data.from,\n to: data.to,\n timestamp: new Date()\n }];\n return newEvents.slice(-5);\n });\n }\n socket.on('connect', onConnect);\n socket.on('disconnect', onDisconnect);\n socket.on('devfun:user_count', onUserCount);\n socket.on('price_update', onPriceUpdate);\n socket.on('trade_event', onTradeEvent);\n const priceInterval = setInterval(() => {\n const randomChange = Math.random() * 0.06 - 0.03;\n const newPrice = parseFloat(marketData.price) * (1 + randomChange);\n socket.emit('price_update', {\n price: newPrice.toFixed(2),\n change24h: marketData.change24h + randomChange * 100\n });\n }, 5000);\n const tradeInterval = setInterval(() => {\n if (Math.random() > 0.5) {\n const tokens = ['ETH', 'AVA', 'USDC', 'WBTC', 'USDT'];\n socket.emit('trade_event', {\n type: Math.random() > 0.7 ? 'buy' : 'sell',\n amount: (1000 + Math.random() * 10000).toFixed(0),\n from: tokens[Math.floor(Math.random() * tokens.length)],\n to: tokens[Math.floor(Math.random() * tokens.length)]\n });\n }\n }, 7000);\n return () => {\n socket.off('connect', onConnect);\n socket.off('disconnect', onDisconnect);\n socket.off('devfun:user_count', onUserCount);\n socket.off('price_update', onPriceUpdate);\n socket.off('trade_event', onTradeEvent);\n clearInterval(priceInterval);\n clearInterval(tradeInterval);\n };\n }, [marketData.price, marketData.change24h]);\n useEffect(() => {\n if (inputAmount && !isNaN(inputAmount)) {\n const baseAmount = parseFloat(inputAmount) * marketData.price;\n const randomFactor = 0.98 + Math.random() * 0.04;\n const calculatedAmount = baseAmount / (selectedInputToken === 'ETH' ? 3420 / marketData.price : 1);\n setOutputAmount(calculatedAmount.toFixed(2));\n } else {\n setOutputAmount('');\n }\n }, [inputAmount, selectedInputToken, marketData.price]);\n const flowRef = useRef(null);\n const handleSwap = () => {\n if (!inputAmount || parseFloat(inputAmount) <= 0) return;\n setIsProcessing(true);\n setTimeout(() => {\n setIsProcessing(false);\n setShowSuccessMessage(true);\n setTimeout(() => {\n setShowSuccessMessage(false);\n setInputAmount('');\n setOutputAmount('');\n }, 3000);\n }, 2000);\n };\n const switchTokens = () => {\n setSelectedInputToken(selectedOutputToken);\n setSelectedOutputToken(selectedInputToken);\n setInputAmount(outputAmount);\n setOutputAmount(inputAmount);\n };\n return

\n {}\n

\n {Array.from({\n length: 20\n }).map((_, i) => )}\n

\n\n

\n \n avalanche\n \n

\n \n DEX AGGREGATOR\n \n \n \n LIVE\n \n {isConnected &&

\n {userCount} online\n

}\n

\n \n

\n \n \n $AVA: ${marketData.price}\n = 0 ? 'text-green-400' : 'text-red-400'}`}>\n {marketData.change24h >= 0 ? '+' : ''}{marketData.change24h}%\n \n \n \n \n \n \n

\n \n

\n {}\n

\n \n

\n
\n \n AVA Market Data\n
\n
\n \n
\n

\n \n

\n Price\n \n {liveActivity && }\n Live\n \n

\n ${marketData.price}\n \n Updated {Math.round((new Date() - marketData.lastUpdate) / 1000)}s ago\n \n

\n \n

24h Change

\n = 0 ? 'text-green-400' : 'text-red-400'}`} animate={{\n scale: [1, 1.05, 1]\n }} transition={{\n duration: 0.5,\n repeat: 1,\n repeatType: \"reverse\",\n repeatDelay: 10\n }}>\n {marketData.change24h >= 0 ? '+' : ''}{marketData.change24h}%\n \n

24h Volume

${marketData.volume24h}

Market Cap

${marketData.marketCap}

\n \n {liveActivity && \n

\n \n Live Network Activity\n

\n {liveEvents.map(event => \n

\n \n {event.type === 'buy' ? 'BUY' : event.type === 'sell' ? 'SELL' : 'SWAP'}\n \n \n {new Date(event.timestamp).toLocaleTimeString([], {\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit'\n })}\n \n

\n {event.amount} {event.from} → {event.to}\n

\n )}\n {liveEvents.length === 0 &&

\n Waiting for transaction events...\n

}\n

\n }\n \n \n \n

\n \n DEX Liquidity\n

\n \n

\n {dexes.map((dex, index) =>

{dex.name}

${(dex.liquidity / 1000000).toFixed(2)}M

\n \n

Fee: {dex.fee}%

Gas: ~{dex.gas} Gwei

)}\n

\n \n

\n \n {}\n

\n \n \n \n

\n \n

Smart Swap

\n {isConnected &&

\n \n Connected\n

}\n \n \n {marketUpdates.length > 0 && }\n \n setIsSettingsOpen(!isSettingsOpen)}>\n \n \n

\n \n {}\n \n {isSettingsOpen && \n

Transaction Settings

\n Slippage Tolerance\n

\n {[0.1, 0.5, 1.0].map(value => )}\n

\n setSlippage(parseFloat(e.target.value) || 0)} />\n

\n Transaction Deadline\n

\n \n

minutes

\n }\n \n \n {}\n

\n From\n \n Balance: {tokens.find(t => t.symbol === selectedInputToken)?.balance || '0'}\n \n

\n setInputAmount(e.target.value)} />\n

\n \n

\n {inputAmount &&

\n ≈ ${(parseFloat(inputAmount || 0) * (tokens.find(t => t.symbol === selectedInputToken)?.price || 0)).toFixed(2)}\n

}\n

\n \n {}\n

\n \n \n \n

\n \n {}\n

\n To\n \n Balance: {tokens.find(t => t.symbol === selectedOutputToken)?.balance || '0'}\n \n

\n \n

\n {outputAmount &&

\n ≈ ${(parseFloat(outputAmount || 0) * (tokens.find(t => t.symbol === selectedOutputToken)?.price || 0)).toFixed(2)}\n

}\n

\n \n {}\n {inputAmount && outputAmount && \n

\n \n Smart Route\n

\n \n

\n \n \n {isRouteExpanded && \n

\n {routes.map(route => )}\n

\n \n

\n {selectedRoute.paths.map((path, index) =>

{path.dex}

{path.percentage}%

)}\n

\n \n

\n \n Execution: {selectedRoute.executionTime}\n

\n \n Savings: {selectedRoute.savings}\n

\n }\n \n \n {!isRouteExpanded &&

\n {selectedRoute.paths.map((path, index) =>

\n {index > 0 && }\n \n {path.dex} ({path.percentage}%)\n \n

)}\n

}\n }\n \n {}\n {inputAmount && outputAmount && \n

\n {Array.from({\n length: 40\n }).map((_, i) => )}\n

\n \n \n LIVE AVALANCHE ROUTING\n \n

\n {userCount > 0 ? `${userCount} traders connected` : 'Connecting to network...'}\n

\n \n {}\n {liveActivity &&

\n {selectedRoute.paths.map((path, idx) =>

\n {Array.from({\n length: Math.floor(path.percentage / 10)\n }).map((_, i) => )}\n

)}\n

}\n }\n \n {}\n \n {showSuccessMessage ? \n

\n \n Swap Successful!\n

\n : isProcessing ? \n \n \n \n Processing...\n : 0 ? {\n scale: 1.02\n } : {}} whileTap={inputAmount && parseFloat(inputAmount) > 0 ? {\n scale: 0.98\n } : {}} initial={{\n opacity: 0,\n y: 10\n }} animate={{\n opacity: 1,\n y: 0\n }} exit={{\n opacity: 0,\n y: -10\n }} transition={{\n duration: 0.3\n }} onClick={handleSwap} disabled={!inputAmount || parseFloat(inputAmount) <= 0}>\n {!inputAmount || parseFloat(inputAmount) <= 0 ? 'Enter an amount' : 'Swap Now'}\n }\n \n \n {}\n {inputAmount && outputAmount && !isProcessing && !showSuccessMessage && \n

\n Price Impact\n < {(Math.random() * 0.5).toFixed(2)}%\n

\n Route Savings\n ~{selectedRoute.savings}\n

\n Network Fee\n {selectedRoute.totalGas} Gwei (≈ $1.24)\n

\n }\n

\n \n

\n \n \n

;\n}","packageJson","{\"dependencies\":{\"react\":\"18.2.0\",\"framer-motion\":\"10.16.4\",\"lucide-react\":\"0.441.0\",\"react-router-dom\":\"6.18.0\",\"socket.io-client\":\"4.7.1\"}}","token",{"_18":69,"_70":71,"_72":73,"_74":75,"_76":77,"_78":79,"_80":81,"_82":83,"_84":85,"_61":62},"Ava AI","symbol","AVA","price",0.02009,"marketcap",20097225,"image","https://pump.mypinata.cloud/ipfs/QmQdYxGMCLEZqWpgKo8BREBa5YSUbxFu6qaWiVXUW1yUhg?img-width=256&img-dpr=2","website","https://holoworld.com","twitter","https://x.com/tong0x/status/1856761485474893871","devCount",8,"appCount",12,"upstreamApp","isLordOfDev","analytics",[90,94,96,98,100,102,104,106,108,110,112,114,116,118,120,121],{"_91":92,"_93":54},"day","2025-03-27","runCount",{"_91":95,"_93":54},"2025-03-28",{"_91":97,"_93":54},"2025-03-29",{"_91":99,"_93":54},"2025-03-30",{"_91":101,"_93":54},"2025-03-31",{"_91":103,"_93":54},"2025-04-01",{"_91":105,"_93":54},"2025-04-02",{"_91":107,"_93":54},"2025-04-03",{"_91":109,"_93":54},"2025-04-04",{"_91":111,"_93":54},"2025-04-05",{"_91":113,"_93":54},"2025-04-06",{"_91":115,"_93":54},"2025-04-07",{"_91":117,"_93":54},"2025-04-08",{"_91":119,"_93":54},"2025-04-09",{"_91":99,"_93":83},{"_91":101,"_93":122},3,"snapshot","ogImage","https://cdn.dev.fun/og/image/d313166867b7b6695e85/6509f1d9.webp","actionData","errors"]

\n \n \n AVA Market Data\n \n \n setLiveActivity(!liveActivity)}>\n \n {liveActivity ? 'Live' : 'Paused'}\n \n \n

\n \n DEX Liquidity\n

Smart Swap

Transaction Settings

\n
\n \n AVA Market Data\n
\n
\n \n
\n