Logged-in Widget

The SDK offers a widget component to facilitate users connecting and disconnecting their active wallet. When the widget is used with an EVM wallet and your environment has multiple EVM networks configured, the widget will also offer network switching capabilities.

Setting up the component

You need to wrap it in a <DynamicContextProvider> . The widget has the following props:

import { DynamicContextProvider, DynamicWidget } from "@dynamic-labs/sdk-react";

const App = () => (
  <DynamicContextProvider
    settings={{
      appLogoUrl:
        'https://upload.wikimedia.org/wikipedia/commons/3/34/Examplelogo.svg',
      appName: 'Example App',
      environmentId: 'REPLACE_WITH_YOUR_ENV_ID',
      onAuthSuccess: () => console.log("connected!")
    }}
  >
    <DynamicWidget />
  </DynamicContextProvider>
);

export default App;

Demo

Connect your wallet to see the widget in action