Merge pull request #738 from EdiWang/feature/737-comment-display-order

Add comment display order settings
EdiWang · Aug 2, 2023 · cf3ee77 · cf3ee77
2 parents e3407d8 + 6d597bb
commit cf3ee77
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 13 deletions.
diff --git a/src/Moonglade.Configuration/ContentSettings.cs b/src/Moonglade.Configuration/ContentSettings.cs
@@ -7,6 +7,9 @@ public class ContentSettings : IBlogSettings
 {
     [Display(Name = "Comment provider")]
     public CommentProvider CommentProvider { get; set; }
+
+    [Display(Name = "Comments display order")]
+    public CommentOrder CommentOrder { get; set; }
 
     [Display(Name = "Post title alignment")]
     public PostTitleAlignment PostTitleAlignment { get; set; } = PostTitleAlignment.Left;
@@ -91,6 +94,12 @@ public enum CommentProvider
     ThirdParty = 1
 }
 
+public enum CommentOrder
+{
+    OldToNew = 0,
+    NewToOld = 1
+}
+
 public enum PostTitleAlignment
 {
     Left = 0,

diff --git a/src/Moonglade.Web/Pages/Components/CommentList/Default.cshtml b/src/Moonglade.Web/Pages/Components/CommentList/Default.cshtml
@@ -20,8 +20,13 @@
 
 @if (null != Model && Model.Any())
 {
+    var orderedList =
+        BlogConfig.ContentSettings.CommentOrder == CommentOrder.NewToOld ?
+            Model.OrderByDescending(m => m.CreateTimeUtc) :
+            Model.OrderBy(m => m.CreateTimeUtc);
+
     <div class="comment-list row">
-        @foreach (var item in Model.OrderBy(m => m.CreateTimeUtc))
+        @foreach (var item in orderedList)
         {
             <div class="col-md-1 mb-3 d-none d-sm-block">
                 @if (BlogConfig.ContentSettings.EnableGravatar && !string.IsNullOrWhiteSpace(item.Email))
@@ -56,9 +61,10 @@
                                         <strong>
                                             @SharedLocalizer["Author"]
                                         </strong>
-                                        <span class="float-end text-muted">@SharedLocalizer["Replied at"]
+                                        <span class="float-end text-muted">
+                                            @SharedLocalizer["Replied at"]
                                             <time data-utc-label="@reply.ReplyTimeUtc.ToString("u")">@reply.ReplyTimeUtc</time>
-                                            </span>
+                                        </span>
                                     </div>
                                     <p>
                                         @Html.Raw(ContentProcessor.MarkdownToContent(reply.ReplyContent, ContentProcessor.MarkdownConvertType.Html))

diff --git a/src/Moonglade.Web/Pages/Settings/Content.cshtml b/src/Moonglade.Web/Pages/Settings/Content.cshtml
@@ -55,24 +55,43 @@
                             <div class="col-md-5 text-end">
                                 <div class="form-check form-check-inline">
                                     @Html.RadioButtonFor(model => settings.CommentProvider, CommentProvider.BuiltIn, new
-                                {
-                                id = CommentProvider.BuiltIn.ToString(),
-                                @class = "form-check-input comment-provider-checkbox",
-                                onchange = "window.toggleCommentSettingsUI()"
-                                })
+                                    {
+                                        id = CommentProvider.BuiltIn.ToString(),
+                                        @class = "form-check-input comment-provider-checkbox",
+                                        onchange = "window.toggleCommentSettingsUI()"
+                                    })
                                     <label class="form-check-label" for="@CommentProvider.BuiltIn">@SharedLocalizer["Built in"]</label>
                                 </div>
                                 <div class="form-check form-check-inline">
                                     @Html.RadioButtonFor(model => settings.CommentProvider, CommentProvider.ThirdParty, new
-                                {
-                                id = CommentProvider.ThirdParty.ToString(),
-                                @class = "form-check-input comment-provider-checkbox",
-                                onchange = "window.toggleCommentSettingsUI()"
-                                })
+                                    {
+                                        id = CommentProvider.ThirdParty.ToString(),
+                                        @class = "form-check-input comment-provider-checkbox",
+                                        onchange = "window.toggleCommentSettingsUI()"
+                                    })
                                     <label class="form-check-label" for="@CommentProvider.ThirdParty">@SharedLocalizer["Third party"]</label>
                                 </div>
                             </div>
                         </div>
+
+                        <div class="row g-3 align-items-center settings-entry mb-4">
+                            <div class="col-auto">
+                                <i class="bi-sort-numeric-down settings-entry-icon"></i>
+                            </div>
+                            <div class="col">
+                                <label asp-for="@settings.CommentOrder" class="me-4"></label>
+                            </div>
+                            <div class="col-md-5 text-end">
+                                <div class="form-check form-check-inline">
+                                @Html.RadioButtonFor(model => settings.CommentOrder, CommentOrder.OldToNew, new { id = CommentOrder.OldToNew.ToString(), @class = "form-check-input" })
+                                <label class="form-check-label" for="@CommentOrder.OldToNew">@SharedLocalizer["Old to new"]</label>
+                                </div>
+                                <div class="form-check form-check-inline">
+                                @Html.RadioButtonFor(model => settings.CommentOrder, CommentOrder.NewToOld, new { id = CommentOrder.NewToOld.ToString(), @class = "form-check-input" })
+                                <label class="form-check-label" for="@CommentOrder.NewToOld">@SharedLocalizer["New to old"]</label>
+                                </div>
+                            </div>
+                        </div>
 
                         <div class="comment-settings-built-in">