feat: share PSBT as text

lnbits/extensions/watchonly/static/components/payment/payment.html

@@ -1,5 +1,5 @@
 <div>
-  <q-form @submit="checkAndSend" class="q-gutter-md">
+  <q-form @submit="checkAndSend" ref="paymentFormRef" class="q-gutter-md">
     <q-card class="q-mt-lg">
       <q-card-section>
         <send-to
@@ -175,7 +175,7 @@
                 >
               </q-item-section>
             </q-item>
-            <q-item clickable disabled v-close-popup>
+            <q-item @click="showPsbtDialog" clickable v-close-popup>
               <q-item-section>
                 <q-item-label>Share PSBT</q-item-label>
                 <q-item-label caption
@@ -204,4 +204,21 @@
       </div>
     </div>
   </q-form>
+  <q-dialog v-model="showPsbt" position="top">
+    <q-card class="q-pa-lg q-pt-xl">
+      <q-input
+        filled
+        dense
+        v-model.trim="psbtBase64"
+        type="textarea"
+        rows="25"
+        cols="200"
+        label="PSBT"
+      ></q-input>
+
+      <div class="row q-mt-lg">
+        <q-btn v-close-popup flat color="grey" class="q-ml-auto">Close</q-btn>
+      </div>
+    </q-card>
+  </q-dialog>
 </div>

lnbits/extensions/watchonly/static/components/payment/payment.js

@@ -39,6 +39,7 @@ async function payment(path) {
         showCoinSelect: false,
         showChecking: false,
         showChange: false,
+        showPsbt: false,
         feeRate: 1
       }
     },
@@ -103,13 +104,11 @@ async function payment(path) {
             await this.serialSignerRef.hwwSendPsbt(this.psbtBase64, txData)
             await this.serialSignerRef.isSendingPsbt()
           }
-
-          console.log('### hwwSendPsbt')
         } catch (error) {
-          console.error(error)
           this.$q.notify({
             type: 'warning',
             message: 'Cannot check and sign PSBT!',
+            caption: `${error}`,
             timeout: 10000
           })
         } finally {
@@ -117,6 +116,24 @@ async function payment(path) {
           this.psbtBase64 = null
         }
       },
+      showPsbtDialog: async function () {
+        try {
+          const valid = await this.$refs.paymentFormRef.validate()
+          if (!valid) return
+
+          const data = await this.createPsbt()
+          if (data) {
+            this.showPsbt = true
+          }
+        } catch (error) {
+          this.$q.notify({
+            type: 'warning',
+            message: 'Failed to create PSBT!',
+            caption: `${error}`,
+            timeout: 10000
+          })
+        }
+      },
       createPsbt: async function () {
         try {
           console.log('### this.createPsbt')
@@ -136,6 +153,7 @@ async function payment(path) {
           )
 
           this.psbtBase64 = data
+          return data
         } catch (err) {
           LNbits.utils.notifyApiError(err)
         }