feat: add successful payment response handling

This commit is contained in:
fsociety
2024-09-10 22:14:46 +02:00
parent 89d2f30241
commit d12b0e3261
3 changed files with 26 additions and 6 deletions

View File

@@ -12,6 +12,8 @@ class WebLN extends Component
public $invoice; public $invoice;
public bool $paymentDone = false;
public function mount() public function mount()
{ {
$this->invoice = $this->createInvoice( $this->invoice = $this->createInvoice(
@@ -24,6 +26,11 @@ class WebLN extends Component
); );
} }
public function success($preimage)
{
$this->paymentDone = true;
}
public function reloadMe() public function reloadMe()
{ {
// full reload current page // full reload current page

View File

@@ -10,7 +10,7 @@ export default (livewireComponent) => ({
.then(response => { .then(response => {
console.log('Payment response:', response); console.log('Payment response:', response);
this.$wire.call('logThis', 'Payment response: ' + JSON.stringify(response)); this.$wire.call('logThis', 'Payment response: ' + JSON.stringify(response));
this.$wire.call('reloadMe'); this.$wire.call('success', response.preimage);
}) })
.catch(error => { .catch(error => {
console.error('Payment failed:', error); console.error('Payment failed:', error);

View File

@@ -5,11 +5,24 @@
<div class="text-xs sm:text-base break-words">hash: {{ $invoice['payment_hash'] }}</div> <div class="text-xs sm:text-base break-words">hash: {{ $invoice['payment_hash'] }}</div>
<div class="text-xs sm:text-base break-words">payment_request: {{ $invoice['payment_request'] }}</div> <div class="text-xs sm:text-base break-words">payment_request: {{ $invoice['payment_request'] }}</div>
<div class="mt-6"> <div class="mt-6">
<div class="flex justify-center"> @if(!$paymentDone)
<button x-on:click="pay" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"> <div class="flex justify-center">
Pay Invoice <button x-on:click="pay"
</button> class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
</div> Pay Invoice
</button>
</div>
@else
<div class="flex justify-center">
<div class="text-green-500">
Success! Payment done.
</div>
<button wire:click="reloadMe"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
Reload
</button>
</div>
@endif
</div> </div>
</div> </div>
</div> </div>