feat: polygon

app/admin/stats/page.tsx

@@ -13,12 +13,15 @@ import { PlatformStats, TimeFrame, AssetVolumeData } from '@/utils/statsUtils';
 import { AssetMetricsTable } from './components/AssetMetricsTable';
 import { StatsOverviewCards } from './components/StatsOverviewCards';
 
-// API endpoints mapping for different networks
-const API_ENDPOINTS = {
-  [SupportedNetworks.Base]:
-    'https://api.studio.thegraph.com/query/94369/monarch-metrics/version/latest',
-  [SupportedNetworks.Mainnet]:
-    'https://api.studio.thegraph.com/query/94369/monarch-metrics-mainnet/version/latest',
+const getAPIEndpoint = (network: SupportedNetworks) => {
+  switch (network) {
+    case SupportedNetworks.Base:
+      return 'https://api.studio.thegraph.com/query/94369/monarch-metrics/version/latest';
+    case SupportedNetworks.Mainnet:
+      return 'https://api.studio.thegraph.com/query/94369/monarch-metrics-mainnet/version/latest';
+    default:
+      return undefined;
+  }
 };
 
 export default function StatsPage() {
@@ -55,10 +58,13 @@ export default function StatsPage() {
         const startTime = performance.now();
 
         // Get API endpoint for the selected network
-        const apiEndpoint = API_ENDPOINTS[selectedNetwork];
+        const apiEndpoint = getAPIEndpoint(selectedNetwork);
+        if (!apiEndpoint) {
+          throw new Error(`Unsupported network: ${selectedNetwork}`);
+        }
         console.log(`Using API endpoint: ${apiEndpoint}`);
 
-        const allStats = await fetchAllStatistics(timeframe, selectedNetwork, apiEndpoint);
+        const allStats = await fetchAllStatistics(selectedNetwork, apiEndpoint, timeframe);
 
         const endTime = performance.now();
         console.log(`Statistics fetched in ${endTime - startTime}ms:`, allStats);

app/api/balances/route.ts

@@ -4,6 +4,7 @@ const ALCHEMY_API_KEY = process.env.ALCHEMY_API_KEY;
 const ALCHEMY_URLS = {
   '1': `https://eth-mainnet.g.alchemy.com/v2/${ALCHEMY_API_KEY}`,
   '8453': `https://base-mainnet.g.alchemy.com/v2/${ALCHEMY_API_KEY}`,
+  '137': `https://polygon-mainnet.g.alchemy.com/v2/${ALCHEMY_API_KEY}`,
 };
 
 type TokenBalance = {

app/api/block/route.ts

@@ -2,7 +2,7 @@ import { NextRequest, NextResponse } from 'next/server';
 import { PublicClient } from 'viem';
 import { SmartBlockFinder } from '@/utils/blockFinder';
 import { SupportedNetworks } from '@/utils/networks';
-import { mainnetClient, baseClient } from '@/utils/rpc';
+import { getClient } from '@/utils/rpc';
 
 const ETHERSCAN_API_KEY = process.env.ETHERSCAN_API_KEY;
 
@@ -42,7 +42,7 @@ export async function GET(request: NextRequest) {
     const numericTimestamp = parseInt(timestamp);
 
     // Fallback to SmartBlockFinder
-    const client = numericChainId === SupportedNetworks.Mainnet ? mainnetClient : baseClient;
+    const client = getClient(numericChainId as SupportedNetworks);
 
     // Try Etherscan API first
     const etherscanBlock = await getBlockFromEtherscan(numericTimestamp, numericChainId);

app/api/positions/historical/route.ts

@@ -1,9 +1,9 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { Address } from 'viem';
 import morphoABI from '@/abis/morpho';
-import { MORPHO } from '@/utils/morpho';
+import { getMorphoAddress } from '@/utils/morpho';
 import { SupportedNetworks } from '@/utils/networks';
-import { baseClient, mainnetClient } from '@/utils/rpc';
+import { getClient } from '@/utils/rpc';
 
 // Types
 type Position = {
@@ -60,13 +60,13 @@ async function getPositionAtBlock(
     console.log(`Get user position ${marketId.slice(0, 6)} at current block`);
   }
 
-  const client = chainId === SupportedNetworks.Mainnet ? mainnetClient : baseClient;
+  const client = getClient(chainId as SupportedNetworks);
   if (!client) throw new Error(`Unsupported chain ID: ${chainId}`);
 
   try {
     // First get the position data
     const positionArray = (await client.readContract({
-      address: MORPHO,
+      address: getMorphoAddress(chainId as SupportedNetworks),
       abi: morphoABI,
       functionName: 'position',
       args: [marketId as `0x${string}`, userAddress as Address],
@@ -94,7 +94,7 @@ async function getPositionAtBlock(
 
     // Only fetch market data if position has shares
     const marketArray = (await client.readContract({
-      address: MORPHO,
+      address: getMorphoAddress(chainId as SupportedNetworks),
       abi: morphoABI,
       functionName: 'market',
       args: [marketId as `0x${string}`],

app/history/components/HistoryContent.tsx

@@ -8,7 +8,7 @@ import { HistoryTable } from './HistoryTable';
 export default function HistoryContent({ account }: { account: string }) {
   const { data: positions } = useUserPositions(account, true);
 
-  const { rebalancerInfo } = useUserRebalancerInfo(account);
+  const { rebalancerInfos } = useUserRebalancerInfo(account);
 
   return (
     <div className="flex flex-col justify-between font-zen">
@@ -17,7 +17,7 @@ export default function HistoryContent({ account }: { account: string }) {
         <h1 className="py-4 font-zen text-2xl">Transaction History</h1>
 
         <div className="mt-4">
-          <HistoryTable account={account} positions={positions} rebalancerInfo={rebalancerInfo} />
+          <HistoryTable account={account} positions={positions} rebalancerInfos={rebalancerInfos} />
         </div>
       </div>
     </div>

app/history/components/HistoryTable.tsx

@@ -27,7 +27,7 @@ import {
 type HistoryTableProps = {
   account: string | undefined;
   positions: MarketPosition[];
-  rebalancerInfo?: UserRebalancerInfo;
+  rebalancerInfos: UserRebalancerInfo[];
 };
 
 type AssetKey = {
@@ -37,7 +37,7 @@ type AssetKey = {
   decimals: number;
 };
 
-export function HistoryTable({ account, positions, rebalancerInfo }: HistoryTableProps) {
+export function HistoryTable({ account, positions, rebalancerInfos }: HistoryTableProps) {
   const [selectedAsset, setSelectedAsset] = useState<AssetKey | null>(null);
   const [isOpen, setIsOpen] = useState(false);
   const [query, setQuery] = useState('');
@@ -307,7 +307,12 @@ export function HistoryTable({ account, positions, rebalancerInfo }: HistoryTabl
               const sign = tx.type === UserTxTypes.MarketSupply ? '+' : '-';
               const lltv = Number(formatUnits(BigInt(market.lltv), 18)) * 100;
 
-              const isAgent = rebalancerInfo?.transactions.some(
+              // Find the rebalancer info for the specific network of the transaction
+              const networkRebalancerInfo = rebalancerInfos.find(
+                (info) => info.network === market.morphoBlue.chain.id,
+              );
+              // Check if the transaction hash exists in the transactions of the found rebalancer info
+              const isAgent = networkRebalancerInfo?.transactions.some(
                 (agentTx) => agentTx.transactionHash === tx.hash,
               );
 

app/positions/components/PositionsContent.tsx

@@ -19,7 +19,7 @@ import LoadingScreen from '@/components/Status/LoadingScreen';
 import { SupplyModalV2 } from '@/components/SupplyModalV2';
 import useUserPositionsSummaryData from '@/hooks/useUserPositionsSummaryData';
 import { useUserRebalancerInfo } from '@/hooks/useUserRebalancerInfo';
-import { SupportedNetworks } from '@/utils/networks';
+import { isAgentAvailable } from '@/utils/networks';
 import { MarketPosition } from '@/utils/types';
 import { SetupAgentModal } from './agent/SetupAgentModal';
 import { OnboardingModal } from './onboarding/Modal';
@@ -34,7 +34,7 @@ export default function Positions() {
 
   const { account } = useParams<{ account: string }>();
   const { address } = useAccount();
-  const { rebalancerInfo, refetch: refetchRebalancerInfo } = useUserRebalancerInfo(account);
+  const { rebalancerInfos, refetch: refetchRebalancerInfo } = useUserRebalancerInfo(account);
 
   const isOwner = useMemo(() => {
     if (!account) return false;
@@ -51,9 +51,9 @@ export default function Positions() {
 
   const hasSuppliedMarkets = marketPositions && marketPositions.length > 0;
 
-  const hasActivePositionOnBase = marketPositions?.some((position) => {
+  const hasActivePositionForAgent = marketPositions?.some((position) => {
     return (
-      position.market.morphoBlue.chain.id === SupportedNetworks.Base &&
+      isAgentAvailable(position.market.morphoBlue.chain.id) &&
       BigInt(position.state.supplyShares) > 0
     );
   });
@@ -84,7 +84,7 @@ export default function Positions() {
                 Report
               </Button>
             </Link>
-            {isOwner && hasActivePositionOnBase && (
+            {isOwner && hasActivePositionForAgent && (
               <Button size="md" className="font-zen" onClick={() => setShowSetupAgentModal(true)}>
                 <RiRobot2Line size={14} className="mr-2" />
                 Monarch Agent <Badge variant="success">New</Badge>
@@ -146,7 +146,7 @@ export default function Positions() {
             setShowSetupAgentModal(false);
           }}
           account={account as Address}
-          userRebalancerInfo={rebalancerInfo}
+          userRebalancerInfos={rebalancerInfos}
         />
 
         {isPositionsLoading ? (
@@ -179,7 +179,7 @@ export default function Positions() {
               refetch={() => void refetch()}
               isRefetching={isRefetching}
               isLoadingEarnings={isEarningsLoading}
-              rebalancerInfo={rebalancerInfo}
+              rebalancerInfos={rebalancerInfos}
             />
           </div>
         )}

app/positions/components/PositionsSummaryTable.tsx

@@ -1,7 +1,16 @@
 import React, { useMemo, useState, useEffect } from 'react';
-import { Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Tooltip } from '@nextui-org/react';
+import {
+  Dropdown,
+  DropdownTrigger,
+  DropdownMenu,
+  DropdownItem,
+  Tooltip,
+  Switch,
+  Button as NextUIButton,
+} from '@nextui-org/react';
 import { ChevronDownIcon, ChevronUpIcon } from '@radix-ui/react-icons';
 import { ReloadIcon } from '@radix-ui/react-icons';
+import { GearIcon } from '@radix-ui/react-icons';
 import { motion, AnimatePresence } from 'framer-motion';
 import Image from 'next/image';
 import { BsQuestionCircle } from 'react-icons/bs';
@@ -12,6 +21,7 @@ import { useAccount } from 'wagmi';
 import { Button } from '@/components/common/Button';
 import { TokenIcon } from '@/components/TokenIcon';
 import { TooltipContent } from '@/components/TooltipContent';
+import { useLocalStorage } from '@/hooks/useLocalStorage';
 import { useStyledToast } from '@/hooks/useStyledToast';
 import { formatReadable, formatBalance } from '@/utils/balance';
 import { getNetworkImg } from '@/utils/networks';
@@ -21,6 +31,7 @@ import {
   groupPositionsByLoanAsset,
   processCollaterals,
 } from '@/utils/positions';
+import { PositionsShowEmptyKey, PositionsShowCollateralExposureKey } from '@/utils/storageKeys';
 import {
   MarketPosition,
   GroupedPosition,
@@ -44,7 +55,7 @@ type PositionsSummaryTableProps = {
   refetch: (onSuccess?: () => void) => void;
   isRefetching: boolean;
   isLoadingEarnings?: boolean;
-  rebalancerInfo: UserRebalancerInfo | undefined;
+  rebalancerInfos: UserRebalancerInfo[];
 };
 
 export function PositionsSummaryTable({
@@ -56,7 +67,7 @@ export function PositionsSummaryTable({
   isRefetching,
   isLoadingEarnings,
   account,
-  rebalancerInfo,
+  rebalancerInfos,
 }: PositionsSummaryTableProps) {
   const [expandedRows, setExpandedRows] = useState<Set<string>>(new Set());
   const [showRebalanceModal, setShowRebalanceModal] = useState(false);
@@ -65,6 +76,14 @@ export function PositionsSummaryTable({
   );
 
   const [earningsPeriod, setEarningsPeriod] = useState<EarningsPeriod>(EarningsPeriod.Day);
+  const [showEmptyPositions, setShowEmptyPositions] = useLocalStorage<boolean>(
+    PositionsShowEmptyKey,
+    false,
+  );
+  const [showCollateralExposure, setShowCollateralExposure] = useLocalStorage<boolean>(
+    PositionsShowCollateralExposureKey,
+    true,
+  );
   const { address } = useAccount();
 
   const toast = useStyledToast();
@@ -82,8 +101,8 @@ export function PositionsSummaryTable({
   };
 
   const groupedPositions = useMemo(
-    () => groupPositionsByLoanAsset(marketPositions, rebalancerInfo),
-    [marketPositions, rebalancerInfo],
+    () => groupPositionsByLoanAsset(marketPositions, rebalancerInfos),
+    [marketPositions, rebalancerInfos],
   );
 
   const processedPositions = useMemo(
@@ -154,6 +173,53 @@ export function PositionsSummaryTable({
           <ReloadIcon className={`mr-2 h-4 w-4 ${isRefetching ? 'animate-spin' : ''}`} />
           Refresh
         </Button>
+        <Dropdown>
+          <DropdownTrigger>
+            <NextUIButton
+              isIconOnly
+              variant="light"
+              size="sm"
+              className="font-zen text-secondary opacity-80 transition-all duration-200 ease-in-out hover:opacity-100"
+            >
+              <GearIcon className="h-4 w-4" />
+            </NextUIButton>
+          </DropdownTrigger>
+          <DropdownMenu
+            aria-label="Position table settings"
+            className="bg-surface rounded p-2"
+            closeOnSelect={false}
+          >
+            <DropdownItem key="show-empty" className="flex h-auto gap-2 p-0">
+              <div className="flex w-full items-center justify-between px-2 py-1.5">
+                <span className="mr-2 text-xs">Show Empty Positions</span>
+                <Switch
+                  size="sm"
+                  isSelected={showEmptyPositions}
+                  onValueChange={setShowEmptyPositions}
+                  aria-label="Show empty positions"
+                  classNames={{
+                    wrapper: 'mx-0',
+                    thumbIcon: 'p-0 mr-0',
+                  }}
+                />
+              </div>
+            </DropdownItem>
+            <DropdownItem key="show-collateral-exposure" className="flex h-auto gap-2 p-0">
+              <div className="flex w-full items-center justify-between px-2 py-1.5">
+                <span className="mr-2 text-xs">Show Collateral Exposure</span>
+                <Switch
+                  size="sm"
+                  isSelected={showCollateralExposure}
+                  onValueChange={setShowCollateralExposure}
+                  classNames={{
+                    wrapper: 'mx-0',
+                    thumbIcon: 'p-0 mr-0',
+                  }}
+                />
+              </div>
+            </DropdownItem>
+          </DropdownMenu>
+        </Dropdown>
       </div>
       <div className="bg-surface overflow-hidden rounded">
         <table className="responsive w-full min-w-[640px] font-zen">
@@ -191,7 +257,7 @@ export function PositionsSummaryTable({
             {processedPositions.map((groupedPosition) => {
               const rowKey = `${groupedPosition.loanAssetAddress}-${groupedPosition.chainId}`;
               const isExpanded = expandedRows.has(rowKey);
-              const avgApy = groupedPosition.totalWeightedApy / groupedPosition.totalSupply;
+              const avgApy = groupedPosition.totalWeightedApy;
 
               const earnings = getGroupedEarnings(groupedPosition, earningsPeriod);
 
@@ -335,6 +401,8 @@ export function PositionsSummaryTable({
                               setShowWithdrawModal={setShowWithdrawModal}
                               setShowSupplyModal={setShowSupplyModal}
                               setSelectedPosition={setSelectedPosition}
+                              showEmptyPositions={showEmptyPositions}
+                              showCollateralExposure={showCollateralExposure}
                             />
                           </motion.div>
                         </td>