Add option to show recommeded fee on checkout invoice

Address #1036

BTCPayServer.Common/BTCPayNetwork.cs

@@ -104,7 +104,6 @@ namespace BTCPayServer
 
     public abstract class BTCPayNetworkBase
     {
-        
         public string CryptoCode { get; internal set; }
         public string BlockExplorerLink { get; internal set; }
         public string DisplayName { get; set; }

BTCPayServer/Controllers/InvoiceController.UI.cs

@@ -225,7 +225,6 @@ namespace BTCPayServer.Controllers
                    (1m + (changelly.AmountMarkupPercentage / 100m)))
                 : (decimal?)null;
 
-            
             var paymentMethodHandler = _paymentMethodHandlerDictionary[paymentMethodId];
             var model = new PaymentModel()
             {
@@ -244,6 +243,8 @@ namespace BTCPayServer.Controllers
                 OrderAmountFiat = OrderAmountFromInvoice(network.CryptoCode, invoice.ProductInformation),
                 CustomerEmail = invoice.RefundMail,
                 RequiresRefundEmail = storeBlob.RequiresRefundEmail,
+                ShowRecommendedFee = storeBlob.ShowRecommendedFee,
+                FeeRate = paymentMethodDetails.GetFeeRate(),
                 ExpirationSeconds = Math.Max(0, (int)(invoice.ExpirationTime - DateTimeOffset.UtcNow).TotalSeconds),
                 MaxTimeSeconds = (int)(invoice.ExpirationTime - invoice.InvoiceTime).TotalSeconds,
                 MaxTimeMinutes = (int)(invoice.ExpirationTime - invoice.InvoiceTime).TotalMinutes,

BTCPayServer/Controllers/StoresController.cs

@@ -363,6 +363,7 @@ namespace BTCPayServer.Controllers
             vm.HtmlTitle = storeBlob.HtmlTitle;
             vm.SetLanguages(_LangService, storeBlob.DefaultLang);
             vm.RequiresRefundEmail = storeBlob.RequiresRefundEmail;
+            vm.ShowRecommendedFee = storeBlob.ShowRecommendedFee;
             vm.OnChainMinValue = storeBlob.OnChainMinValue?.ToString() ?? "";
             vm.LightningMaxValue = storeBlob.LightningMaxValue?.ToString() ?? "";
             vm.LightningAmountInSatoshi = storeBlob.LightningAmountInSatoshi;
@@ -421,6 +422,7 @@ namespace BTCPayServer.Controllers
             blob.HtmlTitle = string.IsNullOrWhiteSpace(model.HtmlTitle) ? null : model.HtmlTitle;
             blob.DefaultLang = model.DefaultLang;
             blob.RequiresRefundEmail = model.RequiresRefundEmail;
+            blob.ShowRecommendedFee = model.ShowRecommendedFee;
             blob.OnChainMinValue = onchainMinValue;
             blob.LightningMaxValue = lightningMaxValue;
             blob.LightningAmountInSatoshi = model.LightningAmountInSatoshi;

BTCPayServer/Data/StoreBlob.cs

@@ -21,6 +21,7 @@ namespace BTCPayServer.Data
             MonitoringExpiration = 1440;
             PaymentTolerance = 0;
             RequiresRefundEmail = true;
+            ShowRecommendedFee = true;
         }
 
         [Obsolete("Use NetworkFeeMode instead")]
@@ -39,6 +40,8 @@ namespace BTCPayServer.Data
 
         public bool RequiresRefundEmail { get; set; }
 
+        public bool ShowRecommendedFee { get; set; }
+
         CurrencyPair[] _DefaultCurrencyPairs;
         [JsonProperty("defaultCurrencyPairs", ItemConverterType = typeof(CurrencyPairJsonConverter))]
         public CurrencyPair[] DefaultCurrencyPairs

BTCPayServer/Models/InvoicingModels/PaymentModel.cs

@@ -38,6 +38,8 @@ namespace BTCPayServer.Models.InvoicingModels
         public string BtcDue { get; set; }
         public string CustomerEmail { get; set; }
         public bool RequiresRefundEmail { get; set; }
+        public bool ShowRecommendedFee { get; set; }
+        public decimal FeeRate { get; set; }
         public int ExpirationSeconds { get; set; }
         public string Status { get; set; }
         public string MerchantRefLink { get; set; }

BTCPayServer/Models/StoreViewModels/CheckoutExperienceViewModel.cs

@@ -39,6 +39,9 @@ namespace BTCPayServer.Models.StoreViewModels
         [Display(Name = "Requires a refund email")]
         public bool RequiresRefundEmail { get; set; }
 
+        [Display(Name = "Show recommended fee")]
+        public bool ShowRecommendedFee { get; set; }
+
         [Display(Name = "Do not propose on chain payment if the value of the invoice is below...")]
         [MaxLength(20)]
         public string OnChainMinValue { get; set; }

BTCPayServer/Payments/Bitcoin/BitcoinLikeOnChainPaymentMethod.cs

@@ -21,6 +21,11 @@ namespace BTCPayServer.Payments.Bitcoin
         {
             return NextNetworkFee.ToDecimal(MoneyUnit.BTC);
         }
+
+        public decimal GetFeeRate() {
+            return FeeRate.SatoshiPerByte;
+        }
+
         public void SetPaymentDestination(string newPaymentDestination)
         {
             DepositAddress = newPaymentDestination;

BTCPayServer/Payments/IPaymentMethodDetails.cs

@@ -23,6 +23,11 @@ namespace BTCPayServer.Payments
         /// <returns></returns>
         decimal GetNextNetworkFee();
         /// <summary>
+        /// Returns recommended fee rate for a transaction
+        /// </summary>
+        /// <returns></returns>
+        decimal GetFeeRate();
+        /// <summary>
         /// Change the payment destination (internal plumbing)
         /// </summary>
         /// <param name="newPaymentDestination"></param>

BTCPayServer/Payments/Lightning/LightningLikePaymentMethodDetails.cs

@@ -26,6 +26,11 @@ namespace BTCPayServer.Payments.Lightning
         {
             return 0.0m;
         }
+
+        public decimal GetFeeRate() {
+            return 0.0m;
+        }
+
         public void SetPaymentDestination(string newPaymentDestination)
         {
             BOLT11 = newPaymentDestination;

BTCPayServer/Services/Altcoins/Monero/Payments/MoneroLikeOnChainPaymentMethodDetails.cs

@@ -18,6 +18,11 @@ namespace BTCPayServer.Services.Altcoins.Monero.Payments
         {
             return NextNetworkFee;
         }
+
+        public decimal GetFeeRate() {
+            return 0.0m;
+        }
+        
         public void SetPaymentDestination(string newPaymentDestination)
         {
             DepositAddress = newPaymentDestination;

BTCPayServer/Views/Invoice/Checkout-Body.cshtml

@@ -153,7 +153,7 @@
     </component>
 </div>
 
-<div class="payment-box">
+<div class="payment-box" v-bind:class="{ 'payment-box--with-recommended-fee': showRecommendedFee && !showEmailForm }">
     <div class="bp-view payment manual-flow enter-contact-email" id="emailAddressView" v-bind:class="{ 'active': showEmailForm}">
         <form class="manual__step-one refund-address-form contact-email-form" id="emailAddressForm" name="emailAddressForm" novalidate="" v-on:submit.prevent="onEmailSubmit">
             <div class="manual__step-one__header">

BTCPayServer/Views/Invoice/Checkout.cshtml

@@ -185,6 +185,9 @@
             showEmailForm: function(){
                 return this.srvModel.requiresRefundEmail && (!this.srvModel.customerEmail || !this.validateEmail(this.srvModel.customerEmail)) && !this.invoiceUnpayable && !this.invoicePaid;
             },
+            showRecommendedFee: function(){
+                return  this.srvModel.showRecommendedFee && this.srvModel.feeRate != 0;
+            },
             invoiceUnpayable: function(){
                 return  ["expired", "invalid"].indexOf(this.srvModel.status) >= 0;
             },

BTCPayServer/Views/Shared/Bitcoin_Lightning_LikeMethodCheckout.cshtml

@@ -167,7 +167,13 @@
                     </center>
                 </nav>
             </div>
-         }   
+        }
+
+        @if (Model.ShowRecommendedFee) {
+            <div id="recommended-fee" class="recommended-fee" v-bind:class="{ hide: !srvModel.feeRate }">
+                <span>{{$t("Recommended_Fee", srvModel)}}</span>
+            </div>
+        }
     </div>          
 </script>
 

BTCPayServer/Views/Stores/CheckoutExperience.cshtml

@@ -65,9 +65,14 @@
                 </div>
                 <div class="form-check">
                     <input asp-for="RedirectAutomatically" type="checkbox" class="form-check-input" />
-                    <label asp-for="RedirectAutomatically" class="form-check-label" ></label>
+                    <label asp-for="RedirectAutomatically" class="form-check-label"></label>
                     <span asp-validation-for="RedirectAutomatically" class="text-danger"></span>
                 </div>
+                <div class="form-check">
+                    <input asp-for="ShowRecommendedFee" type="checkbox" class="form-check-input" />
+                    <label asp-for="ShowRecommendedFee" class="form-check-label"></label>
+                    <p class="form-text text-muted">Fee will be shown for BTC and LTC onchain payments only.</p>
+                </div>
             </div>
             <button name="command" type="submit" class="btn btn-primary" value="Save">Save</button>
         </form>

BTCPayServer/wwwroot/checkout/css/normalizer.css

@@ -9015,6 +9015,10 @@ strong {
     min-height: 393px;
 }
 
+.payment-box--with-recommended-fee {
+    min-height: 430px;
+}
+
 .paypro {
     padding: 10px;
 }
@@ -9248,6 +9252,20 @@ strong {
             padding-bottom: 40px;
         }
 
+.recommended-fee {
+    box-sizing: border-box;
+    color: #818EA9;
+    font-size: 14px;
+    font-weight: 300;
+    position: absolute;
+    top: calc(100% - 40px);
+    left: 50%;
+    padding: 0 16px;
+    text-align: center;
+    transform: translateX(-50%);
+    width: 100%;
+}
+
 .success-message {
     color: rgba(111, 111, 111, 0.9);
     text-align: center;

BTCPayServer/wwwroot/locales/en.json

@@ -47,5 +47,6 @@
   "Pay with CoinSwitch": "Pay with CoinSwitch",
   "Pay with Changelly": "Pay with Changelly",
   "Close": "Close",
-  "NotPaid_ExtraTransaction": "The invoice hasn't been paid in full. Please send another transaction to cover amount Due."
+  "NotPaid_ExtraTransaction": "The invoice hasn't been paid in full. Please send another transaction to cover amount Due.",
+  "Recommended_Fee": "Recommended fee: {{feeRate}} sat/byte"
 }