mirror of
https://github.com/aljazceru/btcpayserver.git
synced 2025-12-17 22:14:26 +01:00
Use razor component to encapsulate UI logic
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
@model BTCPayServer.Services.Notifications.NotificationSummaryViewModel
|
||||
@inject LinkGenerator linkGenerator
|
||||
@model BTCPayServer.Components.NotificationsDropdown.NotificationSummaryViewModel
|
||||
|
||||
@if (Model.UnseenCount > 0)
|
||||
{
|
||||
@@ -31,3 +32,36 @@ else
|
||||
</a>
|
||||
</li>
|
||||
}
|
||||
<script type="text/javascript">
|
||||
|
||||
var supportsWebSockets = 'WebSocket' in window && window.WebSocket.CLOSING === 2;
|
||||
|
||||
if (supportsWebSockets) {
|
||||
|
||||
var loc = window.location, ws_uri;
|
||||
if (loc.protocol === "https:") {
|
||||
ws_uri = "wss:";
|
||||
} else {
|
||||
ws_uri = "ws:";
|
||||
}
|
||||
ws_uri += "//" + loc.host;
|
||||
ws_uri += "@linkGenerator.GetPathByAction("SubscribeUpdates", "Notifications")";
|
||||
var newDataEndpoint = "@linkGenerator.GetPathByAction("GetNotificationDropdownUI", "Notifications")";
|
||||
|
||||
try {
|
||||
socket = new WebSocket(ws_uri);
|
||||
socket.onmessage = function (e) {
|
||||
$.get(newDataEndpoint, function(data){
|
||||
$("#notifications-nav-item").replaceWith($(data));
|
||||
});
|
||||
};
|
||||
socket.onerror = function (e) {
|
||||
console.error("Error while connecting to websocket for notifications (callback)", e);
|
||||
};
|
||||
}
|
||||
catch (e) {
|
||||
console.error("Error while connecting to websocket for notifications", e);
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,24 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using BTCPayServer.Services.Notifications;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
|
||||
namespace BTCPayServer.Components.NotificationsDropdown
|
||||
{
|
||||
public class NotificationsDropdown : ViewComponent
|
||||
{
|
||||
private readonly NotificationManager _notificationManager;
|
||||
|
||||
public NotificationsDropdown(NotificationManager notificationManager)
|
||||
{
|
||||
_notificationManager = notificationManager;
|
||||
}
|
||||
|
||||
public async Task<IViewComponentResult> InvokeAsync()
|
||||
{
|
||||
return View(await _notificationManager.GetSummaryNotifications(UserClaimsPrincipal));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using BTCPayServer.Models.NotificationViewModels;
|
||||
|
||||
namespace BTCPayServer.Components.NotificationsDropdown
|
||||
{
|
||||
public class NotificationSummaryViewModel
|
||||
{
|
||||
public int UnseenCount { get; set; }
|
||||
public List<NotificationViewModel> Last5 { get; set; }
|
||||
}
|
||||
}
|
||||
20
BTCPayServer/Components/Pager/Pager.cs
Normal file
20
BTCPayServer/Components/Pager/Pager.cs
Normal file
@@ -0,0 +1,20 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using BTCPayServer.Models;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
|
||||
namespace BTCPayServer.Components
|
||||
{
|
||||
public class Pager : ViewComponent
|
||||
{
|
||||
public Pager()
|
||||
{
|
||||
}
|
||||
public IViewComponentResult Invoke(BasePagingViewModel viewModel)
|
||||
{
|
||||
return View(viewModel);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -15,22 +15,6 @@ using Microsoft.AspNetCore.Mvc;
|
||||
|
||||
namespace BTCPayServer.Controllers
|
||||
{
|
||||
|
||||
public class NotificationsDropdown : ViewComponent
|
||||
{
|
||||
private readonly NotificationManager _notificationManager;
|
||||
|
||||
public NotificationsDropdown(NotificationManager notificationManager)
|
||||
{
|
||||
_notificationManager = notificationManager;
|
||||
}
|
||||
|
||||
public async Task<IViewComponentResult> InvokeAsync(int noOfEmployee)
|
||||
{
|
||||
return View(await _notificationManager.GetSummaryNotifications(UserClaimsPrincipal));
|
||||
}
|
||||
}
|
||||
|
||||
[BitpayAPIConstraint(false)]
|
||||
[Authorize(AuthenticationSchemes = AuthenticationSchemes.Cookie)]
|
||||
[Route("[controller]/[action]")]
|
||||
|
||||
@@ -81,6 +81,12 @@ namespace BTCPayServer.Hosting
|
||||
return builtInFactory(context);
|
||||
};
|
||||
})
|
||||
.AddRazorOptions(o =>
|
||||
{
|
||||
// /Components/{View Component Name}/{View Name}.cshtml
|
||||
o.ViewLocationFormats.Add("/{0}.cshtml");
|
||||
o.PageViewLocationFormats.Add("/{0}.cshtml");
|
||||
})
|
||||
.AddNewtonsoftJson()
|
||||
#if RAZOR_RUNTIME_COMPILE
|
||||
.AddRazorRuntimeCompilation()
|
||||
|
||||
@@ -3,6 +3,7 @@ using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Security.Claims;
|
||||
using System.Threading.Tasks;
|
||||
using BTCPayServer.Components.NotificationsDropdown;
|
||||
using BTCPayServer.Data;
|
||||
using BTCPayServer.Models.NotificationViewModels;
|
||||
using Microsoft.AspNetCore.Identity;
|
||||
@@ -124,10 +125,4 @@ namespace BTCPayServer.Services.Notifications
|
||||
throw new InvalidOperationException($"No INotificationHandler found for {blobType.Name}");
|
||||
}
|
||||
}
|
||||
|
||||
public class NotificationSummaryViewModel
|
||||
{
|
||||
public int UnseenCount { get; set; }
|
||||
public List<NotificationViewModel> Last5 { get; set; }
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
@section HeadScripts {
|
||||
<script src="~/modal/btcpay.js" asp-append-version="true"></script>
|
||||
}
|
||||
|
||||
@Html.HiddenFor(a => a.Count)
|
||||
<section>
|
||||
<div class="container">
|
||||
@@ -49,7 +50,7 @@
|
||||
<input type="hidden" asp-for="Count" />
|
||||
<div class="input-group ">
|
||||
<input asp-for="TimezoneOffset" type="hidden" />
|
||||
<input asp-for="SearchTerm" class="form-control"/>
|
||||
<input asp-for="SearchTerm" class="form-control" />
|
||||
<div class="input-group-append">
|
||||
<button type="submit" class="btn btn-primary" title="Search invoice">
|
||||
<span class="fa fa-search"></span> Search
|
||||
@@ -91,7 +92,7 @@
|
||||
<div>
|
||||
<a asp-action="CreateInvoice" class="btn btn-primary mb-1" role="button" id="CreateNewInvoice"><span class="fa fa-plus"></span> Create a new invoice</a>
|
||||
|
||||
<span >
|
||||
<span>
|
||||
<button class="btn btn-primary dropdown-toggle mb-1" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Actions
|
||||
</button>
|
||||
@@ -114,7 +115,7 @@
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
<br />
|
||||
@* Custom Range Modal *@
|
||||
<div class="modal fade" id="customRangeModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 550px;">
|
||||
@@ -194,8 +195,7 @@
|
||||
@* Custom Range Modal *@
|
||||
|
||||
<script type="text/javascript">
|
||||
function selectAll(e)
|
||||
{
|
||||
function selectAll(e) {
|
||||
var items = document.getElementsByClassName("selector");
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
items[i].checked = e.checked;
|
||||
@@ -252,7 +252,7 @@
|
||||
<td>
|
||||
@if(invoice.Details.Archived)
|
||||
{
|
||||
<span class="badge badge-warning" >archived</span>
|
||||
<span class="badge badge-warning">archived</span>
|
||||
}
|
||||
@if (invoice.CanMarkStatus)
|
||||
{
|
||||
@@ -313,7 +313,7 @@
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<partial name="_TableFooterPager" />
|
||||
<vc:pager view-model="Model"></vc:pager>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -91,7 +91,7 @@
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<partial name="_TableFooterPager" />
|
||||
<vc:pager view-model="Model"></vc:pager>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,37 +0,0 @@
|
||||
@inject LinkGenerator linkGenerator
|
||||
|
||||
<div></div>
|
||||
@await Component.InvokeAsync("NotificationsDropdown")
|
||||
<script type="text/javascript">
|
||||
|
||||
var supportsWebSockets = 'WebSocket' in window && window.WebSocket.CLOSING === 2;
|
||||
|
||||
if (supportsWebSockets) {
|
||||
|
||||
var loc = window.location, ws_uri;
|
||||
if (loc.protocol === "https:") {
|
||||
ws_uri = "wss:";
|
||||
} else {
|
||||
ws_uri = "ws:";
|
||||
}
|
||||
ws_uri += "//" + loc.host;
|
||||
ws_uri += "@linkGenerator.GetPathByAction("SubscribeUpdates", "Notifications")";
|
||||
var newDataEndpoint = "@linkGenerator.GetPathByAction("GetNotificationDropdownUI", "Notifications")";
|
||||
|
||||
try {
|
||||
socket = new WebSocket(ws_uri);
|
||||
socket.onmessage = function (e) {
|
||||
$.get(newDataEndpoint, function(data){
|
||||
$("#notifications-nav-item").replaceWith($(data));
|
||||
});
|
||||
};
|
||||
socket.onerror = function (e) {
|
||||
console.error("Error while connecting to websocket for notifications (callback)", e);
|
||||
};
|
||||
}
|
||||
catch (e) {
|
||||
console.error("Error while connecting to websocket for notifications", e);
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -1,4 +1,4 @@
|
||||
@inject SignInManager<ApplicationUser> SignInManager
|
||||
@inject SignInManager<ApplicationUser> SignInManager
|
||||
@inject UserManager<ApplicationUser> UserManager
|
||||
@inject RoleManager<IdentityRole> RoleManager
|
||||
@inject BTCPayServer.Services.BTCPayServerEnvironment env
|
||||
@@ -77,8 +77,7 @@
|
||||
<li class="nav-item">
|
||||
<a asp-area="" asp-controller="Manage" asp-action="Index" title="My settings" class="nav-link js-scroll-trigger" id="MySettings"><i class="fa fa-user"></i></a>
|
||||
</li>
|
||||
|
||||
<partial name="LayoutPartials/NotificationsNavItem" />
|
||||
<vc:notifications-dropdown></vc:notifications-dropdown>
|
||||
|
||||
<li class="nav-item">
|
||||
<a asp-area="" asp-controller="Account" asp- asp-action="Logout" title="Logout" class="nav-link js-scroll-trigger" id="Logout"><i class="fa fa-sign-out"></i></a>
|
||||
|
||||
@@ -10,3 +10,4 @@
|
||||
@using Microsoft.AspNetCore.Routing;
|
||||
@inject BTCPayServer.Services.Safe Safe
|
||||
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
|
||||
@addTagHelper *, BTCPayServer
|
||||
Reference in New Issue
Block a user