namespace ZB.MOM.WW.Theme.Tests;

public class ThemeShellTests : TestContext
{
    [Fact]
    public void Renders_product_nav_and_body()
    {
        var cut = RenderComponent<ThemeShell>(p => p
            .Add(x => x.Product, "OtOpcUa")
            .Add(x => x.Nav, (RenderFragment)(b => b.AddMarkupContent(0, "<a class='rail-link'>N</a>")))
            .AddChildContent("<div class='pagebody'>BODY</div>"));
        Assert.NotNull(cut.Find(".side-rail .brand"));
        Assert.Contains("OtOpcUa", cut.Markup);
        Assert.NotNull(cut.Find(".side-rail .rail-link"));
        Assert.NotNull(cut.Find("main.page .pagebody"));
    }

    [Fact]
    public void Accent_sets_css_variable_on_shell_root()
    {
        var cut = RenderComponent<ThemeShell>(p => p
            .Add(x => x.Product, "ScadaBridge")
            .Add(x => x.Accent, "#2f855a"));
        var shell = cut.Find(".app-shell");
        Assert.Contains("--accent: #2f855a", shell.GetAttribute("style"));
    }

    [Fact]
    public void No_accent_emits_no_style()
    {
        var cut = RenderComponent<ThemeShell>(p => p.Add(x => x.Product, "MXAccess Gateway"));
        Assert.False(cut.Find(".app-shell").HasAttribute("style"));
    }

    [Fact]
    public void RailFooter_renders_when_supplied()
    {
        var cut = RenderComponent<ThemeShell>(p => p
            .Add(x => x.Product, "OtOpcUa")
            .Add(x => x.RailFooter, (RenderFragment)(b => b.AddMarkupContent(0, "<span class='sess'>S</span>"))));
        Assert.NotNull(cut.Find(".rail-foot .sess"));
    }

    // Theme-001: the mobile hamburger must work without Bootstrap collapse JS.
    // The shell is a native <details> disclosure whose <summary> is the toggle —
    // no data-bs-toggle / data-bs-target attributes, so no Bootstrap JS dependency.
    [Fact]
    public void Mobile_toggle_is_a_css_only_details_disclosure_not_bootstrap_collapse()
    {
        var cut = RenderComponent<ThemeShell>(p => p.Add(x => x.Product, "OtOpcUa"));

        // Root is a <details> whose direct <summary> is the hamburger toggle.
        var shell = cut.Find("details.app-shell");
        var summary = cut.Find("details.app-shell > summary.rail-toggle");
        Assert.NotNull(summary);

        // The rail is plain markup inside the <details> — no Bootstrap .collapse class.
        var rail = cut.Find("#theme-rail");
        Assert.DoesNotContain("collapse", rail.ClassList);

        // No Bootstrap collapse JS hooks anywhere in the shell markup.
        Assert.DoesNotContain("data-bs-toggle", shell.OuterHtml);
        Assert.DoesNotContain("data-bs-target", shell.OuterHtml);
    }
}
