Refactor PaymentService and related components for improved state management

- Reset payment state on initialization in PaymentService to prevent stuck states.
- Introduce forceResetPaymentState method for debugging purposes.
- Update useTicketPurchase and useLightningPayment composables to reflect changes in computed properties for better state handling.
- Ensure OrderHistory component resets payment state on mount to enhance user experience.

src/core/services/PaymentService.ts

@@ -46,7 +46,9 @@ export class PaymentService extends BaseService {
    * Service-specific initialization (called by BaseService)
    */
   protected async onInitialize(): Promise<void> {
-    this.debug('PaymentService initialized')
+    // Reset payment state on initialization to prevent stuck states
+    this.resetPaymentState()
+    this.debug('PaymentService initialized with clean state')
   }
 
   /**
@@ -265,6 +267,17 @@ export class PaymentService extends BaseService {
   resetPaymentState(): void {
     this._isProcessingPayment.value = false
     this._paymentError.value = null
+    this.debug('Payment state reset to clean state')
+  }
+
+  /**
+   * Force reset payment state (public method for debugging)
+   */
+  forceResetPaymentState(): void {
+    console.log('Force resetting payment state from:', this._isProcessingPayment.value)
+    this._isProcessingPayment.value = false
+    this._paymentError.value = null
+    console.log('Payment state after force reset:', this._isProcessingPayment.value)
   }
 
   /**

src/modules/events/composables/useTicketPurchase.ts

@@ -35,9 +35,9 @@ export function useTicketPurchase() {
   })
   
   // Delegate to PaymentService
-  const userWallets = computed(() => paymentService.userWallets)
-  const hasWalletWithBalance = computed(() => paymentService.hasWalletWithBalance)
-  const isPayingWithWallet = computed(() => paymentService.isProcessingPayment)
+  const userWallets = computed(() => paymentService.userWallets) // getter method
+  const hasWalletWithBalance = computed(() => paymentService.hasWalletWithBalance) // getter method
+  const isPayingWithWallet = computed(() => paymentService.isProcessingPayment.value) // computed ref
 
   // Generate QR code for Lightning payment - delegate to PaymentService
   async function generateQRCode(bolt11: string) {

src/modules/market/components/OrderHistory.vue

@@ -259,6 +259,7 @@ import type { OrderStatus } from '@/stores/market'
 const router = useRouter()
 const marketStore = useMarketStore()
 const relayHub = injectService(SERVICE_TOKENS.RELAY_HUB) as any
+const paymentService = injectService(SERVICE_TOKENS.PAYMENT_SERVICE) as any
 const { handlePayment, isPayingWithWallet, hasWalletWithBalance } = useLightningPayment()
 
 // const orderEvents = useOrderEvents() // TODO: Move to market module
@@ -483,6 +484,11 @@ const navigateToMarket = () => router.push('/market')
 
 // Load orders on mount
 onMounted(() => {
+  // Reset payment state to prevent stuck "Paying..." buttons (safety measure)
+  if (paymentService?.forceResetPaymentState) {
+    paymentService.forceResetPaymentState()
+  }
+  
   // Orders are already loaded in the market store
   console.log('Order History component loaded with', allOrders.value.length, 'orders')
   console.log('Market store orders:', marketStore.orders)
@@ -525,4 +531,5 @@ watch(
   },
   { immediate: true }
 )
+
 </script>

src/modules/market/composables/useLightningPayment.ts

@@ -8,10 +8,10 @@ export function useLightningPayment() {
   const marketStore = useMarketStore()
 
   // Computed properties - delegate to PaymentService
-  const userWallets = computed(() => paymentService.userWallets)
-  const hasWalletWithBalance = computed(() => paymentService.hasWalletWithBalance)
-  const isPayingWithWallet = computed(() => paymentService.isProcessingPayment)
-  const paymentError = computed(() => paymentService.paymentError)
+  const userWallets = computed(() => paymentService.userWallets) // getter method
+  const hasWalletWithBalance = computed(() => paymentService.hasWalletWithBalance) // getter method  
+  const isPayingWithWallet = computed(() => paymentService.isProcessingPayment.value) // computed ref
+  const paymentError = computed(() => paymentService.paymentError.value) // computed ref
 
   // Get wallet with sufficient balance - delegate to PaymentService
   const getWalletWithBalance = (requiredAmountSats?: number) => {