Ping Dashboard is a next-generation blockchain explorer and wallet interface for the Cosmos ecosystem. Unlike traditional explorers that rely on cached data, Ping Dashboard provides real-time blockchain exploration by directly interfacing with Cosmos full nodes via LCD/RPC endpoints - earning it the distinction as a "Light Explorer".
🔗 Live App: https://ping.pub
🧪 Current Configuration: This instance is configured for AIW3 Devnet with integrated faucet functionality and CORS-enabled API proxy.
- Real-time Data: Direct LCD/RPC integration without caching
- Multi-chain Support: Configurable for Cosmos-based blockchains
- Block & Transaction Analysis: Detailed inspection tools
- Validator Information: Complete validator metrics and performance data
- Network Statistics: Live network health and metrics
- Multi-wallet Support: Keplr, Unisat, and more
- Portfolio Management: Asset tracking across multiple chains
- Transaction Broadcasting: Direct transaction submission
- Account Management: Multiple account support
- Proposal Tracking: Complete governance proposal lifecycle
- Voting Interface: Direct on-chain voting
- Staking Operations: Delegate, redelegate, and unbond
- Rewards Management: Claim and compound staking rewards
- Cross-chain Transfers: Seamless asset movement
- IBC Channel Monitoring: Real-time channel status
- Relayer Information: Complete relayer network data
- Testnet Token Distribution: Built-in faucet functionality
- Direct Faucet Integration: Supports both ping.pub and custom faucet services
- Balance Monitoring: Faucet account balance tracking
- Transaction Confirmation: Direct transaction links
- Rate Limiting: Built-in protection against abuse
- NFT Support: View and manage Cosmos NFTs
- CosmWasm Integration: Smart contract interaction
- State Sync: Fast node synchronization tools
- Custom Widgets: Embeddable blockchain widgets
- CORS Proxy: Built-in proxy for API endpoints without CORS support
- Frontend: Vue 3 + TypeScript + Vite
- Styling: TailwindCSS + DaisyUI
- State Management: Pinia
- Blockchain Integration: CosmJS + Osmosis.js
- Build Tool: Vite with modern ES modules
- Deployment: Docker + Nginx
- Proxy: Vite dev server proxy for CORS handling
src/
├── components/ # Reusable UI components
├── layouts/ # Application layouts
├── modules/ # Feature modules
│ ├── [chain]/ # Chain-specific features
│ │ └── faucet/ # Faucet functionality
│ └── wallet/ # Wallet functionality
├── pages/ # Route pages
├── plugins/ # Vue plugins (i18n, etc.)
├── router/ # Vue Router configuration
├── stores/ # Pinia state stores
│ └── useDashboard.ts # Main dashboard store
└── types/ # TypeScript definitions
chains/
└── testnet/ # Testnet configurations (default)
└── aiw3-devnet.json # AIW3 devnet config
docker/
├── Dockerfile # Production build
├── Dockerfile.dev # Development build
├── docker-compose.yml # Container orchestration
├── nginx.conf # Web server configuration
└── docker.sh # Management script
- Node.js: v16+ (recommended: latest LTS)
- Yarn: v1.22+ or npm v8+
- Docker: v20+ (for containerized deployment)
- Git: For cloning the repository
-
Clone the repository
git clone https://github.com/ping-pub/explorer.git cd explorer
-
Start with Docker (Production)
# Build and start production server ./docker.sh build ./docker.sh start # Access at: http://localhost:8080
-
Start with Docker (Development)
# Start development server with hot reload ./docker.sh dev # Access at: http://localhost:3000
-
Install dependencies
yarn install --ignore-engines
-
Start development server
yarn dev
-
Access the application
- Open http://localhost:3000
- For testnet: Use a hostname containing "testnet" (e.g.,
testnet.localhost:3000
)
./docker.sh build # Build production image
./docker.sh dev # Start development server
./docker.sh start # Start production server
./docker.sh stop # Stop all containers
./docker.sh restart # Restart production
./docker.sh logs # View container logs
./docker.sh clean # Remove containers/images
./docker.sh help # Show help
# Build the production image
./docker.sh build
# Start production server
./docker.sh start
# Monitor logs
./docker.sh logs
# Health check
curl http://localhost:8080/health
# Start development with hot reload
./docker.sh dev
# View development logs
./docker.sh logs
- ping-dashboard: Production service (port 8080)
- ping-dashboard-dev: Development service (port 3000)
# Manual build for production
yarn build
# Preview production build
yarn preview
# Deploy to web server
cp -r ./dist/* /path/to/web/server/root
This Ping Dashboard instance is configured for the AIW3 Devnet with the following services:
Network Details:
- Chain ID:
aiw3-devnet
- Token: AIW3 (6 decimal places)
- Address Prefix:
aiw3
- Coin Type: 118
- Network Type: Testnet (default)
Service Endpoints:
- API Service:
https://devnet-api.aiw3.io
(proxied viahttp://localhost:3000/api
) - RPC Service:
https://devnet-rpc.aiw3.io
- Faucet Service:
https://devnet-faucet.aiw3.io
{
"chain_name": "aiw3-devnet",
"api": ["http://localhost:3000/api"],
"rpc": ["https://devnet-rpc.aiw3.io"],
"faucet": "https://devnet-faucet.aiw3.io",
"sdk_version": "0.47.1",
"coin_type": "118",
"min_tx_fee": "1000",
"addr_prefix": "aiw3",
"logo": "https://mypinata.moonpump.ai/ipfs/bafybeie7kjiokeo7pm5j33tszrouvntmw3i3tiu4q7ddv4qewddwsrfud4",
"theme_color": "#4338ca",
"assets": [{
"base": "uaiw3",
"symbol": "AIW3",
"exponent": "6",
"coingecko_id": "",
"logo": ""
}]
}
The Vite development server includes a proxy configuration to handle CORS issues:
// vite.config.ts
server: {
proxy: {
'/api': {
target: 'https://devnet-api.aiw3.io',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
configure: (proxy, _options) => {
proxy.on('error', (err, _req, _res) => {
console.log('proxy error', err);
});
proxy.on('proxyReq', (proxyReq, req, _res) => {
console.log('Sending Request to the Target:', req.method, req.url);
});
proxy.on('proxyRes', (proxyRes, req, _res) => {
console.log('Received Response from the Target:', proxyRes.statusCode, req.url);
});
},
},
},
}
The integrated faucet allows users to request testnet tokens for development and testing.
Faucet URL: Visit /aiw3-devnet/faucet
in the application
- Navigate to Faucet: Go to
http://localhost:3000/aiw3-devnet/faucet
- Enter Address: Paste your AIW3 address (starts with
aiw3
) - Request Tokens: Click "Get Tokens" to receive testnet funds
- Transaction Confirmation: View the transaction hash for confirmation
- ✅ Real-time Balance: Shows current faucet account balance
- ✅ Transaction Tracking: Direct links to successful transactions
- ✅ Address Validation: Ensures proper address format
- ✅ Status Monitoring: Health checks for faucet availability
- ✅ Direct Integration: Works with custom faucet services
- ✅ Automatic Configuration: Detects faucet type and adjusts accordingly
The faucet component automatically detects the faucet type:
For Custom Faucets (like AIW3):
- Uses the
faucet
URL directly from chain configuration - Handles custom API responses
- Shows configured faucet address and balance
For Ping.pub Central Service:
- Falls back to
https://faucet.ping.pub/{chain_name}
- Uses standard ping.pub faucet API format
- Faucet Address:
aiw31r5v5srda7xfth3hn2s26txvrcrntldjur3whgk
- Balance: ~50,000 AIW3 tokens
- Amount per Request: 1 AIW3 token
- Status: ✅ Fully Operational
This section provides a comprehensive guide for upgrading to new chains or updating existing configurations.
Step 1: Create Chain Configuration
# Create new chain config file
touch chains/testnet/your-new-chain.json
Step 2: Configure Chain Details
{
"chain_name": "your-new-chain",
"api": ["https://api.your-chain.com"],
"rpc": ["https://rpc.your-chain.com"],
"faucet": "https://faucet.your-chain.com",
"sdk_version": "0.47.1",
"coin_type": "118",
"min_tx_fee": "1000",
"addr_prefix": "yourchain",
"logo": "https://your-logo-url.com/logo.png",
"theme_color": "#your-color",
"assets": [{
"base": "uyourtoken",
"symbol": "YOURTOKEN",
"exponent": "6",
"coingecko_id": "your-token-id",
"logo": "https://your-token-logo.com/logo.png"
}]
}
Step 3: Handle CORS Issues
If your API doesn't support CORS, update vite.config.ts
:
server: {
proxy: {
'/api': {
target: 'https://api.your-chain.com',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
},
}
Then update your chain config to use the proxy:
{
"api": ["http://localhost:3000/api"]
}
Step 1: Update Configuration
# Edit existing configuration
nano chains/testnet/aiw3-devnet.json
Step 2: Update Endpoints
- Update API, RPC, and faucet URLs
- Modify SDK version if needed
- Update token information
Step 3: Test Configuration
# Restart development server
./docker.sh stop
./docker.sh dev
# Test endpoints
curl -s http://localhost:3000/api/cosmos/base/tendermint/v1beta1/node_info
Default to Testnet (current setup):
// src/stores/useDashboard.ts
async loadingFromLocal() {
// Default to testnet to enable faucet access
this.networkType = NetworkType.Testnet;
// Override only if explicitly on a mainnet hostname
if(window.location.hostname.search("mainnet") > -1) {
this.networkType = NetworkType.Mainnet
}
// ... rest of the code
}
Default to Mainnet:
async loadingFromLocal() {
// Default to mainnet
this.networkType = NetworkType.Mainnet;
// Override if hostname contains "testnet"
if(window.location.hostname.search("testnet") > -1) {
this.networkType = NetworkType.Testnet
}
// ... rest of the code
}
For Custom Faucet Services:
- Set the
faucet
field in chain configuration to your faucet URL - The faucet component will automatically use the custom service
- Update faucet address and balance in the component if needed
For Ping.pub Central Service:
- Remove or set
faucet
field to empty string - The component will fallback to
https://faucet.ping.pub/{chain_name}
Update Production Build:
# Stop current containers
./docker.sh stop
# Rebuild with new configuration
./docker.sh build --no-cache
# Start updated service
./docker.sh start
Update Development Environment:
# Restart development server
./docker.sh stop
./docker.sh dev
Before deploying upgrades, test the following:
Basic Functionality:
- Chain loads correctly
- API endpoints respond
- Block explorer shows latest blocks
- Transaction search works
Wallet Integration:
- Connect wallet (Keplr/Unisat)
- Address displays correctly
- Balance shows properly
- Send transactions work
Advanced Features:
- Staking operations (delegate/undelegate)
- Governance proposals display
- IBC transfers (if applicable)
- Faucet functionality
Performance:
- Page load times acceptable
- Real-time updates working
- No console errors
- Mobile responsiveness
CORS Errors:
- Add proxy configuration to
vite.config.ts
- Update chain config to use proxy URL
- Ensure target API supports the required endpoints
Faucet Not Working:
- Check faucet URL in chain configuration
- Verify faucet service is operational
- Update faucet component logic if needed
Chain Not Loading:
- Verify JSON syntax in chain configuration
- Check network type (mainnet vs testnet)
- Ensure all required fields are present
Docker Issues:
- Clear Docker cache:
./docker.sh clean
- Rebuild without cache:
./docker.sh build --no-cache
- Check container logs:
./docker.sh logs
-
Create configuration file
# For testnet (current setup) touch chains/testnet/your-chain.json
-
Configuration format
{ "chain_name": "your-chain", "api": ["https://api.your-chain.com"], "rpc": ["https://rpc.your-chain.com"], "faucet": "https://faucet.your-chain.com", "sdk_version": "0.47.0", "coin_type": "118", "min_tx_fee": "1000", "addr_prefix": "yourchain", "assets": [{ "base": "uyourtoken", "symbol": "YOURTOKEN", "exponent": "6" }] }
Your blockchain nodes must have LCD API enabled:
# In config/app.toml
[api]
enable = true
swagger = false
address = "tcp://0.0.0.0:1317"
max-open-connections = 1000
CORS Configuration (nginx example):
server {
server_name api.your-chain.com;
listen 443 ssl;
location / {
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Max-Age 3600;
add_header Access-Control-Expose-Headers Content-Length;
proxy_pass http://localhost:1317;
}
}
- Block Explorer: Browse blocks and transactions
- Validator Information: View validator details and performance
- Network Statistics: Monitor network health and metrics
- Search: Find blocks, transactions, and addresses
- Connect Wallet: Support for Keplr and other Cosmos wallets
- Send Transactions: Transfer tokens directly from the interface
- Staking Operations: Delegate, redelegate, and claim rewards
- Portfolio View: Track balances across multiple accounts
- Get Test Tokens: Use the integrated faucet for development
- Address Validation: Automatic validation of wallet addresses
- Transaction Confirmation: Direct links to successful transactions
- Real-time Updates: Live blockchain data without caching
- API Integration: Direct connection to blockchain nodes
- Custom Widgets: Embeddable components for other applications
# Traditional development
yarn dev # Start development server
yarn build # Build for production
yarn preview # Preview production build
yarn type-check # Run TypeScript checks
# Docker development
./docker.sh dev # Start development with Docker
./docker.sh build # Build production image
./docker.sh start # Start production container
- ESLint: For code linting
- Prettier: For code formatting
- TypeScript: For type safety
- Create feature module:
src/modules/your-feature/
- Add routes: Vue Router will auto-discover
.vue
files - Create stores: Use Pinia for state management
- Add types: Define TypeScript interfaces in
src/types/
When contributing, please test:
- Connect wallet and verify address
- Transfer tokens
- Delegate to validator
- Redelegate between validators
- Unbond delegation
- Withdraw validator commission
- Withdraw staking rewards
- Faucet functionality
- Docker deployment
We welcome contributions! Please follow these guidelines:
- Fork the repository
- Create feature branch (
git checkout -b feature/amazing-feature
) - Commit changes (
git commit -m 'Add amazing feature'
) - Push to branch (
git push origin feature/amazing-feature
) - Open Pull Request
- Create configuration file in
chains/testnet/
- Test all functionality with the testing checklist
- Submit PR with configuration and test results
- Use GitHub Issues for bug reports
- Provide detailed reproduction steps
- Include browser and OS information
- Mention Docker environment if applicable
Your support helps us build better tools for the Cosmos ecosystem:
ERC20 Address (USDC, USDT, ETH):
0x88BFec573Dd3E4b7d2E6BfD4D0D6B11F843F8aa1
Special thanks to our sponsors:
- Point Network: $1000 USDC + $1000 worth of POINT
- BitSong: 50,000 BTSG
- IRISnet: 100,000 IRIS
Fund development through IssueHunter
This project is licensed under the MIT License - see the LICENSE file for details.
- @liangping - Lead Developer
- @dingyiming - Core Developer
- Website: https://ping.pub
- Discord: Join our community
- Twitter: @ping_pub
- GitHub: ping-pub/explorer
Built with ❤️ for the Cosmos ecosystem
Empowering users to explore, interact, and transact across the interchain
🧪 AIW3 Devnet Explorer - Ready for Development & Testing