Skip to content
create-bsv-app
7 / 9

Add it to an existing app

This is a different project: a recipe box you built before you heard of create-bsv-app. You ran add mode on it:

Terminal
npx create-bsv-app@latest add --capabilities wallet-connect,wallet-login --yes

Add mode wrote helper files into client/src/bsv/ and server/src/bsv/ (open them: they're the real ones). It never edits your main.tsx, App.tsx or server entry. It puts the snippets to paste in AGENTS.md, under Wiring (manual). That part is yours.

Your task#

  1. In client/src/main.tsx, import WalletProviders from ./bsv/WalletProviders and wrap <App /> in it.
  2. In client/src/App.tsx, add the <ConnectWallet /> button and a Log in button that calls login() from useWalletLogin(). Connect in the preview.
  3. Logging in fails: your server has no identity and no login route. AGENTS.md's snippet assumes a generated server with a serverWallet already in it, and yours has none. In server/src/index.ts, add a server wallet, GET /api/identity and POST /api/login:
ts
const key = process.env.SERVER_PRIVATE_KEY
if (key == null && process.env.NODE_ENV === 'production') throw new Error('SERVER_PRIVATE_KEY is required in production')
const serverWallet = new ProtoWallet(key != null ? PrivateKey.fromString(key) : PrivateKey.fromRandom())

app.get('/api/identity', async (_req, res) => {
  const { publicKey } = await serverWallet.getPublicKey({ identityKey: true })
  res.json({ identityKey: publicKey })
})
app.post('/api/login', loginRoute(serverWallet))

(Import PrivateKey and ProtoWallet from @bsv/sdk, and loginRoute from ./bsv/loginRoute.js.) Then log in.

Your task

  • Wrap the app in WalletProviders and connect
  • Give the server an identity and a login route, then log in