Fix Public Node Info View

As the Node Info was used as an ID, this didn't work with IPv6 addresses, as those contain characters not suitable for HTML IDs.

Fixes #4245.

Also: Simplify the head section of that view by reusing the existing partial.
This commit is contained in:
Dennis Reimann 2022-10-29 15:26:20 +02:00 committed by Andrew Camilleri
parent 8806ba76eb
commit ba423a79e3

View file

@ -1,27 +1,12 @@
@using BTCPayServer.Abstractions.Extensions
@model BTCPayServer.Controllers.ShowLightningNodeInfoViewModel @model BTCPayServer.Controllers.ShowLightningNodeInfoViewModel
@inject BTCPayServer.Services.ThemeSettings Theme
@{ @{
Layout = null; Layout = null;
ViewData["Title"] = $"{Model.StoreName} {Model.CryptoCode} Lightning Node";
} }
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>@Model.StoreName @Model.CryptoCode Lightning Node</title> <partial name="LayoutHead" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="~/img/icons/icon-512x512.png" asp-append-version="true">
<link rel="apple-touch-startup-image" href="~/img/splash.png" asp-append-version="true">
<link rel="manifest" href="~/manifest.json">
<link href="~/main/bootstrap/bootstrap.css" asp-append-version="true" rel="stylesheet" />
<link href="~/vendor/font-awesome/css/font-awesome.css" asp-append-version="true" rel="stylesheet" />
<link href="~/vendor/flatpickr/flatpickr.css" asp-append-version="true" rel="stylesheet" />
<link href="~/main/fonts/OpenSans.css" asp-append-version="true" rel="stylesheet" />
<link href="~/main/layout.css" asp-append-version="true" rel="stylesheet" />
<link href="~/main/site.css" asp-append-version="true" rel="stylesheet" />
<link href="@Context.Request.GetRelativePathOrAbsolute(Theme.CssUri)" rel="stylesheet" asp-append-version="true"/>
<link href="~/main/qrcode.css" rel="stylesheet" asp-append-version="true" /> <link href="~/main/qrcode.css" rel="stylesheet" asp-append-version="true" />
</head> </head>
<body> <body>
@ -46,26 +31,26 @@
@if (Model.NodeInfo.Length > 1) @if (Model.NodeInfo.Length > 1)
{ {
<ul class="nav nav-pills justify-content-center mt-4" id="nodeInfo-tab" role="tablist"> <ul class="nav nav-pills justify-content-center mt-4" id="nodeInfo-tab" role="tablist">
@for (int i = 0; i < Model.NodeInfo.Length; i++) @for (var i = 0; i < Model.NodeInfo.Length; i++)
{ {
var nodeInfo = Model.NodeInfo[i]; var nodeInfo = Model.NodeInfo[i];
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">
<button class="nav-link w-100px @(i == 0 ? "active" : "")" id="nodeInfo-tab-@nodeInfo.Id" data-bs-toggle="pill" data-bs-target="#nodeInfo-@nodeInfo.Id" type="button" role="tab" aria-controls="nodeInfo-@nodeInfo.Id" aria-selected="true">@(Model.NodeInfo[i].IsTor ? "Tor" : "Clearnet")</button> <button class="nav-link w-100px @(i == 0 ? "active" : "")" id="nodeInfo-tab-@i" data-bs-toggle="pill" data-bs-target="#nodeInfo-@i" type="button" role="tab" aria-controls="nodeInfo-@i" aria-selected="true">@(nodeInfo.IsTor ? "Tor" : "Clearnet")</button>
</li> </li>
} }
</ul> </ul>
} }
<div class="tab-content" id="nodeInfo-tabContent"> <div class="tab-content" id="nodeInfo-tabContent">
@for (int i = 0; i < Model.NodeInfo.Length; i++) @for (var i = 0; i < Model.NodeInfo.Length; i++)
{ {
var nodeInfo = Model.NodeInfo[i]; var nodeInfo = Model.NodeInfo[i].ToString();
<div class="tab-pane fade @(i == 0 ? "show active" : "")" id="nodeInfo-@nodeInfo.Id" role="tabpanel" aria-labelledby="nodeInfo-tab-@nodeInfo.Id"> <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="nodeInfo-@i" role="tabpanel" aria-labelledby="nodeInfo-tab-@i">
<div class="qr-container my-4 w-100"> <div class="qr-container my-4 w-100">
<img alt="@Model.CryptoCode" class="qr-icon" src="@Model.CryptoImage"/> <img alt="@Model.CryptoCode" class="qr-icon" src="@Model.CryptoImage"/>
<vc:qr-code data="@nodeInfo.ToString()"/> <vc:qr-code data="@nodeInfo"/>
</div> </div>
<div class="input-group" data-clipboard="@nodeInfo.ToString()"> <div class="input-group" data-clipboard="@nodeInfo">
<input type="text" class="form-control" style="cursor:copy" readonly="readonly" value="@nodeInfo.ToString()" id="nodeInfo-addr-@nodeInfo.Id"/> <input type="text" class="form-control" style="cursor:copy" readonly="readonly" value="@nodeInfo" id="nodeInfo-addr-@i"/>
<button type="button" class="btn btn-outline-secondary" data-clipboard-confirm>Copy</button> <button type="button" class="btn btn-outline-secondary" data-clipboard-confirm>Copy</button>
</div> </div>
</div> </div>