Fix 418, 419, 422 & 424

* Fix #418 * Partialy fix #419 Add a ccs class to enable grid to show multiple lines of text. * Fix #424: Infinite rendering loop in TableOfContents * Fix #422 Demo site not working on iPhone
microsoft · Jun 4, 2023 · 9d21e4c · 9d21e4c
1 parent 6dd2398
commit 9d21e4c
Show file tree

Hide file tree

Showing 5 changed files with 38,405 additions and 28 deletions.
diff --git a/examples/FluentUI.Demo.Shared/Components/MarkdownSection.razor.cs b/examples/FluentUI.Demo.Shared/Components/MarkdownSection.razor.cs
@@ -9,6 +9,7 @@ namespace FluentUI.Demo.Shared.Components;
 public partial class MarkdownSection : FluentComponentBase
 {
     private string? _content;
+    private bool _raiseContentConverted;
 
     [Inject]
     private IStaticAssetService StaticAssetService { get; set; } = default!;
@@ -36,10 +37,8 @@ public string? InternalContent
         {
             _content = value;
             HtmlContent = ConvertToMarkupString(_content);
-            if (OnContentConverted.HasDelegate)
-            {
-                OnContentConverted.InvokeAsync();
-            }
+            _raiseContentConverted = true;
+
 
             StateHasChanged();
         }
@@ -60,8 +59,19 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     {
 
         if (firstRender && !string.IsNullOrEmpty(FromAsset))
+        {
             InternalContent = await StaticAssetService.GetAsync(FromAsset);
+        }
 
+        if (_raiseContentConverted)
+        {
+            _raiseContentConverted = false;
+            if (OnContentConverted.HasDelegate)
+            {
+                await OnContentConverted.InvokeAsync();
+            }
+
+        }
     }
 
     private MarkupString ConvertToMarkupString(string? value)

diff --git a/examples/FluentUI.Demo.Shared/Components/TableOfContents.razor.cs b/examples/FluentUI.Demo.Shared/Components/TableOfContents.razor.cs
@@ -8,7 +8,39 @@ namespace FluentUI.Demo.Shared.Components;
 
 public partial class TableOfContents : IAsyncDisposable
 {
-    private record Anchor(string Level, string Text, string Href, Anchor[] Anchors);
+    private record Anchor(string Level, string Text, string Href, Anchor[] Anchors)
+    {
+        public virtual bool Equals(Anchor? other)
+        {
+            if (other is null) return false;
+
+            if (Level != other.Level ||
+                Text != other.Text ||
+                Href != other.Href ||
+                (Anchors?.Length ?? 0) != (other.Anchors?.Length ?? 0))
+            {
+                return false;
+            }
+
+            if (Anchors is not null &&
+                Anchors.Length > 0)
+            {
+                for (var i = 0; i < Anchors.Length; i++)
+                {
+                    if (!Anchors[i].Equals(other.Anchors![i]))
+                    {
+                        return false;
+                    }
+                }
+            }
+
+            return true;
+        }
+
+        public override int GetHashCode()
+             => HashCode.Combine(Level, Text, Href);
+    }
+
     private Anchor[]? _anchors;
     private bool _expanded = true;
 
@@ -44,16 +76,18 @@ private record Anchor(string Level, string Text, string Href, Anchor[] Anchors);
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
-        // Remember to replace the location of the script with your own project specific location.
-        _jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>("import",
-        "./_content/FluentUI.Demo.Shared/Components/TableOfContents.razor.js");
-        bool mobile = await _jsModule!.InvokeAsync<bool>("isDevice");
-
-        if (mobile)
-            _expanded = false;
+        if (firstRender)
+        {
+            // Remember to replace the location of the script with your own project specific location.
+            _jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>("import",
+            "./_content/FluentUI.Demo.Shared/Components/TableOfContents.razor.js");
+            bool mobile = await _jsModule!.InvokeAsync<bool>("isDevice");
 
+            if (mobile)
+                _expanded = false;
+            await QueryDom();
+        }
 
-        await QueryDom();
     }
 
     private async Task BackToTop()
@@ -63,10 +97,23 @@ private async Task BackToTop()
 
     private async Task QueryDom()
     {
-        _anchors = await _jsModule.InvokeAsync<Anchor[]?>("queryDomForTocEntries");
+        Anchor[]? foundAnchors = await _jsModule.InvokeAsync<Anchor[]?>("queryDomForTocEntries");
+
+        if (AnchorsEqual(_anchors, foundAnchors))
+        {
+            return;
+        }
+
+        _anchors = foundAnchors;
         StateHasChanged();
     }
 
+    private bool AnchorsEqual(Anchor[]? firstSet, Anchor[]? secondSet)
+    {
+        return (firstSet ?? Array.Empty<Anchor>())
+            .SequenceEqual(secondSet ?? Array.Empty<Anchor>());
+    }
+
     protected override void OnInitialized()
     {
         // Subscribe to the event
@@ -129,6 +176,8 @@ public async Task Refresh()
 
     }
 
+
+
     async ValueTask IAsyncDisposable.DisposeAsync()
     {
         try