BSV Desktop Wallet Info - Next.js

A minimal Next.js application that connects to the BSV Desktop Wallet and displays all available information including keys, addresses, and network details.

Features

• Simple Interface: Connect/Disconnect button + "Fetch All Data" button
• Clean & Modern UI: Built with Next.js, React, and Tailwind CSS
• BSV SDK Integration: Uses @bsv/sdk WalletClient for wallet interaction
• Real-time Display:
  • Identity Key
  • Multiple Public Keys (Identity, Payment, Data keys)
  • Derived Keys with different protocols
  • Network information (mainnet/testnet)
  • Complete list of available wallet methods
• TypeScript: Full type safety with BSV SDK types

Getting Started

Prerequisites

• Node.js 18+ installed
• BSV Desktop Wallet installed and running

Installation

1. Install dependencies:

npm install

2. Run the development server:

npm run dev

3. Open http://localhost:3000 in your browser

Build for Production

npm run build
npm start

Usage

1. Make sure BSV Desktop Wallet is installed and running
2. Open the application in your browser
3. Click "Connect Wallet" button - this will automatically fetch the identity key
4. Approve the connection in the BSV Desktop Wallet popup if prompted
5. Click "Fetch All Data" button to retrieve additional keys and information
6. View all your wallet information displayed on the page:
   • Identity Key
   • Payment and Data keys
   • Derived keys
   • Network information
   • Available wallet methods
7. Click "Disconnect Wallet" when done

Project Structure

├── app/
│   ├── layout.tsx          # Root layout
│   ├── page.tsx            # Home page
│   └── globals.css         # Tailwind v4 styles
├── components/
│   └── WalletConnector.tsx # Main wallet component
├── hooks/
│   └── useWallet.ts        # Wallet connection hook
├── package.json
├── tsconfig.json
├── postcss.config.mjs
└── next.config.js

Technologies

• Next.js 16 - React framework
• React 19 - UI library
• TypeScript - Type safety
• Tailwind CSS v4 - Modern CSS framework
• @bsv/sdk - BSV blockchain SDK for wallet integration
• WalletClient - BSV SDK wallet client for key derivation and management

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm start - Start production server
• npm run lint - Run ESLint

License

MIT