From 569f43fe817e9c7b6b96974690adec9df3557f97 Mon Sep 17 00:00:00 2001
From: benarc <ben@arc.wales>
Date: Tue, 23 Feb 2021 20:42:24 +0000
Subject: [PATCH] Satspay display link

---
 .../satspay/templates/satspay/display.html    | 80 ++++++++++++-------
 .../satspay/templates/satspay/index.html      | 14 +++-
 lnbits/extensions/satspay/views.py            |  4 +-
 .../templates/watchonly/_api_docs.html        |  2 +-
 4 files changed, 66 insertions(+), 34 deletions(-)

diff --git a/lnbits/extensions/satspay/templates/satspay/display.html b/lnbits/extensions/satspay/templates/satspay/display.html
index 11af36ac..c0773e33 100644
--- a/lnbits/extensions/satspay/templates/satspay/display.html
+++ b/lnbits/extensions/satspay/templates/satspay/display.html
@@ -1,46 +1,66 @@
 {% extends "public.html" %} {% block page %}
-<div class="row q-col-gutter-md justify-center">
-  <div class="col-12 col-sm-6 col-md-5 col-lg-4">
-    <q-card class="q-pa-lg">
-      <q-card-section class="q-pa-none">
+
+<div class="q-pa-md">
+  <q-card class="my-card">
+    <q-card-section>
+      <div class="text-h6">Our Changing Planet</div>
+      <div class="text-subtitle2">by John Doe</div>
+    </q-card-section>
+
+    <q-tabs v-model="tab" class="text-teal">
+      <q-tab label="Tab one" name="one" />
+      <q-tab label="Tab two" name="two" />
+    </q-tabs>
+
+    <q-separator />
+
+    <q-tab-panels v-model="tab" animated>
+      <q-tab-panel name="Lightning">
         <div class="text-center">
-          <a href="lightning:{{ link.lnurl }}">
+          <a href="lightning:{{ charge.id }}">
             <q-responsive :ratio="1" class="q-mx-md">
               <qrcode
-                value="{{ link.lnurl }}"
-                :options="{width: 800}"
+                value="{{ charge.id }}"
+                :options="{width: 300}"
                 class="rounded-borders"
               ></qrcode>
             </q-responsive>
           </a>
         </div>
         <div class="row q-mt-lg">
-          <q-btn outline color="grey" @click="copyText('{{ link.lnurl }}')"
-            >Copy LNURL</q-btn
+          <q-btn outline color="grey" @click="copyText('{{ charge.id }}')"
+            >Copy address</q-btn
           >
         </div>
-      </q-card-section>
-    </q-card>
-  </div>
-  <div class="col-12 col-sm-6 col-md-5 col-lg-4 q-gutter-y-md">
-    <q-card>
-      <q-card-section>
-        <h6 class="text-subtitle1 q-mb-sm q-mt-none">
-          LNbits LNURL-pay link
-        </h6>
-        <p class="q-my-none">
-          Use a LNURL compatible bitcoin wallet to claim the sats.
-        </p>
-      </q-card-section>
-      <q-card-section class="q-pa-none">
-        <q-separator></q-separator>
-        <q-list>
-          {% include "lnurlp/_lnurl.html" %}
-        </q-list>
-      </q-card-section>
-    </q-card>
-  </div>
+      </q-tab-panel>
+
+      <q-tab-panel name="Onchain">
+        <div class="text-center">
+          <a href="lightning:{{ charge.id }}">
+            <q-responsive :ratio="1" class="q-mx-md">
+              <qrcode
+                value="{{ charge.id }}"
+                :options="{width: 300}"
+                class="rounded-borders"
+              ></qrcode>
+            </q-responsive>
+          </a>
+        </div>
+        <div class="row q-mt-lg">
+          <q-btn outline color="grey" @click="copyText('{{ charge.id }}')"
+            >Copy address</q-btn
+          >
+        </div>
+      </q-tab-panel>
+    </q-tab-panels>
+  </q-card>
 </div>
+
+
+
+
+
+
 {% endblock %} {% block scripts %}
 <script src="{{ url_for('static', filename='vendor/vue-qrcode@1.0.2/vue-qrcode.min.js') }}"></script>
 <script>
diff --git a/lnbits/extensions/satspay/templates/satspay/index.html b/lnbits/extensions/satspay/templates/satspay/index.html
index da5cd59b..7eab8bf1 100644
--- a/lnbits/extensions/satspay/templates/satspay/index.html
+++ b/lnbits/extensions/satspay/templates/satspay/index.html
@@ -54,7 +54,18 @@
           </template>
           <template v-slot:body="props">
             <q-tr :props="props">
-
+              <q-td auto-width>
+                <q-btn
+                  unelevated
+                  dense
+                  size="xs"
+                  icon="link"
+                  :color="($q.dark.isActive) ? 'grey-7' : 'grey-5'"
+                  type="a"
+                  :href="props.row.displayUrl"
+                  target="_blank"
+                ></q-btn>
+              </q-td>
                <q-td auto-width>
 
                  <q-icon v-if="props.row.timeleft < 1 && props.row.amount_paid < props.row.amount"
@@ -279,6 +290,7 @@
       new Date(obj.time * 1000),
       'YYYY-MM-DD HH:mm'
     )
+    obj.displayUrl = ['/satspay/', obj.id].join('')
     return obj
   }
 
diff --git a/lnbits/extensions/satspay/views.py b/lnbits/extensions/satspay/views.py
index 8891ce94..1be0d266 100644
--- a/lnbits/extensions/satspay/views.py
+++ b/lnbits/extensions/satspay/views.py
@@ -16,6 +16,6 @@ async def index():
 
 @satspay_ext.route("/<charge_id>")
 async def display(charge_id):
-    link = get_payment(charge_id) or abort(HTTPStatus.NOT_FOUND, "Charge link does not exist.")
+    charge = get_charge(charge_id) or abort(HTTPStatus.NOT_FOUND, "Charge link does not exist.")
 
-    return await render_template("satspay/display.html", link=link)
\ No newline at end of file
+    return await render_template("satspay/display.html", charge=charge)
\ No newline at end of file
diff --git a/lnbits/extensions/watchonly/templates/watchonly/_api_docs.html b/lnbits/extensions/watchonly/templates/watchonly/_api_docs.html
index cec471c7..87d048dc 100644
--- a/lnbits/extensions/watchonly/templates/watchonly/_api_docs.html
+++ b/lnbits/extensions/watchonly/templates/watchonly/_api_docs.html
@@ -1,6 +1,6 @@
   <q-card>
     <q-card-section>
-      <p>The WatchOnly extension uses https://mempool.space for blockchain data.<br />
+      <p>The WatchOnly extension uses mempool.space for blockchain data.<br />
         <small>
           Created by, <a href="https://github.com/benarc">Ben Arc</a></small
         >