Detect MyDoge and Adapt Your dApp

This guide shows you how to tell whether your dApp is running inside the MyDoge app’s in-app browser, and how to use that to adapt it. Most of your app needs no check: the SDK already connects MyDoge’s wallet inside MyDoge. Check only where your own UI should differ.

Choose a Check#

Where you need it	Use	Returns
In a component under `WalletConnectProvider`	`useWalletHost().isNativeHost`	`boolean`, right away
Anywhere else, such as before the provider mounts	`await isInMyDogeBrowser()`	`Promise<boolean>`, within about 500 ms
Without the SDK	The EIP-6963 check	`Promise<boolean>`

Don’t check the user agent. Neither check can tell which MyDoge version the user has; see the MyDoge reference for what each build supports.

In a Component#

useWalletHost() knows the answer before your components first render, so you can use it directly:


"use client"
 
import { useWalletHost } from "@dogeos/dogeos-sdk"
 
export function WalletLabel() {
  const { isNativeHost } = useWalletHost()
  return <span>{isNativeHost ? "Connect MyDoge" : "Connect wallet"}</span>
}

Anywhere Else#

isInMyDogeBrowser() asks the page for EIP-6963 wallet announcements and resolves true when MyDoge’s in-app browser answers. It resolves false after 500 ms without an answer, and straight away during server rendering. In React, keep the result in state, and render nothing that depends on it until it arrives:


"use client"
 
import { useEffect, useState } from "react"
import { isInMyDogeBrowser } from "@dogeos/dogeos-sdk"
 
export function useIsInMyDoge() {
  const [inMyDoge, setInMyDoge] = useState<boolean | null>(null) // null until the check finishes
 
  useEffect(() => {
    void isInMyDogeBrowser().then(setInMyDoge)
  }, [])
 
  return inMyDoge
}

Without the SDK#

MyDoge announces its wallet through EIP-6963 with rdns set to com.mydoge.wallet:


export function isInMyDoge(timeoutMs = 500): Promise<boolean> {
  return new Promise((resolve) => {
    const onAnnounce = (event: Event) => {
      const { detail } = event as CustomEvent<{ info?: { rdns?: string } }>
      if (detail?.info?.rdns === "com.mydoge.wallet") finish(true)
    }
    const finish = (result: boolean) => {
      clearTimeout(timer)
      window.removeEventListener("eip6963:announceProvider", onAnnounce)
      resolve(result)
    }
    const timer = setTimeout(() => finish(false), timeoutMs)
    window.addEventListener("eip6963:announceProvider", onAnnounce)
    window.dispatchEvent(new Event("eip6963:requestProvider"))
  })
}

Link to Another dApp#

Inside MyDoge, link to another dApp with a mydoge://dapp link so it gets its own wallet connection. getDappHref() gives you that link inside MyDoge and the plain URL elsewhere:


"use client"
 
import { getDappHref } from "@dogeos/dogeos-sdk"
import { useIsInMyDoge } from "./use-is-in-mydoge"
 
export function SwapLink() {
  const inMyDoge = useIsInMyDoge()
  const href = inMyDoge === null ? undefined : getDappHref("https://swap.example/", { inMyDoge })
  return <a href={href}>Swap</a>
}

Under the provider you can pass useWalletHost().isNativeHost as inMyDoge instead. See Link to Other dApps and Websites for the rules these links follow.

Popup sign-in and Google sign-in don’t work in MyDoge’s in-app browser. Hide them there, and sign users in with the wallet:


"use client"
 
import { useWalletHost } from "@dogeos/dogeos-sdk"
 
export function SignInOptions() {
  const { isNativeHost } = useWalletHost()
 
  return (
    <div>
      <button>Sign in with wallet</button>
      {!isNativeHost && <button>Sign in with Google</button>}
    </div>
  )
}

See Sign Users In Inside MyDoge.

Show Your Own Account Controls#

MyDoge 3.1.1 (build 652) and earlier have no account sheet, so openModal() does nothing once a wallet is connected. Inside MyDoge, show your own Disconnect button and, if you support several networks, a network switch:


"use client"
 
import { useWalletConnect, useWalletHost } from "@dogeos/dogeos-sdk"
 
export function AccountControls() {
  const { isNativeHost } = useWalletHost()
  const { isConnected, openModal, disconnect } = useWalletConnect()
 
  if (!isConnected) return <button onClick={openModal}>Connect wallet</button>
  if (isNativeHost) return <button onClick={disconnect}>Disconnect</button>
  return <button onClick={openModal}>Account</button>
}

To add a network switch, see Switch the Connected Wallet to Chikyū.