From 794ae2079698cc4b4bf2b49da8c35fd1d207d5e5 Mon Sep 17 00:00:00 2001
From: secretmemelocker <very.traceable@gmail.com>
Date: Sat, 17 Jan 2026 11:32:01 -0600
Subject: [PATCH 1/5] Move supplier and borrower table to top of positions tab

---
 src/features/market-detail/market-view.tsx | 37 +++++++++++-----------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/features/market-detail/market-view.tsx b/src/features/market-detail/market-view.tsx
index a0a4123d..f917838b 100644
--- a/src/features/market-detail/market-view.tsx
+++ b/src/features/market-detail/market-view.tsx
@@ -358,6 +358,25 @@ function MarketContent() {
           </TabsContent>
 
           <TabsContent value="positions">
+            {/* Tables */}
+            <div className="mt-6">
+              <SuppliersTable
+                chainId={network}
+                market={market}
+                minShares={scaledMinSupplierShares}
+                onOpenFiltersModal={() => setShowSupplierFiltersModal(true)}
+              />
+            </div>
+            <div className="mt-6">
+              <BorrowersTable
+                chainId={network}
+                market={market}
+                minShares={scaledMinBorrowerShares}
+                oraclePrice={oraclePrice}
+                onOpenFiltersModal={() => setShowBorrowerFiltersModal(true)}
+              />
+            </div>
+            
             {/* Suppliers row: Pie + Concentration */}
             <div className="grid gap-6 lg:grid-cols-2">
               <SuppliersPieChart
@@ -398,24 +417,6 @@ function MarketContent() {
               />
             </div>
 
-            {/* Tables */}
-            <div className="mt-6">
-              <SuppliersTable
-                chainId={network}
-                market={market}
-                minShares={scaledMinSupplierShares}
-                onOpenFiltersModal={() => setShowSupplierFiltersModal(true)}
-              />
-            </div>
-            <div className="mt-6">
-              <BorrowersTable
-                chainId={network}
-                market={market}
-                minShares={scaledMinBorrowerShares}
-                oraclePrice={oraclePrice}
-                onOpenFiltersModal={() => setShowBorrowerFiltersModal(true)}
-              />
-            </div>
           </TabsContent>
         </Tabs>
       </div>

From 26ac70eaa810c73aa80d3e02e1a88311422368e1 Mon Sep 17 00:00:00 2001
From: secretmemelocker <very.traceable@gmail.com>
Date: Sat, 17 Jan 2026 11:35:35 -0600
Subject: [PATCH 2/5] Add missing required children property

---
 .../markets/components/table/markets-table-actions.tsx        | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/features/markets/components/table/markets-table-actions.tsx b/src/features/markets/components/table/markets-table-actions.tsx
index 93cb9b4c..c8bd38e4 100644
--- a/src/features/markets/components/table/markets-table-actions.tsx
+++ b/src/features/markets/components/table/markets-table-actions.tsx
@@ -34,6 +34,7 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
               detail={`${moment(dataUpdatedAt).format('h:mm:ss A')} (${moment(dataUpdatedAt).fromNow()})`}
             />
           }
+          children={undefined}
         >
           <span className="text-xs text-secondary whitespace-nowrap cursor-default">{moment(dataUpdatedAt).format('h:mm:ss A')}</span>
         </Tooltip>
@@ -48,6 +49,7 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
             detail="Fetch the latest market data"
           />
         }
+        children={undefined}
       >
         <Button
           variant="ghost"
@@ -73,6 +75,7 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
               }
             />
           }
+          children={undefined}
         >
           <Button
             aria-label="Toggle table view mode"
@@ -97,6 +100,7 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
             detail="Adjust thresholds and columns"
           />
         }
+        children={undefined}
       >
         <Button
           aria-label="Market Preferences"

From cb4b4d3162bc11a43df0e9b74a2f6460cb95cb39 Mon Sep 17 00:00:00 2001
From: secretmemelocker <very.traceable@gmail.com>
Date: Sat, 17 Jan 2026 17:49:34 -0600
Subject: [PATCH 3/5] Add accrue interest on market page

---
 .../components/market-header.tsx              | 10 ++-
 src/features/market-detail/market-view.tsx    | 61 ++++++++++++++++++-
 .../supplied-morpho-blue-grouped-table.tsx    | 13 ++++
 3 files changed, 80 insertions(+), 4 deletions(-)

diff --git a/src/features/market-detail/components/market-header.tsx b/src/features/market-detail/components/market-header.tsx
index 215d6335..5b46c38f 100644
--- a/src/features/market-detail/components/market-header.tsx
+++ b/src/features/market-detail/components/market-header.tsx
@@ -8,7 +8,7 @@ import { ChevronDownIcon } from '@radix-ui/react-icons';
 import { GrStatusGood } from 'react-icons/gr';
 import { IoWarningOutline, IoEllipsisVertical } from 'react-icons/io5';
 import { MdError } from 'react-icons/md';
-import { BsArrowUpCircle, BsArrowDownLeftCircle } from 'react-icons/bs';
+import { BsArrowUpCircle, BsArrowDownLeftCircle, BsFillLightningFill } from 'react-icons/bs';
 import { FiExternalLink } from 'react-icons/fi';
 import { LuCopy } from 'react-icons/lu';
 import { Button } from '@/components/ui/button';
@@ -121,6 +121,7 @@ type MarketHeaderProps = {
   allWarnings: WarningWithDetail[];
   onSupplyClick: () => void;
   onBorrowClick: () => void;
+  accrueInterest: () => void;
 };
 
 export function MarketHeader({
@@ -132,6 +133,7 @@ export function MarketHeader({
   allWarnings,
   onSupplyClick,
   onBorrowClick,
+  accrueInterest
 }: MarketHeaderProps) {
   const [isExpanded, setIsExpanded] = useState(false);
   const { short: rateLabel } = useRateLabel();
@@ -351,6 +353,12 @@ export function MarketHeader({
                   >
                     Borrow
                   </DropdownMenuItem>
+                  <DropdownMenuItem
+                    onClick={accrueInterest}
+                    startContent={<BsFillLightningFill className="h-4 w-4" />}
+                  >
+                    Accrue Interest
+                  </DropdownMenuItem>
                   <DropdownMenuItem
                     onClick={() => window.open(getMarketURL(marketId, network), '_blank')}
                     startContent={<FiExternalLink className="h-4 w-4" />}
diff --git a/src/features/market-detail/market-view.tsx b/src/features/market-detail/market-view.tsx
index f917838b..ddf5dcfd 100644
--- a/src/features/market-detail/market-view.tsx
+++ b/src/features/market-detail/market-view.tsx
@@ -4,13 +4,16 @@
 
 import { useState, useCallback, useMemo } from 'react';
 import { useParams } from 'next/navigation';
-import { parseUnits, formatUnits } from 'viem';
-import { useConnection } from 'wagmi';
+import { parseUnits, formatUnits, encodeFunctionData, type Address } from 'viem';
+import { useConnection, useSwitchChain, useWriteContract } from 'wagmi';
+import morphoAbi from '@/abis/morpho';
 import { BorrowModal } from '@/modals/borrow/borrow-modal';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { Spinner } from '@/components/ui/spinner';
 import Header from '@/components/layout/header/Header';
 import { useModal } from '@/hooks/useModal';
+import { useStyledToast } from '@/hooks/useStyledToast';
+import { useTransactionWithToast } from '@/hooks/useTransactionWithToast';
 import { useMarketData } from '@/hooks/useMarketData';
 import { useOraclePrice } from '@/hooks/useOraclePrice';
 import { useTransactionFilters } from '@/stores/useTransactionFilters';
@@ -76,6 +79,22 @@ function MarketContent() {
 
   const { address } = useConnection();
 
+  const toast = useStyledToast();
+
+  // Transaction hook for accruing interest
+  const { sendTransaction: sendAccrueInterest, isConfirming: isAccruingInterest } = useTransactionWithToast({
+    toastId: 'accrue-interest',
+    pendingText: 'Accruing Interest',
+    successText: 'Interest Accrued',
+    errorText: 'Failed to accrue interest',
+    chainId: market?.morphoBlue.chain.id,
+    pendingDescription: 'Updating market interest rates...',
+    successDescription: 'Market interest rates have been updated',
+    onSuccess: () => {
+      void refetchMarket();
+    },
+  });
+
   const { position: userPosition, refetch: refetchUserPosition } = useUserPosition(address, network, marketId as string);
 
   // Get all warnings for this market (hook handles undefined market)
@@ -96,6 +115,9 @@ function MarketContent() {
     totalCount: suppliersTotalCount,
   } = useAllMarketSuppliers(market?.uniqueKey, network);
 
+  const { mutateAsync: writeContractAsync, error: writeError, isPending: isWritePending } = useWriteContract();
+  const { mutateAsync: switchChainAsync } = useSwitchChain();
+
   // 6. All memoized values and callbacks
 
   // Helper to scale user input to token amount
@@ -247,6 +269,38 @@ function MarketContent() {
     setShowBorrowModal(true);
   };
 
+  const handleAccrueInterest = async () => {
+    if (!address) {
+      toast.info('Wallet not connected', 'Please connect your wallet to accrue interest.');
+      return;
+    }
+    
+    await switchChainAsync({ chainId: market.morphoBlue.chain.id });
+    const morphoAddress = market.morphoBlue.address as Address;
+
+    toast.info('Accruing interest...');
+
+    const txData = writeContractAsync({
+      address: morphoAddress,
+      abi: morphoAbi,
+      functionName: 'accrueInterest',
+      chainId: market.morphoBlue.chain.id,
+      args: [
+        {
+          loanToken: market.loanAsset.address as Address,
+          collateralToken: market.collateralAsset.address as Address,
+          oracle: market.oracleAddress as Address,
+          irm: market.irmAddress as Address,
+          lltv: BigInt(market.lltv),
+        },
+      ],
+    }).then((txData) => {
+      if (txData) {
+        toast.success('Interest accrued successfully!');
+      }
+    });
+  };
+
   return (
     <>
       <Header />
@@ -261,6 +315,7 @@ function MarketContent() {
           allWarnings={allWarnings}
           onSupplyClick={handleSupplyClick}
           onBorrowClick={handleBorrowClick}
+          accrueInterest={handleAccrueInterest}
         />
 
         {showBorrowModal && (
@@ -376,7 +431,7 @@ function MarketContent() {
                 onOpenFiltersModal={() => setShowBorrowerFiltersModal(true)}
               />
             </div>
-            
+
             {/* Suppliers row: Pie + Concentration */}
             <div className="grid gap-6 lg:grid-cols-2">
               <SuppliersPieChart
diff --git a/src/features/positions/components/supplied-morpho-blue-grouped-table.tsx b/src/features/positions/components/supplied-morpho-blue-grouped-table.tsx
index 8aeff50d..9f402140 100644
--- a/src/features/positions/components/supplied-morpho-blue-grouped-table.tsx
+++ b/src/features/positions/components/supplied-morpho-blue-grouped-table.tsx
@@ -228,6 +228,7 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                     className="cursor-pointer hover:bg-gray-50"
                     onClick={() => toggleRow(rowKey)}
                   >
+                    {/* Chain image */}
                     <TableCell className="w-10">
                       <div className="flex items-center justify-center">
                         <Image
@@ -238,6 +239,8 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                         />
                       </div>
                     </TableCell>
+
+                    {/* Loan asset details */}
                     <TableCell data-label="Size">
                       <div className="flex items-center justify-center gap-2">
                         <span className="font-medium">{formatReadable(groupedPosition.totalSupply)}</span>
@@ -251,11 +254,15 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                         />
                       </div>
                     </TableCell>
+
+                    {/* Current APR/APY  */}
                     <TableCell data-label={`${rateLabel} (now)`}>
                       <div className="flex items-center justify-center">
                         <span className="font-medium">{formatReadable((isAprDisplay ? convertApyToApr(avgApy) : avgApy) * 100)}%</span>
                       </div>
                     </TableCell>
+
+                    {/* Accrued interest */}
                     <TableCell data-label={`Interest Accrued (${period})`}>
                       <div className="flex items-center justify-center gap-2">
                         {isEarningsLoading ? (
@@ -293,6 +300,8 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                         )}
                       </div>
                     </TableCell>
+
+                    {/* Collateral exposure */}
                     <TableCell data-label="Collateral">
                       <CollateralIconsDisplay
                         collaterals={groupedPosition.collaterals}
@@ -301,6 +310,8 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                         iconSize={20}
                       />
                     </TableCell>
+
+                    {/* Risk indicators */}
                     <TableCell
                       data-label="Risk Tiers"
                       className="align-middle"
@@ -309,6 +320,8 @@ export function SuppliedMorphoBlueGroupedTable({ account }: SuppliedMorphoBlueGr
                         <AggregatedRiskIndicators groupedPosition={groupedPosition} />
                       </div>
                     </TableCell>
+
+                    {/* Actions button */}
                     <TableCell
                       data-label="Actions"
                       className="justify-center px-4 py-3"

From 9d711f61c2b79ab2261b2e7f86d933f1092c3b92 Mon Sep 17 00:00:00 2001
From: antoncoding <antonassocareer@gmail.com>
Date: Sun, 18 Jan 2026 11:54:02 +0800
Subject: [PATCH 4/5] chore: lint and useTransactionWithToast usage

---
 .../components/market-header.tsx              |  2 +-
 src/features/market-detail/market-view.tsx    | 78 ++++++++-----------
 .../table/markets-table-actions.tsx           |  4 -
 3 files changed, 35 insertions(+), 49 deletions(-)

diff --git a/src/features/market-detail/components/market-header.tsx b/src/features/market-detail/components/market-header.tsx
index 5b46c38f..12930578 100644
--- a/src/features/market-detail/components/market-header.tsx
+++ b/src/features/market-detail/components/market-header.tsx
@@ -133,7 +133,7 @@ export function MarketHeader({
   allWarnings,
   onSupplyClick,
   onBorrowClick,
-  accrueInterest
+  accrueInterest,
 }: MarketHeaderProps) {
   const [isExpanded, setIsExpanded] = useState(false);
   const { short: rateLabel } = useRateLabel();
diff --git a/src/features/market-detail/market-view.tsx b/src/features/market-detail/market-view.tsx
index ddf5dcfd..340939b5 100644
--- a/src/features/market-detail/market-view.tsx
+++ b/src/features/market-detail/market-view.tsx
@@ -4,8 +4,8 @@
 
 import { useState, useCallback, useMemo } from 'react';
 import { useParams } from 'next/navigation';
-import { parseUnits, formatUnits, encodeFunctionData, type Address } from 'viem';
-import { useConnection, useSwitchChain, useWriteContract } from 'wagmi';
+import { parseUnits, formatUnits, type Address, encodeFunctionData } from 'viem';
+import { useConnection, useSwitchChain } from 'wagmi';
 import morphoAbi from '@/abis/morpho';
 import { BorrowModal } from '@/modals/borrow/borrow-modal';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
@@ -13,12 +13,12 @@ import { Spinner } from '@/components/ui/spinner';
 import Header from '@/components/layout/header/Header';
 import { useModal } from '@/hooks/useModal';
 import { useStyledToast } from '@/hooks/useStyledToast';
-import { useTransactionWithToast } from '@/hooks/useTransactionWithToast';
 import { useMarketData } from '@/hooks/useMarketData';
 import { useOraclePrice } from '@/hooks/useOraclePrice';
 import { useTransactionFilters } from '@/stores/useTransactionFilters';
 import { useMarketDetailPreferences, type MarketDetailTab } from '@/stores/useMarketDetailPreferences';
 import useUserPosition from '@/hooks/useUserPosition';
+import { useTransactionWithToast } from '@/hooks/useTransactionWithToast';
 import type { SupportedNetworks } from '@/utils/networks';
 import { BorrowersTable } from '@/features/market-detail/components/borrowers-table';
 import { BorrowsTable } from '@/features/market-detail/components/borrows-table';
@@ -79,21 +79,7 @@ function MarketContent() {
 
   const { address } = useConnection();
 
-  const toast = useStyledToast();
-
-  // Transaction hook for accruing interest
-  const { sendTransaction: sendAccrueInterest, isConfirming: isAccruingInterest } = useTransactionWithToast({
-    toastId: 'accrue-interest',
-    pendingText: 'Accruing Interest',
-    successText: 'Interest Accrued',
-    errorText: 'Failed to accrue interest',
-    chainId: market?.morphoBlue.chain.id,
-    pendingDescription: 'Updating market interest rates...',
-    successDescription: 'Market interest rates have been updated',
-    onSuccess: () => {
-      void refetchMarket();
-    },
-  });
+  const _toast = useStyledToast();
 
   const { position: userPosition, refetch: refetchUserPosition } = useUserPosition(address, network, marketId as string);
 
@@ -115,9 +101,22 @@ function MarketContent() {
     totalCount: suppliersTotalCount,
   } = useAllMarketSuppliers(market?.uniqueKey, network);
 
-  const { mutateAsync: writeContractAsync, error: writeError, isPending: isWritePending } = useWriteContract();
   const { mutateAsync: switchChainAsync } = useSwitchChain();
 
+  // Transaction hook for accruing interest
+  const { sendTransaction } = useTransactionWithToast({
+    toastId: 'accrue-interest',
+    pendingText: 'Accruing Interest',
+    successText: 'Interest Accrued',
+    errorText: 'Failed to accrue interest',
+    chainId: market?.morphoBlue.chain.id,
+    pendingDescription: 'Updating market interest rates...',
+    successDescription: 'Market interest rates have been updated',
+    onSuccess: () => {
+      void refetchMarket();
+    },
+  });
+
   // 6. All memoized values and callbacks
 
   // Helper to scale user input to token amount
@@ -270,34 +269,26 @@ function MarketContent() {
   };
 
   const handleAccrueInterest = async () => {
-    if (!address) {
-      toast.info('Wallet not connected', 'Please connect your wallet to accrue interest.');
-      return;
-    }
-    
     await switchChainAsync({ chainId: market.morphoBlue.chain.id });
     const morphoAddress = market.morphoBlue.address as Address;
 
-    toast.info('Accruing interest...');
-
-    const txData = writeContractAsync({
-      address: morphoAddress,
-      abi: morphoAbi,
-      functionName: 'accrueInterest',
+    sendTransaction({
+      to: morphoAddress,
+      account: address,
+      data: encodeFunctionData({
+        abi: morphoAbi,
+        functionName: 'accrueInterest',
+        args: [
+          {
+            loanToken: market.loanAsset.address as Address,
+            collateralToken: market.collateralAsset.address as Address,
+            oracle: market.oracleAddress as Address,
+            irm: market.irmAddress as Address,
+            lltv: BigInt(market.lltv),
+          },
+        ],
+      }),
       chainId: market.morphoBlue.chain.id,
-      args: [
-        {
-          loanToken: market.loanAsset.address as Address,
-          collateralToken: market.collateralAsset.address as Address,
-          oracle: market.oracleAddress as Address,
-          irm: market.irmAddress as Address,
-          lltv: BigInt(market.lltv),
-        },
-      ],
-    }).then((txData) => {
-      if (txData) {
-        toast.success('Interest accrued successfully!');
-      }
     });
   };
 
@@ -471,7 +462,6 @@ function MarketContent() {
                 oraclePrice={oraclePrice}
               />
             </div>
-
           </TabsContent>
         </Tabs>
       </div>
diff --git a/src/features/markets/components/table/markets-table-actions.tsx b/src/features/markets/components/table/markets-table-actions.tsx
index c8bd38e4..93cb9b4c 100644
--- a/src/features/markets/components/table/markets-table-actions.tsx
+++ b/src/features/markets/components/table/markets-table-actions.tsx
@@ -34,7 +34,6 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
               detail={`${moment(dataUpdatedAt).format('h:mm:ss A')} (${moment(dataUpdatedAt).fromNow()})`}
             />
           }
-          children={undefined}
         >
           <span className="text-xs text-secondary whitespace-nowrap cursor-default">{moment(dataUpdatedAt).format('h:mm:ss A')}</span>
         </Tooltip>
@@ -49,7 +48,6 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
             detail="Fetch the latest market data"
           />
         }
-        children={undefined}
       >
         <Button
           variant="ghost"
@@ -75,7 +73,6 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
               }
             />
           }
-          children={undefined}
         >
           <Button
             aria-label="Toggle table view mode"
@@ -100,7 +97,6 @@ export function MarketsTableActions({ onRefresh, isRefetching, isMobile, dataUpd
             detail="Adjust thresholds and columns"
           />
         }
-        children={undefined}
       >
         <Button
           aria-label="Market Preferences"

From 577059a433403372322dbfc095dd03f6e36c92e2 Mon Sep 17 00:00:00 2001
From: antoncoding <antonassocareer@gmail.com>
Date: Sun, 18 Jan 2026 11:55:39 +0800
Subject: [PATCH 5/5] chore: cleanup

---
 src/features/market-detail/market-view.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/features/market-detail/market-view.tsx b/src/features/market-detail/market-view.tsx
index 340939b5..8e6964e1 100644
--- a/src/features/market-detail/market-view.tsx
+++ b/src/features/market-detail/market-view.tsx
@@ -12,7 +12,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { Spinner } from '@/components/ui/spinner';
 import Header from '@/components/layout/header/Header';
 import { useModal } from '@/hooks/useModal';
-import { useStyledToast } from '@/hooks/useStyledToast';
 import { useMarketData } from '@/hooks/useMarketData';
 import { useOraclePrice } from '@/hooks/useOraclePrice';
 import { useTransactionFilters } from '@/stores/useTransactionFilters';
@@ -79,8 +78,6 @@ function MarketContent() {
 
   const { address } = useConnection();
 
-  const _toast = useStyledToast();
-
   const { position: userPosition, refetch: refetchUserPosition } = useUserPosition(address, network, marketId as string);
 
   // Get all warnings for this market (hook handles undefined market)