src/wallet/WalletLoginModal.tsx

@@ -146,6 +146,18 @@ export function WalletLoginModal() {
       .finally(() => setState("idle"));
   };
 
+  // Desktop: open the RainbowKit modal — it discovers every installed wallet
+  // via EIP-6963 (robust when several extensions fight over window.ethereum)
+  // and also offers a WalletConnect QR. Fall back to the raw injected flow only
+  // when WalletConnect has no project id configured.
+  const connectBrowserWallet = () => {
+    if (wc.available) {
+      wc.start();
+      return;
+    }
+    void signInjected();
+  };
+
   const openApp = (kind: WalletKind) => {
     setError("");
     setOpeningWallet(kind);
@@ -201,27 +213,30 @@ export function WalletLoginModal() {
         </div>
 
         <div className="mt-5 grid gap-3">
-          {/* Injected wallet: browser extension (desktop) or in-wallet browser. */}
+          {/* Browser wallet: in a wallet's in-app browser we sign directly with
-          {hasInjected ? (
+              the injected provider; on desktop we open the RainbowKit picker so
+              the user can choose among installed extensions reliably. */}
+          {mobileDevice && hasInjected ? (
             <button
               type="button"
               onClick={() => void signInjected()}
               disabled={busy}
               className="flex items-center justify-center gap-2 rounded-2xl bg-ark-gold px-4 py-4 text-base font-bold text-black transition hover:bg-ark-gold2 disabled:cursor-wait disabled:opacity-70"
             >
-              {state === "signing"
+              {state === "signing" ? t("walletSigning") : t("walletUseCurrent")}
-                ? t("walletSigning")
-                : mobileDevice
-                  ? t("walletUseCurrent")
-                  : t("walletInjected")}
             </button>
           ) : !mobileDevice ? (
             <button
               type="button"
-              onClick={() => void signInjected()}
+              onClick={connectBrowserWallet}
-              className="flex items-center justify-center gap-2 rounded-2xl border border-ark-gold/50 bg-ark-gold/5 px-4 py-3 text-sm font-semibold text-ark-gold transition hover:bg-ark-gold/10"
+              disabled={busy || wc.state !== "idle"}
+              className="flex items-center justify-center gap-2 rounded-2xl bg-ark-gold px-4 py-4 text-base font-bold text-black transition hover:bg-ark-gold2 disabled:cursor-wait disabled:opacity-70"
             >
-              {t("walletInjected")}
+              {wc.state === "connecting"
+                ? t("walletConnecting")
+                : wc.state === "signing" || state === "signing"
+                  ? t("walletSigning")
+                  : t("walletInjected")}
             </button>
           ) : null}