feat: add 7d and 30d APY columns to markets list

src/data-sources/subgraph/market.ts

@@ -188,6 +188,11 @@ const transformSubgraphMarketToMarket = (
       timestamp,
       apyAtTarget: 0,
       rateAtTarget: '0',
+      // Subgraph doesn't support weekly/monthly APY - return null
+      weeklySupplyApy: null,
+      weeklyBorrowApy: null,
+      monthlySupplyApy: null,
+      monthlyBorrowApy: null,
     },
     oracleAddress,
     morphoBlue: {

src/features/markets/components/column-visibility.ts

@@ -9,6 +9,10 @@ export type ColumnVisibility = {
   rateAtTarget: boolean;
   trustedBy: boolean;
   utilizationRate: boolean;
+  weeklySupplyAPY: boolean;
+  weeklyBorrowAPY: boolean;
+  monthlySupplyAPY: boolean;
+  monthlyBorrowAPY: boolean;
 };
 
 export const DEFAULT_COLUMN_VISIBILITY: ColumnVisibility = {
@@ -20,6 +24,10 @@ export const DEFAULT_COLUMN_VISIBILITY: ColumnVisibility = {
   rateAtTarget: false,
   trustedBy: false,
   utilizationRate: false,
+  weeklySupplyAPY: false,
+  weeklyBorrowAPY: false,
+  monthlySupplyAPY: false,
+  monthlyBorrowAPY: false,
 };
 
 export const COLUMN_LABELS: Record<keyof ColumnVisibility, string> = {
@@ -31,6 +39,10 @@ export const COLUMN_LABELS: Record<keyof ColumnVisibility, string> = {
   rateAtTarget: 'Target Rate',
   trustedBy: 'Trusted By',
   utilizationRate: 'Utilization',
+  weeklySupplyAPY: '7d Supply APY',
+  weeklyBorrowAPY: '7d Borrow APY',
+  monthlySupplyAPY: '30d Supply APY',
+  monthlyBorrowAPY: '30d Borrow APY',
 };
 
 export const COLUMN_DESCRIPTIONS: Record<keyof ColumnVisibility, string> = {
@@ -42,4 +54,8 @@ export const COLUMN_DESCRIPTIONS: Record<keyof ColumnVisibility, string> = {
   rateAtTarget: 'Interest rate at target utilization',
   trustedBy: 'Highlights your trusted vaults that currently supply this market',
   utilizationRate: 'Percentage of supplied assets currently borrowed',
+  weeklySupplyAPY: '7-day average supply APY',
+  weeklyBorrowAPY: '7-day average borrow APY',
+  monthlySupplyAPY: '30-day average supply APY',
+  monthlyBorrowAPY: '30-day average borrow APY',
 };

src/features/markets/components/constants.ts

@@ -12,6 +12,10 @@ export enum SortColumn {
   TrustedBy = 11,
   UtilizationRate = 12,
   Trend = 13,
+  WeeklySupplyAPY = 14,
+  WeeklyBorrowAPY = 15,
+  MonthlySupplyAPY = 16,
+  MonthlyBorrowAPY = 17,
 }
 
 // Gas cost to simplify tx flow: do not need to estimate gas for transactions

src/features/markets/components/table/market-table-body.tsx

@@ -44,7 +44,11 @@ export function MarketTableBody({ currentEntries, expandedRowId, setExpandedRowI
     (columnVisibility.borrowAPY ? 1 : 0) +
     (columnVisibility.rateAtTarget ? 1 : 0) +
     (columnVisibility.trustedBy ? 1 : 0) +
-    (columnVisibility.utilizationRate ? 1 : 0);
+    (columnVisibility.utilizationRate ? 1 : 0) +
+    (columnVisibility.weeklySupplyAPY ? 1 : 0) +
+    (columnVisibility.weeklyBorrowAPY ? 1 : 0) +
+    (columnVisibility.monthlySupplyAPY ? 1 : 0) +
+    (columnVisibility.monthlyBorrowAPY ? 1 : 0);
 
   const getTrustedVaultsForMarket = (market: Market): TrustedVault[] => {
     if (!columnVisibility.trustedBy || !market.supplyingVaults?.length) {
@@ -229,6 +233,50 @@ export function MarketTableBody({ currentEntries, expandedRowId, setExpandedRowI
                   <p className="text-sm">{`${(item.state.utilization * 100).toFixed(2)}%`}</p>
                 </TableCell>
               )}
+              {columnVisibility.weeklySupplyAPY && (
+                <TableCell
+                  data-label="7d Supply"
+                  className="z-50 text-center"
+                  style={{ minWidth: '85px', paddingLeft: 3, paddingRight: 3 }}
+                >
+                  <p className="text-sm">
+                    {item.state.weeklySupplyApy != null ? <RateFormatted value={item.state.weeklySupplyApy} /> : '—'}
+                  </p>
+                </TableCell>
+              )}
+              {columnVisibility.weeklyBorrowAPY && (
+                <TableCell
+                  data-label="7d Borrow"
+                  className="z-50 text-center"
+                  style={{ minWidth: '85px', paddingLeft: 3, paddingRight: 3 }}
+                >
+                  <p className="text-sm">
+                    {item.state.weeklyBorrowApy != null ? <RateFormatted value={item.state.weeklyBorrowApy} /> : '—'}
+                  </p>
+                </TableCell>
+              )}
+              {columnVisibility.monthlySupplyAPY && (
+                <TableCell
+                  data-label="30d Supply"
+                  className="z-50 text-center"
+                  style={{ minWidth: '85px', paddingLeft: 3, paddingRight: 3 }}
+                >
+                  <p className="text-sm">
+                    {item.state.monthlySupplyApy != null ? <RateFormatted value={item.state.monthlySupplyApy} /> : '—'}
+                  </p>
+                </TableCell>
+              )}
+              {columnVisibility.monthlyBorrowAPY && (
+                <TableCell
+                  data-label="30d Borrow"
+                  className="z-50 text-center"
+                  style={{ minWidth: '85px', paddingLeft: 3, paddingRight: 3 }}
+                >
+                  <p className="text-sm">
+                    {item.state.monthlyBorrowApy != null ? <RateFormatted value={item.state.monthlyBorrowApy} /> : '—'}
+                  </p>
+                </TableCell>
+              )}
               <TableCell style={{ minWidth: '90px' }}>
                 <MarketRiskIndicators market={item} />
               </TableCell>

src/features/markets/components/table/markets-table.tsx

@@ -239,6 +239,42 @@ function MarketsTable({ currentPage, setCurrentPage, className, tableClassName,
                     targetColumn={SortColumn.UtilizationRate}
                   />
                 )}
+                {columnVisibility.weeklySupplyAPY && (
+                  <HTSortable
+                    label="7d Supply"
+                    sortColumn={sortColumn}
+                    titleOnclick={titleOnclick}
+                    sortDirection={sortDirection}
+                    targetColumn={SortColumn.WeeklySupplyAPY}
+                  />
+                )}
+                {columnVisibility.weeklyBorrowAPY && (
+                  <HTSortable
+                    label="7d Borrow"
+                    sortColumn={sortColumn}
+                    titleOnclick={titleOnclick}
+                    sortDirection={sortDirection}
+                    targetColumn={SortColumn.WeeklyBorrowAPY}
+                  />
+                )}
+                {columnVisibility.monthlySupplyAPY && (
+                  <HTSortable
+                    label="30d Supply"
+                    sortColumn={sortColumn}
+                    titleOnclick={titleOnclick}
+                    sortDirection={sortDirection}
+                    targetColumn={SortColumn.MonthlySupplyAPY}
+                  />
+                )}
+                {columnVisibility.monthlyBorrowAPY && (
+                  <HTSortable
+                    label="30d Borrow"
+                    sortColumn={sortColumn}
+                    titleOnclick={titleOnclick}
+                    sortDirection={sortDirection}
+                    targetColumn={SortColumn.MonthlyBorrowAPY}
+                  />
+                )}
                 <TableHead
                   className="font-normal px-2 py-2 whitespace-nowrap"
                   style={{ padding: '0.35rem 0.8rem' }}

src/graphql/morpho-api-queries.ts

@@ -108,6 +108,10 @@ state {
   timestamp
   apyAtTarget
   rateAtTarget
+  weeklySupplyApy
+  weeklyBorrowApy
+  monthlySupplyApy
+  monthlyBorrowApy
 }
 warnings {
   type
@@ -216,6 +220,10 @@ export const marketsQuery = `
       timestamp
       apyAtTarget
       rateAtTarget
+      weeklySupplyApy
+      weeklyBorrowApy
+      monthlySupplyApy
+      monthlyBorrowApy
     }
     warnings {
       type

src/hooks/useFilteredMarkets.ts

@@ -112,6 +112,10 @@ export const useFilteredMarkets = (): Market[] => {
       [SortColumn.TrustedBy]: '',
       [SortColumn.UtilizationRate]: 'state.utilization',
       [SortColumn.Trend]: '', // Trend is a filter mode, not a sort
+      [SortColumn.WeeklySupplyAPY]: 'state.weeklySupplyApy',
+      [SortColumn.WeeklyBorrowAPY]: 'state.weeklyBorrowApy',
+      [SortColumn.MonthlySupplyAPY]: 'state.monthlySupplyApy',
+      [SortColumn.MonthlyBorrowAPY]: 'state.monthlyBorrowApy',
     };
 
     const propertyPath = sortPropertyMap[preferences.sortColumn];

src/utils/types.ts

@@ -321,6 +321,12 @@ export type Market = {
 
     apyAtTarget: number;
     rateAtTarget: string;
+
+    // Weekly and monthly APY averages (may be null for new markets or backup subgraph)
+    weeklySupplyApy: number | null;
+    weeklyBorrowApy: number | null;
+    monthlySupplyApy: number | null;
+    monthlyBorrowApy: number | null;
   };
   realizedBadDebt: {
     underlying: string;