Skip to main content
import { SunbreakProvider } from "@tdfc/sunbreak-react";

export function MetaMaskSiwe() {
  const [address, setAddress] = React.useState<string | undefined>();
  const [proof, setProof] = React.useState<any | null>(null);

  async function connect() {
    const accounts = await window.ethereum.request({
      method: "eth_requestAccounts",
    });
    setAddress(accounts[0]?.toLowerCase());
  }

  async function signMessage() {
    if (!address) return;
    const msg = `Sign in to Sunbreak @ ${window.location.host}`;
    const sig = await window.ethereum.request({
      method: "personal_sign",
      params: [msg, address],
    });
    // set method to "siwe" for real siwe proof
    setProof({ method: "eip191", message: msg, signature: sig });
  }

  return (
    <SunbreakProvider
      base={process.env.NEXT_PUBLIC_SUNBREAK_BASE!}
      clientId={process.env.NEXT_PUBLIC_SUNBREAK_CLIENT_ID!}
      wallet={address}
      proof={proof}
    >
      <button onClick={connect}>Connect</button>
      <button onClick={signMessage}>Sign</button>
    </SunbreakProvider>
  );
}