From 3d1ea76676fd7b8402d5f5642cdd8828f07620b4 Mon Sep 17 00:00:00 2001
From: Vlad Stan <stan.v.vlad@gmail.com>
Date: Thu, 11 Aug 2022 13:20:29 +0300
Subject: [PATCH] feat: add `Copy` button for addresses

---
 .../static/components/address-list/address-list.html | 12 +++++++++++-
 .../static/components/address-list/address-list.js   | 10 ++++++++++
 .../watchonly/templates/watchonly/index.html         | 10 ++++++++++
 3 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/lnbits/extensions/watchonly/static/components/address-list/address-list.html b/lnbits/extensions/watchonly/static/components/address-list/address-list.html
index f2121063..8db6e4d0 100644
--- a/lnbits/extensions/watchonly/static/components/address-list/address-list.html
+++ b/lnbits/extensions/watchonly/static/components/address-list/address-list.html
@@ -111,7 +111,7 @@
         <q-td colspan="100%">
           <div class="row items-center q-mt-md q-mb-lg">
             <div class="col-2 q-pr-lg"></div>
-            <div class="col-4 q-pr-lg">
+            <div class="col-2 q-pr-lg">
               <q-btn
                 unelevated
                 dense
@@ -123,6 +123,16 @@
                 QR Code</q-btn
               >
             </div>
+            <div class="col-2 q-pr-lg">
+              <q-btn
+                outline
+                color="grey"
+                icon="content_copy"
+                @click="copyText(props.row.address)"
+                class="q-ml-sm"
+                >Copy</q-btn
+              >
+            </div>
             <div class="col-2 q-pr-lg">
               <q-btn
                 outline
diff --git a/lnbits/extensions/watchonly/static/components/address-list/address-list.js b/lnbits/extensions/watchonly/static/components/address-list/address-list.js
index ebb8c87f..61545df0 100644
--- a/lnbits/extensions/watchonly/static/components/address-list/address-list.js
+++ b/lnbits/extensions/watchonly/static/components/address-list/address-list.js
@@ -74,6 +74,16 @@ async function addressList(path) {
       satBtc(val, showUnit = true) {
         return satOrBtc(val, showUnit, this.satsDenominated)
       },
+      // todo: bad. base.js not present in custom components
+      copyText: function (text, message, position) {
+        var notify = this.$q.notify
+        Quasar.utils.copyToClipboard(text).then(function () {
+          notify({
+            message: message || 'Copied to clipboard!',
+            position: position || 'bottom'
+          })
+        })
+      },
       getWalletName: function (walletId) {
         const wallet = (this.accounts || []).find(wl => wl.id === walletId)
         return wallet ? wallet.title : 'unknown'
diff --git a/lnbits/extensions/watchonly/templates/watchonly/index.html b/lnbits/extensions/watchonly/templates/watchonly/index.html
index 43ad9556..03deeffa 100644
--- a/lnbits/extensions/watchonly/templates/watchonly/index.html
+++ b/lnbits/extensions/watchonly/templates/watchonly/index.html
@@ -170,7 +170,17 @@
         ></qrcode>
       </q-responsive>
       <p v-if="currentAddress">
+        <q-btn
+          flat
+          dense
+          size="ms"
+          icon="content_copy"
+          @click="copyText(props.row.address)"
+          class="q-ml-sm"
+        ></q-btn>
+
         {{ currentAddress.address }}
+
         <q-btn
           flat
           dense