celo-org / react-celo

Connect your react dApp to Celo
https://react-celo.vercel.app
MIT License
59 stars 42 forks source link

Cannot connect Metamask or Celo Browser Extension wallet #1

Closed critesjosh closed 3 years ago

critesjosh commented 3 years ago

Trying to get this working with the web dapp tutorial. I added the next.config.js file specified here.

I am unable to connect Metamask or the Celo browser extension wallet. I see the following errors.

react.development.js?72d0:220 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `Modal`. See https://reactjs.org/link/warning-keys for more information.
    at div
    at Modal (webpack-internal:///./node_modules/@celo-tools/use-contractkit/lib/modal.js:117:23)
    at Provider (webpack-internal:///./node_modules/unstated-next/dist/unstated-next.mjs:11:31)
    at ContractKitProvider (webpack-internal:///./node_modules/@celo-tools/use-contractkit/lib/use-contractkit.js:164:23)
    at div
    at WrappedApp
    at ErrorBoundary (webpack-internal:///./node_modules/@next/react-dev-overlay/lib/internal/ErrorBoundary.js:23:47)
    at ReactDevOverlay (webpack-internal:///./node_modules/@next/react-dev-overlay/lib/internal/ReactDevOverlay.js:73:23)
    at Container (webpack-internal:///./node_modules/next/dist/client/index.js:152:5)
    at AppContainer (webpack-internal:///./node_modules/next/dist/client/index.js:641:24)
    at Root (webpack-internal:///./node_modules/next/dist/client/index.js:772:24)
Uncaught (in promise) TypeError: Cannot read property 'indexOf' of undefined
    at WarningComponent.render (warning.js:1)
    at p._renderValidatedComponentWithoutOwnerOrContext (react-dom.min.js:13)
    at p._renderValidatedComponent (react-dom.min.js:13)
    at performInitialMount (react-dom.min.js:13)
    at p.mountComponent (react-dom.min.js:13)
    at Object.mountComponent (react-dom.min.js:14)
    at performInitialMount (react-dom.min.js:13)
    at p.mountComponent (react-dom.min.js:13)
warning.js?d96e:34 Warning: react-modal: App element is not defined. Please use `Modal.setAppElement(el)` or set `appElement={el}`. This is needed so screen readers don't see main content when modal is opened. It is not recommended, but you can opt-out by setting `ariaHideApp={false}`.
Screen Shot 2021-03-15 at 1 20 55 PM
AlexBHarley commented 3 years ago

Most of those are warnings (will take the time to sort them out however), but with the latest @celo-tools/use-contractkit release (0.0.28) I verified it was working with the Celo Extension Wallet.