diff --git a/.github/workflows/build_and_test.yml b/.github/workflows/build_and_test.yml
index 668ede14..618bdd8c 100644
--- a/.github/workflows/build_and_test.yml
+++ b/.github/workflows/build_and_test.yml
@@ -49,7 +49,7 @@ jobs:
           VITE_SENTRY_DSN_PROJECT_URI: ${{ secrets.SENTRY_DSN_PROJECT_URI }}
           VITE_SENTRY_DSN_PROJECT_ID: ${{ secrets.SENTRY_DSN_PROJECT_ID }}
           VITE_GITHUB_HASH: ${{ github.sha }}
-          VITE_IO_PROCESS_ID: ${{ secrets.IO_PROCESS_ID }}
+          VITE_ARIO_PROCESS_ID: ${{ vars.ARIO_PROCESS_ID }}
           # ao infra settings
           VITE_AO_CU_URL: ${{ vars.VITE_AO_CU_URL }}
       - name: Add CNAME Record
diff --git a/.github/workflows/production.yml b/.github/workflows/production.yml
index 21b505ba..63b3d65a 100644
--- a/.github/workflows/production.yml
+++ b/.github/workflows/production.yml
@@ -46,7 +46,7 @@ jobs:
           VITE_SENTRY_DSN_PROJECT_URI: ${{ secrets.SENTRY_DSN_PROJECT_URI }}
           VITE_SENTRY_DSN_PROJECT_ID: ${{ secrets.SENTRY_DSN_PROJECT_ID }}
           VITE_GITHUB_HASH: ${{ github.sha }}
-          VITE_IO_PROCESS_ID: ${{ secrets.IO_PROCESS_ID }}
+          VITE_ARIO_PROCESS_ID: ${{ secrets.ARIO_PROCESS_ID }}
           VITE_AO_CU_URL: ${{ vars.VITE_AO_CU_URL }}
 
       # Disribute to Firebase
@@ -84,7 +84,7 @@ jobs:
           VITE_SENTRY_DSN_PROJECT_URI: ${{ secrets.SENTRY_DSN_PROJECT_URI }}
           VITE_SENTRY_DSN_PROJECT_ID: ${{ secrets.SENTRY_DSN_PROJECT_ID }}
           VITE_GITHUB_HASH: ${{ github.sha }}
-          VITE_IO_PROCESS_ID: ${{ secrets.IO_PROCESS_ID }}
+          VITE_ARIO_PROCESS_ID: ${{ vars.ARIO_PROCESS_ID }}
           DEPLOY_ANT_PROCESS_ID: ${{ secrets.DEPLOY_ANT_PROCESS_ID }}
           DEPLOY_KEY: ${{ secrets.DEPLOY_KEY }}
           VITE_AO_CU_URL: ${{ vars.VITE_AO_CU_URL }}
diff --git a/CHANGELOG.md b/CHANGELOG.md
index fcd273ce..ecda7b11 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,119 +7,133 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.7.0] - 2024-12-20
+
+### Added
+
+- Redelegate Stake: Users can now redelegate stake and pending withdrawals between gateways. Includes moving to/from operator stake and delegated stake.
+  Redelegation fees are assessed at 10% per redelegation performed since the last fee reset, up to 60%. Fees are reset when no redelegations are performed in the last 7 days.
+
+### Changed
+
+- Leave Network: text updated to 90-days for vaulted funds
+- Staking: Staking and Withdrawal are now separate modals that are initiated from unique popup menu options
+
+### Fixed
+
+- Gateway Details: Restored "Leave" (when viewing own gateway) and "Stake" (when viewing other gateways) buttons
+
 ## [1.6.0] - 2024-12-10
 
-### Added 
+### Added
 
-* Gateway Details
-  * Added Operator Stake card showing operator stake and EAY, as well as manage stake button for updating operator stake.
-  * Added collapsible Pending Withdrawals card for viewing current withdrawals as well as managing 
-  them (canceling a withdrawal or initiating an expedited withdrawal). Visible only to the gateway operator.
-  * Added collapsible Active Delegates card showing the list of active delegates for the gateway.
+- Gateway Details
+  - Added Operator Stake card showing operator stake and EAY, as well as manage stake button for updating operator stake.
+  - Added collapsible Pending Withdrawals card for viewing current withdrawals as well as managing
+    them (canceling a withdrawal or initiating an expedited withdrawal). Visible only to the gateway operator.
+  - Added collapsible Active Delegates card showing the list of active delegates for the gateway.
 
 ## [1.5.0] - 2024-12-04
 
-### Added 
+### Added
 
-* Profile button shows user's ArNS Primary Name (if available) or wallet address when logged in
-* Download buttons added to Reports page and individual Report page 
-* Observers: Added epoch selector to view prescribed observers for previous epochs
-* Gateway Details Page
-  * Reported On By card: text links to gateway for observer, report button links to report 
-  * Reported On card: Report button shows in header that links to that report's page 
+- Profile button shows user's ArNS Primary Name (if available) or wallet address when logged in
+- Download buttons added to Reports page and individual Report page
+- Observers: Added epoch selector to view prescribed observers for previous epochs
+- Gateway Details Page
+  - Reported On By card: text links to gateway for observer, report button links to report
+  - Reported On card: Report button shows in header that links to that report's page
 
 ### Updated
 
-* Staking and Withdrawal modals updated to show Review page for user to confirm operation before processing
-* Withdrawal Modal: Added option for Standard and Expedited Withdrawal
-* Modal dialog styles refreshed
-* Reward Share Ratio capped to 95% when joining network and updating gateway settings 
+- Staking and Withdrawal modals updated to show Review page for user to confirm operation before processing
+- Withdrawal Modal: Added option for Standard and Expedited Withdrawal
+- Modal dialog styles refreshed
+- Reward Share Ratio capped to 95% when joining network and updating gateway settings
 
 ## [1.4.3] - 2024-11-27
 
 ### Updated
 
-* Settings updated for staking:
-  * Staking withdrawals are now 90 days
-  * Gateway Operator Stake minimum is now 10,000 IO
-  * Minimum Delegated Staking amount for gateway configuration is now 10 IO
+- Settings updated for staking:
+  - Staking withdrawals are now 90 days
+  - Gateway Operator Stake minimum is now 10,000 IO
+  - Minimum Delegated Staking amount for gateway configuration is now 10 IO
 
 ## [1.4.2] - 2024-11-20
 
 ### Updated
 
-* Show error message toast if the application is unable to retrieve the current epoch
+- Show error message toast if the application is unable to retrieve the current epoch
 
 ## [1.4.1] - 2024-11-18
 
 ### Updated
 
-* Optimized loading of user stakes and pending withdrawals. 
+- Optimized loading of user stakes and pending withdrawals.
 
 ### Fixed
 
-* Gateways count in site header should only count active gateways.
+- Gateways count in site header should only count active gateways.
 
 ## [1.4.0] - 2024-11-14
 
 ### Added
 
-* View Pending Withdrawals on Staking page and support cancelling pending withdrawals as well as performing expedited withdrawals
-* View Changelog in app by clicking version number in sidebar
+- View Pending Withdrawals on Staking page and support cancelling pending withdrawals as well as performing expedited withdrawals
+- View Changelog in app by clicking version number in sidebar
 
 ### Updated
 
-* Staking page top cards now show balance, amount staking + pending withdrawals, and rewards earned last 14 epochs and last epoch
+- Staking page top cards now show balance, amount staking + pending withdrawals, and rewards earned last 14 epochs and last epoch
 
 ### Changed
 
-* Updated header style of cards
-* Observations: Updated to use arweave.net for reference domain when generating observation report
-* Observe: Default to using prescribed names 
+- Updated header style of cards
+- Observations: Updated to use arweave.net for reference domain when generating observation report
+- Observe: Default to using prescribed names
 
 ## [1.3.0] - 2024-10-21
 
 ### Added
 
-* New Dashboard home page that visualizes data for the state of the gateway network 
+- New Dashboard home page that visualizes data for the state of the gateway network
 
 ## [1.2.0] - 2024-10-17
 
 ### Added
 
-* “Reported On” and “Reported On By” cards on Gateway Details page for viewing observation status by epoch for a gateway
-* “Software” card on gateway details page that shows gateway software version and available bundlers (if gateway has listed them)
+- “Reported On” and “Reported On By” cards on Gateway Details page for viewing observation status by epoch for a gateway
+- “Software” card on gateway details page that shows gateway software version and available bundlers (if gateway has listed them)
 
 ### Changed
 
-* Updated Gateway Details page for leaving gateways to hide non-relevant cards and show leave date
-
+- Updated Gateway Details page for leaving gateways to hide non-relevant cards and show leave date
 
 ## [1.1.0] - 2024-10-08
 
 ### Added
 
-* Gateways > Reports: Add “AR.IOEpoch #” Column
-* Gateways>Reports>Individual Reports
-  * Add Epoch #
-  * Remove Epoch start height
-* Implemented Leave Network Flow:
-  * Adds button to Gateway Detail page to leave network when gateway shown is the user’s own gateway
-  * Hitting Leave shows a modal with information. User has to type “LEAVE NETWORK” before Leave Network button is enabled.
-  * Hitting Leave Network button initiates signature request and then a success message.
-  * Site is refreshed after leaving.
-* Release version shown on sidebar
-
+- Gateways > Reports: Add “AR.IOEpoch #” Column
+- Gateways>Reports>Individual Reports
+  - Add Epoch #
+  - Remove Epoch start height
+- Implemented Leave Network Flow:
+  - Adds button to Gateway Detail page to leave network when gateway shown is the user’s own gateway
+  - Hitting Leave shows a modal with information. User has to type “LEAVE NETWORK” before Leave Network button is enabled.
+  - Hitting Leave Network button initiates signature request and then a success message.
+  - Site is refreshed after leaving.
+- Release version shown on sidebar
 
 ### Changed
 
-* Gateway Details: rename “Reward Ratios” to “Performance Ratios”
-* Gateway Details: Fixes text bubble cut off when copying wallet address
+- Gateway Details: rename “Reward Ratios” to “Performance Ratios”
+- Gateway Details: Fixes text bubble cut off when copying wallet address
 
 ### Fixed
 
-* Gateway Details: Remove Edit and Stake Buttons from gateways that are leaving
+- Gateway Details: Remove Edit and Stake Buttons from gateways that are leaving
 
 ## [1.0.0]
 
-* Initial versions of application; version was bumped to 1.1.0 for first public versioned release. 
+- Initial versions of application; version was bumped to 1.1.0 for first public versioned release.
diff --git a/package.json b/package.json
index 1a5bfbe4..0bac808b 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@ar-io/network-portal",
   "private": true,
-  "version": "1.6.0",
+  "version": "1.7.0",
   "type": "module",
   "scripts": {
     "build": "yarn clean && tsc --build tsconfig.build.json && NODE_OPTIONS=--max-old-space-size=32768 vite build",
@@ -20,9 +20,10 @@
     "deploy": "yarn build && permaweb-deploy --ant-process ${DEPLOY_ANT_PROCESS_ID}"
   },
   "dependencies": {
-    "@ar.io/sdk": "2.7.0-alpha.5",
+    "@ar.io/sdk": "3.0.1-alpha.1",
     "@fontsource/rubik": "^5.0.19",
     "@headlessui/react": "^2.2.0",
+    "@radix-ui/react-dropdown-menu": "^2.1.2",
     "@radix-ui/react-tooltip": "^1.0.7",
     "@sentry/browser": "^7.101.1",
     "@sentry/react": "^7.101.1",
diff --git a/src/components/GatewaySelector.tsx b/src/components/GatewaySelector.tsx
new file mode 100644
index 00000000..739ecab6
--- /dev/null
+++ b/src/components/GatewaySelector.tsx
@@ -0,0 +1,210 @@
+import { AoGatewayWithAddress, mARIOToken } from '@ar.io/sdk/web';
+import { EAY_TOOLTIP_FORMULA, EAY_TOOLTIP_TEXT } from '@src/constants';
+import useGateways from '@src/hooks/useGateways';
+import useProtocolBalance from '@src/hooks/useProtocolBalance';
+import { useGlobalState } from '@src/store';
+import { formatAddress, formatPercentage, formatWithCommas } from '@src/utils';
+import { calculateGatewayRewards } from '@src/utils/rewards';
+import { ColumnDef, createColumnHelper } from '@tanstack/react-table';
+import { MathJax } from 'better-react-mathjax';
+import { InfoIcon, SearchIcon } from 'lucide-react';
+import { useEffect, useState } from 'react';
+import Button, { ButtonType } from './Button';
+import BaseModal from './modals/BaseModal';
+import TableView from './TableView';
+import Tooltip from './Tooltip';
+
+export type GatewaySelectorProps = {
+  selectedGateway?: AoGatewayWithAddress;
+  setSelectedGateway: (gateway: AoGatewayWithAddress) => void;
+  gateways?: AoGatewayWithAddress[];
+};
+
+interface TableData {
+  label: string;
+  gateway: AoGatewayWithAddress;
+  rewardShareRatio: number;
+  totalStake: number;
+  eay: number;
+}
+
+const columnHelper = createColumnHelper<TableData>();
+
+const GatewaySelectorModal = ({
+  gateways,
+  onClose,
+  onGatewaySelected,
+}: {
+  gateways: AoGatewayWithAddress[];
+  onClose: () => void;
+  onGatewaySelected: (gateway: AoGatewayWithAddress) => void;
+}) => {
+  const ticker = useGlobalState((state) => state.ticker);
+  const [tableData, setTableData] = useState<TableData[]>([]);
+
+  const { data: prototocolBalance } = useProtocolBalance();
+  const { data: totalGateways } = useGateways();
+
+  const [searchText, setSearchText] = useState<string>();
+
+  useEffect(() => {
+    if (prototocolBalance && totalGateways && gateways) {
+      const tableData: TableData[] = gateways.map((gateway) => {
+        return {
+          gateway,
+          label: gateway.settings.label,
+          rewardShareRatio: gateway.settings.delegateRewardShareRatio,
+          totalStake: gateway.totalDelegatedStake,
+          eay: calculateGatewayRewards(
+            new mARIOToken(prototocolBalance).toARIO(),
+            Object.values(totalGateways).filter((g) => g.status == 'joined')
+              .length,
+            gateway,
+          ).EAY,
+        };
+      });
+      if (searchText && searchText.length > 0) {
+        const filteredData = tableData.filter((data) => {
+          return (
+            data.label.toLowerCase().includes(searchText.toLowerCase()) ||
+            data.gateway.settings.fqdn
+              .toLowerCase()
+              .includes(searchText.toLowerCase()) ||
+            data.gateway.gatewayAddress
+              .toLowerCase()
+              .includes(searchText.toLowerCase())
+          );
+        });
+        setTableData(filteredData);
+      } else {
+        setTableData(tableData);
+      }
+    }
+  }, [totalGateways, gateways, prototocolBalance, searchText]);
+
+  // Define columns for the table
+  const columns: ColumnDef<TableData, any>[] = [
+    columnHelper.accessor('label', {
+      id: 'label',
+      header: 'Gateway',
+      sortDescFirst: true,
+      cell: ({ row }) => (
+        <div className="flex flex-col text-left">
+          <div className="text-sm text-high">{row.original.label}</div>
+          <div className="text-xs">
+            {formatAddress(row.original.gateway.gatewayAddress)}
+          </div>
+        </div>
+      ),
+    }),
+    columnHelper.accessor('rewardShareRatio', {
+      id: 'rewardShareRatioe',
+      header: 'Reward Share',
+      sortDescFirst: true,
+      cell: ({ row }) => formatPercentage(row.original.rewardShareRatio / 100),
+    }),
+    columnHelper.accessor('totalStake', {
+      id: 'totalStake',
+      header: 'Total Stake',
+      sortDescFirst: true,
+      cell: ({ row }) =>
+        `${formatWithCommas(row.original.totalStake)} ${ticker}`,
+    }),
+    columnHelper.accessor('eay', {
+      id: 'eay',
+      header: () => (
+        <div className="flex gap-1">
+          EAY
+          <Tooltip
+            message={
+              <div>
+                <p>{EAY_TOOLTIP_TEXT}</p>
+                <MathJax className="mt-4">{EAY_TOOLTIP_FORMULA}</MathJax>
+              </div>
+            }
+          >
+            <InfoIcon className="h-4" />
+          </Tooltip>
+        </div>
+      ),
+      sortDescFirst: true,
+      cell: ({ row }) => (
+        <div>
+          {row.original.eay < 0
+            ? 'N/A'
+            : `${formatWithCommas(row.original.eay * 100)}%`}
+        </div>
+      ),
+    }),
+  ];
+
+  return (
+    <BaseModal onClose={onClose} showCloseButton={false} closeOnClickOutside>
+      <div className="w-[48rem] overflow-hidden rounded-xl border border-grey-500 text-left">
+        <div className="flex items-center rounded-t-xl border border-grey-500 px-6 py-2">
+          <SearchIcon className="size-4 text-mid" />
+          <input
+            type="text"
+            placeholder="Enter label, domain, or address"
+            className="grow bg-transparent px-3 py-2 text-sm text-high placeholder:text-low focus:outline-none"
+            value={searchText ?? ''}
+            onChange={(e) => setSearchText(e.target.value)}
+          />
+        </div>
+        <TableView
+          columns={columns}
+          data={tableData}
+          onRowClick={(row) => {
+            onGatewaySelected(row.gateway);
+            onClose();
+          }}
+          defaultSortingState={{ id: 'label', desc: false }}
+          isLoading={false}
+          noDataFoundText="No gateways found."
+          shortTable={true}
+        />
+      </div>
+    </BaseModal>
+  );
+};
+
+const GatewaySelector = ({
+  selectedGateway,
+  setSelectedGateway,
+  gateways,
+}: GatewaySelectorProps) => {
+  const [showGatewaySelectorTable, setShowGatewaySelectorTable] =
+    useState(false);
+
+  return (
+    <div className="flex items-center rounded border border-grey-500 p-2 pl-6 text-left text-sm text-mid">
+      <div className="grow">
+        {!gateways
+          ? 'Loading Gateways...'
+          : selectedGateway
+            ? formatAddress(selectedGateway.gatewayAddress)
+            : ''}
+      </div>
+
+      <div className={gateways ? undefined : 'pointer-events-none opacity-30'}>
+        <Button
+          buttonType={ButtonType.SECONDARY}
+          className="max-h-7 text-mid"
+          active={true}
+          title="Choose Gateway"
+          text="Choose Gateway"
+          onClick={() => setShowGatewaySelectorTable(true)}
+        />
+      </div>
+      {showGatewaySelectorTable && gateways && (
+        <GatewaySelectorModal
+          gateways={gateways}
+          onClose={() => setShowGatewaySelectorTable(false)}
+          onGatewaySelected={setSelectedGateway}
+        />
+      )}
+    </div>
+  );
+};
+
+export default GatewaySelector;
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 8a0b0729..c60cd7c0 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import { NBSP } from '@src/constants';
 import useEpochCountdown from '@src/hooks/useEpochCountdown';
 import useGateways from '@src/hooks/useGateways';
@@ -88,7 +88,7 @@ const Header = () => {
         value={
           protocolBalance ? (
             <div>
-              {formatWithCommas(new mIOToken(protocolBalance).toIO().valueOf())}{' '}
+              {formatWithCommas(new mARIOToken(protocolBalance).toARIO().valueOf())}{' '}
               {ticker}
             </div>
           ) : undefined
diff --git a/src/components/WalletProvider.tsx b/src/components/WalletProvider.tsx
index 0335dc9a..b096d12b 100644
--- a/src/components/WalletProvider.tsx
+++ b/src/components/WalletProvider.tsx
@@ -1,6 +1,6 @@
-import { AOProcess, IO } from '@ar.io/sdk/web';
+import { AOProcess, ARIO } from '@ar.io/sdk/web';
 import { connect } from '@permaweb/aoconnect';
-import { AO_CU_URL, IO_PROCESS_ID } from '@src/constants';
+import { AO_CU_URL, ARIO_PROCESS_ID } from '@src/constants';
 import { useEffectOnce } from '@src/hooks/useEffectOnce';
 import { ArConnectWalletConnector } from '@src/services/wallets/ArConnectWalletConnector';
 import { useGlobalState } from '@src/store';
@@ -39,10 +39,10 @@ const WalletProvider = ({ children }: { children: ReactElement }) => {
       const signer = wallet.signer;
 
       if (signer) {
-        const writeable = IO.init({
+        const writeable = ARIO.init({
           signer,
           process: new AOProcess({
-            processId: IO_PROCESS_ID.toString(),
+            processId: ARIO_PROCESS_ID.toString(),
             ao: connect({
               CU_URL: AO_CU_URL,
             }),
diff --git a/src/components/forms/validation.ts b/src/components/forms/validation.ts
index 2e7bf3cf..64697960 100644
--- a/src/components/forms/validation.ts
+++ b/src/components/forms/validation.ts
@@ -46,7 +46,7 @@ export const validateTransactionId = (
   };
 };
 
-export const validateIOAmount = (
+export const validateARIOAmount = (
   propertyName: string,
   ticker: string,
   min: number,
diff --git a/src/components/icons/index.ts b/src/components/icons/index.ts
index a881fc18..9aabb29a 100644
--- a/src/components/icons/index.ts
+++ b/src/components/icons/index.ts
@@ -47,6 +47,7 @@ import StatsArrowIcon from './stats_arrow.svg?react';
 import StreakDownArrowIcon from './streak_down_arrow.svg?react';
 import StreakUpArrowIcon from './streak_up_arrow.svg?react';
 import SuccessCheck from './success_check.svg?react';
+import ThreeDotsIcon from './three_dots_icon.svg?react';
 import TimerIcon from './timer.svg?react';
 import ToastCloseIcon from './toast_close.svg?react';
 import WalletIcon from './wallet.svg?react';
@@ -102,6 +103,7 @@ export {
   StreakDownArrowIcon,
   StreakUpArrowIcon,
   SuccessCheck,
+  ThreeDotsIcon,
   TimerIcon,
   ToastCloseIcon,
   WalletIcon,
diff --git a/src/components/icons/three_dots_icon.svg b/src/components/icons/three_dots_icon.svg
new file mode 100644
index 00000000..8bb10bf6
--- /dev/null
+++ b/src/components/icons/three_dots_icon.svg
@@ -0,0 +1,24 @@
+<svg width="6" height="21" viewBox="0 0 6 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Group 47393">
+<path id="Vector" d="M5.83203 17.8319C5.83203 16.4512 4.71274 15.3319 3.33203 15.3319C1.95132 15.3319 0.832031 16.4512 0.832031 17.8319C0.832031 19.2126 1.95132 20.3319 3.33203 20.3319C4.71274 20.3319 5.83203 19.2126 5.83203 17.8319Z" fill="url(#paint0_linear_3724_127221)"/>
+<path id="Vector_2" d="M5.83203 10.3319C5.83203 8.9512 4.71274 7.83191 3.33203 7.83191C1.95132 7.83191 0.832031 8.9512 0.832031 10.3319C0.832031 11.7126 1.95132 12.8319 3.33203 12.8319C4.71274 12.8319 5.83203 11.7126 5.83203 10.3319Z" fill="url(#paint1_linear_3724_127221)"/>
+<path id="Vector_3" d="M5.83203 2.83191C5.83203 1.4512 4.71274 0.331909 3.33203 0.331909C1.95132 0.331909 0.832031 1.4512 0.832031 2.83191C0.832031 4.21262 1.95132 5.33191 3.33203 5.33191C4.71274 5.33191 5.83203 4.21262 5.83203 2.83191Z" fill="url(#paint2_linear_3724_127221)"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_3724_127221" x1="4.7794" y1="19.9363" x2="4.66589" y2="15.2824" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F7C3A1"/>
+<stop offset="0.52" stop-color="#EBAEC6"/>
+<stop offset="1" stop-color="#DF9BE8"/>
+</linearGradient>
+<linearGradient id="paint1_linear_3724_127221" x1="4.7794" y1="12.4363" x2="4.66589" y2="7.78241" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F7C3A1"/>
+<stop offset="0.52" stop-color="#EBAEC6"/>
+<stop offset="1" stop-color="#DF9BE8"/>
+</linearGradient>
+<linearGradient id="paint2_linear_3724_127221" x1="4.7794" y1="4.93634" x2="4.66589" y2="0.282412" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F7C3A1"/>
+<stop offset="0.52" stop-color="#EBAEC6"/>
+<stop offset="1" stop-color="#DF9BE8"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/components/modals/BaseModal.tsx b/src/components/modals/BaseModal.tsx
index 55fe3389..954a69e6 100644
--- a/src/components/modals/BaseModal.tsx
+++ b/src/components/modals/BaseModal.tsx
@@ -7,14 +7,20 @@ const BaseModal = ({
   children,
   showCloseButton = true,
   useDefaultPadding = true,
+  closeOnClickOutside = false,
 }: {
   onClose: () => void;
   children: ReactElement;
   showCloseButton?: boolean;
   useDefaultPadding?: boolean;
+  closeOnClickOutside?: boolean;
 }) => {
   return (
-    <Dialog open={true} onClose={() => {}} className="relative z-10">
+    <Dialog
+      open={true}
+      onClose={closeOnClickOutside ? onClose : () => {}}
+      className="relative z-10"
+    >
       <div
         className="fixed inset-0 w-screen bg-neutrals-1100/80"
         aria-hidden="true"
diff --git a/src/components/modals/CancelWithdrawalModal.tsx b/src/components/modals/CancelWithdrawalModal.tsx
index 5e5a8299..7f0308c0 100644
--- a/src/components/modals/CancelWithdrawalModal.tsx
+++ b/src/components/modals/CancelWithdrawalModal.tsx
@@ -102,7 +102,7 @@ const CancelWithdrawalModal = ({
               <Button
                 onClick={processCancelWithdrawal}
                 buttonType={ButtonType.PRIMARY}
-                title="Leave Network"
+                title="Cancel Withdrawal"
                 text={<div className="py-2">Cancel Withdrawal</div>}
                 className={`w-full ${!termsAccepted && 'pointer-events-none opacity-30'}`}
               />
diff --git a/src/components/modals/InstantWithdrawalModal.tsx b/src/components/modals/InstantWithdrawalModal.tsx
index 76d50b1b..3c029ee1 100644
--- a/src/components/modals/InstantWithdrawalModal.tsx
+++ b/src/components/modals/InstantWithdrawalModal.tsx
@@ -1,4 +1,4 @@
-import { AoGateway, AoVaultData, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, AoVaultData, mARIOToken } from '@ar.io/sdk/web';
 import { WRITE_OPTIONS } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { formatAddress, formatDateTime, formatWithCommas } from '@src/utils';
@@ -54,8 +54,8 @@ const InstantWithdrawalModal = ({
 
     setCalculatedFeeAndAmountReturning({
       penaltyRate,
-      fee: new mIOToken(fee).toIO().valueOf(),
-      amountReturning: new mIOToken(amountReturning).toIO().valueOf(),
+      fee: new mARIOToken(fee).toARIO().valueOf(),
+      amountReturning: new mARIOToken(amountReturning).toARIO().valueOf(),
     });
   }, [setCalculatedFeeAndAmountReturning, vault]);
 
@@ -149,7 +149,7 @@ const InstantWithdrawalModal = ({
           <div className="mt-4 flex flex-col gap-1 px-8 pb-4">
             <LabelValueRow
               label="Stake Withdrawing:"
-              value={`${formatWithCommas(new mIOToken(vault.balance).toIO().valueOf())} ${ticker}`}
+              value={`${formatWithCommas(new mARIOToken(vault.balance).toARIO().valueOf())} ${ticker}`}
             />
 
             <LabelValueRow
@@ -203,7 +203,7 @@ const InstantWithdrawalModal = ({
               <Button
                 onClick={processInstantWithdrawal}
                 buttonType={ButtonType.PRIMARY}
-                title="Leave Network"
+                title="Withdraw"
                 text={<div className="py-2">Withdraw</div>}
                 className={`w-full ${!termsAccepted && 'pointer-events-none opacity-30'}`}
               />
diff --git a/src/components/modals/LeaveNetworkModal.tsx b/src/components/modals/LeaveNetworkModal.tsx
index 557d07a2..66673644 100644
--- a/src/components/modals/LeaveNetworkModal.tsx
+++ b/src/components/modals/LeaveNetworkModal.tsx
@@ -8,9 +8,7 @@ import { LinkArrowIcon } from '../icons';
 import BaseModal from './BaseModal';
 import BlockingMessageModal from './BlockingMessageModal';
 import SuccessModal from './SuccessModal';
-import { WRITE_OPTIONS } from '@src/constants';
-
-const GATEWAY_OPERATOR_STAKE_MINIMUM = 50000;
+import { GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO, WRITE_OPTIONS } from '@src/constants';
 
 const LeaveNetworkModal = ({ onClose }: { onClose: () => void }) => {
   const queryClient = useQueryClient();
@@ -75,17 +73,17 @@ const LeaveNetworkModal = ({ onClose }: { onClose: () => void }) => {
             <ul className="mt-6 list-disc space-y-2 pl-8">
               <li>
                 Your gateway&apos;s primary stake (
-                {formatWithCommas(GATEWAY_OPERATOR_STAKE_MINIMUM)} {ticker})
+                {formatWithCommas(GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO)} {ticker})
                 will be vaulted and subject to a 90-day withdrawal period.
               </li>
               <li>
                 Any additional operator stake above the minimum (
-                {formatWithCommas(GATEWAY_OPERATOR_STAKE_MINIMUM)} {ticker})
-                will be vaulted and subject to a 30-day withdrawal period.
+                {formatWithCommas(GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO)} {ticker})
+                will be vaulted and subject to a 90-day withdrawal period.
               </li>
               <li>
                 Any existing delegated stakes will be vaulted and subject to
-                30-day withdrawal period.{' '}
+                90-day withdrawal period.{' '}
               </li>
               <li>
                 Your gateway status will change to leaving and will no longer be
diff --git a/src/components/modals/OperatorStakingModal.tsx b/src/components/modals/OperatorStakingModal.tsx
index dc58fd44..bd67e63d 100644
--- a/src/components/modals/OperatorStakingModal.tsx
+++ b/src/components/modals/OperatorStakingModal.tsx
@@ -1,27 +1,21 @@
-import { AoGatewayWithAddress, IOToken, mIOToken } from '@ar.io/sdk/web';
-import { Label, Radio, RadioGroup } from '@headlessui/react';
+import { AoGatewayWithAddress, ARIOToken, mARIOToken } from '@ar.io/sdk/web';
 import { EAY_TOOLTIP_FORMULA, EAY_TOOLTIP_TEXT } from '@src/constants';
 import useBalances from '@src/hooks/useBalances';
 import useGateways from '@src/hooks/useGateways';
 import useProtocolBalance from '@src/hooks/useProtocolBalance';
 import { useGlobalState } from '@src/store';
-import { WithdrawalType } from '@src/types';
 import { formatAddress, formatPercentage, formatWithCommas } from '@src/utils';
 import { calculateOperatorRewards } from '@src/utils/rewards';
 import { MathJax } from 'better-react-mathjax';
-import { useCallback, useEffect, useState, useMemo } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import Button, { ButtonType } from '../Button';
 import LabelValueRow from '../LabelValueRow';
 import Tooltip from '../Tooltip';
 import ErrorMessageIcon from '../forms/ErrorMessageIcon';
-import {
-  validateIOAmount,
-  validateOperatorWithdrawAmount,
-} from '../forms/validation';
-import { CircleCheckIcon, CircleIcon, InfoIcon } from '../icons';
+import { validateARIOAmount as validateARIOAmount } from '../forms/validation';
+import { InfoIcon } from '../icons';
 import BaseModal from './BaseModal';
 import ReviewStakeModal from './ReviewStakeModal';
-import ReviewWithdrawalModal from './ReviewWithdrawalModal';
 
 const OperatorStakingModal = ({
   onClose,
@@ -37,17 +31,10 @@ const OperatorStakingModal = ({
   const { data: gateways } = useGateways();
   const ticker = useGlobalState((state) => state.ticker);
 
-  const [tab, setTab] = useState<number>(0);
-
   const [currentStake, setCurrentStake] = useState<number>(0);
   const [amountToStake, setAmountToStake] = useState<string>('');
-  const [amountToWithdraw, setAmountToWithdraw] = useState<string>('');
-  const [withdrawalType, setWithdrawalType] =
-    useState<WithdrawalType>('standard');
 
   const [showReviewStakeModal, setShowReviewStakeModal] = useState(false);
-  const [showReviewWithdrawalModal, setShowReviewWithdrawalModal] =
-    useState(false);
 
   const [EAY, setEAY] = useState('-');
 
@@ -55,54 +42,35 @@ const OperatorStakingModal = ({
     if (!gateway) {
       return;
     }
-    setCurrentStake(new mIOToken(gateway.operatorStake).toIO().valueOf());
+    setCurrentStake(new mARIOToken(gateway.operatorStake).toARIO().valueOf());
   }, [gateway]);
 
-  const newTotalStake =
-    tab == 0
-      ? currentStake + parseFloat(amountToStake)
-      : currentStake - parseFloat(amountToWithdraw);
+  const newTotalStake = currentStake + parseFloat(amountToStake);
 
   const minDelegatedStake = gateway
-    ? new mIOToken(gateway?.settings.minDelegatedStake).toIO().valueOf()
+    ? new mARIOToken(gateway?.settings.minDelegatedStake).toARIO().valueOf()
     : 10;
   const minRequiredStakeToAdd = currentStake > 0 ? 1 : minDelegatedStake;
 
-  const withdrawalFee =
-    withdrawalType === 'expedited' ? 0.5 * parseFloat(amountToWithdraw) : 0;
-  const returningAmount = isNaN(parseFloat(amountToWithdraw))
-    ? '-'
-    : +(
-        isNaN(withdrawalFee)
-          ? parseFloat(amountToWithdraw)
-          : parseFloat(amountToWithdraw) - withdrawalFee
-      ).toFixed(4);
-
-  const validators = useMemo(() => ({
-    stakeAmount: validateIOAmount('Stake Amount', ticker, 1, balances?.io),
-    withdrawAmount: validateOperatorWithdrawAmount(
-      'Withdraw Amount',
-      ticker,
-      currentStake,
-    ),
-  }), [ticker, balances?.io, currentStake]);
+  const validators = useMemo(
+    () => ({
+      stakeAmount: validateARIOAmount('Stake Amount', ticker, 1, balances?.io),
+    }),
+    [ticker, balances?.io],
+  );
 
   const isFormValid = useCallback(() => {
-    if (tab == 0) {
-      return validators.stakeAmount(amountToStake) == undefined;
-    } else {
-      return validators.withdrawAmount(amountToWithdraw) == undefined;
-    }
-  }, [tab, amountToStake, amountToWithdraw, validators]);
+    return validators.stakeAmount(amountToStake) == undefined;
+  }, [amountToStake, validators]);
 
   useEffect(() => {
-    if (tab == 0 && protocolBalance && gateways && gateway && isFormValid()) {
-      const newTotalStake = currentStake + parseFloat(amountToStake)
+    if (protocolBalance && gateways && gateway && isFormValid()) {
+      const newTotalStake = currentStake + parseFloat(amountToStake);
       const { EAY } = calculateOperatorRewards(
-        new mIOToken(protocolBalance).toIO(),
+        new mARIOToken(protocolBalance).toARIO(),
         Object.values(gateways).filter((g) => g.status == 'joined').length,
         gateway,
-        new IOToken(newTotalStake),
+        new ARIOToken(newTotalStake),
       );
       setEAY(formatPercentage(EAY));
     } else {
@@ -110,8 +78,6 @@ const OperatorStakingModal = ({
     }
   }, [
     amountToStake,
-    amountToWithdraw,
-    tab,
     gateway,
     protocolBalance,
     gateways,
@@ -125,31 +91,14 @@ const OperatorStakingModal = ({
   const remainingBalance =
     balances && parsedStake <= balances.io ? balances.io - parsedStake : -1;
 
-  const parsedWithdrawing = parseFloat(
-    amountToWithdraw.length === 0 ? '0' : amountToWithdraw,
-  );
-  const remainingWithdrawalBalance = currentStake - 10000 - parsedWithdrawing;
-
-  const baseTabClassName = 'text-center py-3';
-  const selectedTabClassNames = `${baseTabClassName} bg-grey-700 border-b border-red-400`;
-  const nonSelectedTabClassNames = `${baseTabClassName} bg-grey-1000 text-low`;
-
   const setMaxAmount = () => {
-    if (tab == 0) {
-      setAmountToStake((balances?.io || 0) + '');
-    } else {
-      setAmountToWithdraw(currentStake + '');
-    }
+    setAmountToStake((balances?.io || 0) + '');
   };
 
-  const disableInput =
-    !gateway ||
-    (tab == 0 && (balances?.io || 0) < minRequiredStakeToAdd) ||
-    (tab == 1 && currentStake <= 0);
+  const disableInput = !gateway || (balances?.io || 0) < minRequiredStakeToAdd;
 
   const errorMessages = {
     stakeAmount: validators.stakeAmount(amountToStake),
-    withdrawAmount: validators.withdrawAmount(amountToWithdraw),
     cannotStake:
       (balances?.io || 0) < minRequiredStakeToAdd
         ? `Insufficient balance, at least ${minRequiredStakeToAdd} IO required.`
@@ -159,19 +108,10 @@ const OperatorStakingModal = ({
   return (
     <BaseModal onClose={onClose} useDefaultPadding={false}>
       <div className="w-[28.5rem]">
-        <div className="grid grid-cols-2 border-b border-b-stroke-low">
-          <button
-            className={`${tab == 0 ? selectedTabClassNames : nonSelectedTabClassNames} rounded-tl-xl`}
-            onClick={() => setTab(0)}
-          >
-            <span className={tab == 0 ? 'text-gradient' : ''}>Stake</span>
-          </button>
-          <button
-            className={`${tab == 1 ? selectedTabClassNames : nonSelectedTabClassNames} rounded-tr-xl`}
-            onClick={() => setTab(1)}
-          >
-            <span className={tab == 1 ? 'text-gradient' : ''}>Withdraw</span>
-          </button>
+        <div className="border-b border-b-stroke-low">
+          <div className="rounded-tr-xl border-b border-red-400 bg-grey-700 py-3 text-center">
+            <span className={'text-gradient'}>Stake</span>
+          </div>
         </div>
         <div className="flex flex-col p-8 pb-2">
           <div className="flex flex-col gap-2">
@@ -196,10 +136,8 @@ const OperatorStakingModal = ({
             <div className="text-left text-sm text-mid">Amount:</div>
             <div className="grow"></div>
             <div className="text-left text-xs text-low">
-              {tab == 0
-                ? balances &&
-                  `Available: ${remainingBalance >= 0 ? formatWithCommas(+remainingBalance) : '-'} ${ticker}`
-                : `Available to Withdraw: ${remainingWithdrawalBalance >= 0 ? formatWithCommas(remainingWithdrawalBalance) : '-'} ${ticker}`}
+              {balances &&
+                `Available: ${remainingBalance >= 0 ? formatWithCommas(+remainingBalance) : '-'} ${ticker}`}
             </div>
           </div>
           <div className="mt-3 flex h-[3.25rem] items-center overflow-hidden rounded-md border border-grey-800">
@@ -210,8 +148,8 @@ const OperatorStakingModal = ({
               disabled={disableInput}
               readOnly={disableInput}
               type="text"
-              placeholder={`Enter amount of ${ticker} to ${tab == 0 ? 'stake' : 'withdraw'}`}
-              value={tab == 0 ? amountToStake : amountToWithdraw}
+              placeholder={`Enter amount of ${ticker} to stake`}
+              value={amountToStake}
               onChange={(e) => {
                 const textValue = e.target.value;
 
@@ -219,15 +157,10 @@ const OperatorStakingModal = ({
                   return;
                 }
 
-                if (tab == 0) {
-                  setAmountToStake(textValue);
-                } else {
-                  setAmountToWithdraw(textValue);
-                }
+                setAmountToStake(textValue);
               }}
-            ></input>
-            {tab == 0 &&
-              gateway &&
+            />
+            {gateway &&
               (amountToStake?.length > 0 ||
                 (balances?.io || 0) < minRequiredStakeToAdd) &&
               (errorMessages.cannotStake || errorMessages.stakeAmount) && (
@@ -238,14 +171,6 @@ const OperatorStakingModal = ({
                   tooltipPadding={'3'}
                 />
               )}
-            {tab == 1 &&
-              amountToWithdraw?.length > 0 &&
-              errorMessages.withdrawAmount && (
-                <ErrorMessageIcon
-                  errorMessage={errorMessages.withdrawAmount}
-                  tooltipPadding={'3'}
-                />
-              )}
             <Button
               className="mr-3 h-7"
               onClick={disableInput ? undefined : setMaxAmount}
@@ -255,73 +180,14 @@ const OperatorStakingModal = ({
               text="Max"
             />
           </div>
-          <div className="mt-4 flex flex-col gap-2">
-            {tab == 1 && (
-              <RadioGroup
-                className="my-2 flex flex-col gap-4 text-sm"
-                value={withdrawalType}
-                onChange={(v) => setWithdrawalType(v)}
-              >
-                <Radio
-                  value="standard"
-                  className="group flex w-full cursor-pointer rounded 
-                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
-                >
-                  <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
-                    <div className="flex items-center gap-2">
-                      <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
-                      <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
-                      <Label>Standard Withdrawal</Label>
-                    </div>
-                    <p className="pl-6 text-left text-xs text-mid">
-                      30 day withdrawal period with no fees.
-                    </p>
-                  </div>
-                </Radio>
-
-                <Radio
-                  value="expedited"
-                  className="group flex w-full cursor-pointer rounded 
-                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
-                >
-                  <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
-                    <div className="flex items-center gap-2">
-                      <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
-                      <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
-                      <Label>Expedited Withdrawal</Label>
-                    </div>
-                    <p className="pl-6 text-left text-xs text-mid">
-                      Instant withdrawal with 50% fee.
-                    </p>
-                  </div>
-                </Radio>
-              </RadioGroup>
-            )}
-          </div>
+          <div className="mt-4 flex flex-col gap-2"></div>
         </div>
         <div className="flex size-full flex-col gap-2 bg-containerL0 px-8 pb-8 pt-4">
-          {tab == 1 && withdrawalType == 'expedited' && (
-            <>
-              <LabelValueRow
-                className="first:text-mid last:text-mid"
-                label="Fee:"
-                value={`${isNaN(withdrawalFee) ? '-' : +withdrawalFee.toFixed(4)} ${ticker}`}
-              />
-              <LabelValueRow
-                className="first:text-mid last:text-mid"
-                label="Returning Amount:"
-                value={`${returningAmount} ${ticker}`}
-              />
-            </>
-          )}
-
           <div className="flex flex-col gap-2">
-            {tab == 0 && (
-              <LabelValueRow
-                label="Existing Stake:"
-                value={`${currentStake} ${ticker}`}
-              />
-            )}
+            <LabelValueRow
+              label="Existing Stake:"
+              value={`${currentStake} ${ticker}`}
+            />
 
             <LabelValueRow
               label="New Total Stake:"
@@ -330,26 +196,22 @@ const OperatorStakingModal = ({
               } ${ticker}`}
             />
 
-            {tab == 0 && (
-              <LabelValueRow
-                label="Operator EAY:"
-                value={EAY}
-                rightIcon={
-                  <Tooltip
-                    message={
-                      <div>
-                        <p>{EAY_TOOLTIP_TEXT}</p>
-                        <MathJax className="mt-4">
-                          {EAY_TOOLTIP_FORMULA}
-                        </MathJax>
-                      </div>
-                    }
-                  >
-                    <InfoIcon className="size-[1.125rem]" />
-                  </Tooltip>
-                }
-              />
-            )}
+            <LabelValueRow
+              label="Operator EAY:"
+              value={EAY}
+              rightIcon={
+                <Tooltip
+                  message={
+                    <div>
+                      <p>{EAY_TOOLTIP_TEXT}</p>
+                      <MathJax className="mt-4">{EAY_TOOLTIP_FORMULA}</MathJax>
+                    </div>
+                  }
+                >
+                  <InfoIcon className="size-[1.125rem]" />
+                </Tooltip>
+              }
+            />
           </div>
           <div
             className={
@@ -359,9 +221,7 @@ const OperatorStakingModal = ({
             <Button
               className="mt-4 h-[3.25rem] w-full"
               onClick={() => {
-                tab == 0
-                  ? setShowReviewStakeModal(true)
-                  : setShowReviewWithdrawalModal(true);
+                setShowReviewStakeModal(true);
               }}
               buttonType={ButtonType.PRIMARY}
               title="Review"
@@ -379,19 +239,6 @@ const OperatorStakingModal = ({
             walletAddress={walletAddress}
           />
         )}
-        {showReviewWithdrawalModal && gateway && walletAddress && (
-          <ReviewWithdrawalModal
-            amountToWithdraw={parseFloat(amountToWithdraw)}
-            withdrawalType={withdrawalType}
-            gateway={gateway}
-            onClose={() => setShowReviewWithdrawalModal(false)}
-            onSuccess={() => onClose()}
-            ticker={ticker}
-            walletAddress={walletAddress}
-            withdrawalFee={withdrawalFee}
-            returningAmount={returningAmount}
-          />
-        )}
       </div>
     </BaseModal>
   );
diff --git a/src/components/modals/OperatorWithdrawalModal.tsx b/src/components/modals/OperatorWithdrawalModal.tsx
new file mode 100644
index 00000000..c28af7d6
--- /dev/null
+++ b/src/components/modals/OperatorWithdrawalModal.tsx
@@ -0,0 +1,264 @@
+import { AoGatewayWithAddress, mARIOToken } from '@ar.io/sdk/web';
+import { Label, Radio, RadioGroup } from '@headlessui/react';
+import useBalances from '@src/hooks/useBalances';
+import { useGlobalState } from '@src/store';
+import { WithdrawalType } from '@src/types';
+import { formatAddress, formatWithCommas } from '@src/utils';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import Button, { ButtonType } from '../Button';
+import LabelValueRow from '../LabelValueRow';
+import ErrorMessageIcon from '../forms/ErrorMessageIcon';
+import { validateOperatorWithdrawAmount } from '../forms/validation';
+import { CircleCheckIcon, CircleIcon } from '../icons';
+import BaseModal from './BaseModal';
+import ReviewWithdrawalModal from './ReviewWithdrawalModal';
+
+const OperatorStakingModal = ({
+  onClose,
+  gateway,
+}: {
+  open: boolean;
+  onClose: () => void;
+  gateway: AoGatewayWithAddress;
+}) => {
+  const walletAddress = useGlobalState((state) => state.walletAddress);
+  const { data: balances } = useBalances(walletAddress);
+  const ticker = useGlobalState((state) => state.ticker);
+
+  const [currentStake, setCurrentStake] = useState<number>(0);
+  const [amountToWithdraw, setAmountToWithdraw] = useState<string>('');
+  const [withdrawalType, setWithdrawalType] =
+    useState<WithdrawalType>('standard');
+
+  const [showReviewWithdrawalModal, setShowReviewWithdrawalModal] =
+    useState(false);
+
+  useEffect(() => {
+    if (!gateway) {
+      return;
+    }
+    setCurrentStake(new mARIOToken(gateway.operatorStake).toARIO().valueOf());
+  }, [gateway]);
+
+  const newTotalStake = currentStake - parseFloat(amountToWithdraw);
+
+  const minDelegatedStake = gateway
+    ? new mARIOToken(gateway?.settings.minDelegatedStake).toARIO().valueOf()
+    : 10;
+  const minRequiredStakeToAdd = currentStake > 0 ? 1 : minDelegatedStake;
+
+  const withdrawalFee =
+    withdrawalType === 'expedited' ? 0.5 * parseFloat(amountToWithdraw) : 0;
+  const returningAmount = isNaN(parseFloat(amountToWithdraw))
+    ? '-'
+    : +(
+        isNaN(withdrawalFee)
+          ? parseFloat(amountToWithdraw)
+          : parseFloat(amountToWithdraw) - withdrawalFee
+      ).toFixed(4);
+
+  const validators = useMemo(
+    () => ({
+      withdrawAmount: validateOperatorWithdrawAmount(
+        'Withdraw Amount',
+        ticker,
+        currentStake,
+      ),
+    }),
+    [ticker, currentStake],
+  );
+
+  const isFormValid = useCallback(() => {
+    return validators.withdrawAmount(amountToWithdraw) == undefined;
+  }, [amountToWithdraw, validators]);
+
+  const parsedWithdrawing = parseFloat(
+    amountToWithdraw.length === 0 ? '0' : amountToWithdraw,
+  );
+  const remainingWithdrawalBalance = currentStake - 10000 - parsedWithdrawing;
+
+  const setMaxAmount = () => {
+    setAmountToWithdraw(currentStake + '');
+  };
+
+  const disableInput = !gateway || currentStake <= 0;
+
+  const errorMessages = {
+    withdrawAmount: validators.withdrawAmount(amountToWithdraw),
+    cannotStake:
+      (balances?.io || 0) < minRequiredStakeToAdd
+        ? `Insufficient balance, at least ${minRequiredStakeToAdd} IO required.`
+        : undefined,
+  };
+
+  return (
+    <BaseModal onClose={onClose} useDefaultPadding={false}>
+      <div className="w-[28.5rem]">
+        <div className="border-b border-b-stroke-low">
+          <div className="rounded-tr-xl border-b border-red-400 bg-grey-700 py-3 text-center">
+            <span className={'text-gradient'}>Withdraw</span>
+          </div>
+        </div>
+        <div className="flex flex-col p-8 pb-2">
+          <div className="flex flex-col gap-2">
+            <LabelValueRow
+              label="Gateway Owner:"
+              value={formatAddress(gateway.gatewayAddress)}
+            />
+
+            <LabelValueRow
+              label="Label:"
+              value={gateway ? gateway.settings.label : '-'}
+            />
+
+            <LabelValueRow
+              label="Domain:"
+              isLink={true}
+              value={gateway ? gateway.settings.fqdn : '-'}
+            />
+          </div>
+
+          <div className="mt-8 flex items-center">
+            <div className="text-left text-sm text-mid">Amount:</div>
+            <div className="grow"></div>
+            <div className="text-left text-xs text-low">
+              {`Available to Withdraw: ${remainingWithdrawalBalance >= 0 ? formatWithCommas(remainingWithdrawalBalance) : '-'} ${ticker}`}
+            </div>
+          </div>
+          <div className="mt-3 flex h-[3.25rem] items-center overflow-hidden rounded-md border border-grey-800">
+            <input
+              className={
+                'size-full grow  bg-grey-1000 px-6 py-3 text-sm text-mid outline-none placeholder:text-grey-400 focus:text-high'
+              }
+              disabled={disableInput}
+              readOnly={disableInput}
+              type="text"
+              placeholder={`Enter amount of ${ticker} to withdraw'}`}
+              value={amountToWithdraw}
+              onChange={(e) => {
+                const textValue = e.target.value;
+
+                if (textValue && isNaN(+e.target.value)) {
+                  return;
+                }
+
+                setAmountToWithdraw(textValue);
+              }}
+            />
+
+            {amountToWithdraw?.length > 0 && errorMessages.withdrawAmount && (
+              <ErrorMessageIcon
+                errorMessage={errorMessages.withdrawAmount}
+                tooltipPadding={'3'}
+              />
+            )}
+            <Button
+              className="mr-3 h-7"
+              onClick={disableInput ? undefined : setMaxAmount}
+              buttonType={ButtonType.SECONDARY}
+              active={true}
+              title="Max"
+              text="Max"
+            />
+          </div>
+          <div className="mt-4 flex flex-col gap-2">
+            <RadioGroup
+              className="my-2 flex flex-col gap-4 text-sm"
+              value={withdrawalType}
+              onChange={(v) => setWithdrawalType(v)}
+            >
+              <Radio
+                value="standard"
+                className="group flex w-full cursor-pointer rounded 
+                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
+              >
+                <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
+                  <div className="flex items-center gap-2">
+                    <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
+                    <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
+                    <Label>Standard Withdrawal</Label>
+                  </div>
+                  <p className="pl-6 text-left text-xs text-mid">
+                    90 day withdrawal period with no fees.
+                  </p>
+                </div>
+              </Radio>
+
+              <Radio
+                value="expedited"
+                className="group flex w-full cursor-pointer rounded 
+                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
+              >
+                <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
+                  <div className="flex items-center gap-2">
+                    <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
+                    <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
+                    <Label>Expedited Withdrawal</Label>
+                  </div>
+                  <p className="pl-6 text-left text-xs text-mid">
+                    Instant withdrawal with 50% fee.
+                  </p>
+                </div>
+              </Radio>
+            </RadioGroup>
+          </div>
+        </div>
+        <div className="flex size-full flex-col gap-2 bg-containerL0 px-8 pb-8 pt-4">
+          {withdrawalType == 'expedited' && (
+            <>
+              <LabelValueRow
+                className="first:text-mid last:text-mid"
+                label="Fee:"
+                value={`${isNaN(withdrawalFee) ? '-' : +withdrawalFee.toFixed(4)} ${ticker}`}
+              />
+              <LabelValueRow
+                className="first:text-mid last:text-mid"
+                label="Returning Amount:"
+                value={`${returningAmount} ${ticker}`}
+              />
+            </>
+          )}
+
+          <div className="flex flex-col gap-2">
+            <LabelValueRow
+              label="New Total Stake:"
+              value={`${
+                isFormValid() ? formatWithCommas(newTotalStake) : '-'
+              } ${ticker}`}
+            />
+          </div>
+          <div
+            className={
+              isFormValid() ? undefined : 'pointer-events-none opacity-30'
+            }
+          >
+            <Button
+              className="mt-4 h-[3.25rem] w-full"
+              onClick={() => {
+                setShowReviewWithdrawalModal(true);
+              }}
+              buttonType={ButtonType.PRIMARY}
+              title="Review"
+              text="Review"
+            />
+          </div>
+        </div>
+        {showReviewWithdrawalModal && gateway && walletAddress && (
+          <ReviewWithdrawalModal
+            amountToWithdraw={parseFloat(amountToWithdraw)}
+            withdrawalType={withdrawalType}
+            gateway={gateway}
+            onClose={() => setShowReviewWithdrawalModal(false)}
+            onSuccess={() => onClose()}
+            ticker={ticker}
+            walletAddress={walletAddress}
+            withdrawalFee={withdrawalFee}
+            returningAmount={returningAmount}
+          />
+        )}
+      </div>
+    </BaseModal>
+  );
+};
+
+export default OperatorStakingModal;
diff --git a/src/components/modals/RedelegateModal.tsx b/src/components/modals/RedelegateModal.tsx
new file mode 100644
index 00000000..9473ef68
--- /dev/null
+++ b/src/components/modals/RedelegateModal.tsx
@@ -0,0 +1,350 @@
+import { AoGatewayWithAddress, ARIOToken, mARIOToken } from '@ar.io/sdk/web';
+import useDelegateStakes from '@src/hooks/useDelegateStakes';
+import useGateways from '@src/hooks/useGateways';
+import useRedelegationFee from '@src/hooks/useRedelegationFee';
+import { useGlobalState } from '@src/store';
+import { formatWithCommas } from '@src/utils';
+import { InfoIcon } from 'lucide-react';
+import { useEffect, useMemo, useState } from 'react';
+import Button, { ButtonType } from '../Button';
+import GatewaySelector from '../GatewaySelector';
+import LabelValueRow from '../LabelValueRow';
+import Tooltip from '../Tooltip';
+import ErrorMessageIcon from '../forms/ErrorMessageIcon';
+import { validateARIOAmount } from '../forms/validation';
+import BaseModal from './BaseModal';
+import ReviewRedelegateModal from './ReviewRedelegateModal';
+import { REDELEGATION_FEE_TOOLTIP_TEXT } from '@src/constants';
+
+export type RedelegateModalProps = {
+  onClose: () => void;
+  sourceGateway: AoGatewayWithAddress;
+  vaultId?: string;
+  maxRedelegationStake: ARIOToken;
+};
+
+const RedelegateModal = ({
+  onClose,
+  sourceGateway,
+  vaultId,
+  maxRedelegationStake,
+}: RedelegateModalProps) => {
+  const walletAddress = useGlobalState((state) => state.walletAddress);
+  const ticker = useGlobalState((state) => state.ticker);
+
+  const { data: delegateStakes } = useDelegateStakes(walletAddress?.toString());
+
+  const [targetGateway, setTargetGateway] = useState<AoGatewayWithAddress>();
+  const [targetGatewayCurrentStake, setTargetGatewayCurrentStake] =
+    useState<number>();
+
+  const [amountToRedelegate, setAmountToRedelegate] = useState<string>('');
+  const [errorMessage, setErrorMessage] = useState<string>();
+  const [isFormValid, setIsFormValid] = useState<boolean>(false);
+
+  const [showReviewRedelegateModal, setShowReviewRedelegateModal] =
+    useState(false);
+
+  const { data: redelegationFee } = useRedelegationFee(
+    walletAddress?.toString(),
+  );
+
+  const { data: gateways } = useGateways();
+  const [filteredGateways, setFilteredGateways] =
+    useState<AoGatewayWithAddress[]>();
+
+  useEffect(() => {
+    if (gateways) {
+      const filteredGateways = Object.entries(gateways)
+        .map(([address, gateway]) => {
+          return { ...gateway, gatewayAddress: address };
+        })
+        .filter(
+          (gateway) =>
+            gateway.status === 'joined' &&
+            gateway.settings.allowDelegatedStaking &&
+            gateway.gatewayAddress !== sourceGateway.gatewayAddress,
+        );
+      setFilteredGateways(filteredGateways);
+    }
+  }, [gateways, sourceGateway.gatewayAddress]);
+
+  useEffect(() => {
+    if (targetGateway && walletAddress) {
+      if (targetGateway.gatewayAddress === walletAddress.toString()) {
+        setTargetGatewayCurrentStake(
+          new mARIOToken(targetGateway.operatorStake).toARIO().valueOf(),
+        );
+      } else if (delegateStakes) {
+        const stake = delegateStakes.stakes.find(
+          (stake) => stake.gatewayAddress === targetGateway.gatewayAddress,
+        )?.balance;
+        setTargetGatewayCurrentStake(
+          new mARIOToken(stake ?? 0).toARIO().valueOf(),
+        );
+      }
+    }
+  }, [targetGateway, delegateStakes, walletAddress]);
+
+  const minDelegatedStake = targetGateway
+    ? new mARIOToken(targetGateway?.settings.minDelegatedStake)
+        .toARIO()
+        .valueOf()
+    : 10;
+  const minRequiredStakeToAdd =
+    (targetGatewayCurrentStake ?? 0) > 0 ? 1 : minDelegatedStake;
+
+  const validators = useMemo(
+    () => ({
+      redelegationAmount: validateARIOAmount(
+        'Redelegation Amount',
+        ticker,
+        minRequiredStakeToAdd,
+        maxRedelegationStake.valueOf(),
+      ),
+    }),
+    [ticker, minRequiredStakeToAdd, maxRedelegationStake],
+  );
+
+  useEffect(() => {
+    if (!targetGateway) {
+      setIsFormValid(false);
+      return;
+    }
+
+    const amount = parseFloat(amountToRedelegate);
+    const maxStake = maxRedelegationStake.valueOf();
+
+    const sourceMinStakeARIO = new mARIOToken(
+      sourceGateway.settings.minDelegatedStake,
+    )
+      .toARIO()
+      .valueOf();
+
+    if (
+      // checking if redelegation source is from a stake rather than a vault
+      vaultId === undefined &&
+      amount != maxStake &&
+      maxStake - amount < sourceMinStakeARIO
+    ) {
+      setErrorMessage(
+        `Amount to redelegate must either leave enough stake to meet the source gateway's minimum delegated stake (${formatWithCommas(sourceMinStakeARIO)} ${ticker}) or move the entire stake completely.`,
+      );
+      setIsFormValid(false);
+      return;
+    }
+
+    const redelegationAmountError =
+      validators.redelegationAmount(amountToRedelegate);
+
+    if (redelegationAmountError !== undefined) {
+      setErrorMessage(redelegationAmountError);
+      setIsFormValid(false);
+      return;
+    }
+
+    if (maxStake < minRequiredStakeToAdd) {
+      setErrorMessage(
+        `Insufficient redelegation balance, at least ${minRequiredStakeToAdd} IO required for target gateway.`,
+      );
+      setIsFormValid(false);
+      return;
+    }
+
+    setErrorMessage(undefined);
+    setIsFormValid(true);
+  }, [
+    amountToRedelegate,
+    maxRedelegationStake,
+    minRequiredStakeToAdd,
+    sourceGateway.settings.minDelegatedStake,
+    targetGateway,
+    ticker,
+    validators,
+    vaultId,
+  ]);
+
+  const fee = useMemo(() => {
+    if (redelegationFee && amountToRedelegate && isFormValid) {
+      const feeAmount =
+        (redelegationFee.redelegationFeeRate / 100) *
+        parseFloat(amountToRedelegate);
+      return feeAmount;
+    }
+    return 0;
+  }, [redelegationFee, amountToRedelegate, isFormValid]);
+
+  const totalRedelegatedStake = parseFloat(amountToRedelegate) - fee;
+  const newTotalStake =
+    (targetGatewayCurrentStake ?? 0) + totalRedelegatedStake;
+
+  const parsedStake = parseFloat(
+    amountToRedelegate.length === 0 ? '0' : amountToRedelegate,
+  );
+  const remainingBalance =
+    parsedStake <= maxRedelegationStake.valueOf()
+      ? maxRedelegationStake.valueOf() - parsedStake
+      : -1;
+
+  const setMaxAmount = () => {
+    setAmountToRedelegate(maxRedelegationStake + '');
+  };
+
+  const disableInput =
+    !targetGateway || maxRedelegationStake.valueOf() < minRequiredStakeToAdd;
+
+  return (
+    <BaseModal onClose={onClose} useDefaultPadding={false}>
+      <div className="w-[28.5rem]">
+        <div className="border-b border-b-stroke-low">
+          <div className="rounded-tr-xl border-b border-red-400 bg-grey-700 py-3 text-center">
+            <span className={'text-gradient'}>Redelegate</span>
+          </div>
+        </div>
+        <div className="flex flex-col p-8 pb-2">
+          <div className="flex flex-col gap-2">
+            <div className="mb-1">
+              <GatewaySelector
+                selectedGateway={targetGateway}
+                setSelectedGateway={setTargetGateway}
+                gateways={filteredGateways}
+              />
+            </div>
+
+            <LabelValueRow
+              label="Label:"
+              value={targetGateway ? targetGateway.settings.label : '-'}
+            />
+
+            <LabelValueRow
+              label="Domain:"
+              isLink={true}
+              value={targetGateway ? targetGateway.settings.fqdn : '-'}
+            />
+
+            <LabelValueRow
+              label="Current Stake:"
+              value={`${targetGatewayCurrentStake ? formatWithCommas(targetGatewayCurrentStake) : '0'} ${ticker}`}
+            />
+          </div>
+
+          <div className="mt-8 flex items-center">
+            <div className="text-left text-sm text-mid">Amount:</div>
+            <div className="grow"></div>
+            <div className="text-left text-xs text-low">
+              {`Available: ${
+                remainingBalance >= 0
+                  ? formatWithCommas(+remainingBalance)
+                  : '-'
+              } ${ticker}`}
+            </div>
+          </div>
+          <div className="mt-3 flex h-[3.25rem] items-center overflow-hidden rounded-md border border-grey-800">
+            <input
+              className={
+                'size-full grow  bg-grey-1000 px-6 py-3 text-sm text-mid outline-none placeholder:text-grey-400 focus:text-high'
+              }
+              disabled={disableInput}
+              readOnly={disableInput}
+              type="text"
+              placeholder={`Enter amount of ${ticker} to stake`}
+              value={amountToRedelegate}
+              onChange={(e) => {
+                const textValue = e.target.value;
+
+                if (textValue && isNaN(+e.target.value)) {
+                  return;
+                }
+
+                setAmountToRedelegate(textValue);
+              }}
+            />
+            {targetGateway &&
+              (amountToRedelegate?.length > 0 ||
+                maxRedelegationStake.valueOf() < minRequiredStakeToAdd) &&
+              errorMessage && (
+                <ErrorMessageIcon
+                  errorMessage={errorMessage}
+                  tooltipPadding={'3'}
+                />
+              )}
+            <Button
+              className="mr-3 max-h-7"
+              onClick={disableInput ? undefined : setMaxAmount}
+              buttonType={ButtonType.SECONDARY}
+              active={true}
+              title="Max"
+              text="Max"
+            />
+          </div>
+        </div>
+        <div className="flex size-full flex-col gap-2 bg-containerL0 px-8 pb-8 pt-4">
+          <div className="flex flex-col gap-2">
+            {fee > 0 && (
+              <LabelValueRow
+                label="Fee:"
+                value={`${fee} ${ticker}`}
+                rightIcon={
+                  <Tooltip
+                    message={
+                      <div>
+                        <p>
+                          {REDELEGATION_FEE_TOOLTIP_TEXT} 
+                        </p>
+                      </div>
+                    }
+                  >
+                    <InfoIcon className="size-[1.125rem]" />
+                  </Tooltip>
+                }
+              />
+            )}
+
+            <LabelValueRow
+              label="Total Redelegated Stake:"
+              value={`${isFormValid ? formatWithCommas(totalRedelegatedStake) : '-'} ${ticker}`}
+            />
+
+            <LabelValueRow
+              label="New Total Stake:"
+              value={`${
+                isFormValid ? formatWithCommas(newTotalStake) : '-'
+              } ${ticker}`}
+            />
+          </div>
+          <div
+            className={
+              isFormValid ? undefined : 'pointer-events-none opacity-30'
+            }
+          >
+            <Button
+              className="mt-4 h-[3.25rem] w-full"
+              onClick={() => {
+                setShowReviewRedelegateModal(true);
+              }}
+              buttonType={ButtonType.PRIMARY}
+              title="Review"
+              text="Review"
+            />
+          </div>
+        </div>
+        {showReviewRedelegateModal && targetGateway && walletAddress && (
+          <ReviewRedelegateModal
+            amountToRedelegate={new ARIOToken(parseFloat(amountToRedelegate))}
+            fee={fee}
+            newTotalStake={newTotalStake}
+            sourceGateway={sourceGateway}
+            targetGateway={targetGateway}
+            onClose={() => setShowReviewRedelegateModal(false)}
+            onSuccess={() => onClose()}
+            ticker={ticker}
+            walletAddress={walletAddress}
+            vaultId={vaultId}
+          />
+        )}
+      </div>
+    </BaseModal>
+  );
+};
+
+export default RedelegateModal;
diff --git a/src/components/modals/ReviewRedelegateModal.tsx b/src/components/modals/ReviewRedelegateModal.tsx
new file mode 100644
index 00000000..1daba32c
--- /dev/null
+++ b/src/components/modals/ReviewRedelegateModal.tsx
@@ -0,0 +1,252 @@
+import { AoGatewayWithAddress, ARIOToken } from '@ar.io/sdk/web';
+import {
+  log,
+  REDELEGATION_FEE_TOOLTIP_TEXT,
+  WRITE_OPTIONS,
+} from '@src/constants';
+import useRedelegationFee from '@src/hooks/useRedelegationFee';
+import { useGlobalState } from '@src/store';
+import { formatAddress, formatWithCommas } from '@src/utils';
+import { ArweaveTransactionID } from '@src/utils/ArweaveTransactionId';
+import { showErrorToast } from '@src/utils/toast';
+import { useQueryClient } from '@tanstack/react-query';
+import { InfoIcon } from 'lucide-react';
+import { useState } from 'react';
+import Button, { ButtonType } from '../Button';
+import { LinkArrowIcon } from '../icons';
+import LabelValueRow from '../LabelValueRow';
+import Tooltip from '../Tooltip';
+import BaseModal from './BaseModal';
+import BlockingMessageModal from './BlockingMessageModal';
+import SuccessModal from './SuccessModal';
+import WithdrawWarning from './WithdrawWarning';
+
+type ReviewRedelegateModalProps = {
+  sourceGateway: AoGatewayWithAddress;
+  targetGateway: AoGatewayWithAddress;
+  amountToRedelegate: ARIOToken;
+  fee: number;
+  newTotalStake: number;
+  walletAddress: ArweaveTransactionID;
+  vaultId?: string;
+  onClose: () => void;
+  onSuccess: () => void;
+  ticker: string;
+};
+
+const ReviewRedelegateModal = ({
+  sourceGateway,
+  targetGateway,
+  amountToRedelegate,
+  vaultId,
+  fee,
+  newTotalStake,
+  onSuccess,
+  onClose,
+  walletAddress,
+  ticker,
+}: ReviewRedelegateModalProps) => {
+  const queryClient = useQueryClient();
+  const arIOWriteableSDK = useGlobalState((state) => state.arIOWriteableSDK);
+
+  const [txid, setTxid] = useState<string>();
+
+  const [showBlockingMessageModal, setShowBlockingMessageModal] =
+    useState(false);
+  const [showSuccessModal, setShowSuccessModal] = useState(false);
+
+  const { data: redelegationFee } = useRedelegationFee();
+
+  const totalRedelegatedStake = amountToRedelegate.valueOf() - fee;
+
+  const submitForm = async () => {
+    if (arIOWriteableSDK) {
+      setShowBlockingMessageModal(true);
+
+      try {
+        const { id: txID } = await arIOWriteableSDK.redelegateStake(
+          {
+            source: sourceGateway.gatewayAddress,
+            target: targetGateway.gatewayAddress,
+            stakeQty: amountToRedelegate.toMARIO(),
+            vaultId,
+          },
+          WRITE_OPTIONS,
+        );
+
+        setTxid(txID);
+
+        log.info(`Redelegate Stake txID: ${txID}`);
+
+        queryClient.invalidateQueries({
+          queryKey: ['gateway', walletAddress.toString()],
+          refetchType: 'all',
+        });
+        queryClient.invalidateQueries({
+          queryKey: ['gateways'],
+          refetchType: 'all',
+        });
+        queryClient.invalidateQueries({
+          queryKey: ['balances'],
+          refetchType: 'all',
+        });
+        queryClient.invalidateQueries({
+          queryKey: ['delegateStakes'],
+          refetchType: 'all',
+        });
+        queryClient.invalidateQueries({
+          queryKey: ['gatewayVaults'],
+          refetchType: 'all',
+        });
+
+        setShowSuccessModal(true);
+      } catch (e: any) {
+        showErrorToast(`${e}`);
+      } finally {
+        setShowBlockingMessageModal(false);
+      }
+    }
+  };
+
+  return (
+    <>
+      <BaseModal
+        onClose={onClose}
+        useDefaultPadding={false}
+        showCloseButton={false}
+      >
+        <div className="w-[28.5rem]">
+          <div className="text-gradient rounded-t-xl border-b border-b-stroke-low bg-containerL3 p-4">
+            Review
+          </div>
+          <div className="flex flex-col gap-2 p-8">
+            <LabelValueRow
+              label="Source Gateway Owner:"
+              value={formatAddress(sourceGateway.gatewayAddress)}
+            />
+
+            <LabelValueRow
+              label="Label:"
+              value={sourceGateway.settings.label}
+            />
+
+            <LabelValueRow
+              label="Domain:"
+              isLink={true}
+              value={sourceGateway.settings.fqdn}
+            />
+
+            <div className="h-6"></div>
+
+            <LabelValueRow
+              label="Target Gateway Owner:"
+              value={formatAddress(targetGateway.gatewayAddress)}
+            />
+
+            <LabelValueRow
+              label="Label:"
+              value={targetGateway.settings.label}
+            />
+
+            <LabelValueRow
+              label="Domain:"
+              isLink={true}
+              value={targetGateway.settings.fqdn}
+            />
+
+            <div className="h-6"></div>
+
+            <LabelValueRow
+              label="Amount:"
+              value={`${formatWithCommas(amountToRedelegate.valueOf())} ${ticker}`}
+            />
+
+            {fee > 0 && (
+              <LabelValueRow
+                label="Fee:"
+                value={`${fee > 0 && fee} ${redelegationFee ? `(-${redelegationFee.redelegationFeeRate}%)` : ''} ${ticker}`}
+                rightIcon={
+                  <Tooltip
+                    message={
+                      <div>
+                        <p>{REDELEGATION_FEE_TOOLTIP_TEXT}</p>
+                      </div>
+                    }
+                  >
+                    <InfoIcon className="size-[1.125rem]" />
+                  </Tooltip>
+                }
+              />
+            )}
+
+            <LabelValueRow
+              label="Total Redelegated Stake:"
+              value={`${formatWithCommas(totalRedelegatedStake)} ${ticker}`}
+            />
+
+            <LabelValueRow
+              label="New Total Stake:"
+              value={`${formatWithCommas(newTotalStake)} ${ticker}`}
+            />
+          </div>
+
+          <div className="px-8 pb-6 text-left">
+            <WithdrawWarning />
+          </div>
+
+          <div className="flex size-full flex-col bg-containerL0 px-8 pb-2 pt-6">
+            <Button
+              className="h-[3.25rem] w-full"
+              onClick={submitForm}
+              buttonType={ButtonType.PRIMARY}
+              title={`Redelegate ${ticker}`}
+              text={`Redelegate ${ticker}`}
+            />
+            <div>
+              <button className="h-[3.25rem] p-4 text-sm" onClick={onClose}>
+                Back
+              </button>
+            </div>
+          </div>
+        </div>
+      </BaseModal>
+
+      {showBlockingMessageModal && (
+        <BlockingMessageModal
+          onClose={() => setShowBlockingMessageModal(false)}
+          message="Sign the following data with your wallet to proceed."
+        ></BlockingMessageModal>
+      )}
+      {showSuccessModal && (
+        <SuccessModal
+          onClose={() => {
+            setShowSuccessModal(false);
+            onClose();
+            onSuccess();
+          }}
+          title="Congratulations"
+          bodyText={
+            <div className="mb-8 text-sm text-mid">
+              <div>You have successfully redelegated your stake.</div>
+              <div className="my-2 flex flex-col justify-center gap-2">
+                <div>Transaction ID:</div>
+                <button
+                  className="flex items-center justify-center"
+                  title="View transaction on ao.link"
+                  onClick={async () => {
+                    window.open(`https://ao.link/#/message/${txid}`, '_blank');
+                  }}
+                >
+                  {txid}
+                  <LinkArrowIcon className="ml-1 size-3" />
+                </button>
+              </div>
+            </div>
+          }
+        />
+      )}
+    </>
+  );
+};
+
+export default ReviewRedelegateModal;
diff --git a/src/components/modals/ReviewStakeModal.tsx b/src/components/modals/ReviewStakeModal.tsx
index 8becf4e8..fb9bf1f1 100644
--- a/src/components/modals/ReviewStakeModal.tsx
+++ b/src/components/modals/ReviewStakeModal.tsx
@@ -1,4 +1,4 @@
-import { AoGatewayWithAddress, IOToken } from '@ar.io/sdk/web';
+import { AoGatewayWithAddress, ARIOToken } from '@ar.io/sdk/web';
 import { log, WRITE_OPTIONS } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { formatAddress, formatWithCommas } from '@src/utils';
@@ -46,7 +46,7 @@ const ReviewStakeModal = ({
         if(gateway.gatewayAddress === walletAddress.toString()) {
         const { id: txID } = await arIOWriteableSDK.increaseOperatorStake(
           {
-            increaseQty: new IOToken(amountToStake).toMIO(),
+            increaseQty: new ARIOToken(amountToStake).toMARIO(),
           },
           WRITE_OPTIONS,
         );
@@ -58,7 +58,7 @@ const ReviewStakeModal = ({
         const { id: txID } = await arIOWriteableSDK.delegateStake(
           {
             target: gateway.gatewayAddress,
-            stakeQty: new IOToken(amountToStake).toMIO(),
+            stakeQty: new ARIOToken(amountToStake).toMARIO(),
           },
           WRITE_OPTIONS,
         );
diff --git a/src/components/modals/ReviewWithdrawalModal.tsx b/src/components/modals/ReviewWithdrawalModal.tsx
index 63706d2a..7e319c08 100644
--- a/src/components/modals/ReviewWithdrawalModal.tsx
+++ b/src/components/modals/ReviewWithdrawalModal.tsx
@@ -1,4 +1,4 @@
-import { AoGatewayWithAddress, IOToken } from '@ar.io/sdk/web';
+import { AoGatewayWithAddress, ARIOToken } from '@ar.io/sdk/web';
 import { log, WRITE_OPTIONS } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { WithdrawalType } from '@src/types';
@@ -69,7 +69,7 @@ const ReviewWithdrawalModal = ({
         if (gateway.gatewayAddress === walletAddress.toString()) {
           const { id: txID } = await arIOWriteableSDK.decreaseOperatorStake(
             {
-              decreaseQty: new IOToken(amountToWithdraw).toMIO(),
+              decreaseQty: new ARIOToken(amountToWithdraw).toMARIO(),
               instant,
             },
             WRITE_OPTIONS,
@@ -81,7 +81,7 @@ const ReviewWithdrawalModal = ({
           const { id: txID } = await arIOWriteableSDK.decreaseDelegateStake(
             {
               target: gateway.gatewayAddress,
-              decreaseQty: new IOToken(amountToWithdraw).toMIO(),
+              decreaseQty: new ARIOToken(amountToWithdraw).toMARIO(),
               instant,
             },
             WRITE_OPTIONS,
diff --git a/src/components/modals/StakeWithdrawalModal.tsx b/src/components/modals/StakeWithdrawalModal.tsx
new file mode 100644
index 00000000..5c7d3c91
--- /dev/null
+++ b/src/components/modals/StakeWithdrawalModal.tsx
@@ -0,0 +1,280 @@
+import { mARIOToken } from '@ar.io/sdk/web';
+import { Label, Radio, RadioGroup } from '@headlessui/react';
+import useBalances from '@src/hooks/useBalances';
+import useDelegateStakes from '@src/hooks/useDelegateStakes';
+import useGateway from '@src/hooks/useGateway';
+import { useGlobalState } from '@src/store';
+import { WithdrawalType } from '@src/types';
+import { formatAddress, formatWithCommas } from '@src/utils';
+import { useEffect, useState } from 'react';
+import Button, { ButtonType } from '../Button';
+import LabelValueRow from '../LabelValueRow';
+import ErrorMessageIcon from '../forms/ErrorMessageIcon';
+import { validateWithdrawAmount } from '../forms/validation';
+import { CircleCheckIcon, CircleIcon } from '../icons';
+import BaseModal from './BaseModal';
+import ReviewWithdrawalModal from './ReviewWithdrawalModal';
+
+const StakeWithdrawalModal = ({
+  onClose,
+  ownerWallet,
+}: {
+  open: boolean;
+  onClose: () => void;
+  ownerWallet: string;
+}) => {
+  const walletAddress = useGlobalState((state) => state.walletAddress);
+  const { data: balances } = useBalances(walletAddress);
+  const ticker = useGlobalState((state) => state.ticker);
+
+  const [currentStake, setCurrentStake] = useState<number>(0);
+  const [amountToWithdraw, setAmountToWithdraw] = useState<string>('');
+  const [withdrawalType, setWithdrawalType] =
+    useState<WithdrawalType>('standard');
+
+  const [showReviewWithdrawalModal, setShowReviewWithdrawalModal] =
+    useState(false);
+
+  const { data: gateway } = useGateway({
+    ownerWalletAddress: ownerWallet,
+  });
+
+  const { data: delegateStakes } = useDelegateStakes(walletAddress?.toString());
+
+  useEffect(() => {
+    if (!gateway || !delegateStakes) {
+      return;
+    }
+    const stake = delegateStakes.stakes.find(
+      (stake) => stake.gatewayAddress === gateway.gatewayAddress,
+    )?.balance;
+    setCurrentStake(new mARIOToken(stake ?? 0).toARIO().valueOf());
+  }, [delegateStakes, gateway]);
+
+  const allowDelegatedStaking =
+    gateway?.settings.allowDelegatedStaking ?? false;
+
+  const minDelegatedStake = gateway
+    ? new mARIOToken(gateway?.settings.minDelegatedStake).toARIO().valueOf()
+    : 10;
+  const minRequiredStakeToAdd = currentStake > 0 ? 1 : minDelegatedStake;
+
+  const withdrawalFee =
+    withdrawalType === 'expedited' ? 0.5 * parseFloat(amountToWithdraw) : 0;
+  const returningAmount = isNaN(parseFloat(amountToWithdraw))
+    ? '-'
+    : +(
+        isNaN(withdrawalFee)
+          ? parseFloat(amountToWithdraw)
+          : parseFloat(amountToWithdraw) - withdrawalFee
+      ).toFixed(4);
+
+  const validators = {
+    withdrawAmount: validateWithdrawAmount(
+      'Withdraw Amount',
+      ticker,
+      currentStake,
+      minDelegatedStake,
+    ),
+  };
+
+  const isFormValid = () => {
+    if (!gateway) {
+      return false;
+    }
+    return validators.withdrawAmount(amountToWithdraw) == undefined;
+  };
+
+  const parsedWithdrawing = parseFloat(
+    amountToWithdraw.length === 0 ? '0' : amountToWithdraw,
+  );
+  const remainingWithdrawalBalance = currentStake - parsedWithdrawing;
+
+  const setMaxAmount = () => {
+    setAmountToWithdraw(currentStake + '');
+  };
+
+  const disableInput = !gateway || currentStake <= 0;
+
+  const errorMessages = {
+    withdrawAmount: validators.withdrawAmount(amountToWithdraw),
+    cannotStake:
+      (balances?.io || 0) < minRequiredStakeToAdd
+        ? `Insufficient balance, at least ${minRequiredStakeToAdd} IO required.`
+        : !allowDelegatedStaking
+          ? 'Gateway does not allow delegated staking.'
+          : undefined,
+  };
+
+  return (
+    <BaseModal onClose={onClose} useDefaultPadding={false}>
+      <div className="w-[28.5rem]">
+        <div className="border-b border-b-stroke-low">
+          <div className="rounded-tr-xl border-b border-red-400 bg-grey-700 py-3 text-center">
+            <span className={'text-gradient'}>Withdraw</span>
+          </div>
+        </div>
+        <div className="flex flex-col p-8 pb-2">
+          <div className="flex flex-col gap-2">
+            <LabelValueRow
+              label="Gateway Owner:"
+              value={formatAddress(ownerWallet)}
+            />
+            <LabelValueRow
+              label="Label:"
+              value={gateway ? gateway.settings.label : '-'}
+            />
+            <LabelValueRow
+              label="Domain:"
+              isLink={true}
+              value={gateway ? gateway.settings.fqdn : '-'}
+            />
+          </div>
+
+          <div className="mt-8 flex items-center">
+            <div className="text-left text-sm text-mid">Amount:</div>
+            <div className="grow"></div>
+            <div className="text-left text-xs text-low">
+              {`Available to Withdraw: ${remainingWithdrawalBalance >= 0 ? formatWithCommas(remainingWithdrawalBalance) : '-'} ${ticker}`}
+            </div>
+          </div>
+          <div className="mt-3 flex h-[3.25rem] items-center overflow-hidden rounded-md border border-grey-800">
+            <input
+              className={
+                'size-full grow  bg-grey-1000 px-6 py-3 text-sm text-mid outline-none placeholder:text-grey-400 focus:text-high'
+              }
+              disabled={disableInput}
+              readOnly={disableInput}
+              type="text"
+              placeholder={`Enter amount of ${ticker} to withdraw`}
+              value={amountToWithdraw}
+              onChange={(e) => {
+                const textValue = e.target.value;
+
+                if (textValue && isNaN(+e.target.value)) {
+                  return;
+                }
+
+                setAmountToWithdraw(textValue);
+              }}
+            />
+            {amountToWithdraw?.length > 0 && errorMessages.withdrawAmount && (
+              <ErrorMessageIcon
+                errorMessage={errorMessages.withdrawAmount}
+                tooltipPadding={'3'}
+              />
+            )}
+            <Button
+              className="mr-3 h-7"
+              onClick={disableInput ? undefined : setMaxAmount}
+              buttonType={ButtonType.SECONDARY}
+              active={true}
+              title="Max"
+              text="Max"
+            />
+          </div>
+          <div className="mt-4 flex flex-col gap-2">
+            <RadioGroup
+              className="my-2 flex flex-col gap-4 text-sm"
+              value={withdrawalType}
+              onChange={(v) => setWithdrawalType(v)}
+            >
+              <Radio
+                value="standard"
+                className="group flex w-full cursor-pointer rounded 
+                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
+              >
+                <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
+                  <div className="flex items-center gap-2">
+                    <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
+                    <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
+                    <Label>Standard Withdrawal</Label>
+                  </div>
+                  <p className="pl-6 text-left text-xs text-mid">
+                    90 day withdrawal period with no fees.
+                  </p>
+                </div>
+              </Radio>
+
+              <Radio
+                value="expedited"
+                className="group flex w-full cursor-pointer rounded 
+                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
+              >
+                <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
+                  <div className="flex items-center gap-2">
+                    <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
+                    <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
+                    <Label>Expedited Withdrawal</Label>
+                  </div>
+                  <p className="pl-6 text-left text-xs text-mid">
+                    Instant withdrawal with 50% fee.
+                  </p>
+                </div>
+              </Radio>
+            </RadioGroup>
+          </div>
+        </div>
+        <div className="flex size-full flex-col gap-2 bg-containerL0 px-8 pb-8 pt-4">
+          {withdrawalType == 'expedited' && (
+            <>
+              <LabelValueRow
+                className="first:text-mid last:text-mid"
+                label="Fee:"
+                value={`${isNaN(withdrawalFee) ? '-' : +withdrawalFee.toFixed(4)} ${ticker}`}
+              />
+              <LabelValueRow
+                className="first:text-mid last:text-mid"
+                label="Returning Amount:"
+                value={`${returningAmount} ${ticker}`}
+              />
+            </>
+          )}
+
+          <div className="flex flex-col gap-2">
+            <LabelValueRow
+              label="New Total Stake:"
+              value={`${
+                isFormValid()
+                  ? formatWithCommas(
+                      currentStake - parseFloat(amountToWithdraw),
+                    )
+                  : '-'
+              } ${ticker}`}
+            />
+          </div>
+          <div
+            className={
+              isFormValid() ? undefined : 'pointer-events-none opacity-30'
+            }
+          >
+            <Button
+              className="mt-4 h-[3.25rem] w-full"
+              onClick={() => {
+                setShowReviewWithdrawalModal(true);
+              }}
+              buttonType={ButtonType.PRIMARY}
+              title="Review"
+              text="Review"
+            />
+          </div>
+        </div>
+        {showReviewWithdrawalModal && gateway && walletAddress && (
+          <ReviewWithdrawalModal
+            amountToWithdraw={parseFloat(amountToWithdraw)}
+            withdrawalType={withdrawalType}
+            gateway={gateway}
+            onClose={() => setShowReviewWithdrawalModal(false)}
+            onSuccess={() => onClose()}
+            ticker={ticker}
+            walletAddress={walletAddress}
+            withdrawalFee={withdrawalFee}
+            returningAmount={returningAmount}
+          />
+        )}
+      </div>
+    </BaseModal>
+  );
+};
+
+export default StakeWithdrawalModal;
diff --git a/src/components/modals/StakingModal.tsx b/src/components/modals/StakingModal.tsx
index c8c0287f..b5ca448e 100644
--- a/src/components/modals/StakingModal.tsx
+++ b/src/components/modals/StakingModal.tsx
@@ -1,12 +1,10 @@
-import { mIOToken } from '@ar.io/sdk/web';
-import { Label, Radio, RadioGroup } from '@headlessui/react';
+import { mARIOToken } from '@ar.io/sdk/web';
 import { EAY_TOOLTIP_FORMULA, EAY_TOOLTIP_TEXT } from '@src/constants';
 import useBalances from '@src/hooks/useBalances';
 import useDelegateStakes from '@src/hooks/useDelegateStakes';
 import useGateway from '@src/hooks/useGateway';
 import useRewardsInfo from '@src/hooks/useRewardsInfo';
 import { useGlobalState } from '@src/store';
-import { WithdrawalType } from '@src/types';
 import { formatAddress, formatWithCommas } from '@src/utils';
 import { MathJax } from 'better-react-mathjax';
 import { useEffect, useState } from 'react';
@@ -14,15 +12,10 @@ import Button, { ButtonType } from '../Button';
 import LabelValueRow from '../LabelValueRow';
 import Tooltip from '../Tooltip';
 import ErrorMessageIcon from '../forms/ErrorMessageIcon';
-import {
-  validateIOAmount,
-  validateWalletAddress,
-  validateWithdrawAmount,
-} from '../forms/validation';
-import { CircleCheckIcon, CircleIcon, InfoIcon } from '../icons';
+import { validateARIOAmount, validateWalletAddress } from '../forms/validation';
+import { InfoIcon } from '../icons';
 import BaseModal from './BaseModal';
 import ReviewStakeModal from './ReviewStakeModal';
-import ReviewWithdrawalModal from './ReviewWithdrawalModal';
 
 const StakingModal = ({
   onClose,
@@ -30,31 +23,19 @@ const StakingModal = ({
 }: {
   open: boolean;
   onClose: () => void;
-  ownerWallet?: string;
+  ownerWallet: string;
 }) => {
   const walletAddress = useGlobalState((state) => state.walletAddress);
   const { data: balances } = useBalances(walletAddress);
   const ticker = useGlobalState((state) => state.ticker);
 
-  const [tab, setTab] = useState<number>(0);
-  const [userEnteredWalletAddress, setUserEnteredWalletAddress] =
-    useState<string>('');
-
   const [currentStake, setCurrentStake] = useState<number>(0);
   const [amountToStake, setAmountToStake] = useState<string>('');
-  const [amountToWithdraw, setAmountToWithdraw] = useState<string>('');
-  const [withdrawalType, setWithdrawalType] =
-    useState<WithdrawalType>('standard');
 
   const [showReviewStakeModal, setShowReviewStakeModal] = useState(false);
-  const [showReviewWithdrawalModal, setShowReviewWithdrawalModal] =
-    useState(false);
-
-  const gatewayOwnerWallet =
-    ownerWallet?.toString() ?? userEnteredWalletAddress;
 
   const { data: gateway } = useGateway({
-    ownerWalletAddress: gatewayOwnerWallet,
+    ownerWalletAddress: ownerWallet,
   });
 
   const { data: delegateStakes } = useDelegateStakes(walletAddress?.toString());
@@ -66,18 +47,14 @@ const StakingModal = ({
     const stake = delegateStakes.stakes.find(
       (stake) => stake.gatewayAddress === gateway.gatewayAddress,
     )?.balance;
-    setCurrentStake(new mIOToken(stake ?? 0).toIO().valueOf());
+    setCurrentStake(new mARIOToken(stake ?? 0).toARIO().valueOf());
   }, [delegateStakes, gateway]);
 
   const allowDelegatedStaking =
     gateway?.settings.allowDelegatedStaking ?? false;
 
-  const newTotalStake =
-    tab == 0
-      ? currentStake + parseFloat(amountToStake)
-      : currentStake - parseFloat(amountToWithdraw);
-  const newStake =
-    tab == 0 ? parseFloat(amountToStake) : -parseFloat(amountToWithdraw);
+  const newTotalStake = currentStake + parseFloat(amountToStake);
+  const newStake = parseFloat(amountToStake);
   const rewardsInfo = useRewardsInfo(gateway, newStake);
   const EAY =
     rewardsInfo && newTotalStake > 0 && !isNaN(rewardsInfo.EAY)
@@ -87,45 +64,25 @@ const StakingModal = ({
       : '-';
 
   const minDelegatedStake = gateway
-    ? new mIOToken(gateway?.settings.minDelegatedStake).toIO().valueOf()
+    ? new mARIOToken(gateway?.settings.minDelegatedStake).toARIO().valueOf()
     : 10;
   const minRequiredStakeToAdd = currentStake > 0 ? 1 : minDelegatedStake;
 
-  const withdrawalFee =
-    withdrawalType === 'expedited' ? 0.5 * parseFloat(amountToWithdraw) : 0;
-  const returningAmount = isNaN(parseFloat(amountToWithdraw))
-    ? '-'
-    : +(
-        isNaN(withdrawalFee)
-          ? parseFloat(amountToWithdraw)
-          : parseFloat(amountToWithdraw) - withdrawalFee
-      ).toFixed(4);
-
   const validators = {
     address: validateWalletAddress('Gateway Owner'),
-    stakeAmount: validateIOAmount(
+    stakeAmount: validateARIOAmount(
       'Stake Amount',
       ticker,
       minRequiredStakeToAdd,
       balances?.io,
     ),
-    withdrawAmount: validateWithdrawAmount(
-      'Withdraw Amount',
-      ticker,
-      currentStake,
-      minDelegatedStake,
-    ),
   };
 
   const isFormValid = () => {
-    if (!gateway || (tab == 0 && !allowDelegatedStaking)) {
+    if (!gateway || !allowDelegatedStaking) {
       return false;
     }
-    if (tab == 0) {
-      return validators.stakeAmount(amountToStake) == undefined;
-    } else {
-      return validators.withdrawAmount(amountToWithdraw) == undefined;
-    }
+    return validators.stakeAmount(amountToStake) == undefined;
   };
 
   const parsedStake = parseFloat(
@@ -134,32 +91,17 @@ const StakingModal = ({
   const remainingBalance =
     balances && parsedStake <= balances.io ? balances.io - parsedStake : -1;
 
-  const parsedWithdrawing = parseFloat(amountToWithdraw.length === 0 ? '0' : amountToWithdraw);
-  const remainingWithdrawalBalance = currentStake - parsedWithdrawing;
-
-  const baseTabClassName = 'text-center py-3';
-  const selectedTabClassNames = `${baseTabClassName} bg-grey-700 border-b border-red-400`;
-  const nonSelectedTabClassNames = `${baseTabClassName} bg-grey-1000 text-low`;
-
   const setMaxAmount = () => {
-    if (tab == 0) {
-      setAmountToStake((balances?.io || 0) + '');
-    } else {
-      setAmountToWithdraw(currentStake + '');
-    }
+    setAmountToStake((balances?.io || 0) + '');
   };
 
   const disableInput =
     !gateway ||
-    (tab == 0 &&
-      ((balances?.io || 0) < minRequiredStakeToAdd ||
-        !allowDelegatedStaking)) ||
-    (tab == 1 && currentStake <= 0);
+    (balances?.io || 0) < minRequiredStakeToAdd ||
+    !allowDelegatedStaking;
 
   const errorMessages = {
-    gatewayOwner: validators.address(gatewayOwnerWallet),
     stakeAmount: validators.stakeAmount(amountToStake),
-    withdrawAmount: validators.withdrawAmount(amountToWithdraw),
     cannotStake:
       (balances?.io || 0) < minRequiredStakeToAdd
         ? `Insufficient balance, at least ${minRequiredStakeToAdd} IO required.`
@@ -171,44 +113,17 @@ const StakingModal = ({
   return (
     <BaseModal onClose={onClose} useDefaultPadding={false}>
       <div className="w-[28.5rem]">
-        <div className="grid grid-cols-2 border-b border-b-stroke-low">
-          <button
-            className={`${tab == 0 ? selectedTabClassNames : nonSelectedTabClassNames} rounded-tl-xl`}
-            onClick={() => setTab(0)}
-          >
-            <span className={tab == 0 ? 'text-gradient' : ''}>Stake</span>
-          </button>
-          <button
-            className={`${tab == 1 ? selectedTabClassNames : nonSelectedTabClassNames} rounded-tr-xl`}
-            onClick={() => setTab(1)}
-          >
-            <span className={tab == 1 ? 'text-gradient' : ''}>Withdraw</span>
-          </button>
+        <div className="border-b border-b-stroke-low">
+          <div className="rounded-tr-xl border-b border-red-400 bg-grey-700 py-3 text-center">
+            <span className={'text-gradient'}>Stake</span>
+          </div>
         </div>
         <div className="flex flex-col p-8 pb-2">
           <div className="flex flex-col gap-2">
-            {ownerWallet ? (
-              <LabelValueRow
-                label="Gateway Owner:"
-                value={formatAddress(ownerWallet)}
-              />
-            ) : (
-              <>
-                <div className="text-left text-sm text-mid">Gateway Owner:</div>
-                <input
-                  className={
-                    'mb-2 size-full rounded-md border border-grey-800 bg-grey-1000 px-6 py-3 text-sm text-mid outline-none placeholder:text-grey-400 focus:text-high'
-                  }
-                  type="text"
-                  placeholder="Enter wallet address for Gateway"
-                  value={userEnteredWalletAddress}
-                  onChange={(e) => {
-                    setUserEnteredWalletAddress(e.target.value);
-                  }}
-                  maxLength={43}
-                />
-              </>
-            )}
+            <LabelValueRow
+              label="Gateway Owner:"
+              value={formatAddress(ownerWallet)}
+            />
 
             <LabelValueRow
               label="Label:"
@@ -226,10 +141,10 @@ const StakingModal = ({
             <div className="text-left text-sm text-mid">Amount:</div>
             <div className="grow"></div>
             <div className="text-left text-xs text-low">
-              {tab == 0
-                ? balances &&
-                  `Available: ${remainingBalance >= 0 ? formatWithCommas(+remainingBalance) : '-'} ${ticker}`
-                : `Available to Withdraw: ${remainingWithdrawalBalance >= 0 ? formatWithCommas(remainingWithdrawalBalance) : '-'} ${ticker}`}
+              {balances &&
+                `Available: ${remainingBalance >= 0
+                ? formatWithCommas(+remainingBalance)
+                : '-'} ${ticker}`}
             </div>
           </div>
           <div className="mt-3 flex h-[3.25rem] items-center overflow-hidden rounded-md border border-grey-800">
@@ -240,8 +155,8 @@ const StakingModal = ({
               disabled={disableInput}
               readOnly={disableInput}
               type="text"
-              placeholder={`Enter amount of ${ticker} to ${tab == 0 ? 'stake' : 'withdraw'}`}
-              value={tab == 0 ? amountToStake : amountToWithdraw}
+              placeholder={`Enter amount of ${ticker} to stake`}
+              value={amountToStake}
               onChange={(e) => {
                 const textValue = e.target.value;
 
@@ -249,15 +164,10 @@ const StakingModal = ({
                   return;
                 }
 
-                if (tab == 0) {
-                  setAmountToStake(textValue);
-                } else {
-                  setAmountToWithdraw(textValue);
-                }
+                setAmountToStake(textValue);
               }}
-            ></input>
-            {tab == 0 &&
-              gateway &&
+            />
+            {gateway &&
               (amountToStake?.length > 0 ||
                 (balances?.io || 0) < minRequiredStakeToAdd ||
                 !allowDelegatedStaking) &&
@@ -269,14 +179,6 @@ const StakingModal = ({
                   tooltipPadding={'3'}
                 />
               )}
-            {tab == 1 &&
-              amountToWithdraw?.length > 0 &&
-              errorMessages.withdrawAmount && (
-                <ErrorMessageIcon
-                  errorMessage={errorMessages.withdrawAmount}
-                  tooltipPadding={'3'}
-                />
-              )}
             <Button
               className="mr-3 h-7"
               onClick={disableInput ? undefined : setMaxAmount}
@@ -286,107 +188,39 @@ const StakingModal = ({
               text="Max"
             />
           </div>
-          <div className="mt-4 flex flex-col gap-2">
-            {tab == 1 && (
-              <RadioGroup
-                className="my-2 flex flex-col gap-4 text-sm"
-                value={withdrawalType}
-                onChange={(v) => setWithdrawalType(v)}
-              >
-                <Radio
-                  value="standard"
-                  className="group flex w-full cursor-pointer rounded 
-                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
-                >
-                  <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
-                    <div className="flex items-center gap-2">
-                      <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
-                      <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
-                      <Label>Standard Withdrawal</Label>
-                    </div>
-                    <p className="pl-6 text-left text-xs text-mid">
-                      30 day withdrawal period with no fees.
-                    </p>
-                  </div>
-                </Radio>
-
-                <Radio
-                  value="expedited"
-                  className="group flex w-full cursor-pointer rounded 
-                  from-gradient-primary-start to-gradient-primary-end data-[checked]:bg-gradient-to-r"
-                >
-                  <div className="m-px flex size-full flex-col gap-1 rounded  bg-containerL3 px-4 py-2">
-                    <div className="flex items-center gap-2">
-                      <CircleIcon className="visible size-4 group-data-[checked]:hidden" />
-                      <CircleCheckIcon className="hidden size-4 group-data-[checked]:block" />
-                      <Label>Expedited Withdrawal</Label>
-                    </div>
-                    <p className="pl-6 text-left text-xs text-mid">
-                      Instant withdrawal with 50% fee.
-                    </p>
-                  </div>
-                </Radio>
-              </RadioGroup>
-            )}
-          </div>
         </div>
         <div className="flex size-full flex-col gap-2 bg-containerL0 px-8 pb-8 pt-4">
-          {tab == 1 && withdrawalType == 'expedited' && (
-            <>
-              <LabelValueRow
-                className="first:text-mid last:text-mid"
-                label="Fee:"
-                value={`${isNaN(withdrawalFee) ? '-' : +withdrawalFee.toFixed(4)} ${ticker}`}
-              />
-              <LabelValueRow
-                className="first:text-mid last:text-mid"
-                label="Returning Amount:"
-                value={`${returningAmount} ${ticker}`}
-              />
-            </>
-          )}
-
           <div className="flex flex-col gap-2">
-            {tab == 0 && (
-              <LabelValueRow
-                label="Existing Stake:"
-                value={`${currentStake} ${ticker}`}
-              />
-            )}
+            <LabelValueRow
+              label="Existing Stake:"
+              value={`${currentStake} ${ticker}`}
+            />
 
             <LabelValueRow
               label="New Total Stake:"
               value={`${
                 isFormValid()
-                  ? tab == 0
-                    ? formatWithCommas(currentStake + parseFloat(amountToStake))
-                    : formatWithCommas(
-                        currentStake - parseFloat(amountToWithdraw),
-                      )
+                  ? formatWithCommas(currentStake + parseFloat(amountToStake))
                   : '-'
               } ${ticker}`}
             />
 
-            {tab == 0 && (
-              <LabelValueRow
-                label="Delegate EAY:"
-                value={EAY}
-                rightIcon={
-                  <Tooltip
-                    message={
-                      <div>
-                        <p>{EAY_TOOLTIP_TEXT}</p>
-                        <MathJax className="mt-4">
-                          {EAY_TOOLTIP_FORMULA}
-                        </MathJax>
-                      </div>
-                    }
-                  >
-                    <InfoIcon className="size-[1.125rem]" />
-                  </Tooltip>
-                }
-              />
-            )}
+            <LabelValueRow
+              label="Delegate EAY:"
+              value={EAY}
+              rightIcon={
+                <Tooltip
+                  message={
+                    <div>
+                      <p>{EAY_TOOLTIP_TEXT}</p>
+                      <MathJax className="mt-4">{EAY_TOOLTIP_FORMULA}</MathJax>
+                    </div>
+                  }
+                >
+                  <InfoIcon className="size-[1.125rem]" />
+                </Tooltip>
+              }
+            />
           </div>
           <div
             className={
@@ -396,9 +230,7 @@ const StakingModal = ({
             <Button
               className="mt-4 h-[3.25rem] w-full"
               onClick={() => {
-                tab == 0
-                  ? setShowReviewStakeModal(true)
-                  : setShowReviewWithdrawalModal(true);
+                setShowReviewStakeModal(true);
               }}
               buttonType={ButtonType.PRIMARY}
               title="Review"
@@ -416,19 +248,6 @@ const StakingModal = ({
             walletAddress={walletAddress}
           />
         )}
-        {showReviewWithdrawalModal && gateway && walletAddress && (
-          <ReviewWithdrawalModal
-            amountToWithdraw={parseFloat(amountToWithdraw)}
-            withdrawalType={withdrawalType}
-            gateway={gateway}
-            onClose={() => setShowReviewWithdrawalModal(false)}
-            onSuccess={() => onClose()}
-            ticker={ticker}
-            walletAddress={walletAddress}
-            withdrawalFee={withdrawalFee}
-            returningAmount={returningAmount}
-          />
-        )}
       </div>
     </BaseModal>
   );
diff --git a/src/components/modals/StartGatewayModal.tsx b/src/components/modals/StartGatewayModal.tsx
index 179d2d0d..503d13c6 100644
--- a/src/components/modals/StartGatewayModal.tsx
+++ b/src/components/modals/StartGatewayModal.tsx
@@ -1,5 +1,5 @@
-import { IOToken } from '@ar.io/sdk/web';
-import { WRITE_OPTIONS, log } from '@src/constants';
+import { ARIOToken } from '@ar.io/sdk/web';
+import { GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO, WRITE_OPTIONS, log } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { showErrorToast } from '@src/utils/toast';
 import { useQueryClient } from '@tanstack/react-query';
@@ -9,7 +9,7 @@ import FormRow, { RowType } from '../forms/FormRow';
 import { FormRowDef, isFormValid } from '../forms/formData';
 import {
   validateDomainName,
-  validateIOAmount,
+  validateARIOAmount,
   validateNumberRange,
   validateString,
   validateTransactionId,
@@ -91,8 +91,8 @@ const StartGatewayModal = ({ onClose }: { onClose: () => void }) => {
     {
       formPropertyName: 'stake',
       label: `*Stake (${ticker}):`,
-      placeholder: `Minimum 10000 ${ticker}`,
-      validateProperty: validateIOAmount('Stake', ticker, 10000),
+      placeholder: `Minimum ${GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO} ${ticker}`,
+      validateProperty: validateARIOAmount('Stake', ticker, GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO),
     },
     {
       formPropertyName: 'allowDelegatedStaking',
@@ -105,7 +105,7 @@ const StartGatewayModal = ({ onClose }: { onClose: () => void }) => {
       placeholder: allowDelegatedStaking
         ? `Minimum 10 ${ticker}`
         : 'Enable Delegated Staking to set this value.',
-      validateProperty: validateIOAmount('Minimum Delegated Stake', ticker, 10),
+      validateProperty: validateARIOAmount('Minimum Delegated Stake', ticker, 10),
     },
     {
       formPropertyName: 'delegatedStakingShareRatio',
@@ -149,15 +149,15 @@ const StartGatewayModal = ({ onClose }: { onClose: () => void }) => {
           delegateRewardShareRatio: allowDelegatedStaking
             ? parseFloat(String(formState.delegatedStakingShareRatio))
             : DEFAULT_DELEGATED_STAKING_REWARD_SHARE_RATIO,
-          minDelegatedStake: new IOToken(
+          minDelegatedStake: new ARIOToken(
             allowDelegatedStaking
               ? parseFloat(String(formState.minDelegatedStake))
               : DEFAULT_DELEGATED_STAKING,
-          ).toMIO().valueOf(),
+          ).toMARIO().valueOf(),
           autoStake: true,
-          operatorStake: new IOToken(
+          operatorStake: new ARIOToken(
             parseFloat(String(formState.stake)),
-          ).toMIO().valueOf(),
+          ).toMARIO().valueOf(),
         };
 
         // UNCOMMENT AND COMMENT OUT JOIN NETWORK FOR DEV WORK
diff --git a/src/components/modals/WithdrawAllModal.tsx b/src/components/modals/WithdrawAllModal.tsx
index 2933d112..a7a2eaf2 100644
--- a/src/components/modals/WithdrawAllModal.tsx
+++ b/src/components/modals/WithdrawAllModal.tsx
@@ -1,4 +1,4 @@
-import { AoGateway, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, mARIOToken } from '@ar.io/sdk/web';
 import { WRITE_OPTIONS, log } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { showErrorToast } from '@src/utils/toast';
@@ -108,7 +108,7 @@ const WithdrawAllModal = ({
                     </a>
                   </td>
                   <td className="py-2 text-right text-mid ">
-                    {new mIOToken(stake.delegatedStake).toIO().valueOf()}{' '}
+                    {new mARIOToken(stake.delegatedStake).toARIO().valueOf()}{' '}
                     {ticker}
                   </td>
                 </tr>
@@ -122,7 +122,7 @@ const WithdrawAllModal = ({
             <div className="mt-1 flex text-sm text-mid">
               <div className="grow">Total Withdrawal:</div>
               <div>
-                {new mIOToken(totalWithdrawalMIO).toIO().valueOf()} {ticker}
+                {new mARIOToken(totalWithdrawalMIO).toARIO().valueOf()} {ticker}
               </div>
             </div>
 
diff --git a/src/constants.ts b/src/constants.ts
index 846fa777..0ddd3876 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,4 +1,4 @@
-import { ioDevnetProcessId } from '@ar.io/sdk/web';
+import { arioDevnetProcessId } from '@ar.io/sdk/web';
 import * as loglevel from 'loglevel';
 
 import Ar from 'arweave/web/ar';
@@ -17,13 +17,12 @@ export const WRITE_OPTIONS = {
 };
 
 export const ARIO_DOCS_URL = 'https://docs.ar.io';
-export const IO_PROCESS_ID = new ArweaveTransactionID(
-  process.env.VITE_IO_PROCESS_ID ?? ioDevnetProcessId,
+export const ARIO_PROCESS_ID = new ArweaveTransactionID(
+  process.env.VITE_ARIO_PROCESS_ID ?? arioDevnetProcessId,
 );
-export const AO_CU_URL =
-  process.env.VITE_AO_CU_URL || 'https://cu.ao-testnet.xyz';
+export const AO_CU_URL = process.env.VITE_AO_CU_URL || 'https://cu.ardrive.io';
 
-export const IO_PROCESS_INFO_URL = `https://www.ao.link/#/entity/${IO_PROCESS_ID.toString()}`;
+export const IO_PROCESS_INFO_URL = `https://www.ao.link/#/entity/${ARIO_PROCESS_ID.toString()}`;
 
 export const DEFAULT_ARWEAVE_PROTOCOL =
   process.env.VITE_GATEWAY_PROTOCOL ?? 'https';
@@ -62,3 +61,8 @@ export const OPERATOR_EAY_TOOLTIP_FORMULA =
 export const NAME_PASS_THRESHOLD = 0.8;
 export const REFERENCE_GATEWAY_FQDN =
   process.env.VITE_REFERENCE_GATEWAY_FQDN ?? 'arweave.net';
+
+export const GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO = 10000;
+
+export const REDELEGATION_FEE_TOOLTIP_TEXT =
+  'Redelegation fees are assessed at 10% per redelegation performed since the last fee reset, up to 60%. Fees are reset when no redelegations are performed in the last 7 days.';
diff --git a/src/hooks/useBalances.ts b/src/hooks/useBalances.ts
index 5ad8fb13..4be49813 100644
--- a/src/hooks/useBalances.ts
+++ b/src/hooks/useBalances.ts
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import { AR } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { ArweaveTransactionID } from '@src/utils/ArweaveTransactionId';
@@ -26,7 +26,7 @@ const useBalances = (walletAddress?: ArweaveTransactionID) => {
       ]);
 
       const arBalance = +AR.winstonToAr(winstonBalance);
-      const ioBalance = new mIOToken(mioBalance).toIO().valueOf();
+      const ioBalance = new mARIOToken(mioBalance).toARIO().valueOf();
 
       return { ar: arBalance, io: ioBalance };
     },
diff --git a/src/hooks/useGatewayInfo.ts b/src/hooks/useGatewayInfo.ts
index b9ff6047..7f9b3b4b 100644
--- a/src/hooks/useGatewayInfo.ts
+++ b/src/hooks/useGatewayInfo.ts
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import { useGlobalState } from '@src/store';
 import { formatDateTime, formatWalletAddress, formatWithCommas } from '@src/utils';
 import useGateway from './useGateway';
@@ -29,7 +29,7 @@ export const useGatewayInfo = () => {
       ['Joined at', formatDateTime(new Date(gateway.startTimestamp))],
       [
         `Stake (${ticker})`,
-        formatWithCommas(new mIOToken(gateway.operatorStake).toIO().valueOf()),
+        formatWithCommas(new mARIOToken(gateway.operatorStake).toARIO().valueOf()),
       ],
       ['Status', gateway.status],
       ['Reward Ratio', gateway.settings.delegateRewardShareRatio],
diff --git a/src/hooks/useGateways.ts b/src/hooks/useGateways.ts
index feff484f..d8bf79fc 100644
--- a/src/hooks/useGateways.ts
+++ b/src/hooks/useGateways.ts
@@ -1,4 +1,4 @@
-import { AoGateway, AoIORead } from '@ar.io/sdk/web';
+import { AoGateway, AoARIORead } from '@ar.io/sdk/web';
 import { useGlobalState } from '@src/store';
 import { useQuery } from '@tanstack/react-query';
 
@@ -6,7 +6,7 @@ const useGateways = () => {
   const arIOReadSDK = useGlobalState((state) => state.arIOReadSDK);
 
   const fetchAllGateways = async (
-    arIOReadSDK: AoIORead,
+    arIOReadSDK: AoARIORead,
   ): Promise<Record<string, AoGateway>> => {
     let cursor: string | undefined;
     const gateways: Record<string, AoGateway> = {};
diff --git a/src/hooks/useOperatorRewards.ts b/src/hooks/useOperatorRewards.ts
index 3176c56b..cb202ac2 100644
--- a/src/hooks/useOperatorRewards.ts
+++ b/src/hooks/useOperatorRewards.ts
@@ -1,4 +1,4 @@
-import { AoGateway, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, mARIOToken } from '@ar.io/sdk/web';
 import { OperatorRewards, calculateOperatorRewards } from '@src/utils/rewards';
 import { useEffect, useState } from 'react';
 import useGateways from './useGateways';
@@ -16,10 +16,10 @@ const useOperatorRewards = (gateway: AoGateway | undefined) => {
         (g) => g.status == 'joined',
       ).length;
       const operatorRewards = calculateOperatorRewards(
-        new mIOToken(protocolBalance).toIO(),
+        new mARIOToken(protocolBalance).toARIO(),
         numGateways,
         gateway,
-        new mIOToken(gateway.operatorStake).toIO(),
+        new mARIOToken(gateway.operatorStake).toARIO(),
       );
       setOperatorRewards(operatorRewards);
     }
diff --git a/src/hooks/useProtocolBalance.ts b/src/hooks/useProtocolBalance.ts
index 1ad50a0b..e28aed33 100644
--- a/src/hooks/useProtocolBalance.ts
+++ b/src/hooks/useProtocolBalance.ts
@@ -1,4 +1,4 @@
-import { IO_PROCESS_ID } from '@src/constants';
+import { ARIO_PROCESS_ID } from '@src/constants';
 import { useGlobalState } from '@src/store';
 import { useQuery } from '@tanstack/react-query';
 
@@ -10,7 +10,7 @@ const useProtocolBalance = () => {
     queryFn: () => {
       if (arIOReadSDK) {
         return arIOReadSDK.getBalance({
-          address: IO_PROCESS_ID.toString(),
+          address: ARIO_PROCESS_ID.toString(),
         });
       }
       throw new Error('Error: ArIO Read SDK is not initialized');
diff --git a/src/hooks/useRedelegationFee.ts b/src/hooks/useRedelegationFee.ts
new file mode 100644
index 00000000..2bcf075d
--- /dev/null
+++ b/src/hooks/useRedelegationFee.ts
@@ -0,0 +1,19 @@
+import { useGlobalState } from '@src/store';
+import { useQuery } from '@tanstack/react-query';
+
+const useRedelegationFee = (walletAddress?: string) => {
+  const arioReadSDK = useGlobalState((state) => state.arIOReadSDK);
+
+  const res = useQuery({
+    queryKey: ['redelegationFee', walletAddress],
+    queryFn: async () => {
+      if (!arioReadSDK) throw new Error('arIOReadSDK not initialized');
+      if (!walletAddress) throw new Error('walletAddress not initialized');
+
+      return await arioReadSDK.getRedelegationFee({ address: walletAddress });
+    },
+  });
+  return res;
+};
+
+export default useRedelegationFee;
diff --git a/src/hooks/useRewardsEarned.ts b/src/hooks/useRewardsEarned.ts
index addf2da4..9ced1fc6 100644
--- a/src/hooks/useRewardsEarned.ts
+++ b/src/hooks/useRewardsEarned.ts
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import { useEffect, useState } from 'react';
 import useEpochs from './useEpochs';
 
@@ -27,9 +27,9 @@ const useRewardsEarned = (walletAddress?: string) => {
       }, 0);
 
       setRewardsEarned({
-        previousEpoch: new mIOToken(previousEpochRewards).toIO().valueOf(),
-        totalForPastAvailableEpochs: new mIOToken(totalForPastAvailableEpochs)
-          .toIO()
+        previousEpoch: new mARIOToken(previousEpochRewards).toARIO().valueOf(),
+        totalForPastAvailableEpochs: new mARIOToken(totalForPastAvailableEpochs)
+          .toARIO()
           .valueOf(),
       });
     }
diff --git a/src/hooks/useRewardsInfo.ts b/src/hooks/useRewardsInfo.ts
index 3bdefdb0..21d03db8 100644
--- a/src/hooks/useRewardsInfo.ts
+++ b/src/hooks/useRewardsInfo.ts
@@ -1,4 +1,4 @@
-import { AoGateway, IOToken, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, ARIOToken, mARIOToken } from '@ar.io/sdk/web';
 import {
   UserRewards,
   calculateGatewayRewards,
@@ -24,14 +24,14 @@ const useRewardsInfo = (gateway: AoGateway | undefined, userStake: number) => {
       ? Object.values(gateways).filter((g) => g.status == 'joined').length
       : 0;
     const gatewayRewards = calculateGatewayRewards(
-      new mIOToken(protocolBalance).toIO(),
+      new mARIOToken(protocolBalance).toARIO(),
       numGateways,
       gateway,
     );
 
     const userRewards = calculateUserRewards(
       gatewayRewards,
-      new IOToken(Math.abs(userStake)),
+      new ARIOToken(Math.abs(userStake)),
       userStake < 0,
     );
     res = userRewards;
diff --git a/src/pages/Dashboard/IOTokenDistributionPanel.tsx b/src/pages/Dashboard/IOTokenDistributionPanel.tsx
index 8f7756c1..a1af4b99 100644
--- a/src/pages/Dashboard/IOTokenDistributionPanel.tsx
+++ b/src/pages/Dashboard/IOTokenDistributionPanel.tsx
@@ -1,4 +1,4 @@
-import { AoTokenSupplyData, mIOToken } from '@ar.io/sdk/web';
+import { AoTokenSupplyData, mARIOToken } from '@ar.io/sdk/web';
 import Placeholder from '@src/components/Placeholder';
 import useTokenSupply from '@src/hooks/useTokenSupply';
 import { useGlobalState } from '@src/store';
@@ -23,25 +23,25 @@ const calculateIODistribution = (
   return [
     {
       name: 'Protocol Balance',
-      value: new mIOToken(tokenSupply.protocolBalance).toIO().valueOf(),
+      value: new mARIOToken(tokenSupply.protocolBalance).toARIO().valueOf(),
     },
     {
       name: 'Actively Staked',
-      value: new mIOToken(tokenSupply.staked + tokenSupply.delegated)
-        .toIO()
+      value: new mARIOToken(tokenSupply.staked + tokenSupply.delegated)
+        .toARIO()
         .valueOf(),
     },
     {
       name: 'Pending Withdrawal',
-      value: new mIOToken(tokenSupply.withdrawn).toIO().valueOf(),
+      value: new mARIOToken(tokenSupply.withdrawn).toARIO().valueOf(),
     },
     {
       name: 'In Circulation',
-      value: new mIOToken(tokenSupply.circulating).toIO().valueOf(),
+      value: new mARIOToken(tokenSupply.circulating).toARIO().valueOf(),
     },
     {
       name: 'Locked Supply',
-      value: new mIOToken(tokenSupply.locked).toIO().valueOf(),
+      value: new mARIOToken(tokenSupply.locked).toARIO().valueOf(),
     },
   ];
 };
@@ -72,7 +72,7 @@ const IOTokenDistributionPanel = () => {
       data && activeIndex !== undefined
         ? data[activeIndex].value
         : tokenSupply?.total
-          ? new mIOToken(tokenSupply.total).toIO().valueOf()
+          ? new mARIOToken(tokenSupply.total).toARIO().valueOf()
           : TOTAL_IO,
     ),
   );
diff --git a/src/pages/Dashboard/RewardsDistributionPanel.tsx b/src/pages/Dashboard/RewardsDistributionPanel.tsx
index 37675edd..d6c03e44 100644
--- a/src/pages/Dashboard/RewardsDistributionPanel.tsx
+++ b/src/pages/Dashboard/RewardsDistributionPanel.tsx
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import Placeholder from '@src/components/Placeholder';
 import useEpochs from '@src/hooks/useEpochs';
 import { useGlobalState } from '@src/store';
@@ -157,15 +157,15 @@ const RewardsDistributionPanel = () => {
           .filter((epoch) => epoch !== undefined)
           .sort((a, b) => a!.epochIndex - b!.epochIndex)
           .map((epoch) => {
-            const eligible = new mIOToken(
+            const eligible = new mARIOToken(
               epoch!.distributions.totalEligibleRewards,
             )
-              .toIO()
+              .toARIO()
               .valueOf();
-            const claimed = new mIOToken(
+            const claimed = new mARIOToken(
               epoch!.distributions.totalDistributedRewards ?? 0,
             )
-              .toIO()
+              .toARIO()
               .valueOf();
             return {
               epoch: epoch!.epochIndex,
diff --git a/src/pages/Gateway/ActiveDelegates.tsx b/src/pages/Gateway/ActiveDelegates.tsx
index e480e753..853c4041 100644
--- a/src/pages/Gateway/ActiveDelegates.tsx
+++ b/src/pages/Gateway/ActiveDelegates.tsx
@@ -1,4 +1,4 @@
-import { AoGatewayWithAddress, mIOToken } from '@ar.io/sdk/web';
+import { AoGatewayWithAddress, mARIOToken } from '@ar.io/sdk/web';
 import AddressCell from '@src/components/AddressCell';
 import Placeholder from '@src/components/Placeholder';
 import TableView from '@src/components/TableView';
@@ -30,7 +30,7 @@ const ActiveDelegates = ({ gateway }: { gateway?: AoGatewayWithAddress }) => {
     if (gateway && gatewayDelegateStakes) {
       const totalDelegatedStake = gateway.totalDelegatedStake;
       const data = gatewayDelegateStakes.map((stake) => {
-        const totalStake = new mIOToken(stake.delegatedStake).toIO().valueOf();
+        const totalStake = new mARIOToken(stake.delegatedStake).toARIO().valueOf();
         const percentageOfTotalStake =
           totalDelegatedStake > 0
             ? stake.delegatedStake / totalDelegatedStake
@@ -84,7 +84,7 @@ const ActiveDelegates = ({ gateway }: { gateway?: AoGatewayWithAddress }) => {
             {gateway ? (
               <div>
                 {formatWithCommas(
-                  new mIOToken(gateway.totalDelegatedStake).toIO().valueOf(),
+                  new mARIOToken(gateway.totalDelegatedStake).toARIO().valueOf(),
                 )}{' '}
                 {ticker}
               </div>
diff --git a/src/pages/Gateway/OperatorStake.tsx b/src/pages/Gateway/OperatorStake.tsx
index f268cf2c..e3ec7a34 100644
--- a/src/pages/Gateway/OperatorStake.tsx
+++ b/src/pages/Gateway/OperatorStake.tsx
@@ -1,9 +1,12 @@
-import { AoGatewayWithAddress, mIOToken } from '@ar.io/sdk/web';
-import Button, { ButtonType } from '@src/components/Button';
+import { AoGatewayWithAddress, ARIOToken, mARIOToken } from '@ar.io/sdk/web';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { ThreeDotsIcon } from '@src/components/icons';
 import OperatorStakingModal from '@src/components/modals/OperatorStakingModal';
+import OperatorWithdrawalModal from '@src/components/modals/OperatorWithdrawalModal';
+import RedelegateModal, { RedelegateModalProps } from '@src/components/modals/RedelegateModal';
 import Placeholder from '@src/components/Placeholder';
 import Tooltip from '@src/components/Tooltip';
-import { EAY_TOOLTIP_TEXT, OPERATOR_EAY_TOOLTIP_FORMULA } from '@src/constants';
+import { EAY_TOOLTIP_TEXT, GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO, OPERATOR_EAY_TOOLTIP_FORMULA } from '@src/constants';
 import useGateways from '@src/hooks/useGateways';
 import useProtocolBalance from '@src/hooks/useProtocolBalance';
 import { useGlobalState } from '@src/store';
@@ -23,15 +26,20 @@ const OperatorStake = ({ gateway, walletAddress }: OperatorStakeProps) => {
   const { data: protocolBalance } = useProtocolBalance();
   const { data: gateways } = useGateways();
   const [isStakingModalOpen, setIsStakingModalOpen] = useState<boolean>(false);
+  const [isWithdrawalModalOpen, setIsWithdrawalModalOpen] =
+    useState<boolean>(false);
   const [eay, setEAY] = useState<number>();
 
+  const [showRedelegateModal, setShowRedelegateModal] =
+    useState<RedelegateModalProps>();
+
   useEffect(() => {
     if (gateways && gateway && protocolBalance) {
       const rewards = calculateOperatorRewards(
-        new mIOToken(protocolBalance).toIO(),
+        new mARIOToken(protocolBalance).toARIO(),
         Object.values(gateways).filter((g) => g.status == 'joined').length,
         gateway,
-        new mIOToken(gateway.operatorStake).toIO(),
+        new mARIOToken(gateway.operatorStake).toARIO(),
       );
       setEAY(rewards.EAY);
     }
@@ -46,14 +54,59 @@ const OperatorStake = ({ gateway, walletAddress }: OperatorStakeProps) => {
 
         {gateway?.gatewayAddress === walletAddress &&
           gateway?.status != 'leaving' && (
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              className="*:text-gradient h-[1.875rem]"
-              active={true}
-              title="Manage Stake"
-              text="Manage Stake"
-              onClick={() => setIsStakingModalOpen(true)}
-            />
+            <DropdownMenu.Root>
+              <DropdownMenu.Trigger
+                asChild
+                onPointerDown={(e) => e.stopPropagation()}
+              >
+                <div className="cursor-pointer rounded-md bg-gradient-to-b from-btn-primary-outer-gradient-start to-btn-primary-outer-gradient-end p-px">
+                  <div className="inline-flex size-full items-center justify-start gap-[0.6875rem] rounded-md bg-btn-primary-base bg-gradient-to-b from-btn-primary-gradient-start to-btn-primary-gradient-end px-[0.3125rem] py-[.3125rem] shadow-inner">
+                    <ThreeDotsIcon className="size-4" />
+                  </div>
+                </div>
+              </DropdownMenu.Trigger>
+              <DropdownMenu.Content className="z-50 rounded border border-grey-500 bg-containerL0 text-sm">
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setIsStakingModalOpen(true);
+                  }}
+                >
+                  Add Stake
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setIsWithdrawalModalOpen(true);
+                  }}
+                >
+                  Withdraw Stake
+                </DropdownMenu.Item>
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    if (gateway) {
+                      setShowRedelegateModal({
+                        sourceGateway: gateway,
+                        onClose: () => setShowRedelegateModal(undefined),
+                        maxRedelegationStake: new mARIOToken(
+                          gateway.operatorStake -
+                            new ARIOToken(GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO)
+                              .toMARIO()
+                              .valueOf(),
+                        ).toARIO(),
+                      });
+                    }
+                  }}
+                >
+                  Redelegate
+                </DropdownMenu.Item>
+              </DropdownMenu.Content>
+            </DropdownMenu.Root>
           )}
       </div>
       <div className="flex items-center gap-2 p-6">
@@ -61,7 +114,7 @@ const OperatorStake = ({ gateway, walletAddress }: OperatorStakeProps) => {
           <>
             <div className="grow whitespace-nowrap text-mid">
               {formatWithCommas(
-                new mIOToken(gateway?.operatorStake).toIO().valueOf(),
+                new mARIOToken(gateway?.operatorStake).toARIO().valueOf(),
               )}{' '}
               {ticker}{' '}
               {gateway?.status === 'leaving' && '(Gateway Leaving Network)'}
@@ -98,6 +151,14 @@ const OperatorStake = ({ gateway, walletAddress }: OperatorStakeProps) => {
           gateway={gateway}
         />
       )}
+      {isWithdrawalModalOpen && gateway && (
+        <OperatorWithdrawalModal
+          open={isWithdrawalModalOpen}
+          onClose={() => setIsWithdrawalModalOpen(false)}
+          gateway={gateway}
+        />
+      )}
+      {showRedelegateModal && <RedelegateModal {...showRedelegateModal} />}
     </div>
   );
 };
diff --git a/src/pages/Gateway/PendingWIthdrawals.tsx b/src/pages/Gateway/PendingWIthdrawals.tsx
index 5061367b..6a5a7809 100644
--- a/src/pages/Gateway/PendingWIthdrawals.tsx
+++ b/src/pages/Gateway/PendingWIthdrawals.tsx
@@ -3,15 +3,15 @@ import {
   AoGatewayVault,
   AoGatewayWithAddress,
   AoVaultData,
-  mIOToken,
+  mARIOToken,
 } from '@ar.io/sdk/web';
-import Button, { ButtonType } from '@src/components/Button';
-import {
-  CancelButtonXIcon,
-  InstantWithdrawalIcon,
-} from '@src/components/icons';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { ThreeDotsIcon } from '@src/components/icons';
 import CancelWithdrawalModal from '@src/components/modals/CancelWithdrawalModal';
 import InstantWithdrawalModal from '@src/components/modals/InstantWithdrawalModal';
+import RedelegateModal, {
+  RedelegateModalProps,
+} from '@src/components/modals/RedelegateModal';
 import TableView from '@src/components/TableView';
 import useGatewayVaults from '@src/hooks/useGatewayVaults';
 import { useGlobalState } from '@src/store';
@@ -48,6 +48,9 @@ const PendingWithdrawals = ({
     vaultId: string;
   }>();
 
+  const [showRedelegateModal, setShowRedelegateModal] =
+    useState<RedelegateModalProps>();
+
   // Define columns for the table
   const columns: ColumnDef<AoGatewayVault, any>[] = [
     columnHelper.accessor('balance', {
@@ -56,7 +59,7 @@ const PendingWithdrawals = ({
       sortDescFirst: true,
       cell: ({ row }) =>
         `${formatWithCommas(
-          new mIOToken(row.original.balance).toIO().valueOf(),
+          new mARIOToken(row.original.balance).toARIO().valueOf(),
         )} ${ticker}`,
     }),
     columnHelper.accessor('endTimestamp', {
@@ -69,39 +72,77 @@ const PendingWithdrawals = ({
       id: 'actions',
       cell: ({ row }) => {
         return (
-          <div className="flex w-full justify-end gap-2 pr-6">
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              active={true}
-              title="Expedited Withdrawal"
-              text={<InstantWithdrawalIcon className="size-4" />}
-              onClick={(e) => {
-                e.stopPropagation();
-                if (walletAddress && gateway) {
-                  setConfirmInstantWithdrawal({
-                    gateway: gateway,
-                    gatewayAddress: walletAddress?.toString(),
-                    vault: row.original,
-                    vaultId: row.original.vaultId,
-                  });
-                }
-              }}
-            />
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              active={true}
-              title="Cancel Withdrawal"
-              text={<CancelButtonXIcon className="size-4" />}
-              onClick={(e) => {
-                e.stopPropagation();
-                if (gateway) {
-                  setConfirmCancelWithdrawal({
-                    gatewayAddress: gateway.gatewayAddress,
-                    vaultId: row.original.vaultId,
-                  });
-                }
-              }}
-            />
+          <div className="flex w-full justify-end pr-6">
+            <DropdownMenu.Root>
+              <DropdownMenu.Trigger
+                asChild
+                onPointerDown={(e) => e.stopPropagation()}
+              >
+                <div className="cursor-pointer rounded-md bg-gradient-to-b from-btn-primary-outer-gradient-start to-btn-primary-outer-gradient-end  p-px">
+                  <div className="inline-flex size-full items-center justify-start gap-[0.6875rem] rounded-md bg-btn-primary-base bg-gradient-to-b from-btn-primary-gradient-start to-btn-primary-gradient-end px-[0.3125rem] py-[.3125rem] shadow-inner">
+                    <ThreeDotsIcon className="size-4" />
+                  </div>
+                </div>
+              </DropdownMenu.Trigger>
+              <DropdownMenu.Content className="z-50 rounded border border-grey-500 bg-containerL0 text-sm">
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    if (gateway) {
+                      setConfirmInstantWithdrawal({
+                        gateway: gateway,
+                        gatewayAddress: gateway.gatewayAddress,
+                        vault: row.original,
+                        vaultId: row.original.vaultId,
+                      });
+                    }
+                  }}
+                >
+                  Expedite Withdrawal
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    if (gateway) {
+                      setConfirmCancelWithdrawal({
+                        gatewayAddress: gateway.gatewayAddress,
+                        vaultId: row.original.vaultId,
+                      });
+                    }
+                  }}
+                >
+                  Cancel Withdrawal
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none  px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    if (gateway) {
+                      setShowRedelegateModal({
+                        sourceGateway: gateway,
+                        onClose: () => setShowRedelegateModal(undefined),
+                        // maxRedelegationStake: new mARIOToken(
+                        //   gateway.operatorStake -
+                        //     new ARIOToken(GATEWAY_OPERATOR_STAKE_MINIMUM_ARIO)
+                        //       .toMARIO()
+                        //       .valueOf(),
+                        // ).toARIO(),
+                        maxRedelegationStake: new mARIOToken(
+                          row.original.balance,
+                        ).toARIO(),
+                        vaultId: row.original.vaultId,
+                      });
+                    }
+                  }}
+                >
+                  Redelegate
+                </DropdownMenu.Item>
+              </DropdownMenu.Content>
+            </DropdownMenu.Root>
           </div>
         );
       },
@@ -117,8 +158,8 @@ const PendingWithdrawals = ({
           <div className="text-gradient-red">
             <div>
               {formatWithCommas(
-                new mIOToken(gatewayVaults.reduce((a, b) => a + b.balance, 0))
-                  .toIO()
+                new mARIOToken(gatewayVaults.reduce((a, b) => a + b.balance, 0))
+                  .toARIO()
                   .valueOf(),
               )}{' '}
               {ticker}
@@ -154,6 +195,7 @@ const PendingWithdrawals = ({
           onClose={() => setConfirmInstantWithdrawal(undefined)}
         />
       )}
+      {showRedelegateModal && <RedelegateModal {...showRedelegateModal} />}
     </CollapsiblePanel>
   ) : (
     <></>
diff --git a/src/pages/Gateway/PropertyDisplayPanel.tsx b/src/pages/Gateway/PropertyDisplayPanel.tsx
index 3cb6d8dd..4636959b 100644
--- a/src/pages/Gateway/PropertyDisplayPanel.tsx
+++ b/src/pages/Gateway/PropertyDisplayPanel.tsx
@@ -1,4 +1,4 @@
-import { AoGateway, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, mARIOToken } from '@ar.io/sdk/web';
 import Button, { ButtonType } from '@src/components/Button';
 import Placeholder from '@src/components/Placeholder';
 import ConnectModal from '@src/components/modals/ConnectModal';
@@ -7,17 +7,19 @@ import StakingModal from '@src/components/modals/StakingModal';
 import { useGlobalState } from '@src/store';
 import { useState } from 'react';
 
+type DisplayRowProps = {
+  label: string;
+  value?: string | number | boolean | React.ReactNode;
+  type?: string;
+  rightComponent?: React.ReactNode;
+};
+
 const DisplayRow = ({
   label,
   value,
   type,
   rightComponent,
-}: {
-  label: string;
-  value: React.ReactNode | string | number | boolean | undefined;
-  type?: string;
-  rightComponent?: React.ReactNode;
-}) => {
+}: DisplayRowProps) => {
   return (
     <>
       <div className="border-t border-grey-900">
@@ -99,14 +101,14 @@ const PropertyDisplayPanel = ({
           label: `Minimum Delegated Stake (${ticker}):`,
           value: gatewayLeaving
             ? 'N/A'
-            : new mIOToken(gateway?.settings.minDelegatedStake || 0)
-                .toIO()
+            : new mARIOToken(gateway?.settings.minDelegatedStake || 0)
+                .toARIO()
                 .valueOf(),
         },
       ]
     : [];
 
-  const gatewayRows = [
+  const gatewayRows: DisplayRowProps[] = [
     { label: 'Label:', value: gateway?.settings.label },
     { label: 'Address:', value: gatewayAddress, type: 'link' },
     { label: 'Owner Wallet:', value: ownerId, type: 'address' },
@@ -151,6 +153,7 @@ const PropertyDisplayPanel = ({
       label: 'Delegated Staking:',
       value: gatewayLeaving ? 'N/A' : gateway?.settings.allowDelegatedStaking,
       rightComponent:
+        !isOwnGateway &&
         gateway?.settings.allowDelegatedStaking &&
         gateway?.status == 'joined' ? (
           <Button
@@ -174,11 +177,12 @@ const PropertyDisplayPanel = ({
 
   return (
     <div className="grid grid-cols-[14.375rem_auto]">
-      {gatewayRows.map(({ label, value  }, index) => (
+      {gatewayRows.map(({ label, value, rightComponent  }, index) => (
         <DisplayRow
           key={index}
           label={label}
           value={value}
+          rightComponent={rightComponent}
         />
       ))}
 
diff --git a/src/pages/Gateway/index.tsx b/src/pages/Gateway/index.tsx
index 18b576d3..601270db 100644
--- a/src/pages/Gateway/index.tsx
+++ b/src/pages/Gateway/index.tsx
@@ -1,8 +1,8 @@
 /* eslint-disable tailwindcss/classnames-order */
 import {
   AoUpdateGatewaySettingsParams,
-  IOToken,
-  mIOToken,
+  ARIOToken,
+  mARIOToken,
 } from '@ar.io/sdk/web';
 import Button, { ButtonType } from '@src/components/Button';
 import Placeholder from '@src/components/Placeholder';
@@ -14,7 +14,7 @@ import {
 } from '@src/components/forms/formData';
 import {
   validateDomainName,
-  validateIOAmount,
+  validateARIOAmount,
   validateNumberRange,
   validateString,
   validateTransactionId,
@@ -201,7 +201,7 @@ const Gateway = () => {
       placeholder: delegatedStakingEnabled
         ? `Minimum 10 ${ticker}`
         : 'Enable Delegated Staking to set this value.',
-      validateProperty: validateIOAmount(
+      validateProperty: validateARIOAmount(
         'Minumum Delegated Stake',
         ticker,
         10,
@@ -225,7 +225,7 @@ const Gateway = () => {
       delegateRewardShareRatio:
         (gateway.settings.delegateRewardShareRatio || 0) + '',
       minDelegatedStake:
-        new mIOToken(gateway.settings.minDelegatedStake || 0).toIO().valueOf() +
+        new mARIOToken(gateway.settings.minDelegatedStake || 0).toARIO().valueOf() +
         '',
     };
     setInitialState(initialState);
@@ -262,8 +262,8 @@ const Gateway = () => {
         label: changed.label as string,
         minDelegatedStake:
           formState.allowDelegatedStaking && changed.minDelegatedStake
-            ? new IOToken(parseFloat(changed.minDelegatedStake as string))
-                .toMIO()
+            ? new ARIOToken(parseFloat(changed.minDelegatedStake as string))
+                .toMARIO()
                 .valueOf()
             : undefined,
         note: changed.note as string,
diff --git a/src/pages/Gateways/index.tsx b/src/pages/Gateways/index.tsx
index 240c06c9..72d0e48a 100644
--- a/src/pages/Gateways/index.tsx
+++ b/src/pages/Gateways/index.tsx
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import AddressCell from '@src/components/AddressCell';
 import Header from '@src/components/Header';
 import Streak from '@src/components/Streak';
@@ -51,14 +51,14 @@ const Gateways = () => {
             domain: gateway.settings.fqdn,
             owner: owner,
             start: new Date(gateway.startTimestamp),
-            totalDelegatedStake: new mIOToken(gateway.totalDelegatedStake)
-              .toIO()
+            totalDelegatedStake: new mARIOToken(gateway.totalDelegatedStake)
+              .toARIO()
               .valueOf(),
-            operatorStake: new mIOToken(gateway.operatorStake).toIO().valueOf(),
-            totalStake: new mIOToken(
+            operatorStake: new mARIOToken(gateway.operatorStake).toARIO().valueOf(),
+            totalStake: new mARIOToken(
               gateway.totalDelegatedStake + gateway.operatorStake,
             )
-              .toIO()
+              .toARIO()
               .valueOf(),
             status: gateway.status,
             endTimeStamp: gateway.endTimestamp,
diff --git a/src/pages/Observe/ObserveHeader.tsx b/src/pages/Observe/ObserveHeader.tsx
index bf8504ce..c7afd7a6 100644
--- a/src/pages/Observe/ObserveHeader.tsx
+++ b/src/pages/Observe/ObserveHeader.tsx
@@ -33,7 +33,7 @@ const ObserveHeader = ({
 }) => {
   const params = useParams();
   const ownerId = params?.ownerId;
-  
+
   const [runningObservation, setRunningObservation] = useState(false);
 
   // fetch current prescribed names, fallback to defaults
@@ -79,7 +79,7 @@ const ObserveHeader = ({
         <div className="text-mid">
           <Link to={'/gateways'}>Gateways</Link>
         </div>
-        <HeaderSeparatorIcon className="size-4"/>
+        <HeaderSeparatorIcon className="size-4" />
         {gateway ? (
           <Link className="text-mid" to={`/gateways/${ownerId}`}>
             {gateway.settings.label}
@@ -87,7 +87,7 @@ const ObserveHeader = ({
         ) : (
           <Placeholder />
         )}
-        <HeaderSeparatorIcon className="size-4"/>
+        <HeaderSeparatorIcon className="size-4" />
         <Link className="text-mid" to={`/gateways/${ownerId}/reports`}>
           Observe
         </Link>
@@ -112,7 +112,7 @@ const ObserveHeader = ({
           onChange={(e) => {
             setArnsNamesToSearch(e.target.value);
           }}
-        ></input>
+        />
 
         <div
           className={
diff --git a/src/pages/Staking/ConnectedLandingPage.tsx b/src/pages/Staking/ConnectedLandingPage.tsx
index 41ffcbbf..1f111217 100644
--- a/src/pages/Staking/ConnectedLandingPage.tsx
+++ b/src/pages/Staking/ConnectedLandingPage.tsx
@@ -1,6 +1,5 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import Placeholder from '@src/components/Placeholder';
-import StakingModal from '@src/components/modals/StakingModal';
 import useBalances from '@src/hooks/useBalances';
 import useDelegateStakes from '@src/hooks/useDelegateStakes';
 import useRewardsEarned from '@src/hooks/useRewardsEarned';
@@ -71,8 +70,6 @@ const ConnectedLandingPage = () => {
   const ticker = useGlobalState((state) => state.ticker);
   const [amountStaking, setAmountStaking] = useState<number>();
 
-  const [isStakingModalOpen, setIsStakingModalOpen] = useState<boolean>(false);
-
   const { data: balances } = useBalances(walletAddress);
   const rewardsEarned = useRewardsEarned(walletAddress?.toString());
 
@@ -92,7 +89,7 @@ const ConnectedLandingPage = () => {
         },
         0,
       );
-      setAmountStaking(new mIOToken(staked + withdrawing).toIO().valueOf());
+      setAmountStaking(new mARIOToken(staked + withdrawing).toARIO().valueOf());
     }
   }, [delegatedStakes]);
 
@@ -138,12 +135,6 @@ const ConnectedLandingPage = () => {
       </div>
       <MyStakesTable />
       <DelegateStake />
-      {isStakingModalOpen && (
-        <StakingModal
-          open={isStakingModalOpen}
-          onClose={() => setIsStakingModalOpen(false)}
-        />
-      )}
     </div>
   );
 };
diff --git a/src/pages/Staking/DelegateStakeTable.tsx b/src/pages/Staking/DelegateStakeTable.tsx
index 71da80f0..b59eaabf 100644
--- a/src/pages/Staking/DelegateStakeTable.tsx
+++ b/src/pages/Staking/DelegateStakeTable.tsx
@@ -1,4 +1,4 @@
-import { mIOToken } from '@ar.io/sdk/web';
+import { mARIOToken } from '@ar.io/sdk/web';
 import AddressCell from '@src/components/AddressCell';
 import Button, { ButtonType } from '@src/components/Button';
 import Streak from '@src/components/Streak';
@@ -84,22 +84,22 @@ const DelegateStake = () => {
                         : -1,
                     passedEpochCount,
                     totalEpochCount,
-                    totalDelegatedStake: new mIOToken(
+                    totalDelegatedStake: new mARIOToken(
                       gateway.totalDelegatedStake,
                     )
-                      .toIO()
+                      .toARIO()
                       .valueOf(),
-                    operatorStake: new mIOToken(gateway.operatorStake)
-                      .toIO()
+                    operatorStake: new mARIOToken(gateway.operatorStake)
+                      .toARIO()
                       .valueOf(),
-                    totalStake: new mIOToken(
+                    totalStake: new mARIOToken(
                       gateway.totalDelegatedStake + gateway.operatorStake,
                     )
-                      .toIO()
+                      .toARIO()
                       .valueOf(),
 
                     eay: calculateGatewayRewards(
-                      new mIOToken(protocolBalance).toIO(),
+                      new mARIOToken(protocolBalance).toARIO(),
                       Object.values(gateways).filter(
                         (g) => g.status == 'joined',
                       ).length,
diff --git a/src/pages/Staking/MyStakesTable.tsx b/src/pages/Staking/MyStakesTable.tsx
index 1ee30b12..fb72f149 100644
--- a/src/pages/Staking/MyStakesTable.tsx
+++ b/src/pages/Staking/MyStakesTable.tsx
@@ -1,16 +1,17 @@
-import { AoGateway, AoVaultData, mIOToken } from '@ar.io/sdk/web';
+import { AoGatewayWithAddress, AoVaultData, mARIOToken } from '@ar.io/sdk/web';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
 import AddressCell from '@src/components/AddressCell';
 import Button, { ButtonType } from '@src/components/Button';
 import Dropdown from '@src/components/Dropdown';
 import Streak from '@src/components/Streak';
 import TableView from '@src/components/TableView';
-import {
-  CancelButtonXIcon,
-  GearIcon,
-  InstantWithdrawalIcon,
-} from '@src/components/icons';
+import { ThreeDotsIcon } from '@src/components/icons';
 import CancelWithdrawalModal from '@src/components/modals/CancelWithdrawalModal';
 import InstantWithdrawalModal from '@src/components/modals/InstantWithdrawalModal';
+import RedelegateModal, {
+  RedelegateModalProps,
+} from '@src/components/modals/RedelegateModal';
+import StakeWithdrawalModal from '@src/components/modals/StakeWithdrawalModal';
 import StakingModal from '@src/components/modals/StakingModal';
 import WithdrawAllModal from '@src/components/modals/WithdrawAllModal';
 import useDelegateStakes from '@src/hooks/useDelegateStakes';
@@ -24,14 +25,14 @@ import { useNavigate } from 'react-router-dom';
 interface ActiveStakesTableData {
   owner: string;
   delegatedStake: number;
-  gateway: AoGateway;
+  gateway: AoGatewayWithAddress;
   pendingWithdrawals: number;
   streak: number;
 }
 
 interface PendingWithdrawalsTableData {
   owner: string;
-  gateway: AoGateway;
+  gateway: AoGatewayWithAddress;
   withdrawal: AoVaultData;
   withdrawalId: string;
 }
@@ -57,7 +58,11 @@ const MyStakesTable = () => {
   const [showWithdrawAllModal, setShowWithdrawAllModal] = useState(false);
   const [stakingModalWalletAddress, setStakingModalWalletAddress] =
     useState<string>();
-  const [showQuickStake, setShowQuickStake] = useState(false);
+  const [withdrawalModalWalletAddress, setWithdrawalModalWalletAddress] =
+    useState<string>();
+  const [showRedelegateModal, setShowRedelegateModal] =
+    useState<RedelegateModalProps>();
+
   const [confirmCancelWithdrawal, setConfirmCancelWithdrawal] = useState<{
     gatewayAddress: string;
     vaultId: string;
@@ -65,7 +70,7 @@ const MyStakesTable = () => {
 
   const [confirmInstantWithdrawal, setConfirmInstantWithdrawal] = useState<{
     gatewayAddress: string;
-    gateway: AoGateway;
+    gateway: AoGatewayWithAddress;
     vault: AoVaultData;
     vaultId: string;
   }>();
@@ -86,7 +91,7 @@ const MyStakesTable = () => {
               return {
                 owner: stake.gatewayAddress,
                 delegatedStake: stake.balance,
-                gateway,
+                gateway: { ...gateway, gatewayAddress: stake.gatewayAddress },
                 pendingWithdrawals: delegateStakes.withdrawals.filter(
                   (w) => w.gatewayAddress == stake.gatewayAddress,
                 ).length,
@@ -109,7 +114,10 @@ const MyStakesTable = () => {
 
               return {
                 owner: withdrawal.gatewayAddress,
-                gateway,
+                gateway: {
+                  ...gateway,
+                  gatewayAddress: withdrawal.gatewayAddress,
+                },
                 withdrawal,
                 withdrawalId: withdrawal.vaultId,
               };
@@ -154,7 +162,7 @@ const MyStakesTable = () => {
       header: `Current Stake (${ticker})`,
       sortDescFirst: true,
       cell: ({ row }) => {
-        return `${new mIOToken(row.original.delegatedStake).toIO().valueOf()}`;
+        return `${new mARIOToken(row.original.delegatedStake).toARIO().valueOf()}`;
       },
     }),
     columnHelper.accessor('streak', {
@@ -183,17 +191,55 @@ const MyStakesTable = () => {
       cell: ({ row }) => {
         return (
           <div className="flex w-full justify-end pr-6">
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              active={true}
-              title="Manage Stake"
-              text=" "
-              rightIcon={<GearIcon className="size-4" />}
-              onClick={(e) => {
-                e.stopPropagation();
-                setStakingModalWalletAddress(row.original.owner);
-              }}
-            />
+            <DropdownMenu.Root>
+              <DropdownMenu.Trigger
+                asChild
+                onPointerDown={(e) => e.stopPropagation()}
+              >
+                <div className="cursor-pointer rounded-md bg-gradient-to-b from-btn-primary-outer-gradient-start to-btn-primary-outer-gradient-end  p-px">
+                  <div className="inline-flex size-full items-center justify-start gap-[0.6875rem] rounded-md bg-btn-primary-base bg-gradient-to-b from-btn-primary-gradient-start to-btn-primary-gradient-end px-[0.3125rem] py-[.3125rem] shadow-inner">
+                    <ThreeDotsIcon className="size-4" />
+                  </div>
+                </div>
+              </DropdownMenu.Trigger>
+              <DropdownMenu.Content className="z-50 rounded border border-grey-500 bg-containerL0 text-sm">
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setStakingModalWalletAddress(row.original.owner);
+                  }}
+                >
+                  Add Stake
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setWithdrawalModalWalletAddress(row.original.owner);
+                  }}
+                >
+                  Withdraw Stake
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none  px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setShowRedelegateModal({
+                      sourceGateway: row.original.gateway,
+                      onClose: () => setShowRedelegateModal(undefined),
+                      maxRedelegationStake: new mARIOToken(
+                        row.original.delegatedStake,
+                      ).toARIO(),
+                    });
+                  }}
+                >
+                  Redelegate
+                </DropdownMenu.Item>
+              </DropdownMenu.Content>
+            </DropdownMenu.Root>
           </div>
         );
       },
@@ -241,7 +287,7 @@ const MyStakesTable = () => {
       header: `Stake Withdrawing (${ticker})`,
       sortDescFirst: true,
       cell: ({ row }) => {
-        return `${new mIOToken(row.original.withdrawal.balance).toIO().valueOf()}`;
+        return `${new mARIOToken(row.original.withdrawal.balance).toARIO().valueOf()}`;
       },
     }),
     columnHelperWithdrawals.accessor((row) => row.withdrawal.endTimestamp, {
@@ -256,35 +302,65 @@ const MyStakesTable = () => {
       id: 'actions',
       cell: ({ row }) => {
         return (
-          <div className="flex w-full justify-end gap-2 pr-6">
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              active={true}
-              title="Expedited Withdrawal"
-              text={<InstantWithdrawalIcon className="size-4" />}
-              onClick={(e) => {
-                e.stopPropagation();
-                setConfirmInstantWithdrawal({
-                  gateway: row.original.gateway,
-                  gatewayAddress: row.original.owner,
-                  vault: row.original.withdrawal,
-                  vaultId: row.original.withdrawalId,
-                });
-              }}
-            />
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              active={true}
-              title="Cancel Withdrawal"
-              text={<CancelButtonXIcon className="size-4" />}
-              onClick={(e) => {
-                e.stopPropagation();
-                setConfirmCancelWithdrawal({
-                  gatewayAddress: row.original.owner,
-                  vaultId: row.original.withdrawalId,
-                });
-              }}
-            />
+          <div className="flex w-full justify-end pr-6">
+            <DropdownMenu.Root>
+              <DropdownMenu.Trigger
+                asChild
+                onPointerDown={(e) => e.stopPropagation()}
+              >
+                <div className="cursor-pointer rounded-md bg-gradient-to-b from-btn-primary-outer-gradient-start to-btn-primary-outer-gradient-end  p-px">
+                  <div className="inline-flex size-full items-center justify-start gap-[0.6875rem] rounded-md bg-btn-primary-base bg-gradient-to-b from-btn-primary-gradient-start to-btn-primary-gradient-end px-[0.3125rem] py-[.3125rem] shadow-inner">
+                    <ThreeDotsIcon className="size-4" />
+                  </div>
+                </div>
+              </DropdownMenu.Trigger>
+              <DropdownMenu.Content className="z-50 rounded border border-grey-500 bg-containerL0 text-sm">
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setConfirmInstantWithdrawal({
+                      gateway: row.original.gateway,
+                      gatewayAddress: row.original.owner,
+                      vault: row.original.withdrawal,
+                      vaultId: row.original.withdrawalId,
+                    });
+                  }}
+                >
+                  Expedite Withdrawal
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setConfirmCancelWithdrawal({
+                      gatewayAddress: row.original.owner,
+                      vaultId: row.original.withdrawalId,
+                    });
+                  }}
+                >
+                  Cancel Withdrawal
+                </DropdownMenu.Item>
+
+                <DropdownMenu.Item
+                  className="cursor-pointer select-none  px-4 py-2 outline-none  data-[highlighted]:bg-containerL3"
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setShowRedelegateModal({
+                      sourceGateway: row.original.gateway,
+                      onClose: () => setShowRedelegateModal(undefined),
+                      maxRedelegationStake: new mARIOToken(
+                        row.original.withdrawal.balance,
+                      ).toARIO(),
+                      vaultId: row.original.withdrawalId,
+                    });
+                  }}
+                >
+                  Redelegate
+                </DropdownMenu.Item>
+              </DropdownMenu.Content>
+            </DropdownMenu.Root>
           </div>
         );
       },
@@ -310,27 +386,15 @@ const MyStakesTable = () => {
           />
         </div>
 
-        {tableMode == 'activeStakes' && (
-          <>
-            {hasDelegatedStake && (
-              <Button
-                buttonType={ButtonType.SECONDARY}
-                className="*:text-gradient-red h-[1.875rem]"
-                active={true}
-                title="Withdraw All"
-                text="Withdraw All"
-                onClick={() => setShowWithdrawAllModal(true)}
-              />
-            )}
-            <Button
-              buttonType={ButtonType.SECONDARY}
-              className="*:text-gradient h-[1.875rem]"
-              active={true}
-              title="QuickStake"
-              text="QuickStake"
-              onClick={() => setShowQuickStake(true)}
-            />
-          </>
+        {tableMode == 'activeStakes' && hasDelegatedStake && (
+          <Button
+            buttonType={ButtonType.SECONDARY}
+            className="*:text-gradient-red h-[1.875rem]"
+            active={true}
+            title="Withdraw All"
+            text="Withdraw All"
+            onClick={() => setShowWithdrawAllModal(true)}
+          />
         )}
       </div>
       {tableMode === 'activeStakes' ? (
@@ -370,16 +434,24 @@ const MyStakesTable = () => {
           onClose={() => setShowWithdrawAllModal(false)}
         />
       )}
-      {(stakingModalWalletAddress || showQuickStake) && (
+      {stakingModalWalletAddress && (
         <StakingModal
           open={!!stakingModalWalletAddress}
           onClose={() => {
             setStakingModalWalletAddress(undefined);
-            setShowQuickStake(false);
           }}
           ownerWallet={stakingModalWalletAddress}
         />
       )}
+      {withdrawalModalWalletAddress && (
+        <StakeWithdrawalModal
+          open={!!withdrawalModalWalletAddress}
+          onClose={() => {
+            setWithdrawalModalWalletAddress(undefined);
+          }}
+          ownerWallet={withdrawalModalWalletAddress}
+        />
+      )}
       {confirmCancelWithdrawal && (
         <CancelWithdrawalModal
           gatewayAddress={confirmCancelWithdrawal.gatewayAddress}
@@ -396,6 +468,7 @@ const MyStakesTable = () => {
           onClose={() => setConfirmInstantWithdrawal(undefined)}
         />
       )}
+      {showRedelegateModal && <RedelegateModal {...showRedelegateModal} />}
     </div>
   );
 };
diff --git a/src/store/db.ts b/src/store/db.ts
index 392920c7..7e4d3a46 100644
--- a/src/store/db.ts
+++ b/src/store/db.ts
@@ -1,5 +1,5 @@
-import { AoEpochData, AoIORead } from '@ar.io/sdk/web';
-import { IO_PROCESS_ID } from '@src/constants';
+import { AoEpochData, AoARIORead } from '@ar.io/sdk/web';
+import { ARIO_PROCESS_ID } from '@src/constants';
 import { Assessment } from '@src/types';
 import Dexie, { type EntityTable } from 'dexie';
 
@@ -11,7 +11,7 @@ export interface Observation {
 }
 
 // Use process ID as the database name so that cached data is unique to each process
-const DB_NAME = IO_PROCESS_ID.toString();
+const DB_NAME = ARIO_PROCESS_ID.toString();
 
 export const db = new Dexie(DB_NAME) as Dexie & {
   observations: EntityTable<
@@ -37,7 +37,7 @@ db.version(2).stores({
 db.open().catch(function (err) {
   console.error('Failed to open db: ', err);
 });
-export const getEpoch = async (arIOReadSDK: AoIORead, epochIndex: number) => {
+export const getEpoch = async (arIOReadSDK: AoARIORead, epochIndex: number) => {
   const epoch = await db.epochs.where('epochIndex').equals(epochIndex).first();
   if (epoch) {
     return epoch;
diff --git a/src/store/index.ts b/src/store/index.ts
index 2badfbce..5760335c 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -1,9 +1,9 @@
 import {
   AOProcess,
   AoEpochData,
-  AoIORead,
-  AoIOWrite,
-  IO,
+  AoARIORead,
+  AoARIOWrite,
+  ARIO,
 } from '@ar.io/sdk/web';
 import { connect } from '@permaweb/aoconnect';
 import {
@@ -11,7 +11,7 @@ import {
   DEFAULT_ARWEAVE_HOST,
   DEFAULT_ARWEAVE_PORT,
   DEFAULT_ARWEAVE_PROTOCOL,
-  IO_PROCESS_ID,
+  ARIO_PROCESS_ID as ARIO_PROCESS_ID,
   THEME_TYPES,
 } from '@src/constants';
 import { ArweaveWalletConnector } from '@src/types';
@@ -24,8 +24,8 @@ export type ThemeType = (typeof THEME_TYPES)[keyof typeof THEME_TYPES];
 export type GlobalState = {
   theme: ThemeType;
   arweave: Arweave;
-  arIOReadSDK: AoIORead;
-  arIOWriteableSDK?: AoIOWrite;
+  arIOReadSDK: AoARIORead;
+  arIOWriteableSDK?: AoARIOWrite;
   blockHeight?: number;
   currentEpoch?: AoEpochData;
   walletAddress?: ArweaveTransactionID;
@@ -43,7 +43,7 @@ export type GlobalStateActions = {
     walletAddress?: ArweaveTransactionID,
     wallet?: ArweaveWalletConnector,
   ) => void;
-  setArIOWriteableSDK: (arIOWriteableSDK?: AoIOWrite) => void;
+  setArIOWriteableSDK: (arIOWriteableSDK?: AoARIOWrite) => void;
   setWalletStateInitialized: (initialized: boolean) => void;
   setTicker: (ticker: string) => void;
   setAoCongested: (congested: boolean) => void;
@@ -56,9 +56,9 @@ export const initialGlobalState: GlobalState = {
     protocol: DEFAULT_ARWEAVE_PROTOCOL,
     port: DEFAULT_ARWEAVE_PORT,
   }),
-  arIOReadSDK: IO.init({
+  arIOReadSDK: ARIO.init({
     process: new AOProcess({
-      processId: IO_PROCESS_ID.toString(),
+      processId: ARIO_PROCESS_ID.toString(),
       ao: connect({
         CU_URL: AO_CU_URL,
       }),
@@ -94,7 +94,7 @@ export class GlobalStateActionBase implements GlobalStateActions {
     this.set({ walletAddress, wallet });
   };
 
-  setArIOWriteableSDK = (arIOWriteableSDK?: AoIOWrite) => {
+  setArIOWriteableSDK = (arIOWriteableSDK?: AoARIOWrite) => {
     this.set({ arIOWriteableSDK });
   };
 
diff --git a/src/utils/rewards.ts b/src/utils/rewards.ts
index 736f4e8f..a6c66f6d 100644
--- a/src/utils/rewards.ts
+++ b/src/utils/rewards.ts
@@ -1,4 +1,4 @@
-import { AoGateway, IOToken, mIOToken } from '@ar.io/sdk/web';
+import { AoGateway, ARIOToken, mARIOToken } from '@ar.io/sdk/web';
 
 const EPOCHS_PER_YEAR = 365;
 const EPOCH_DISTRIBUTION_RATIO = 0.0005; // 0.05%
@@ -6,15 +6,15 @@ const GATEWAY_REWARDS_RATIO = 0.9; // 90%
 // const OBSERVER_REWARDS_RATIO = .05; // 5%
 
 export interface GatewayRewards {
-  totalDelegatedStake: IOToken;
-  rewardsSharedPerEpoch: IOToken;
+  totalDelegatedStake: ARIOToken;
+  rewardsSharedPerEpoch: ARIOToken;
   EEY: number;
   EAY: number;
 }
 
 export interface OperatorRewards {
-  operatorStake: IOToken;
-  rewardsSharedPerEpoch: IOToken;
+  operatorStake: ARIOToken;
+  rewardsSharedPerEpoch: ARIOToken;
   EEY: number;
   EAY: number;
 }
@@ -34,10 +34,10 @@ export interface UserRewards {
  * user what the EAY will be.)
  */
 export const calculateOperatorRewards = (
-  protocolBalance: IOToken,
+  protocolBalance: ARIOToken,
   totalGateways: number,
   gateway: AoGateway,
-  operatorStake: IOToken,
+  operatorStake: ARIOToken,
 ): OperatorRewards => {
   const epochRewards = protocolBalance.valueOf() * EPOCH_DISTRIBUTION_RATIO;
   const baseGatewayReward =
@@ -46,7 +46,7 @@ export const calculateOperatorRewards = (
   const gatewayRewardShareRatio =
     gateway.settings.delegateRewardShareRatio / 100;
 
-  const rewardsSharedPerEpoch = new IOToken(
+  const rewardsSharedPerEpoch = new ARIOToken(
     baseGatewayReward * (1 - gatewayRewardShareRatio),
   );
 
@@ -67,7 +67,7 @@ export const calculateOperatorRewards = (
 };
 
 export const calculateGatewayRewards = (
-  protocolBalance: IOToken,
+  protocolBalance: ARIOToken,
   totalGateways: number,
   gateway: AoGateway,
 ): GatewayRewards => {
@@ -77,9 +77,9 @@ export const calculateGatewayRewards = (
 
   const gatewayRewardShareRatio =
     gateway.settings.delegateRewardShareRatio / 100;
-  const totalDelegatedStake = new mIOToken(gateway.totalDelegatedStake).toIO();
+  const totalDelegatedStake = new mARIOToken(gateway.totalDelegatedStake).toARIO();
 
-  const rewardsSharedPerEpoch = new IOToken(
+  const rewardsSharedPerEpoch = new ARIOToken(
     baseGatewayReward * gatewayRewardShareRatio,
   );
 
@@ -101,7 +101,7 @@ export const calculateGatewayRewards = (
 
 export const calculateUserRewards = (
   gatewayRewards: GatewayRewards,
-  userDelegatedStake: IOToken,
+  userDelegatedStake: ARIOToken,
   removingStake = false,
 ): UserRewards => {
   const multiplier = removingStake ? -1 : 1;
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index d90faa2b..3571df15 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -8,7 +8,7 @@ interface ImportMetaEnv {
   readonly VITE_SENTRY_DSN_PROJECT_ID: string;
   readonly VITE_NODE_ENV: string;
   readonly VITE_GITHUB_HASH: string;
-  readonly VITE_IO_PROCESS_ID: string;
+  readonly VITE_ARIO_PROCESS_ID: string;
   readonly VITE_AO_CU_URL: string;
 }
 
diff --git a/tests/components/forms/validation.test.ts b/tests/components/forms/validation.test.ts
index 17634bf4..cd345865 100644
--- a/tests/components/forms/validation.test.ts
+++ b/tests/components/forms/validation.test.ts
@@ -1,6 +1,6 @@
 import {
   validateDomainName,
-  validateIOAmount,
+  validateARIOAmount,
   validateNumberRange,
   validateString,
   validateTransactionId,
@@ -97,7 +97,7 @@ describe('Form Validation Functions', () => {
   });
 
   describe('validateIOAmount', () => {
-    const validator = validateIOAmount('tIO Amount', 'tIO', 10, 100);
+    const validator = validateARIOAmount('tIO Amount', 'tIO', 10, 100);
 
     it('should fail for empty string', () => {
       expect(validator('')).toEqual(
diff --git a/tests/utils/rewards.test.ts b/tests/utils/rewards.test.ts
index 81664c2a..c0bd48dc 100644
--- a/tests/utils/rewards.test.ts
+++ b/tests/utils/rewards.test.ts
@@ -1,4 +1,4 @@
-import { AoGateway, IOToken } from '@ar.io/sdk/web';
+import { AoGateway, ARIOToken } from '@ar.io/sdk/web';
 import {
   GatewayRewards,
   calculateGatewayRewards,
@@ -8,10 +8,10 @@ import {
 describe('rewards.ts', () => {
   describe('calculateGatewayRewards', () => {
     it('should calculate gateway rewards correctly', () => {
-      const protocolBalance = new IOToken(50_000_000);
+      const protocolBalance = new ARIOToken(50_000_000);
       const totalGateways = 300;
       const gateway = {
-        totalDelegatedStake: new IOToken(50000).toMIO().valueOf(),
+        totalDelegatedStake: new ARIOToken(50000).toMARIO().valueOf(),
         settings: {
           delegateRewardShareRatio: 50,
         },
@@ -24,7 +24,7 @@ describe('rewards.ts', () => {
       );
 
       expect(result.totalDelegatedStake.valueOf()).toEqual(
-        new IOToken(50000).valueOf(),
+        new ARIOToken(50000).valueOf(),
       );
       expect(result.rewardsSharedPerEpoch.valueOf()).toBeCloseTo(37.5, 1);
       expect(result.EEY).toBeCloseTo(0.004);
@@ -35,12 +35,12 @@ describe('rewards.ts', () => {
   describe('calculateUserRewards', () => {
     it('should calculate user rewards correctly', () => {
       const gatewayRewards: GatewayRewards = {
-        totalDelegatedStake: new IOToken(50000),
-        rewardsSharedPerEpoch: new IOToken(197.91),
+        totalDelegatedStake: new ARIOToken(50000),
+        rewardsSharedPerEpoch: new ARIOToken(197.91),
         EEY: 0.0038,
         EAY: 0.2058,
       };
-      const userDelegatedStake = new IOToken(5000);
+      const userDelegatedStake = new ARIOToken(5000);
 
       const result = calculateUserRewards(gatewayRewards, userDelegatedStake);
 
diff --git a/yarn.lock b/yarn.lock
index 1ac0e08b..d15e953a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -35,10 +35,10 @@
     plimit-lit "^3.0.1"
     warp-contracts "1.4.45"
 
-"@ar.io/sdk@2.7.0-alpha.5":
-  version "2.7.0-alpha.5"
-  resolved "https://registry.yarnpkg.com/@ar.io/sdk/-/sdk-2.7.0-alpha.5.tgz#d95719058d63b703fd8e551830c28399722acf18"
-  integrity sha512-rJczCspZIJDKLO6sZDELQohMJlKFx6kAxThSZczh38+U2K4uFzt3zB7KukLCq0hC4gQBW3ZEXitlvikSkLNqtw==
+"@ar.io/sdk@3.0.1-alpha.1":
+  version "3.0.1-alpha.1"
+  resolved "https://registry.yarnpkg.com/@ar.io/sdk/-/sdk-3.0.1-alpha.1.tgz#4c0ccd5df8628039342be611125fba7061d301b4"
+  integrity sha512-XKvDA3uygPskb++QPkByBfrIfNxvsiKRHO35Sy0eZ8GevnBuc2TKNVCtZVYKn2A8zduD7Jx9egFQBUw/XN/qtA==
   dependencies:
     "@dha-team/arbundles" "^1.0.1"
     "@permaweb/aoconnect" "^0.0.57"
@@ -2415,6 +2415,11 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/primitive@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.1.0.tgz#42ef83b3b56dccad5d703ae8c42919a68798bbe2"
+  integrity sha512-4Z8dn6Upk0qk4P74xBhZ6Hd/w0mPEzOOLxy4xiPXOXqjF7jZS0VAKk7/x/H6FyY2zCkYJqePf1G5KmkmNJ4RBA==
+
 "@radix-ui/react-arrow@1.0.3":
   version "1.0.3"
   resolved "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.0.3.tgz"
@@ -2423,6 +2428,23 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-primitive" "1.0.3"
 
+"@radix-ui/react-arrow@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-arrow/-/react-arrow-1.1.0.tgz#744f388182d360b86285217e43b6c63633f39e7a"
+  integrity sha512-FmlW1rCg7hBpEBwFbjHwCW6AmWLQM6g/v0Sn8XbP9NvmSZ2San1FpQeyPtufzOMSIx7Y4dzjlHoifhp+7NkZhw==
+  dependencies:
+    "@radix-ui/react-primitive" "2.0.0"
+
+"@radix-ui/react-collection@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-collection/-/react-collection-1.1.0.tgz#f18af78e46454a2360d103c2251773028b7724ed"
+  integrity sha512-GZsZslMJEyo1VKm5L1ZJY8tGDxZNPAoUeQUIbKeJfoi7Q4kmig5AsgLMYYuyYbfjd8fBmFORAIwYAkXMnXZgZw==
+  dependencies:
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-context" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-slot" "1.1.0"
+
 "@radix-ui/react-compose-refs@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz"
@@ -2430,6 +2452,11 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/react-compose-refs@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.0.tgz#656432461fc8283d7b591dcf0d79152fae9ecc74"
+  integrity sha512-b4inOtiaOnYf9KWyO3jAeeCG6FeyfY6ldiEPanbUjWd+xIk5wZeHa8yVwmrJ2vderhu/BQvzCrJI0lHd+wIiqw==
+
 "@radix-ui/react-context@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.0.1.tgz"
@@ -2437,6 +2464,21 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/react-context@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.1.0.tgz#6df8d983546cfd1999c8512f3a8ad85a6e7fcee8"
+  integrity sha512-OKrckBy+sMEgYM/sMmqmErVn0kZqrHPJze+Ql3DzYsDDp0hl0L62nx/2122/Bvps1qz645jlcu2tD9lrRSdf8A==
+
+"@radix-ui/react-context@1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.1.1.tgz#82074aa83a472353bb22e86f11bcbd1c61c4c71a"
+  integrity sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==
+
+"@radix-ui/react-direction@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-direction/-/react-direction-1.1.0.tgz#a7d39855f4d077adc2a1922f9c353c5977a09cdc"
+  integrity sha512-BUuBvgThEiAXh2DWu93XsT+a3aWrGqolGlqqw5VU1kG7p/ZH2cuDlM1sRLNnY3QcBS69UIz2mcKhMxDsdewhjg==
+
 "@radix-ui/react-dismissable-layer@1.0.5":
   version "1.0.5"
   resolved "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.5.tgz"
@@ -2449,6 +2491,44 @@
     "@radix-ui/react-use-callback-ref" "1.0.1"
     "@radix-ui/react-use-escape-keydown" "1.0.3"
 
+"@radix-ui/react-dismissable-layer@1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.1.tgz#cbdcb739c5403382bdde5f9243042ba643883396"
+  integrity sha512-QSxg29lfr/xcev6kSz7MAlmDnzbP1eI/Dwn3Tp1ip0KT5CUELsxkekFEMVBEoykI3oV39hKT4TKZzBNMbcTZYQ==
+  dependencies:
+    "@radix-ui/primitive" "1.1.0"
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+    "@radix-ui/react-use-escape-keydown" "1.1.0"
+
+"@radix-ui/react-dropdown-menu@^2.1.2":
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.1.2.tgz#acc49577130e3c875ef0133bd1e271ea3392d924"
+  integrity sha512-GVZMR+eqK8/Kes0a36Qrv+i20bAPXSn8rCBTHx30w+3ECnR5o3xixAlqcVaYvLeyKUsm0aqyhWfmUcqufM8nYA==
+  dependencies:
+    "@radix-ui/primitive" "1.1.0"
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-context" "1.1.1"
+    "@radix-ui/react-id" "1.1.0"
+    "@radix-ui/react-menu" "2.1.2"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-controllable-state" "1.1.0"
+
+"@radix-ui/react-focus-guards@1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.1.1.tgz#8635edd346304f8b42cae86b05912b61aef27afe"
+  integrity sha512-pSIwfrT1a6sIoDASCSpFwOasEwKTZWDw/iBdtnqKO7v6FeOzYJ7U53cPzYFVR3geGGXgVHaH+CdngrrAzqUGxg==
+
+"@radix-ui/react-focus-scope@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.0.tgz#ebe2891a298e0a33ad34daab2aad8dea31caf0b2"
+  integrity sha512-200UD8zylvEyL8Bx+z76RJnASR2gRMuxlgFCPAe/Q/679a/r0eK3MBVYMb7vZODZcffZBdob1EGnky78xmVvcA==
+  dependencies:
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+
 "@radix-ui/react-id@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.0.1.tgz"
@@ -2457,6 +2537,37 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-use-layout-effect" "1.0.1"
 
+"@radix-ui/react-id@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-1.1.0.tgz#de47339656594ad722eb87f94a6b25f9cffae0ed"
+  integrity sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==
+  dependencies:
+    "@radix-ui/react-use-layout-effect" "1.1.0"
+
+"@radix-ui/react-menu@2.1.2":
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-menu/-/react-menu-2.1.2.tgz#91f6815845a4298dde775563ed2d80b7ad667899"
+  integrity sha512-lZ0R4qR2Al6fZ4yCCZzu/ReTFrylHFxIqy7OezIpWF4bL0o9biKo0pFIvkaew3TyZ9Fy5gYVrR5zCGZBVbO1zg==
+  dependencies:
+    "@radix-ui/primitive" "1.1.0"
+    "@radix-ui/react-collection" "1.1.0"
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-context" "1.1.1"
+    "@radix-ui/react-direction" "1.1.0"
+    "@radix-ui/react-dismissable-layer" "1.1.1"
+    "@radix-ui/react-focus-guards" "1.1.1"
+    "@radix-ui/react-focus-scope" "1.1.0"
+    "@radix-ui/react-id" "1.1.0"
+    "@radix-ui/react-popper" "1.2.0"
+    "@radix-ui/react-portal" "1.1.2"
+    "@radix-ui/react-presence" "1.1.1"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-roving-focus" "1.1.0"
+    "@radix-ui/react-slot" "1.1.0"
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+    aria-hidden "^1.1.1"
+    react-remove-scroll "2.6.0"
+
 "@radix-ui/react-popper@1.1.3":
   version "1.1.3"
   resolved "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.1.3.tgz"
@@ -2474,6 +2585,22 @@
     "@radix-ui/react-use-size" "1.0.1"
     "@radix-ui/rect" "1.0.1"
 
+"@radix-ui/react-popper@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-popper/-/react-popper-1.2.0.tgz#a3e500193d144fe2d8f5d5e60e393d64111f2a7a"
+  integrity sha512-ZnRMshKF43aBxVWPWvbj21+7TQCvhuULWJ4gNIKYpRlQt5xGRhLx66tMp8pya2UkGHTSlhpXwmjqltDYHhw7Vg==
+  dependencies:
+    "@floating-ui/react-dom" "^2.0.0"
+    "@radix-ui/react-arrow" "1.1.0"
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-context" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+    "@radix-ui/react-use-layout-effect" "1.1.0"
+    "@radix-ui/react-use-rect" "1.1.0"
+    "@radix-ui/react-use-size" "1.1.0"
+    "@radix-ui/rect" "1.1.0"
+
 "@radix-ui/react-portal@1.0.4":
   version "1.0.4"
   resolved "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.0.4.tgz"
@@ -2482,6 +2609,14 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-primitive" "1.0.3"
 
+"@radix-ui/react-portal@1.1.2":
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.1.2.tgz#51eb46dae7505074b306ebcb985bf65cc547d74e"
+  integrity sha512-WeDYLGPxJb/5EGBoedyJbT0MpoULmwnIPMJMSldkuiMsBAv7N1cRdsTWZWht9vpPOiN3qyiGAtbK2is47/uMFg==
+  dependencies:
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-layout-effect" "1.1.0"
+
 "@radix-ui/react-presence@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.0.1.tgz"
@@ -2491,6 +2626,14 @@
     "@radix-ui/react-compose-refs" "1.0.1"
     "@radix-ui/react-use-layout-effect" "1.0.1"
 
+"@radix-ui/react-presence@1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.1.1.tgz#98aba423dba5e0c687a782c0669dcd99de17f9b1"
+  integrity sha512-IeFXVi4YS1K0wVZzXNrbaaUvIJ3qdY+/Ih4eHFhWA9SwGR9UDX7Ck8abvL57C4cv3wwMvUE0OG69Qc3NCcTe/A==
+  dependencies:
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-use-layout-effect" "1.1.0"
+
 "@radix-ui/react-primitive@1.0.3":
   version "1.0.3"
   resolved "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz"
@@ -2499,6 +2642,28 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-slot" "1.0.2"
 
+"@radix-ui/react-primitive@2.0.0":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz#fe05715faa9203a223ccc0be15dc44b9f9822884"
+  integrity sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==
+  dependencies:
+    "@radix-ui/react-slot" "1.1.0"
+
+"@radix-ui/react-roving-focus@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-1.1.0.tgz#b30c59daf7e714c748805bfe11c76f96caaac35e"
+  integrity sha512-EA6AMGeq9AEeQDeSH0aZgG198qkfHSbvWTf1HvoDmOB5bBG/qTxjYMWUKMnYiV6J/iP/J8MEFSuB2zRU2n7ODA==
+  dependencies:
+    "@radix-ui/primitive" "1.1.0"
+    "@radix-ui/react-collection" "1.1.0"
+    "@radix-ui/react-compose-refs" "1.1.0"
+    "@radix-ui/react-context" "1.1.0"
+    "@radix-ui/react-direction" "1.1.0"
+    "@radix-ui/react-id" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+    "@radix-ui/react-use-controllable-state" "1.1.0"
+
 "@radix-ui/react-slot@1.0.2":
   version "1.0.2"
   resolved "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.2.tgz"
@@ -2507,6 +2672,13 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-compose-refs" "1.0.1"
 
+"@radix-ui/react-slot@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.1.0.tgz#7c5e48c36ef5496d97b08f1357bb26ed7c714b84"
+  integrity sha512-FUCf5XMfmW4dtYl69pdS4DbxKy8nj4M7SafBgPllysxmdachynNflAdp/gCsnYWNDnge6tI9onzMp5ARYc1KNw==
+  dependencies:
+    "@radix-ui/react-compose-refs" "1.1.0"
+
 "@radix-ui/react-tooltip@^1.0.7":
   version "1.0.7"
   resolved "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.0.7.tgz"
@@ -2533,6 +2705,11 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/react-use-callback-ref@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.0.tgz#bce938ca413675bc937944b0d01ef6f4a6dc5bf1"
+  integrity sha512-CasTfvsy+frcFkbXtSJ2Zu9JHpN8TYKxkgJGWbjiZhFivxaeW7rMeZt7QELGVLaYVfFMsKHjb7Ak0nMEe+2Vfw==
+
 "@radix-ui/react-use-controllable-state@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.1.tgz"
@@ -2541,6 +2718,13 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-use-callback-ref" "1.0.1"
 
+"@radix-ui/react-use-controllable-state@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.1.0.tgz#1321446857bb786917df54c0d4d084877aab04b0"
+  integrity sha512-MtfMVJiSr2NjzS0Aa90NPTnvTSg6C/JLCV7ma0W6+OMV78vd8OyRpID+Ng9LxzsPbLeuBnWBA1Nq30AtBIDChw==
+  dependencies:
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+
 "@radix-ui/react-use-escape-keydown@1.0.3":
   version "1.0.3"
   resolved "https://registry.npmjs.org/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.3.tgz"
@@ -2549,6 +2733,13 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-use-callback-ref" "1.0.1"
 
+"@radix-ui/react-use-escape-keydown@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.1.0.tgz#31a5b87c3b726504b74e05dac1edce7437b98754"
+  integrity sha512-L7vwWlR1kTTQ3oh7g1O0CBF3YCyyTj8NmhLR+phShpyA50HCfBFKVJTpshm9PzLiKmehsrQzTYTpX9HvmC9rhw==
+  dependencies:
+    "@radix-ui/react-use-callback-ref" "1.1.0"
+
 "@radix-ui/react-use-layout-effect@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz"
@@ -2556,6 +2747,11 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/react-use-layout-effect@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.1.0.tgz#3c2c8ce04827b26a39e442ff4888d9212268bd27"
+  integrity sha512-+FPE0rOdziWSrH9athwI1R0HDVbWlEhd+FR+aSDk4uWGmSJ9Z54sdZVDQPZAinJhJXwfT+qnj969mCsT2gfm5w==
+
 "@radix-ui/react-use-rect@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.0.1.tgz"
@@ -2564,6 +2760,13 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/rect" "1.0.1"
 
+"@radix-ui/react-use-rect@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-rect/-/react-use-rect-1.1.0.tgz#13b25b913bd3e3987cc9b073a1a164bb1cf47b88"
+  integrity sha512-0Fmkebhr6PiseyZlYAOtLS+nb7jLmpqTrJyv61Pe68MKYW6OWdRE2kI70TaYY27u7H0lajqM3hSMMLFq18Z7nQ==
+  dependencies:
+    "@radix-ui/rect" "1.1.0"
+
 "@radix-ui/react-use-size@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz"
@@ -2572,6 +2775,13 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-use-layout-effect" "1.0.1"
 
+"@radix-ui/react-use-size@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-size/-/react-use-size-1.1.0.tgz#b4dba7fbd3882ee09e8d2a44a3eed3a7e555246b"
+  integrity sha512-XW3/vWuIXHa+2Uwcc2ABSfcCledmXhhQPlGbfcRXbiUQI5Icjcg19BGCZVKKInYbvUCut/ufbbLLPFC5cbb1hw==
+  dependencies:
+    "@radix-ui/react-use-layout-effect" "1.1.0"
+
 "@radix-ui/react-visually-hidden@1.0.3":
   version "1.0.3"
   resolved "https://registry.npmjs.org/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.0.3.tgz"
@@ -2587,6 +2797,11 @@
   dependencies:
     "@babel/runtime" "^7.13.10"
 
+"@radix-ui/rect@1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/rect/-/rect-1.1.0.tgz#f817d1d3265ac5415dadc67edab30ae196696438"
+  integrity sha512-A9+lCBZoaMJlVKcRBz2YByCG+Cp2t6nAnMnNba+XiWxnj6r4JUFqfsgwocMBZU9LPtdxC6wB56ySYpc7LQIoJg==
+
 "@randlabs/communication-bridge@1.0.1":
   version "1.0.1"
   resolved "https://registry.npmjs.org/@randlabs/communication-bridge/-/communication-bridge-1.0.1.tgz"
@@ -4055,6 +4270,13 @@ argparse@^2.0.1:
   resolved "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
+aria-hidden@^1.1.1:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/aria-hidden/-/aria-hidden-1.2.4.tgz#b78e383fdbc04d05762c78b4a25a501e736c4522"
+  integrity sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==
+  dependencies:
+    tslib "^2.0.0"
+
 aria-query@5.1.3:
   version "5.1.3"
   resolved "https://registry.npmjs.org/aria-query/-/aria-query-5.1.3.tgz"
@@ -5610,6 +5832,11 @@ detect-newline@^3.0.0:
   resolved "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz"
   integrity sha512-TLz+x/vEXm/Y7P7wn1EJFNLxYpUD4TgMosxY6fAVJUnJMbupHBOncxyWUG9OpTaH9EBD7uFI5LfEgmMOc54DsA==
 
+detect-node-es@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/detect-node-es/-/detect-node-es-1.1.0.tgz#163acdf643330caa0b4cd7c21e7ee7755d6fa493"
+  integrity sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==
+
 dexie-react-hooks@^1.1.7:
   version "1.1.7"
   resolved "https://registry.npmjs.org/dexie-react-hooks/-/dexie-react-hooks-1.1.7.tgz"
@@ -6628,6 +6855,11 @@ get-intrinsic@^1.1.3, get-intrinsic@^1.2.1, get-intrinsic@^1.2.2, get-intrinsic@
     has-symbols "^1.0.3"
     hasown "^2.0.0"
 
+get-nonce@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/get-nonce/-/get-nonce-1.0.1.tgz#fdf3f0278073820d2ce9426c18f07481b1e0cdf3"
+  integrity sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==
+
 get-package-type@^0.1.0:
   version "0.1.0"
   resolved "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz"
@@ -7113,6 +7345,13 @@ internal-slot@^1.0.4, internal-slot@^1.0.7:
   resolved "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz"
   integrity sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==
 
+invariant@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
+  dependencies:
+    loose-envify "^1.0.0"
+
 is-arguments@^1.0.4, is-arguments@^1.1.1:
   version "1.1.1"
   resolved "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz"
@@ -8402,7 +8641,7 @@ loglevel@^1.9.1:
   resolved "https://registry.npmjs.org/loglevel/-/loglevel-1.9.1.tgz"
   integrity sha512-hP3I3kCrDIMuRwAwHltphhDM1r8i55H33GgqjXbrisuJhF4kRhW1dNuxsRklp4bXl8DSdLaNLuiL4A/LWRfxvg==
 
-loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -9625,6 +9864,25 @@ react-refresh@^0.14.2:
   resolved "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz"
   integrity sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==
 
+react-remove-scroll-bar@^2.3.6:
+  version "2.3.6"
+  resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.6.tgz#3e585e9d163be84a010180b18721e851ac81a29c"
+  integrity sha512-DtSYaao4mBmX+HDo5YWYdBWQwYIQQshUV/dVxFxK+KM26Wjwp1gZ6rv6OC3oujI6Bfu6Xyg3TwK533AQutsn/g==
+  dependencies:
+    react-style-singleton "^2.2.1"
+    tslib "^2.0.0"
+
+react-remove-scroll@2.6.0:
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.6.0.tgz#fb03a0845d7768a4f1519a99fdb84983b793dc07"
+  integrity sha512-I2U4JVEsQenxDAKaVa3VZ/JeJZe0/2DxPWL8Tj8yLKctQJQiZM52pn/GWFpSp8dftjM3pSAHVJZscAnC/y+ySQ==
+  dependencies:
+    react-remove-scroll-bar "^2.3.6"
+    react-style-singleton "^2.2.1"
+    tslib "^2.1.0"
+    use-callback-ref "^1.3.0"
+    use-sidecar "^1.1.2"
+
 react-router-dom@^6.22.1:
   version "6.23.1"
   resolved "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.23.1.tgz"
@@ -9649,6 +9907,15 @@ react-smooth@^4.0.0:
     prop-types "^15.8.1"
     react-transition-group "^4.4.5"
 
+react-style-singleton@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.2.1.tgz#f99e420492b2d8f34d38308ff660b60d0b1205b4"
+  integrity sha512-ZWj0fHEMyWkHzKYUr2Bs/4zU6XLmq9HsgBURm7g5pAVfyn49DgUiNgY2d4lXRlYSiCif9YBGpQleewkcqddc7g==
+  dependencies:
+    get-nonce "^1.0.0"
+    invariant "^2.2.4"
+    tslib "^2.0.0"
+
 react-transition-group@^4.4.5:
   version "4.4.5"
   resolved "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz"
@@ -10856,6 +11123,11 @@ tsconfig-paths@^3.15.0:
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
+tslib@^2.0.0, tslib@^2.8.0:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
+  integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
+
 tslib@^2.0.3, tslib@^2.4.0:
   version "2.6.2"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz"
@@ -10866,11 +11138,6 @@ tslib@^2.1.0:
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz"
   integrity sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==
 
-tslib@^2.8.0:
-  version "2.8.1"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f"
-  integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==
-
 tty-browserify@0.0.1:
   version "0.0.1"
   resolved "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.1.tgz"
@@ -11082,6 +11349,21 @@ url@^0.11.0:
     punycode "^1.4.1"
     qs "^6.11.2"
 
+use-callback-ref@^1.3.0:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/use-callback-ref/-/use-callback-ref-1.3.2.tgz#6134c7f6ff76e2be0b56c809b17a650c942b1693"
+  integrity sha512-elOQwe6Q8gqZgDA8mrh44qRTQqpIHDcZ3hXTLjBe1i4ph8XpNJnO+aQf3NaG+lriLopI4HMx9VjQLfPQ6vhnoA==
+  dependencies:
+    tslib "^2.0.0"
+
+use-sidecar@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/use-sidecar/-/use-sidecar-1.1.2.tgz#2f43126ba2d7d7e117aa5855e5d8f0276dfe73c2"
+  integrity sha512-epTbsLuzZ7lPClpz2TyryBfztm7m+28DlEv2ZCQ3MDr5ssiwyOwGH/e5F9CkfWjJ1t4clvI58yF822/GUkjjhw==
+  dependencies:
+    detect-node-es "^1.1.0"
+    tslib "^2.0.0"
+
 use-sync-external-store@1.2.0:
   version "1.2.0"
   resolved "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz"