fix: max amount

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

@@ -3,7 +3,7 @@
     <!-- {{addresses}} -->
     <q-tabs v-model="paymentTab" no-caps class="bg-dark text-white shadow-2">
       <q-tab name="destination" label="Send To"></q-tab>
-      <q-tab name="coinControl" label="Coin Control"></q-tab>
+      <q-tab name="coinControl" label="Coin Select"></q-tab>
     </q-tabs>
     <q-tab-panels v-model="paymentTab">
       <q-tab-panel name="destination">
@@ -11,7 +11,9 @@
           <q-card-section>
             <send-to
               :data.sync="sendToList"
-              :tx:size="txSizeNoChange"
+              :fee-rate="feeRate"
+              :tx-size="txSizeNoChange"
+              :selected-amount="selectedAmount"
               :sats-denominated="sats_denominated"
             ></send-to>
             <!-- <div class="row items-center no-wrap q-mb-md">
@@ -158,7 +160,7 @@
           </q-card-section>
         </q-card>
         <utxo-list
-          :utxos="utxos.data"
+          :utxos="utxos"
           :selectable="true"
           :payed-amount="getTotalPaymentAmount()"
           :mempool_endpoint="mempool_endpoint"

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

@@ -45,6 +45,11 @@ async function payment(path) {
       },
       feeValue: function () {
         return this.feeRate * this.txSize
+      },
+      selectedAmount: function () {
+        return this.utxos
+          .filter(utxo => utxo.selected)
+          .reduce((t, a) => t + (a.amount || 0), 0)
       }
     },
 
@@ -84,7 +89,7 @@ async function payment(path) {
             fingerprint: w.fingerprint
           }))
         }
-        tx.inputs = this.utxos.data
+        tx.inputs = this.utxos
           .filter(utxo => utxo.selected)
           .map(mapUtxoToPsbtInput)
           .sort((a, b) =>

lnbits/extensions/watchonly/static/components/send-to/send-to.js

@@ -4,7 +4,13 @@ async function sendTo(path) {
     name: 'send-to',
     template,
 
-    props: ['data', 'tx-size', 'total-amount', 'fee-rate', 'sats_denominated'],
+    props: [
+      'data',
+      'tx-size',
+      'selected-amount',
+      'fee-rate',
+      'sats_denominated'
+    ],
 
     computed: {
       dataLocal: {
@@ -21,7 +27,6 @@ async function sendTo(path) {
     data: function () {
       return {
         DUST_LIMIT: 546,
-        amount: 0,
         paymentTable: {
           columns: [
             {
@@ -50,17 +55,19 @@ async function sendTo(path) {
           this.dataLocal.splice(index, 1)
         }
       },
+
+      sendMaxToAddress: function (paymentAddress = {}) {
+        const feeValue = this.feeRate * this.txSize
+        const inputAmount = this.selectedAmount
+        const currentAmount = Math.max(0, paymentAddress.amount || 0)
+        const payedAmount = this.getTotalPaymentAmount() - currentAmount
+        paymentAddress.amount = Math.max(
+          0,
+          inputAmount - payedAmount - feeValue
+        )
+      },
       getTotalPaymentAmount: function () {
         return this.dataLocal.reduce((t, a) => t + (a.amount || 0), 0)
-      },
-      sendMaxToAddress: function (paymentAddress = {}) {
-        this.amount = 0
-        // const tx = this.createTx(true)
-        // this.payment.txSize = Math.round(txSize(tx))
-        const fee = this['fee-rate'] * this['tx-size']
-        const inputAmount = this['total-amount']
-        const payedAmount = this.getTotalPaymentAmount()
-        paymentAddress.amount = Math.max(0, inputAmount - payedAmount - fee)
       }
     },
 

lnbits/extensions/watchonly/static/components/utxo-list/utxo-list.js

@@ -96,7 +96,7 @@ async function utxoList(path) {
         return wallet ? wallet.title : 'unknown'
       },
       getTotalSelectedUtxoAmount: function () {
-        const total = this.utxos
+        const total = (this.utxos || [])
           .filter(u => u.selected)
           .reduce((t, a) => t + (a.amount || 0), 0)
         return total

lnbits/extensions/watchonly/static/js/index.js

@@ -759,13 +759,6 @@ const watchOnly = async () => {
         )
         this.updateAmountForAddress(addressData, addressTotal)
       },
-      // todo: move/dedup
-      getTotalSelectedUtxoAmount: function () {
-        const total = this.utxos.data
-          .filter(u => u.selected)
-          .reduce((t, a) => t + (a.amount || 0), 0)
-        return total
-      },
 
       //################### MEMPOOL API ###################
       getAddressTxsDelayed: async function (addrData) {

lnbits/extensions/watchonly/templates/watchonly/index.html

@@ -497,8 +497,9 @@
         <payment
           :accounts="walletAccounts"
           :addresses="addresses"
-          :utxos="utxos"
+          :utxos="utxos.data"
         ></payment>
+        <!-- todo: no more utxos.data -->
       </q-card-section>
     </q-card>
   </div>