From 81ffeaa7804d3325d976085a47a74474706baba4 Mon Sep 17 00:00:00 2001
From: Sveske_Juice <carl.benjamin.dreyer@gmail.com>
Date: Thu, 22 Feb 2024 00:59:46 +0100
Subject: [PATCH] Sort by newest news & display human readable date

---
 src/lib/posts/NewsCard.svelte         | 7 ++++++-
 src/lib/posts/ShowcaseNewsCard.svelte | 7 ++++++-
 src/routes/+layout.server.ts          | 3 +++
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/lib/posts/NewsCard.svelte b/src/lib/posts/NewsCard.svelte
index 676ec33..b511a8b 100644
--- a/src/lib/posts/NewsCard.svelte
+++ b/src/lib/posts/NewsCard.svelte
@@ -5,6 +5,11 @@
     export let title = '<title>';
     export let summary = '<summary>';
     export let creation_date = '<date>';
+
+    const monthNames = ["January", "February", "March", "April", "May", "June",
+                  "July", "August", "September", "October", "November", "December"];
+
+    $: human_creation_date = new Date(+creation_date * 1000);
 </script>
 
 <div class="news-card">
@@ -15,7 +20,7 @@
         <div class="content">
             <h3 id="title">{title}</h3>
             <p id="summary-text">{summary}</p>
-            <p id="date">{creation_date}</p>
+            <p id="date">{human_creation_date.getDate()} {monthNames[human_creation_date.getMonth()]} {human_creation_date.getFullYear()}</p>
         </div>
     </a>
 </div>
diff --git a/src/lib/posts/ShowcaseNewsCard.svelte b/src/lib/posts/ShowcaseNewsCard.svelte
index 86ad77e..21cf174 100644
--- a/src/lib/posts/ShowcaseNewsCard.svelte
+++ b/src/lib/posts/ShowcaseNewsCard.svelte
@@ -5,6 +5,11 @@
     export let title = '<title>';
     export let summary = '<summary>';
     export let creation_date = '<date>';
+
+    const monthNames = ["January", "February", "March", "April", "May", "June",
+                  "July", "August", "September", "October", "November", "December"];
+
+    $: human_creation_date = new Date(+creation_date * 1000);
 </script>
 
 <div class="news-card">
@@ -15,7 +20,7 @@
         <div class="content">
             <h3 id="title">{title}</h3>
             <p id="summary-text">{summary}</p>
-            <p id="date">{creation_date}</p>
+            <p id="date">{human_creation_date.getDate()} {monthNames[human_creation_date.getMonth()]} {human_creation_date.getFullYear()}</p>
         </div>
     </a>
 </div>
diff --git a/src/routes/+layout.server.ts b/src/routes/+layout.server.ts
index 5c86d4a..9ebcf41 100644
--- a/src/routes/+layout.server.ts
+++ b/src/routes/+layout.server.ts
@@ -17,6 +17,9 @@ type Summary = {
 export function load() {
     let summaries : Summary[] = [];
 
+    // Sort by newest news first
+    posts.sort((a, b) => b.creation_date - a.creation_date);
+
     posts.map((post) => {
         let summary : Summary = {
             url: post.url,