PostList widget updates

Author: rxtur

plugins/Common/Views/Widgets/PostList/Index.cshtml

@@ -1,3 +1,7 @@
-<div>
-    This post is from PostList widget loaded from external class library.
+@model IEnumerable<BlogPost>
+<div class="list-group">
+    @foreach (var post in Model)
+    {
+    <a href="~/posts/@post.Slug" class="list-group-item list-group-item-action" title="">@post.Title</a>
+    }
 </div>

plugins/Common/Widgets/PostList.cs

@@ -1,17 +1,23 @@
-using Microsoft.AspNetCore.Mvc;
+using Core.Services;
+using Microsoft.AspNetCore.Mvc;
 
 namespace Common.Widgets
 {
     [ViewComponent(Name = "PostList")]
     public class PostList : ViewComponent
     {
-        public PostList()
+        IDataService _db;
+
+        public PostList(IDataService db)
         {
+            _db = db;
         }
 
         public IViewComponentResult Invoke()
         {
-            return View("~/Views/Widgets/PostList/Index.cshtml");
+            var model = _db.BlogPosts.All();
+
+            return View("~/Views/Widgets/PostList/Index.cshtml", model);
         }
     }
 }

src/App/Pages/Admin/Settings/Users.cshtml

@@ -3,30 +3,36 @@
 @{
     ViewData["Title"] = "Users";
 }
-
 <style>
     .modal-body .row {
         line-height: 2.5em;
         border-bottom: 1px solid #efefef;
     }
+    .post-grid-col { max-width: 200px !important }
 </style>
 <div class="bf-main">
     <partial name="~/Pages/Admin/Settings/_Taskbar.cshtml" />
     <div class="bf-body">
-        <div class="bf-content bf-content-boxed bf-settings">
+        <!-- Grid -->
+        <div class="bf-posts-grid d-flex" aria-label="posts">
             @foreach (var user in Model.Authors)
             {
                 var avatar = user.Avatar ?? AppSettings.Avatar;
-                <div class="card" style="width: 130px; margin: 10px 5px 0 0; float: left">
-                    <img class="card-img-top" style="height: 130px; overflow: hidden" src="~/@avatar" alt="@avatar" />
-                    <div class="card-body">
-                        <p style="text-align: center">
-                            <a href="~/admin/settings/profile?name=@user.AppUserName">@user.AppUserName</a>
-                        </p>
+                var img = $"{Url.Content("~/")}{avatar}";
+                <div class="post-grid-col">
+                    <div class="post-grid-item">
+                        <a class="item-link" style="background-image:url(@img);"><div class="item-title mt-auto">&nbsp;</div></a>
+                        <div class="item-info d-flex align-items-center">
+                            <span class="item-date mr-auto">@user.DisplayName</span>
+                            <a href="~/admin/settings/profile?name=@user.AppUserName" class="btn-unstyled item-favorite ml-3" data-tooltip="" title="" data-original-title="Profile">
+                                <i class="fas fa-external-link-square-alt"></i>
+                            </a>
+                        </div>
                     </div>
                 </div>
             }
         </div>
+        <!--/Grid -->
     </div>
 </div>
 

src/App/Views/Themes/Simple/Shared/_Sidebar.cshtml

@@ -25,4 +25,9 @@
     <div class="card-body">
         @await Component.InvokeAsync("HtmlBlock", new { theme = "Simple", widget = "Sidebar" })
     </div>
+</div>
+
+<div class="card my-4">
+    <h5 class="card-header">Post List</h5>
+    @await Component.InvokeAsync("PostList", new { theme = "Simple", widget = "Post List" })
 </div>