@arteq-io/react-common NPM

npm-react-common

A repo to hold all reusable common react components

Connecting wallet and authenticating

important

always set these:

window.chain = "ETHEREUM";
window.network = "RINKEBY";
window.SKEPTICS_BASE_URL="https://skeptic-dev.arteq.auction/skeptic/v1";
ReactDOM.render(
    <React.StrictMode>
      <App />
    </React.StrictMode>,
    document.getElementById('root')
);

if you want to disable reCaptcha (local testing) add also this global variable:

window.DISABLE_RECAPTCHA

or add recaptcha lib in your index.html and set sitekey like so:

window.rcSiteKey = "6LfJSDceAAAAAPLNlczwZMQbOXbATkOZiW0u0GA3";

To customize sign message, please set SIGN_MESSAGE environment variable before building your repo

to set sign message, set this global variable:

window.MESSAGE_TO_SIGN = "Welcome to skeptics! signing this message means you agree with our terms of use (https://example.org/temrs-of-use), please sign this message in order to log in"

import { useWallet } from "@arteq-io/react-common";

window.chain = "ETHEREUM";
window.network = "RINKEBY";
window.servicesURL = "[https://skeptics-base-url]";


const WalletConnect = () => {

  const {
    logout,
    account,
    initMetamask,
    isWalletConnected,
    initWalletConnect,
  } = useWallet();

  return (
    <main>
      {isWalletConnected 
        ?  (
          <>
            <h1>Login with wallet</h1>
            <ul>
              <li onClick={initMetamask}>with Metamask</li>
              <li onClick={initWalletConnect}>with WalletConnect</li>
            </ul>
          </>
        ) : (
          <>
            <h2>Wallet Address: {account}</h2>
            <button onClick={logout}>Logout</button>
          </>
        )
      }
    </main>
  );
}

const App = () => (
  <WalletProvider>
    <WalletConnect />
  </WaletProvider>
);

possible issues:

you're not using React@17 this package is created based on react 17 and haven't been tested on react 18 which was just released if you've installed react with create-react-app, you can downgrade react to 17 like so:

edit package.json and change react from 18 (or any other versions) to 17 in dependecies section
rm -rf ./node_modules
do a yarn or npm install again
change index.jsx to use previous react-dom import and syntax