diff --git a/apps/staking/src/app/api/v1/cmc/supply/route.ts b/apps/staking/src/app/api/v1/cmc/supply/route.ts
index 21298dd963..d895a143fb 100644
--- a/apps/staking/src/app/api/v1/cmc/supply/route.ts
+++ b/apps/staking/src/app/api/v1/cmc/supply/route.ts
@@ -4,19 +4,17 @@ import { clusterApiUrl, Connection } from "@solana/web3.js";
 import type { NextRequest } from "next/server";
 import { z } from "zod";
 
-import { IS_MAINNET, RPC } from "../../../../../config/server";
+import { MAINNET_RPC } from "../../../../../config/server";
 
 const querySchema = z.enum(["totalSupply", "circulatingSupply"]);
 
 export async function GET(req: NextRequest) {
+  const isMainnet = req.nextUrl.searchParams.get("devnet") !== "true";
   const stakingClient = new PythStakingClient({
     connection: new Connection(
-      RPC ??
-        clusterApiUrl(
-          IS_MAINNET
-            ? WalletAdapterNetwork.Mainnet
-            : WalletAdapterNetwork.Devnet,
-        ),
+      isMainnet && MAINNET_RPC !== undefined
+        ? MAINNET_RPC
+        : clusterApiUrl(WalletAdapterNetwork.Devnet),
       {
         httpHeaders: {
           Origin: req.nextUrl.origin,
diff --git a/apps/staking/src/app/api/v1/locked_accounts/route.ts b/apps/staking/src/app/api/v1/locked_accounts/route.ts
index 47f2ad9949..cd8817b20b 100644
--- a/apps/staking/src/app/api/v1/locked_accounts/route.ts
+++ b/apps/staking/src/app/api/v1/locked_accounts/route.ts
@@ -4,7 +4,7 @@ import { clusterApiUrl, Connection, PublicKey } from "@solana/web3.js";
 import type { NextRequest } from "next/server";
 import { z } from "zod";
 
-import { IS_MAINNET, RPC } from "../../../../config/server";
+import { MAINNET_RPC } from "../../../../config/server";
 import { tokensToString } from "../../../../tokens";
 
 const UnlockScheduleSchema = z.object({
@@ -35,14 +35,12 @@ const isValidPublicKey = (publicKey: string) => {
 };
 
 export async function GET(req: NextRequest) {
+  const isMainnet = req.nextUrl.searchParams.get("devnet") !== "true";
   const stakingClient = new PythStakingClient({
     connection: new Connection(
-      RPC ??
-        clusterApiUrl(
-          IS_MAINNET
-            ? WalletAdapterNetwork.Mainnet
-            : WalletAdapterNetwork.Devnet,
-        ),
+      isMainnet && MAINNET_RPC !== undefined
+        ? MAINNET_RPC
+        : clusterApiUrl(WalletAdapterNetwork.Devnet),
       {
         httpHeaders: {
           Origin: req.nextUrl.origin,
diff --git a/apps/staking/src/components/Menu/index.tsx b/apps/staking/src/components/Menu/index.tsx
index 9c71f11b99..752c81dfb5 100644
--- a/apps/staking/src/components/Menu/index.tsx
+++ b/apps/staking/src/components/Menu/index.tsx
@@ -23,16 +23,13 @@ export const Menu = <T extends object>({
   ...props
 }: MenuProps<T>) => (
   <Popover
-    className="data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in data-[exiting]:fade-out"
+    className={clsx(
+      "flex origin-top-right flex-col border border-neutral-400 bg-pythpurple-100 py-2 text-sm text-pythpurple-950 shadow shadow-neutral-400 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in data-[exiting]:fade-out",
+      className,
+    )}
     {...(placement && { placement })}
   >
-    <BaseMenu
-      className={clsx(
-        "flex origin-top-right flex-col border border-neutral-400 bg-pythpurple-100 py-2 text-sm text-pythpurple-950 shadow shadow-neutral-400 outline-none",
-        className,
-      )}
-      {...props}
-    />
+    <BaseMenu className="outline-none" {...props} />
   </Popover>
 );
 
@@ -51,7 +48,7 @@ export const MenuItem = ({
   <BaseMenuItem
     textValue={textValue ?? (typeof children === "string" ? children : "")}
     className={clsx(
-      "flex cursor-pointer items-center gap-2 whitespace-nowrap px-4 py-2 text-left data-[disabled]:cursor-default data-[focused]:bg-pythpurple-800/20 data-[has-submenu]:data-[open]:bg-pythpurple-800/10 data-[has-submenu]:data-[open]:data-[focused]:bg-pythpurple-800/20 focus:outline-none focus-visible:outline-none",
+      "flex cursor-pointer items-center gap-2 whitespace-nowrap px-4 py-2 text-left outline-none data-[disabled]:cursor-default data-[focused]:bg-pythpurple-800/20 data-[has-submenu]:data-[open]:bg-pythpurple-800/10 data-[has-submenu]:data-[open]:data-[focused]:bg-pythpurple-800/20",
       className,
     )}
     {...props}
diff --git a/apps/staking/src/components/OracleIntegrityStaking/index.tsx b/apps/staking/src/components/OracleIntegrityStaking/index.tsx
index 865550945d..f99a413d88 100644
--- a/apps/staking/src/components/OracleIntegrityStaking/index.tsx
+++ b/apps/staking/src/components/OracleIntegrityStaking/index.tsx
@@ -30,7 +30,6 @@ import {
   Label,
   TextField,
   Form,
-  Switch,
   MenuTrigger,
 } from "react-aria-components";
 
@@ -50,6 +49,7 @@ import { Select } from "../Select";
 import { SparkChart } from "../SparkChart";
 import { StakingTimeline } from "../StakingTimeline";
 import { Styled } from "../Styled";
+import { Switch } from "../Switch";
 import { Tokens } from "../Tokens";
 import { AmountType, TransferButton } from "../TransferButton";
 import { TruncatedKey } from "../TruncatedKey";
@@ -709,15 +709,8 @@ const PublisherList = ({
           <Switch
             isSelected={yoursFirst}
             onChange={updateYoursFirst}
-            className="group flex cursor-pointer flex-row items-center gap-2"
-          >
-            <div className="whitespace-nowrap opacity-80">
-              Show your positions first
-            </div>
-            <div className="h-8 w-16 flex-none rounded-full border border-neutral-400/50 bg-neutral-800/50 p-1 transition group-data-[selected]:border-pythpurple-600 group-data-[selected]:bg-pythpurple-600/10">
-              <div className="aspect-square h-full rounded-full bg-neutral-400/50 transition group-data-[selected]:translate-x-8 group-data-[selected]:bg-pythpurple-600" />
-            </div>
-          </Switch>
+            preLabel="Show your positions first"
+          />
         </div>
       </div>
 
diff --git a/apps/staking/src/components/Root/index.tsx b/apps/staking/src/components/Root/index.tsx
index 2402fb42ad..cc261b642b 100644
--- a/apps/staking/src/components/Root/index.tsx
+++ b/apps/staking/src/components/Root/index.tsx
@@ -1,8 +1,7 @@
 import { GoogleAnalytics } from "@next/third-parties/google";
-import { WalletAdapterNetwork } from "@solana/wallet-adapter-base";
 import clsx from "clsx";
 import { Red_Hat_Text, Red_Hat_Mono } from "next/font/google";
-import type { ReactNode, CSSProperties } from "react";
+import type { ReactNode, CSSProperties, HTMLProps } from "react";
 
 import { I18nProvider } from "./i18n-provider";
 import { RestrictedRegionBanner } from "./restricted-region-banner";
@@ -11,12 +10,12 @@ import {
   GOOGLE_ANALYTICS_ID,
   AMPLITUDE_API_KEY,
   WALLETCONNECT_PROJECT_ID,
-  RPC,
+  MAINNET_RPC,
   HERMES_URL,
-  IS_MAINNET,
 } from "../../config/server";
 import { ApiProvider } from "../../hooks/use-api";
 import { LoggerProvider } from "../../hooks/use-logger";
+import { NetworkProvider } from "../../hooks/use-network";
 import { Amplitude } from "../Amplitude";
 import { Footer } from "../Footer";
 import { Header } from "../Header";
@@ -40,49 +39,48 @@ type Props = {
 };
 
 export const Root = ({ children }: Props) => (
+  <HtmlWithProviders
+    lang="en"
+    dir="ltr"
+    style={
+      {
+        "--header-height": "4rem",
+      } as CSSProperties
+    }
+    className={clsx(
+      "scroll-pt-header-height",
+      redHatText.variable,
+      redHatMono.variable,
+    )}
+  >
+    <body className="grid min-h-dvh grid-rows-[auto_auto_1fr_auto] text-pythpurple-100 [background:radial-gradient(20rem_50rem_at_50rem_10rem,_rgba(119,_49,_234,_0.20)_0%,_rgba(17,_15,_35,_0.00)_100rem),_#0A0814] selection:bg-pythpurple-600/60">
+      <Header className="z-10" />
+      <RestrictedRegionBanner />
+      <MaxWidth className="z-0 min-h-[calc(100dvh_-_var(--header-height))] py-8 sm:min-h-0">
+        {children}
+      </MaxWidth>
+      <Footer className="z-10" />
+    </body>
+    {GOOGLE_ANALYTICS_ID && <GoogleAnalytics gaId={GOOGLE_ANALYTICS_ID} />}
+    {AMPLITUDE_API_KEY && <Amplitude apiKey={AMPLITUDE_API_KEY} />}
+    {!IS_PRODUCTION_SERVER && <ReportAccessibility />}
+  </HtmlWithProviders>
+);
+
+const HtmlWithProviders = ({ lang, ...props }: HTMLProps<HTMLHtmlElement>) => (
   <I18nProvider>
     <RouterProvider>
       <LoggerProvider>
-        <WalletProvider
-          walletConnectProjectId={WALLETCONNECT_PROJECT_ID}
-          rpc={RPC}
-          network={
-            IS_MAINNET
-              ? WalletAdapterNetwork.Mainnet
-              : WalletAdapterNetwork.Devnet
-          }
-        >
-          <ApiProvider hermesUrl={HERMES_URL}>
-            <html
-              lang="en"
-              dir="ltr"
-              style={
-                {
-                  "--header-height": "4rem",
-                } as CSSProperties
-              }
-              className={clsx(
-                "scroll-pt-header-height",
-                redHatText.variable,
-                redHatMono.variable,
-              )}
-            >
-              <body className="grid min-h-dvh grid-rows-[auto_auto_1fr_auto] text-pythpurple-100 [background:radial-gradient(20rem_50rem_at_50rem_10rem,_rgba(119,_49,_234,_0.20)_0%,_rgba(17,_15,_35,_0.00)_100rem),_#0A0814] selection:bg-pythpurple-600/60">
-                <Header className="z-10" />
-                <RestrictedRegionBanner />
-                <MaxWidth className="z-0 min-h-[calc(100dvh_-_var(--header-height))] py-8 sm:min-h-0">
-                  {children}
-                </MaxWidth>
-                <Footer className="z-10" />
-              </body>
-              {GOOGLE_ANALYTICS_ID && (
-                <GoogleAnalytics gaId={GOOGLE_ANALYTICS_ID} />
-              )}
-              {AMPLITUDE_API_KEY && <Amplitude apiKey={AMPLITUDE_API_KEY} />}
-              {!IS_PRODUCTION_SERVER && <ReportAccessibility />}
-            </html>
-          </ApiProvider>
-        </WalletProvider>
+        <NetworkProvider>
+          <WalletProvider
+            walletConnectProjectId={WALLETCONNECT_PROJECT_ID}
+            mainnetRpc={MAINNET_RPC}
+          >
+            <ApiProvider hermesUrl={HERMES_URL}>
+              <html lang={lang} {...props} />
+            </ApiProvider>
+          </WalletProvider>
+        </NetworkProvider>
       </LoggerProvider>
     </RouterProvider>
   </I18nProvider>
diff --git a/apps/staking/src/components/Switch/index.tsx b/apps/staking/src/components/Switch/index.tsx
new file mode 100644
index 0000000000..2ada253897
--- /dev/null
+++ b/apps/staking/src/components/Switch/index.tsx
@@ -0,0 +1,45 @@
+import clsx from "clsx";
+import type { ComponentProps, ReactNode } from "react";
+import { Switch as BaseSwitch } from "react-aria-components";
+
+type Props = Omit<ComponentProps<typeof BaseSwitch>, "children"> & {
+  preLabel?: ReactNode;
+  postLabel?: ReactNode;
+  size?: "small";
+};
+
+export const Switch = ({
+  preLabel,
+  postLabel,
+  className,
+  size,
+  ...props
+}: Props) => (
+  <BaseSwitch
+    className={clsx(
+      "group flex cursor-pointer flex-row items-center gap-2",
+      className,
+    )}
+    {...props}
+  >
+    {preLabel && <div className="whitespace-nowrap opacity-80">{preLabel}</div>}
+    <div
+      className={clsx(
+        "flex-none rounded-full border border-neutral-400/50 bg-neutral-800/50 p-1 transition group-data-[selected]:border-pythpurple-600 group-data-[selected]:bg-pythpurple-600/10",
+        size === "small" ? "h-6 w-10" : "h-8 w-16",
+      )}
+    >
+      <div
+        className={clsx(
+          "aspect-square h-full rounded-full bg-neutral-400/50 transition group-data-[selected]:bg-pythpurple-600",
+          size === "small"
+            ? "group-data-[selected]:translate-x-4"
+            : "group-data-[selected]:translate-x-8",
+        )}
+      />
+    </div>
+    {postLabel && (
+      <div className="whitespace-nowrap opacity-80">{postLabel}</div>
+    )}
+  </BaseSwitch>
+);
diff --git a/apps/staking/src/components/WalletButton/index.tsx b/apps/staking/src/components/WalletButton/index.tsx
index 74ad476d39..3b0aac851c 100644
--- a/apps/staking/src/components/WalletButton/index.tsx
+++ b/apps/staking/src/components/WalletButton/index.tsx
@@ -26,6 +26,7 @@ import {
   SubmenuTrigger,
   Header,
   Collection,
+  MenuItem as BaseMenuItem,
 } from "react-aria-components";
 
 import { VPN_BLOCKED_SEGMENT } from "../../config/isomorphic";
@@ -36,9 +37,11 @@ import {
 } from "../../hooks/use-api";
 import { StateType as DataStateType, useData } from "../../hooks/use-data";
 import { useLogger } from "../../hooks/use-logger";
+import { useNetwork } from "../../hooks/use-network";
 import { usePrimaryDomain } from "../../hooks/use-primary-domain";
 import { Button } from "../Button";
 import { Menu, MenuItem, Section, Separator } from "../Menu";
+import { Switch } from "../Switch";
 import { TruncatedKey } from "../TruncatedKey";
 
 const ONE_SECOND_IN_MS = 1000;
@@ -106,6 +109,7 @@ const ConnectedButton = ({
       logger.error(error);
     });
   }, [wallet, logger]);
+  const { isMainnet, toggleMainnet } = useNetwork();
 
   return (
     <MenuTrigger>
@@ -139,6 +143,20 @@ const ConnectedButton = ({
             Disconnect
           </MenuItem>
         </Section>
+        <Separator />
+        <Section>
+          <BaseMenuItem
+            className="outline-none data-[focused]:bg-pythpurple-800/20"
+            onAction={toggleMainnet}
+          >
+            <Switch
+              isSelected={isMainnet}
+              postLabel="Mainnet"
+              className="px-4 py-1"
+              size="small"
+            />
+          </BaseMenuItem>
+        </Section>
       </Menu>
     </MenuTrigger>
   );
diff --git a/apps/staking/src/components/WalletProvider/index.tsx b/apps/staking/src/components/WalletProvider/index.tsx
index 4fe28a367b..cbc2eb0720 100644
--- a/apps/staking/src/components/WalletProvider/index.tsx
+++ b/apps/staking/src/components/WalletProvider/index.tsx
@@ -20,22 +20,35 @@ import {
 import { clusterApiUrl } from "@solana/web3.js";
 import { type ReactNode, useMemo } from "react";
 
+import { useNetwork } from "../../hooks/use-network";
 import { metadata } from "../../metadata";
 
 type Props = {
-  network: WalletAdapterNetwork.Devnet | WalletAdapterNetwork.Mainnet;
   children?: ReactNode | ReactNode[] | undefined;
   walletConnectProjectId?: string | undefined;
-  rpc?: string | undefined;
+  mainnetRpc?: string | undefined;
 };
 
 export const WalletProvider = ({
-  network,
   children,
   walletConnectProjectId,
-  rpc,
+  mainnetRpc,
 }: Props) => {
-  const endpoint = useMemo(() => rpc ?? clusterApiUrl(network), [rpc, network]);
+  const { isMainnet } = useNetwork();
+
+  const network = useMemo(
+    () =>
+      isMainnet ? WalletAdapterNetwork.Mainnet : WalletAdapterNetwork.Devnet,
+    [isMainnet],
+  );
+
+  const endpoint = useMemo(
+    () =>
+      network === WalletAdapterNetwork.Mainnet && mainnetRpc !== undefined
+        ? mainnetRpc
+        : clusterApiUrl(network),
+    [mainnetRpc, network],
+  );
 
   const wallets = useMemo(
     () => [
diff --git a/apps/staking/src/config/server.ts b/apps/staking/src/config/server.ts
index a41c75da03..c1bb634438 100644
--- a/apps/staking/src/config/server.ts
+++ b/apps/staking/src/config/server.ts
@@ -51,8 +51,7 @@ export const AMPLITUDE_API_KEY = demandInProduction("AMPLITUDE_API_KEY");
 export const WALLETCONNECT_PROJECT_ID = demandInProduction(
   "WALLETCONNECT_PROJECT_ID",
 );
-export const RPC = process.env.RPC;
-export const IS_MAINNET = process.env.IS_MAINNET !== undefined;
+export const MAINNET_RPC = process.env.MAINNET_RPC;
 export const HERMES_URL = getOr("HERMES_URL", "https://hermes.pyth.network");
 export const BLOCKED_REGIONS = transformOr("BLOCKED_REGIONS", fromCsv, []);
 export const PROXYCHECK_API_KEY = demandInProduction("PROXYCHECK_API_KEY");
diff --git a/apps/staking/src/hooks/use-api.tsx b/apps/staking/src/hooks/use-api.tsx
index cdbae74f28..f1fedfaaa6 100644
--- a/apps/staking/src/hooks/use-api.tsx
+++ b/apps/staking/src/hooks/use-api.tsx
@@ -9,6 +9,7 @@ import { type ComponentProps, createContext, useContext, useMemo } from "react";
 import { useSWRConfig } from "swr";
 
 import { StateType as DataStateType, useData } from "./use-data";
+import { useNetwork } from "./use-network";
 import * as api from "../api";
 
 export enum StateType {
@@ -40,12 +41,16 @@ const State = {
   }),
 
   [StateType.LoadedNoStakeAccount]: (
+    isMainnet: boolean,
     client: PythStakingClient,
     hermesClient: HermesClient,
     onCreateAccount: (newAccount: PublicKey) => Promise<void>,
   ) => ({
     type: StateType.LoadedNoStakeAccount as const,
-    dashboardDataCacheKey: client.wallet.publicKey.toBase58(),
+    dashboardDataCacheKey: [
+      isMainnet ? "mainnet" : "devnet",
+      client.wallet.publicKey.toBase58(),
+    ],
     loadData: () => api.loadData(client, hermesClient),
     deposit: async (amount: bigint) => {
       const account = await api.createStakeAccountAndDeposit(client, amount);
@@ -54,6 +59,7 @@ const State = {
   }),
 
   [StateType.Loaded]: (
+    isMainnet: boolean,
     client: PythStakingClient,
     hermesClient: HermesClient,
     account: PublicKey,
@@ -61,15 +67,10 @@ const State = {
     selectAccount: (account: PublicKey) => void,
     mutate: ReturnType<typeof useSWRConfig>["mutate"],
   ) => {
-    const dashboardDataCacheKey = account.toBase58();
-    const accountHistoryCacheKey = `${account.toBase58()}/history`;
-
-    const reload = async () => {
-      await Promise.all([
-        mutate(dashboardDataCacheKey),
-        mutate(accountHistoryCacheKey),
-      ]);
-    };
+    const dashboardDataCacheKey = [
+      isMainnet ? "mainnet" : "devnet",
+      account.toBase58(),
+    ];
 
     const bindApi =
       <T extends unknown[]>(
@@ -81,7 +82,7 @@ const State = {
       ) =>
       async (...args: T) => {
         await fn(client, account, ...args);
-        await reload();
+        await mutate(dashboardDataCacheKey);
       };
 
     return {
@@ -90,7 +91,6 @@ const State = {
       allAccounts,
       selectAccount,
       dashboardDataCacheKey,
-      accountHistoryCacheKey,
 
       loadData: () => api.loadData(client, hermesClient, account),
 
@@ -138,6 +138,7 @@ export const ApiProvider = ({ hermesUrl, ...props }: ApiProviderProps) => {
 const useApiContext = (hermesUrl: string) => {
   const wallet = useWallet();
   const { connection } = useConnection();
+  const { isMainnet } = useNetwork();
   const { mutate } = useSWRConfig();
   const hermesClient = useMemo(() => new HermesClient(hermesUrl), [hermesUrl]);
   const pythStakingClient = useMemo(
@@ -160,7 +161,10 @@ const useApiContext = (hermesUrl: string) => {
     ],
   );
   const stakeAccounts = useData(
-    () => (pythStakingClient ? ["stakeAccounts", wallet.publicKey] : undefined),
+    () =>
+      pythStakingClient
+        ? [isMainnet ? "mainnet" : "devnet", "stakeAccounts", wallet.publicKey]
+        : undefined,
     () =>
       pythStakingClient
         ? api.getAllStakeAccountAddresses(pythStakingClient)
@@ -203,6 +207,7 @@ const useApiContext = (hermesUrl: string) => {
                   )
                 : undefined;
               return State[StateType.Loaded](
+                isMainnet,
                 pythStakingClient,
                 hermesClient,
                 selectedAccount ?? firstAccount,
@@ -214,6 +219,7 @@ const useApiContext = (hermesUrl: string) => {
               );
             } else {
               return State[StateType.LoadedNoStakeAccount](
+                isMainnet,
                 pythStakingClient,
                 hermesClient,
                 async (newAccount) => {
@@ -228,6 +234,7 @@ const useApiContext = (hermesUrl: string) => {
       return State[StateType.NoWallet]();
     }
   }, [
+    isMainnet,
     wallet.connecting,
     wallet.disconnecting,
     wallet.connected,
diff --git a/apps/staking/src/hooks/use-network.tsx b/apps/staking/src/hooks/use-network.tsx
new file mode 100644
index 0000000000..4ab9fa764b
--- /dev/null
+++ b/apps/staking/src/hooks/use-network.tsx
@@ -0,0 +1,49 @@
+"use client";
+
+import {
+  type ComponentProps,
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+} from "react";
+
+const NetworkContext = createContext<undefined | NetworkContext>(undefined);
+
+type NetworkContext = {
+  isMainnet: boolean;
+  toggleMainnet: (isMainnet?: boolean) => void;
+};
+
+type NetworkContextProps = Omit<
+  ComponentProps<typeof NetworkContext.Provider>,
+  "value"
+>;
+
+export const NetworkProvider = ({ ...props }: NetworkContextProps) => {
+  const [isMainnet, setIsMainnet] = useState(true);
+
+  const toggleMainnet = useCallback((isMainnet?: boolean) => {
+    setIsMainnet(isMainnet ?? ((prev) => !prev));
+  }, []);
+
+  return (
+    <NetworkContext.Provider value={{ isMainnet, toggleMainnet }} {...props} />
+  );
+};
+
+export const useNetwork = () => {
+  const network = useContext(NetworkContext);
+  if (network) {
+    return network;
+  } else {
+    throw new NotInitializedError();
+  }
+};
+
+class NotInitializedError extends Error {
+  constructor() {
+    super("This component must be contained within a `NetworkProvider`!");
+    this.name = "NotInitializedError";
+  }
+}