feat: add pre-formatted date "dddd, d MMMM yyyy HH:mm"

OliverBooth/Controllers/BlogApiController.cs

@@ -43,6 +43,7 @@ public sealed class BlogApiController : ControllerBase
             author = post.AuthorId,
             title = post.Title,
             published = post.Published.ToUnixTimeSeconds(),
+            formattedDate = post.Published.ToString("dddd, d MMMM yyyy HH:mm"),
             updated = post.Updated?.ToUnixTimeSeconds(),
             humanizedTimestamp = post.Updated?.Humanize() ?? post.Published.Humanize(), 
             excerpt = _blogService.GetExcerpt(post, out bool trimmed),

OliverBooth/Pages/Blog/Article.cshtml

@@ -29,14 +29,14 @@
     <img class="blog-author-icon" src="https://gravatar.com/avatar/@author.AvatarHash?s=28" alt="@author.Name">
     @author.Name &bull;
 
-    <abbr data-bs-toggle="tooltip" data-bs-title="@published.ToString("f")">
+    <abbr data-bs-toggle="tooltip" data-bs-title="@published.ToString("dddd, d MMMM yyyy HH:mm")">
         Published @published.Humanize()
     </abbr>
 
     @if (post.Updated is { } updated)
     {
         <span>&bull;</span>
-        <abbr data-bs-toggle="tooltip" data-bs-title="@updated.ToString("f")">
+        <abbr data-bs-toggle="tooltip" data-bs-title="@updated.ToString("dddd, d MMMM yyyy HH:mm")">
             Updated @updated.Humanize()
         </abbr>
     }

OliverBooth/Pages/Blog/Index.cshtml

@@ -19,7 +19,7 @@
             <img class="blog-author-icon" src="{{author.avatar}}" alt="{{author.name}}">
             <span>{{author.name}}<span>
             <span> &bull; </span>
-            <span title="{{ post.date }}">{{ post.date_humanized }}</span>
+            <abbr title="{{ post.formattedDate }}">{{ post.date_humanized }}</abbr>
             {{#if post.enable_comments}}
                 <span> &bull; </span>
                 <a href="{{post.url}}#disqus_thread" data-disqus-identifier="{{post.disqus_identifier}}">

src/ts/BlogPost.ts

@@ -10,6 +10,7 @@
     private readonly _trimmed: boolean;
     private readonly _identifier: string;
     private readonly _humanizedTimestamp: string;
+    private readonly _formattedDate: string;
 
     constructor(json: any) {
         this._id = json.id;
@@ -23,6 +24,7 @@
         this._trimmed = json.trimmed;
         this._identifier = json.identifier;
         this._humanizedTimestamp = json.humanizedTimestamp;
+        this._formattedDate = json.formattedDate;
     }
 
     get id(): number {
@@ -68,6 +70,10 @@
     get humanizedTimestamp(): string {
         return this._humanizedTimestamp;
     }
+
+    get formattedDate(): string {
+        return this._formattedDate;
+    }
 }
 
 export default BlogPost;

src/ts/app.ts

@@ -27,6 +27,7 @@ declare const Handlebars: any;
                             excerpt: post.excerpt,
                             url: post.url,
                             date: TimeUtility.formatRelativeTimestamp(post.published),
+                            formattedDate: post.formattedDate,
                             date_humanized: `${post.updated ? "Updated" : "Published"} ${post.humanizedTimestamp}`,
                             enable_comments: post.commentsEnabled,
                             disqus_identifier: post.identifier,