feat: wallet UI — WalletConnect component + ranked fight flow in pages
Add WalletConnect.vue with NWC/LN Address connection states. Add "FIGHT FOR SATS" button to JoinBoutPage with entry fee payment flow. Show ranked pot and winner payout in FightPage. Add sats stats and wallet section to BotProfilePage. Extend BotData interface with satsWon/satsWagered/hasWallet. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.6
parent
131d7e587e
commit
95b53e271f
@@ -4,6 +4,7 @@ import { useRoute, useRouter, RouterLink } from 'vue-router'
|
||||
import { useNostr } from '../composables/useNostr'
|
||||
import SpritePreview from '../components/SpritePreview.vue'
|
||||
import HumanPreview from '../components/HumanPreview.vue'
|
||||
import WalletConnect from '../components/WalletConnect.vue'
|
||||
import type { SpriteCustomization } from '../game/sprites'
|
||||
|
||||
const route = useRoute()
|
||||
@@ -39,6 +40,9 @@ interface BotStats {
|
||||
totalFights: number
|
||||
rank: number
|
||||
totalBots: number
|
||||
satsWon: number
|
||||
satsWagered: number
|
||||
hasWallet: boolean
|
||||
createdAt: string
|
||||
recentFights: {
|
||||
id: string
|
||||
@@ -421,6 +425,23 @@ const tierClass = (t: number) => `tier-${t}`
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sats stats -->
|
||||
<div v-if="stats.satsWon || stats.satsWagered" class="flex gap-2 mt-2">
|
||||
<div class="flex-1 border border-neon-cyan/20 bg-neon-cyan/5 p-2.5 text-center">
|
||||
<p class="font-display font-bold text-base text-neon-cyan">{{ stats.satsWon || 0 }}</p>
|
||||
<p class="font-display text-[8px] text-text-muted tracking-wider mt-0.5">SATS WON</p>
|
||||
</div>
|
||||
<div class="flex-1 border border-neon-purple/20 bg-neon-purple/5 p-2.5 text-center">
|
||||
<p class="font-display font-bold text-base text-neon-purple">{{ stats.satsWagered || 0 }}</p>
|
||||
<p class="font-display text-[8px] text-text-muted tracking-wider mt-0.5">WAGERED</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Wallet connection (owner only) -->
|
||||
<div v-if="isOwner" class="mt-3">
|
||||
<WalletConnect />
|
||||
</div>
|
||||
|
||||
<!-- Fight actions -->
|
||||
<div class="flex gap-2 mt-4">
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user