dohertj2/scadalink-design
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(notification-outbox): add Notification Outbox UI page

Browse Source
This commit is contained in:
Joseph Doherty
2026-05-19 02:58:49 -04:00
parent afdf581e32
commit ad9872705d
3 changed files with 708 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/ScadaLink.CentralUI/Components/Layout/NavMenu.razor
View File

@@ -79,6 +79,9 @@
<li class="nav-item">
<NavLink class="nav-link" href="/monitoring/parked-messages">Parked Messages</NavLink>
</li>
<li class="nav-item">
<NavLink class="nav-link" href="/monitoring/notification-outbox">Notification Outbox</NavLink>
</li>
</Authorized>
</AuthorizeView>

483
src/ScadaLink.CentralUI/Components/Pages/Monitoring/NotificationOutbox.razor Normal file
View File

@@ -0,0 +1,483 @@
@page "/monitoring/notification-outbox"
@attribute [Authorize(Policy = ScadaLink.Security.AuthorizationPolicies.RequireDeployment)]
@using ScadaLink.Commons.Entities.Sites
@using ScadaLink.Commons.Interfaces.Repositories
@using ScadaLink.Commons.Messages.Notification
@using ScadaLink.Communication
@inject CommunicationService CommunicationService
@inject ISiteRepository SiteRepository
@inject IDialogService Dialog
@inject ILogger<NotificationOutbox> Logger
<div class="container-fluid mt-3">
<ToastNotification @ref="_toast" />
<div class="d-flex justify-content-between align-items-center mb-3">
<h4 class="mb-0">Notification Outbox</h4>
<button class="btn btn-outline-secondary btn-sm" @onclick="RefreshAll" disabled="@_loading">
@if (_loading) { <span class="spinner-border spinner-border-sm me-1" role="status"></span> }
Refresh
</button>
</div>
@* ── KPI tiles ── *@
@if (_kpiError != null)
{
<div class="alert alert-warning py-2">KPIs unavailable: @_kpiError</div>
}
else
{
<div class="row g-3 mb-3">
<div class="col-lg col-md-4 col-6">
<div class="card h-100">
<div class="card-body text-center py-3">
<h3 class="mb-0">@_kpi.QueueDepth</h3>
<small class="text-muted">Queue Depth</small>
</div>
</div>
</div>
<div class="col-lg col-md-4 col-6">
<div class="card h-100 @(_kpi.StuckCount > 0 ? "border-warning" : "")">
<div class="card-body text-center py-3">
<h3 class="mb-0 @(_kpi.StuckCount > 0 ? "text-warning" : "")">@_kpi.StuckCount</h3>
<small class="text-muted">Stuck</small>
</div>
</div>
</div>
<div class="col-lg col-md-4 col-6">
<div class="card h-100 @(_kpi.ParkedCount > 0 ? "border-danger" : "")">
<div class="card-body text-center py-3">
<h3 class="mb-0 @(_kpi.ParkedCount > 0 ? "text-danger" : "")">@_kpi.ParkedCount</h3>
<small class="text-muted">Parked</small>
</div>
</div>
</div>
<div class="col-lg col-md-4 col-6">
<div class="card h-100">
<div class="card-body text-center py-3">
<h3 class="mb-0 text-success">@_kpi.DeliveredLastInterval</h3>
<small class="text-muted">Delivered (last interval)</small>
</div>
</div>
</div>
<div class="col-lg col-md-4 col-6">
<div class="card h-100">
<div class="card-body text-center py-3">
<h3 class="mb-0">@FormatAge(_kpi.OldestPendingAge)</h3>
<small class="text-muted">Oldest Pending Age</small>
</div>
</div>
</div>
</div>
}
@* ── Filters ── *@
<div class="card mb-3">
<div class="card-body py-2">
<div class="row g-2 align-items-end">
<div class="col-auto">
<label class="form-label small mb-1" for="no-status">Status</label>
<select id="no-status" class="form-select form-select-sm" style="min-width: 130px;"
@bind="_statusFilter">
<option value="">All</option>
<option value="Pending">Pending</option>
<option value="Retrying">Retrying</option>
<option value="Delivered">Delivered</option>
<option value="Parked">Parked</option>
<option value="Discarded">Discarded</option>
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="no-type">Type</label>
<select id="no-type" class="form-select form-select-sm" style="min-width: 120px;"
@bind="_typeFilter">
<option value="">All</option>
<option value="Email">Email</option>
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="no-site">Source site</label>
<select id="no-site" class="form-select form-select-sm" style="min-width: 150px;"
@bind="_siteFilter">
<option value="">Any</option>
@foreach (var site in _sites)
{
<option value="@site.SiteIdentifier">@site.Name</option>
}
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="no-list">List name</label>
<input id="no-list" type="text" class="form-control form-control-sm"
style="min-width: 140px;" placeholder="Any" @bind="_listFilter" />
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="no-from">From</label>
<input id="no-from" type="datetime-local" class="form-control form-control-sm"
@bind="_fromFilter" />
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="no-to">To</label>
<input id="no-to" type="datetime-local" class="form-control form-control-sm"
@bind="_toFilter" />
</div>
<div class="col">
<label class="form-label small mb-1" for="no-search">Subject keyword</label>
<input id="no-search" type="search" class="form-control form-control-sm"
placeholder="Search subject…" @bind="_subjectFilter" />
</div>
<div class="col-auto">
<div class="form-check mb-1">
<input class="form-check-input" type="checkbox" id="no-stuck-only"
@bind="_stuckOnly" />
<label class="form-check-label small" for="no-stuck-only">Stuck only</label>
</div>
</div>
<div class="col-auto">
<button class="btn btn-outline-secondary btn-sm" @onclick="ClearFilters"
disabled="@(!HasActiveFilters)">Clear</button>
</div>
<div class="col-auto">
<button class="btn btn-primary btn-sm" @onclick="Search" disabled="@_loading">
@if (_loading) { <span class="spinner-border spinner-border-sm me-1" role="status"></span> }
Query
</button>
</div>
</div>
</div>
</div>
@if (_listError != null)
{
<div class="alert alert-danger">@_listError</div>
}
@* ── Notification list ── *@
@if (_notifications == null)
{
@if (_loading)
{
<div class="text-muted small">Loading…</div>
}
}
else if (_notifications.Count == 0)
{
<div class="card">
<div class="card-body text-center text-muted py-5">
<div class="fs-5 mb-1">No notifications</div>
<div class="small">No notifications match the current filters.</div>
</div>
</div>
}
else
{
<div class="table-responsive">
<table class="table table-sm table-hover align-middle">
<thead class="table-light">
<tr>
<th>ID</th>
<th>Type</th>
<th>List</th>
<th>Subject</th>
<th>Status</th>
<th class="text-end">Retries</th>
<th>Source site</th>
<th>Created</th>
<th>Delivered</th>
<th class="text-end">Actions</th>
</tr>
</thead>
<tbody>
@foreach (var n in _notifications)
{
<tr @key="n.NotificationId" class="@(n.IsStuck ? "table-warning" : "")">
<td><code class="small" title="@n.NotificationId">@ShortId(n.NotificationId)</code></td>
<td>@n.Type</td>
<td>@n.ListName</td>
<td>
@n.Subject
@if (!string.IsNullOrEmpty(n.LastError))
{
<div class="small text-danger text-truncate" style="max-width: 320px;"
title="@n.LastError">@n.LastError</div>
}
</td>
<td>
<span class="badge @StatusBadgeClass(n.Status)">@n.Status</span>
@if (n.IsStuck)
{
<span class="badge bg-warning text-dark ms-1">Stuck</span>
}
</td>
<td class="text-end font-monospace">@n.RetryCount</td>
<td><span class="small">@SiteName(n.SourceSiteId)</span></td>
<td><TimestampDisplay Value="@n.CreatedAt" Format="yyyy-MM-dd HH:mm" /></td>
<td><TimestampDisplay Value="@n.DeliveredAt" Format="yyyy-MM-dd HH:mm" NullText="—" /></td>
<td class="text-end">
@if (n.Status == "Parked")
{
<button class="btn btn-outline-success btn-sm me-1"
@onclick="() => RetryNotification(n)" disabled="@_actionInProgress">
Retry
</button>
<button class="btn btn-outline-danger btn-sm"
@onclick="() => DiscardNotification(n)" disabled="@_actionInProgress">
Discard
</button>
}
else
{
<span class="text-muted small">—</span>
}
</td>
</tr>
}
</tbody>
</table>
</div>
@if (_totalCount > _pageSize)
{
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted small">
Page @_pageNumber of @((_totalCount + _pageSize - 1) / _pageSize) · @_totalCount total
</span>
<div>
<button class="btn btn-outline-secondary btn-sm me-1"
@onclick="PrevPage" disabled="@(_pageNumber <= 1 || _loading)">Previous</button>
<button class="btn btn-outline-secondary btn-sm"
@onclick="NextPage" disabled="@(_notifications.Count < _pageSize || _loading)">Next</button>
</div>
</div>
}
}
</div>
@code {
private const int _pageSize = 50;
private ToastNotification _toast = default!;
private List<Site> _sites = new();
// KPIs
private NotificationKpiResponse _kpi =
new(string.Empty, true, null, 0, 0, 0, 0, null);
private string? _kpiError;
// List
private List<NotificationSummary>? _notifications;
private int _totalCount;
private int _pageNumber = 1;
private bool _loading;
private string? _listError;
private bool _actionInProgress;
// Filters
private string _statusFilter = string.Empty;
private string _typeFilter = string.Empty;
private string _siteFilter = string.Empty;
private string _listFilter = string.Empty;
private string _subjectFilter = string.Empty;
private bool _stuckOnly;
private DateTime? _fromFilter;
private DateTime? _toFilter;
protected override async Task OnInitializedAsync()
{
try
{
_sites = (await SiteRepository.GetAllSitesAsync()).ToList();
}
catch (Exception ex)
{
// Non-fatal — source-site filter just falls back to the raw site IDs.
Logger.LogWarning(ex, "Failed to load sites for the outbox source-site filter.");
}
await RefreshAll();
}
private async Task RefreshAll()
{
await Task.WhenAll(LoadKpis(), FetchPage());
}
private async Task LoadKpis()
{
try
{
var response = await CommunicationService.GetNotificationKpisAsync(
new NotificationKpiRequest(Guid.NewGuid().ToString("N")));
if (response.Success)
{
_kpi = response;
_kpiError = null;
}
else
{
_kpiError = response.ErrorMessage ?? "KPI query failed.";
}
}
catch (Exception ex)
{
_kpiError = $"KPI query failed: {ex.Message}";
}
}
private async Task Search()
{
_pageNumber = 1;
await FetchPage();
}
private async Task PrevPage() { _pageNumber--; await FetchPage(); }
private async Task NextPage() { _pageNumber++; await FetchPage(); }
private async Task FetchPage()
{
_loading = true;
_listError = null;
try
{
var request = new NotificationOutboxQueryRequest(
CorrelationId: Guid.NewGuid().ToString("N"),
StatusFilter: NullIfEmpty(_statusFilter),
TypeFilter: NullIfEmpty(_typeFilter),
SourceSiteFilter: NullIfEmpty(_siteFilter),
ListNameFilter: NullIfEmpty(_listFilter),
StuckOnly: _stuckOnly,
SubjectKeyword: NullIfEmpty(_subjectFilter),
From: ToUtc(_fromFilter),
To: ToUtc(_toFilter),
PageNumber: _pageNumber,
PageSize: _pageSize);
var response = await CommunicationService.QueryNotificationOutboxAsync(request);
if (response.Success)
{
_notifications = response.Notifications.ToList();
_totalCount = response.TotalCount;
}
else
{
_listError = response.ErrorMessage ?? "Query failed.";
}
}
catch (Exception ex)
{
_listError = $"Query failed: {ex.Message}";
}
_loading = false;
}
private async Task RetryNotification(NotificationSummary n)
{
var confirmed = await Dialog.ConfirmAsync(
"Retry notification",
$"Re-queue notification {ShortId(n.NotificationId)} (\"{n.Subject}\") for delivery?");
if (!confirmed) return;
_actionInProgress = true;
try
{
var response = await CommunicationService.RetryNotificationAsync(
new RetryNotificationRequest(Guid.NewGuid().ToString("N"), n.NotificationId));
if (response.Success)
{
_toast.ShowSuccess($"Notification {ShortId(n.NotificationId)} re-queued for delivery.");
await RefreshAll();
}
else
{
_toast.ShowError(response.ErrorMessage ?? "Retry failed.");
}
}
catch (Exception ex)
{
_toast.ShowError($"Retry failed: {ex.Message}");
}
_actionInProgress = false;
}
private async Task DiscardNotification(NotificationSummary n)
{
var confirmed = await Dialog.ConfirmAsync(
"Discard notification",
$"Permanently discard notification {ShortId(n.NotificationId)} (\"{n.Subject}\")? This cannot be undone.",
danger: true);
if (!confirmed) return;
_actionInProgress = true;
try
{
var response = await CommunicationService.DiscardNotificationAsync(
new DiscardNotificationRequest(Guid.NewGuid().ToString("N"), n.NotificationId));
if (response.Success)
{
_toast.ShowSuccess($"Notification {ShortId(n.NotificationId)} discarded.");
await RefreshAll();
}
else
{
_toast.ShowError(response.ErrorMessage ?? "Discard failed.");
}
}
catch (Exception ex)
{
_toast.ShowError($"Discard failed: {ex.Message}");
}
_actionInProgress = false;
}
private void ClearFilters()
{
_statusFilter = string.Empty;
_typeFilter = string.Empty;
_siteFilter = string.Empty;
_listFilter = string.Empty;
_subjectFilter = string.Empty;
_stuckOnly = false;
_fromFilter = null;
_toFilter = null;
}
private bool HasActiveFilters =>
!string.IsNullOrEmpty(_statusFilter) ||
!string.IsNullOrEmpty(_typeFilter) ||
!string.IsNullOrEmpty(_siteFilter) ||
!string.IsNullOrEmpty(_listFilter) ||
!string.IsNullOrEmpty(_subjectFilter) ||
_stuckOnly ||
_fromFilter != null ||
_toFilter != null;
private string SiteName(string siteId) =>
_sites.FirstOrDefault(s => s.SiteIdentifier == siteId)?.Name ?? siteId;
private static string? NullIfEmpty(string s) => string.IsNullOrWhiteSpace(s) ? null : s.Trim();
private static DateTimeOffset? ToUtc(DateTime? local) =>
local == null ? null : new DateTimeOffset(DateTime.SpecifyKind(local.Value, DateTimeKind.Utc));
private static string ShortId(string id) => id[..Math.Min(12, id.Length)];
private static string FormatAge(TimeSpan? age)
{
if (age == null) return "—";
var t = age.Value;
if (t.TotalSeconds < 60) return $"{(int)t.TotalSeconds}s";
if (t.TotalMinutes < 60) return $"{(int)t.TotalMinutes}m";
if (t.TotalHours < 24) return $"{(int)t.TotalHours}h";
return $"{(int)t.TotalDays}d";
}
private static string StatusBadgeClass(string status) => status switch
{
"Delivered" => "bg-success",
"Parked" => "bg-danger",
"Retrying" => "bg-warning text-dark",
"Pending" => "bg-info text-dark",
"Discarded" => "bg-secondary",
_ => "bg-light text-dark"
};
}

222
tests/ScadaLink.CentralUI.Tests/Pages/NotificationOutboxPageTests.cs Normal file
View File

@@ -0,0 +1,222 @@
using System.Security.Claims;
using Akka.Actor;
using Bunit;
using Microsoft.AspNetCore.Components.Authorization;
using Microsoft.AspNetCore.Authorization;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging.Abstractions;
using Microsoft.Extensions.Options;
using ScadaLink.CentralUI.Components.Shared;
using NSubstitute;
using ScadaLink.Commons.Entities.Sites;
using ScadaLink.Commons.Interfaces.Repositories;
using ScadaLink.Commons.Messages.Notification;
using ScadaLink.Communication;
using ScadaLink.Security;
using NotificationOutboxPage = ScadaLink.CentralUI.Components.Pages.Monitoring.NotificationOutbox;
namespace ScadaLink.CentralUI.Tests.Pages;
/// <summary>
/// bUnit rendering tests for the Notification Outbox monitoring page (Task 23).
///
/// Testability note: <see cref="CommunicationService"/> is a concrete class with
/// non-virtual methods, so NSubstitute cannot intercept it. The outbox calls all
/// route through an injected <see cref="IActorRef"/> (the notification-outbox
/// proxy), so the tests wire a real, lightweight <see cref="ActorSystem"/> with a
/// scripted <see cref="ReceiveActor"/> that replies with fixed responses — the
/// same seam <c>SetNotificationOutbox</c> exists for.
/// </summary>
public class NotificationOutboxPageTests : BunitContext
{
private readonly ActorSystem _system = ActorSystem.Create("notif-outbox-tests");
private readonly CommunicationService _comms;
// Mutable scripted replies — individual tests can override before rendering.
private NotificationKpiResponse _kpiReply =
new("k", true, null, QueueDepth: 7, StuckCount: 2, ParkedCount: 1,
DeliveredLastInterval: 42, OldestPendingAge: TimeSpan.FromMinutes(9));
private NotificationOutboxQueryResponse _queryReply =
new("q", true, null, new List<NotificationSummary>
{
new("notif-aaaaaaaa-1111", "Email", "Ops On-Call", "Pump fault at Plant-A",
"Parked", RetryCount: 3, LastError: "SMTP timeout", SourceSiteId: "plant-a",
SourceInstanceId: "Pump-001", CreatedAt: DateTimeOffset.UtcNow.AddMinutes(-30),
DeliveredAt: null, IsStuck: true),
new("notif-bbbbbbbb-2222", "Email", "Maintenance", "Daily summary",
"Delivered", RetryCount: 0, LastError: null, SourceSiteId: "plant-b",
SourceInstanceId: null, CreatedAt: DateTimeOffset.UtcNow.AddHours(-2),
DeliveredAt: DateTimeOffset.UtcNow.AddHours(-2), IsStuck: false),
}, TotalCount: 2);
// Records the most recent retry/discard requests the actor received.
private readonly List<RetryNotificationRequest> _retryRequests = new();
private readonly List<DiscardNotificationRequest> _discardRequests = new();
public NotificationOutboxPageTests()
{
_comms = new CommunicationService(
Options.Create(new CommunicationOptions()),
NullLogger<CommunicationService>.Instance);
var outbox = _system.ActorOf(Props.Create(() => new ScriptedOutboxActor(this)));
_comms.SetNotificationOutbox(outbox);
Services.AddSingleton(_comms);
Services.AddSingleton<IDialogService>(new AlwaysConfirmDialogService());
var siteRepo = Substitute.For<ISiteRepository>();
siteRepo.GetAllSitesAsync(Arg.Any<CancellationToken>())
.Returns(Task.FromResult<IReadOnlyList<Site>>(new List<Site>
{
new("Plant A", "plant-a") { Id = 1 },
new("Plant B", "plant-b") { Id = 2 },
}));
Services.AddSingleton(siteRepo);
var claims = new[]
{
new Claim("Username", "tester"),
new Claim(ClaimTypes.Role, "Deployment"),
};
var user = new ClaimsPrincipal(new ClaimsIdentity(claims, "TestAuth"));
Services.AddSingleton<AuthenticationStateProvider>(new TestAuthStateProvider(user));
Services.AddAuthorizationCore();
}
[Fact]
public void Page_RequiresDeploymentPolicy()
{
var attr = typeof(NotificationOutboxPage)
.GetCustomAttributes(typeof(AuthorizeAttribute), true)
.Cast<AuthorizeAttribute>()
.FirstOrDefault();
Assert.NotNull(attr);
Assert.Equal(AuthorizationPolicies.RequireDeployment, attr!.Policy);
}
[Fact]
public void Renders_KpiTiles_WithValues()
{
var cut = Render<NotificationOutboxPage>();
// KPI data arrives via an async actor Ask after first render.
cut.WaitForAssertion(() =>
{
Assert.Contains("Queue Depth", cut.Markup);
Assert.Contains("Stuck", cut.Markup);
Assert.Contains("Parked", cut.Markup);
Assert.Contains("Delivered", cut.Markup);
// KPI numeric values surface in the tiles.
Assert.Contains(">7<", cut.Markup); // QueueDepth
Assert.Contains(">42<", cut.Markup); // DeliveredLastInterval
});
}
[Fact]
public void Renders_NotificationRows()
{
var cut = Render<NotificationOutboxPage>();
cut.WaitForAssertion(() =>
{
Assert.Contains("Pump fault at Plant-A", cut.Markup);
Assert.Contains("Daily summary", cut.Markup);
Assert.Contains("Ops On-Call", cut.Markup);
});
}
[Fact]
public void StuckRow_IsBadged()
{
var cut = Render<NotificationOutboxPage>();
cut.WaitForAssertion(() =>
{
var stuckRow = cut.FindAll("tbody tr")
.First(r => r.TextContent.Contains("Pump fault at Plant-A"));
// The stuck row carries a visible "Stuck" badge.
Assert.Contains("badge", stuckRow.InnerHtml);
Assert.Contains("Stuck", stuckRow.TextContent);
});
}
[Fact]
public void ClickRetry_OnParkedRow_CallsRetryNotification()
{
var cut = Render<NotificationOutboxPage>();
cut.WaitForState(() => cut.Markup.Contains("Pump fault at Plant-A"));
var parkedRow = cut.FindAll("tbody tr")
.First(r => r.TextContent.Contains("Pump fault at Plant-A"));
var retryButton = parkedRow.QuerySelectorAll("button")
.First(b => b.TextContent.Contains("Retry"));
retryButton.Click();
cut.WaitForAssertion(() =>
{
Assert.Single(_retryRequests);
Assert.Equal("notif-aaaaaaaa-1111", _retryRequests[0].NotificationId);
});
}
[Fact]
public void KpiFailure_ShowsErrorMessage()
{
_kpiReply = new NotificationKpiResponse(
"k", false, "outbox repository unavailable", 0, 0, 0, 0, null);
var cut = Render<NotificationOutboxPage>();
cut.WaitForAssertion(() =>
Assert.Contains("outbox repository unavailable", cut.Markup));
}
protected override void Dispose(bool disposing)
{
if (disposing)
{
_system.Terminate().Wait(TimeSpan.FromSeconds(5));
}
base.Dispose(disposing);
}
/// <summary>
/// Stand-in for the notification-outbox actor. Replies to each outbox message
/// type with the test's currently-scripted response.
/// </summary>
private sealed class ScriptedOutboxActor : ReceiveActor
{
public ScriptedOutboxActor(NotificationOutboxPageTests test)
{
Receive<NotificationKpiRequest>(_ => Sender.Tell(test._kpiReply));
Receive<NotificationOutboxQueryRequest>(_ => Sender.Tell(test._queryReply));
Receive<RetryNotificationRequest>(r =>
{
test._retryRequests.Add(r);
Sender.Tell(new RetryNotificationResponse(r.CorrelationId, true, null));
});
Receive<DiscardNotificationRequest>(r =>
{
test._discardRequests.Add(r);
Sender.Tell(new DiscardNotificationResponse(r.CorrelationId, true, null));
});
}
}
/// <summary>A dialog service that auto-confirms, so action paths run end-to-end.</summary>
private sealed class AlwaysConfirmDialogService : IDialogService
{
public Task<bool> ConfirmAsync(string title, string message, bool danger = false)
=> Task.FromResult(true);
public Task<string?> PromptAsync(
string title, string label, string initialValue = "", string? placeholder = null)
=> Task.FromResult<string?>(null);
}
}