From 1bea3ab24b3f264796295b421a355fef9d0d47c2 Mon Sep 17 00:00:00 2001
From: styppo <mail@styp-rekowsky.de>
Date: Tue, 24 Jan 2023 17:52:37 +0000
Subject: [PATCH] Add basic lightning tip button

---
 src/nostr/model/Profile.js    |  2 ++
 src/pages/profile/Profile.vue | 25 +++++++++++++++++++------
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/nostr/model/Profile.js b/src/nostr/model/Profile.js
index 5d2f61a..0b29c00 100644
--- a/src/nostr/model/Profile.js
+++ b/src/nostr/model/Profile.js
@@ -13,6 +13,8 @@ export default class Profile {
       url: metadata.nip05,
       verified: null,
     }
+    this.lud06 = metadata.lud06
+    this.lud16 = metadata.lud16
   }
 
   static from(event) {
diff --git a/src/pages/profile/Profile.vue b/src/pages/profile/Profile.vue
index ae75604..1b42013 100644
--- a/src/pages/profile/Profile.vue
+++ b/src/pages/profile/Profile.vue
@@ -23,7 +23,7 @@
             <BaseIcon icon="messages" />
             <q-tooltip>Send private message</q-tooltip>
           </a>
-          <a>
+          <a :href="lightningLink" :class="{disabled: !lightningLink}">
             <q-icon name="bolt" size="sm" />
             <q-tooltip>Tip with Bitcoin Lightning</q-tooltip>
           </a>
@@ -165,6 +165,12 @@ export default defineComponent({
     followers() {
       return this.nostr.getFollowers(this.pubkey)
     },
+    lightningLink() {
+      // TODO encode lud16 as lud06?
+      // TODO more protocols
+      const ln = this.profile?.lud06 || this.profile?.lud16
+      return ln ? `lightning:${ln}` : null
+    },
   },
   methods: {
     loadMorePosts() {
@@ -270,18 +276,25 @@ export default defineComponent({
       .actions {
         display: flex;
         a {
+          text-decoration: none;
           svg, i {
             width: 24px;
             height: 24px;
             color: $color-light-gray;
             fill: $color-light-gray;
-            //fill: $color-fg;
             transition: 120ms ease;
           }
-          &:hover svg, &:hover i {
-            fill: $color-fg;
-            color: $color-fg;
-            //fill: $color-primary;
+          &.disabled {
+            svg, i {
+              color: $color-dark-gray !important;
+              fill: $color-dark-gray !important;
+            }
+          }
+          &:hover {
+            svg, i {
+              fill: $color-fg;
+              color: $color-fg;
+            }
           }
         }
         a + a {