feat: navbar wallet button and network switcher

src/components/NavbarWallet.tsx

@@ -0,0 +1,46 @@
+"use client";
+
+import { useState } from "react";
+
+/** Navbar wallet button + network switcher (GFI). */
+export function NavbarWallet({
+  address,
+  network,
+  networks = ["TESTNET", "PUBLIC"],
+  onConnect,
+  onSwitchNetwork,
+}: {
+  address?: string | null;
+  network?: string | null;
+  networks?: string[];
+  onConnect?: () => void;
+  onSwitchNetwork?: (n: string) => void;
+}) {
+  const [open, setOpen] = useState(false);
+  const short = address ? `${address.slice(0, 4)}…${address.slice(-4)}` : null;
+  return (
+    <div style={{ display: "flex", gap: 8, alignItems: "center" }}>
+      <button type="button" onClick={() => (address ? setOpen((v) => !v) : onConnect?.())}>
+        {short || "Connect wallet"}
+      </button>
+      {address ? (
+        <select
+          aria-label="Network"
+          value={network || networks[0]}
+          onChange={(e) => onSwitchNetwork?.(e.target.value)}
+        >
+          {networks.map((n) => (
+            <option key={n} value={n}>
+              {n}
+            </option>
+          ))}
+        </select>
+      ) : null}
+      {open && address ? (
+        <div role="status" style={{ fontSize: 12 }}>
+          {address}
+        </div>
+      ) : null}
+    </div>
+  );
+}