From 142582cf1bcaf9fa03d044078aa81c2c232d6781 Mon Sep 17 00:00:00 2001
From: Brendan Forster <brendan.forster@coinbase.com>
Date: Fri, 8 Nov 2024 14:58:26 -0800
Subject: [PATCH] TopNav uses dynamic gas dropdown and connect wallet

---
 .../base-org/shared/TopNavigation/index.tsx   | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/apps/web/src/components/base-org/shared/TopNavigation/index.tsx b/apps/web/src/components/base-org/shared/TopNavigation/index.tsx
index 06280970da..6e99fa71bc 100644
--- a/apps/web/src/components/base-org/shared/TopNavigation/index.tsx
+++ b/apps/web/src/components/base-org/shared/TopNavigation/index.tsx
@@ -1,18 +1,19 @@
 'use client';
 
-import AnalyticsProvider from 'apps/web/contexts/Analytics';
-import Link from 'next/link';
-import logo from './assets/logo.svg';
+import { Suspense } from 'react';
 import Image, { StaticImageData } from 'next/image';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+
+import AnalyticsProvider from 'apps/web/contexts/Analytics';
+import logo from 'apps/web/src/components/base-org/shared/TopNavigation/assets/logo.svg';
+import MenuDesktop from 'apps/web/src/components/base-org/shared/TopNavigation/MenuDesktop';
+import MenuMobile from 'apps/web/src/components/base-org/shared/TopNavigation/MenuMobile';
+import { DynamicWrappedGasPriceDropdown } from 'apps/web/src/components/base-org/shared/TopNavigation/GasPriceDropdown';
 import {
-  WrappedConnectWalletButton,
+  DynamicWrappedConnectWalletButton,
   ConnectWalletButtonVariants,
 } from 'apps/web/src/components/ConnectWalletButton/ConnectWalletButton';
-import MenuDesktop from 'apps/web/src/components/base-org/shared/TopNavigation/MenuDesktop';
-import MenuMobile from 'apps/web/src/components/base-org/shared/TopNavigation/MenuMobile';
-import { WrappedGasPriceDropdown } from 'apps/web/src/components/base-org/shared/TopNavigation/GasPriceDropdown';
-import { Suspense } from 'react';
-import { usePathname } from 'next/navigation';
 
 export type SubItem = {
   name: string;
@@ -109,7 +110,7 @@ export default function TopNavigation() {
             <Link href="/" className="flex min-h-[3rem] min-w-[3rem]">
               <Image src={logo as StaticImageData} alt="Base Logo" />
             </Link>
-            {showGasDropdownAndConnectWallet && <WrappedGasPriceDropdown />}
+            {showGasDropdownAndConnectWallet && <DynamicWrappedGasPriceDropdown />}
           </div>
 
           <div className="hidden md:inline-block">
@@ -124,7 +125,7 @@ export default function TopNavigation() {
           <div className="flex items-end justify-end md:min-w-[16rem]">
             {showGasDropdownAndConnectWallet && (
               <Suspense>
-                <WrappedConnectWalletButton
+                <DynamicWrappedConnectWalletButton
                   connectWalletButtonVariant={ConnectWalletButtonVariants.BaseOrg}
                 />
               </Suspense>