Privy

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import { PrivyProvider } from '@privy-io/react-auth';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <PrivyProvider
      appId={"clpispdty00ycl80fpueukbhl"}
      onSuccess={(user) => console.log(`User ${user.id} logged in!`)}
      createPrivyWalletOnLogin={true}
    >
      <App />
    </PrivyProvider>
  </React.StrictMode>
);

import "./App.css";
import { usePrivy, useWallets } from "@privy-io/react-auth";
import { PrimeSdk, Web3WalletProvider, Web3eip1193WalletProvider } from "@etherspot/prime-sdk";

function App() {
  const { ready, authenticated, user, login, logout } = usePrivy();
  const { wallets } = useWallets();

  // Wait until the Privy client is ready before taking any actions
  if (!ready) {
    return null;
  }

  const etherspotLogin = async () => {
  const privyProvider = await wallets[0].getWeb3jsProvider();
  const provider = privyProvider.walletProvider;

    let mappedProvider;
    if (!isWalletProvider(provider)) {
      try {
        mappedProvider = new Web3eip1193WalletProvider(provider);
        await mappedProvider.refresh();
      } catch (e) {
        // no need to log, this is an attempt
      }

      if (!mappedProvider) {
        throw new Error('Invalid provider!');
      }
    }

    const etherspotPrimeSdk = new PrimeSdk(mappedProvider ?? provider, {
      chainId: 1,
    });

    console.log(etherspotPrimeSdk);
  };

  return (
    <div className="App">
      <header className="App-header">
        {ready && authenticated ? (
          <div>
            <textarea
              readOnly
              value={JSON.stringify(user, null, 2)}
            />
            <br />
            <button onClick={logout}>Log Out of Privy</button>
          </div>
        ) : (
          <button onClick={login}>Log In with Privy</button>
        )}

        <button onClick={etherspotLogin}>Log In with Etherspot</button>
      </header>
    </div>
  );
}

export default App;