Fix dropdown placement of ChainSwitch on PC

helix-bridge · Apr 7, 2024 · e015280 · e015280
1 parent d21e66e
commit e015280
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/src/components/chain-switch.tsx b/src/components/chain-switch.tsx
@@ -1,6 +1,7 @@
 import { getChainConfig, getChainConfigs, getChainLogoSrc } from "@/utils";
 import {
  FloatingPortal,
+ Placement,
  offset,
  useClick,
  useDismiss,
@@ -14,9 +15,10 @@ import { useNetwork, useSwitchNetwork } from "wagmi";
 
 const chainOptions = getChainConfigs();
 
-export default function ChainSwitch() {
+export default function ChainSwitch({ placement }: { placement?: Placement }) {
  const [isOpen, setIsOpen] = useState(false);
  const { refs, context, floatingStyles } = useFloating({
+ placement,
  open: isOpen,
  onOpenChange: setIsOpen,
  middleware: [offset(6)],

diff --git a/src/components/header.tsx b/src/components/header.tsx
@@ -85,7 +85,7 @@ export default function Header() {
  <div className="hidden items-center gap-medium lg:flex">
  <HistoryNav />
  <User prefixLength={14} suffixLength={10} />
- <ChainSwitch />
+ <ChainSwitch placement="bottom-end" />
  </div>
  <Image
  width={24}