Add the MarketProvider component and add your partnerId to the initializationConfig prop.

App.tsx
import './App.css'
import MyPage from './MyPage'
import { MarketProvider } from '@superlink-me/sdk-react'

function App() {
  return (
    <>
      <MarketProvider initializationConfig={{ partnerId: "<your-partner-id>" }}>
        <MyPage/>
      </MarketProvider>
    </>
  )
}

export default App

Add the MarketModal component, set the user info and send transaction callback using the hooks. Execute open() to open the modal.

MyPage.tsx
import { useEffect } from 'react'
import { MarketModal, useMarketModal } from '@superlink-me/sdk-react'

function MyPage() {
  const { open, setUserInfo, setSendTransaction } = useMarketModal()

  useEffect(() => {
    setUserInfo({
      wallets: [{
        address: "<user-wallet-address>", 
        coin: "<coin-type-of-wallet>"
      }],
      externalUserId: "<user-identifier>"
    })

    setSendTransaction((uri) => {
      // Use the uri to send the transaction
    })
  }, [])

  return (
    <>
     <MarketModal />
      <button onClick={() => open()}>
          Open Marketplace
      </button>
    </>
  )
}

export default MyPage
Integration GuideAdvanced configuration