Solicitar Metamask con “eth_requestAccounts” no funciona en next.js.

Este es un proyecto de Next.js. Detecté Metamask:

import detectEthereumProvider from "@metamask/detect-provider";

let provider;
if (typeof window !== "undefined") {
  // para simplificar, he configurado Next.js para usar el await de nivel superior
  provider = await detectEthereumProvider();
}
// El proveedor está detectado
console.log("proveedor", proveedor);

Esta es la función para enviar una solicitud a Metamask. No está arrojando errores:

const connect = async () => {
    try {
      await provider.request({ method: "eth_requestAccounts" });
    } catch (e) {
      console.log("error en la solicitud", e);
      // location.reload();
    }
  };

Agregué un controlador de clics:

<Button onClick={connect}>Conectar</Button>

No está sucediendo nada. Así que cambié el controlador de clics a:

<Button
  onClick={() => {
    // esto se está registrando.
    console.log("clic para enviar solicitud a Metamask");
    connect;
  }}
>
  Conectar
</Button>

Está registrando que hice clic en el botón, pero no está enviando la solicitud a Metamask.