feat(centralui): TemplatePickerDialog — folder-tree template picker hosted by IDialogService

Claude-Session: https://claude.ai/code/session_01G2GHPnbbKGvyyfbr2XBRVH
2026-08-21 07:08:37 -04:00
parent 8df6bcb6e0
commit 4bd2651925
2 changed files with 274 additions and 0 deletions
@@ -0,0 +1,136 @@
+using Bunit;
+using Microsoft.Extensions.DependencyInjection;
+using ZB.MOM.WW.ScadaBridge.CentralUI.Components.Shared;
+using ZB.MOM.WW.ScadaBridge.Commons.Entities.Templates;
+
+namespace ZB.MOM.WW.ScadaBridge.CentralUI.Tests.Shared;
+
+/// <summary>
+/// bUnit tests for the Create Instance template picker: templates are the only
+/// selectable nodes, Select stays disabled until one is picked, double-click
+/// selects, Cancel resolves null, and an InitialTemplateId opens the tree on
+/// that template.
+/// </summary>
+public class TemplatePickerDialogTests : BunitContext
+{
+    private readonly DialogService _service = new();
+
+    public TemplatePickerDialogTests()
+    {
+        Services.AddSingleton<IDialogService>(_service);
+        JSInterop.Mode = JSRuntimeMode.Loose;
+    }
+
+    private static (List<TemplateFolder>, List<Template>) Catalogue()
+    {
+        var a = new TemplateFolder("A") { Id = 1 };
+        var b = new TemplateFolder("B") { Id = 2, ParentFolderId = 1 };
+        var other = new TemplateFolder("Other") { Id = 3 };
+        var t7 = new Template("Deep") { Id = 7, FolderId = 2 };
+        var t8 = new Template("Elsewhere") { Id = 8, FolderId = 3 };
+        return (new() { a, b, other }, new() { t7, t8 });
+    }
+
+    private async Task<(IRenderedComponent<DialogHost> cut, Task<TemplatePickerDialog.TemplatePickResult?> pending)> Open(int? initial = null)
+    {
+        var (f, t) = Catalogue();
+        var cut = Render<DialogHost>();
+        Task<TemplatePickerDialog.TemplatePickResult?> pending = null!;
+        // Block body, not an expression body: an expression-bodied lambda returning the
+        // pending Task binds to InvokeAsync(Func<Task>) and would await the dialog itself.
+        await cut.InvokeAsync(() =>
+        {
+            pending = _service.ShowAsync<TemplatePickerDialog.TemplatePickResult>(
+            "Choose template",
+            ctx => b =>
+            {
+                b.OpenComponent<TemplatePickerDialog>(0);
+                b.AddAttribute(1, nameof(TemplatePickerDialog.Context), ctx);
+                b.AddAttribute(2, nameof(TemplatePickerDialog.Folders), f);
+                b.AddAttribute(3, nameof(TemplatePickerDialog.Templates), t);
+                b.AddAttribute(4, nameof(TemplatePickerDialog.InitialTemplateId), initial);
+                b.CloseComponent();
+            },
+                size: "modal-lg");
+        });
+        cut.Render();
+        return (cut, pending);
+    }
+
+    private static void ExpandFolder(IRenderedComponent<DialogHost> cut, string label) =>
+        cut.FindAll("li[role='treeitem']")
+           .First(li => li.QuerySelector(".tv-label")!.TextContent.Trim() == label)
+           .QuerySelector(".tv-toggle")!.Click();
+
+    private static AngleSharp.Dom.IElement Label(IRenderedComponent<DialogHost> cut, string text) =>
+        cut.FindAll(".tv-label").First(l => l.TextContent.Trim() == text);
+
+    [Fact]
+    public async Task Select_IsDisabled_UntilATemplateIsClicked()
+    {
+        var (cut, _) = await Open();
+        Assert.True(cut.Find("button[data-test='picker-select']").HasAttribute("disabled"));
+        Assert.Contains("Select a template", cut.Find("[data-test='picker-status']").TextContent);
+    }
+
+    [Fact]
+    public async Task ClickingTemplate_ThenSelect_ResolvesItsId()
+    {
+        var (cut, pending) = await Open();
+        ExpandFolder(cut, "A");
+        ExpandFolder(cut, "B");
+        Label(cut, "Deep").Click();
+
+        Assert.False(cut.Find("button[data-test='picker-select']").HasAttribute("disabled"));
+        Assert.Contains("A / B / Deep", cut.Find("[data-test='picker-status']").TextContent);
+
+        cut.Find("button[data-test='picker-select']").Click();
+        Assert.Equal(7, (await pending)!.TemplateId);
+    }
+
+    [Fact]
+    public async Task DoubleClickingTemplate_Resolves()
+    {
+        var (cut, pending) = await Open();
+        ExpandFolder(cut, "A");
+        ExpandFolder(cut, "B");
+        Label(cut, "Deep").DoubleClick();
+        Assert.Equal(7, (await pending)!.TemplateId);
+    }
+
+    [Fact]
+    public async Task ClickingFolder_SelectsNothing()
+    {
+        var (cut, _) = await Open();
+        Label(cut, "A").Click();
+        Assert.True(cut.Find("button[data-test='picker-select']").HasAttribute("disabled"));
+    }
+
+    [Fact]
+    public async Task Cancel_ResolvesNull()
+    {
+        var (cut, pending) = await Open();
+        cut.Find("button[data-test='picker-cancel']").Click();
+        Assert.Null(await pending);
+    }
+
+    [Fact]
+    public async Task InitialTemplateId_IsRevealedAndHighlighted()
+    {
+        var (cut, _) = await Open(initial: 7);
+        Assert.Contains("Deep", cut.Markup);
+        Assert.DoesNotContain("Elsewhere", cut.Markup);
+        Assert.False(cut.Find("button[data-test='picker-select']").HasAttribute("disabled"));
+        Assert.Contains("A / B / Deep", cut.Find("[data-test='picker-status']").TextContent);
+        Assert.Contains("text-primary", Label(cut, "Deep").ClassName);
+    }
+
+    [Fact]
+    public async Task Search_FiltersTree()
+    {
+        var (cut, _) = await Open();
+        cut.Find("input[data-test='picker-search']").Input("Else");
+        Assert.Contains("Elsewhere", cut.Markup);
+        Assert.DoesNotContain("Deep", cut.Markup);
+    }
+}