Merge pull request 'Offer LNURL QR code for download on Lightning info page' (#135) from feature/lightning_donation_qr_codes into master

Reviewed-on: #135
Reviewed-by: slvrbckt <slvrbckt@noreply.kosmos.org>
Reviewed-by: bumi <bumi@noreply.kosmos.org>

Gemfile

@@ -57,6 +57,7 @@ gem "sentry-rails"
 
 # Services
 gem 'discourse_api'
+gem "lnurl"
 gem 'nostr', git: 'https://gitea.kosmos.org/kosmos/nostr-gem.git', branch: 'feature/ruby_2.7_compat'
 
 group :development, :test do

Gemfile.lock

@@ -206,6 +206,8 @@ GEM
     listen (3.8.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
+    lnurl (1.0.1)
+      bech32 (~> 1.1)
     lockbox (1.2.0)
     loofah (2.21.3)
       crass (~> 1.0.2)
@@ -430,6 +432,7 @@ DEPENDENCIES
   letter_opener
   letter_opener_web
   listen (~> 3.2)
+  lnurl
   lockbox
   net-ldap
   nostr!

app/controllers/services/lightning_controller.rb

@@ -1,4 +1,5 @@
 require "rqrcode"
+require "lnurl"
 
 class Services::LightningController < ApplicationController
   before_action :authenticate_user!
@@ -8,9 +9,56 @@ class Services::LightningController < ApplicationController
 
   def index
     @wallet_url = "lndhub://#{current_user.ln_account}:#{current_user.ln_password}@#{ENV['LNDHUB_PUBLIC_URL']}"
+    initialize_lndhub_qr_code
+  end
 
-    qrcode = RQRCode::QRCode.new(@wallet_url)
-    @svg = qrcode.as_svg(
+  def transactions
+    @transactions = fetch_transactions
+  end
+
+  def qr_lnurlp
+    lnurlp_url = "https://kosmos.org/.well-known/lnurlp/#{current_user.cn}"
+    lnurlp_bech32 = Lnurl.new(lnurlp_url).to_bech32
+    qr_code = RQRCode::QRCode.new("lightning:" + lnurlp_bech32)
+
+    respond_to do |format|
+      format.svg do
+        qr_svg = qr_code.as_svg(
+          color: "000",
+          shape_rendering: "crispEdges",
+          module_size: 6,
+          standalone: true,
+          use_path: true,
+          svg_attributes: {
+            class: 'inline-block'
+          }
+        )
+        send_data(
+          qr_svg,
+          filename: "bitcoin-lightning-#{current_user.address}.svg",
+          type: "image/svg+xml"
+        )
+      end
+      format.png do
+        qr_png = qr_code.as_png(
+          fill: "white",
+          color: "black",
+          size: 1024,
+        )
+        send_data(
+          qr_png,
+          filename: "bitcoin-lightning-#{current_user.address}.png",
+          type: "image/png"
+        )
+      end
+    end
+  end
+
+  private
+
+  def initialize_lndhub_qr_code
+    qr_code = RQRCode::QRCode.new(@wallet_url)
+    @lndhub_qr_svg = qr_code.as_svg(
       color: "000",
       shape_rendering: "crispEdges",
       module_size: 6,
@@ -22,12 +70,6 @@ class Services::LightningController < ApplicationController
     )
   end
 
-  def transactions
-    @transactions = fetch_transactions
-  end
-
-  private
-
   def authenticate_with_lndhub(options={})
     if session[:ln_auth_token].present? && !options[:force_reauth]
       @ln_auth_token = session[:ln_auth_token]

app/views/services/lightning/index.html.erb

@@ -7,13 +7,25 @@
 
   <section>
     <h3>Lightning Address</h3>
-    <p>
+    <p class="mb-6">
       Your Kosmos user address is also a
       <a class="ks-text-link" href="https://lightningaddress.com/" target="_blank">Lightning Address</a>!
       The easiest way to receive sats is by just giving out your address:
     </p>
-    <p>
-      <strong><%= current_user.address %></strong>
+    <p data-controller="clipboard" class="flex gap-1 sm:w-2/5">
+      <input type="text" id="user_address" class="grow"
+             value=<%= current_user.address %> disabled="disabled"
+             data-clipboard-target="source" />
+      <button id="copy-user-address" class="btn-md btn-icon btn-blue shrink-0"
+              data-clipboard-target="trigger" data-action="clipboard#copy"
+              title="Copy to clipboard">
+        <span class="content-initial">
+          <%= render partial: "icons/copy", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+        </span>
+        <span class="content-active hidden">
+          <%= render partial: "icons/check", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+        </span>
+      </button>
     </p>
   </section>
 
@@ -39,7 +51,7 @@
       <button id="hide-setup-code" class="hidden btn-md btn-blue w-full sm:w-auto">Hide setup QR code</button>
     </p>
     <p id="setup-code" class="hidden my-10 w-full text-center">
-      <%= raw @svg %>
+      <%= raw @lndhub_qr_svg %>
     </p>
   </section>
 
@@ -88,6 +100,24 @@
       </p>
     </div>
   </section>
+
+  <section class="mb-12">
+    <h3>QR Code for Donations/Tips</h3>
+    <p>
+      You can print out or publish a QR code for people to scan with their
+      wallet apps, so they can send you sats without a direct personal
+      interaction (for example at a concert, or on your website).
+    </p>
+    <p class="my-6 text-center md:text-left">
+      <%= link_to "Download SVG file",
+                  qr_lnurlp_services_lightning_index_path(format: "svg"),
+                  class: "btn-md btn-blue w-full sm:w-auto"%>
+      <span class="mx-2 my-2 md:my-0 block md:inline">or</span>
+      <%= link_to "Download PNG file",
+                  qr_lnurlp_services_lightning_index_path(format: "png"),
+                  class: "btn-md btn-blue w-full sm:w-auto"%>
+    </p>
+  </section>
 <% end %>
 
 <script type="text/javascript">

config/routes.rb

@@ -24,6 +24,7 @@ Rails.application.routes.draw do
     resources :lightning, only: [:index] do
       collection do
         get 'transactions'
+        get 'qr_lnurlp'
       end
     end
   end