updated dependencies, fixed sorting

src/lib/components/AvatarComponent.svelte

@@ -16,7 +16,7 @@
       ['jpg', 99],
       ['jpeg', 99]
     ]);
-    const resizedAvatars = (account.resizedAvatars ?? []).sort((a, b) => {
+    const resizedAvatars = (account.resizedAvatars ?? []).toSorted((a, b) => {
       const extensionA = a.file.split('.').pop() ?? '';
       const extensionB = b.file.split('.').pop() ?? '';
       const prioA = formatPriority.get(extensionA) ?? 3;

src/lib/components/PostComponent.svelte

@@ -65,7 +65,7 @@
       ['jpg', 99],
       ['jpeg', 99]
     ]);
-    const thumbs = (song.resizedThumbnails ?? []).sort((a, b) => {
+    const thumbs = (song.resizedThumbnails ?? []).toSorted((a, b) => {
       const extensionA = a.file.split('.').pop() ?? '';
       const extensionB = b.file.split('.').pop() ?? '';
       const prioA = formatPriority.get(extensionA) ?? 3;

src/routes/+page.svelte

@@ -17,6 +17,7 @@
   }
 
   let { data = $bindable() }: Props = $props();
+  let posts: Post[] = $state(data.posts);
 
   interface FetchOptions {
     since?: string;
@@ -44,11 +45,11 @@
    */
   function edgeFly(node: Element, opts: EdgeFlyParams) {
     const createdAt = new Date(opts.created_at).getTime();
-    const diffNewest = Math.abs(new Date(data.posts[0].created_at).getTime() - createdAt);
+    const diffNewest = Math.abs(new Date(posts[0].created_at).getTime() - createdAt);
     const oldest =
       oldestBeforeLastFetch !== null
         ? oldestBeforeLastFetch
-        : new Date(data.posts[data.posts.length - 1].created_at).getTime();
+        : new Date(posts[posts.length - 1].created_at).getTime();
     const diffOldest = Math.abs(oldest - createdAt);
     const fromTop = diffNewest <= diffOldest;
 
@@ -83,15 +84,15 @@
 
   function refresh() {
     let filter: FetchOptions = {};
-    if (data.posts.length > 0) {
-      filter = { since: data.posts[0].created_at };
+    if (posts.length > 0) {
+      filter = { since: posts[0].created_at };
     }
     fetchPosts(filter)
       .then((resp) => {
         if (resp.length > 0) {
           // Prepend new posts, filter dupes
           // There shouldn't be any duplicates, but better be safe than sorry
-          data.posts = filterDuplicates(resp.concat(data.posts));
+          posts = filterDuplicates(resp.concat(posts));
         }
       })
       .catch((e: Error) => {
@@ -100,8 +101,9 @@
   }
 
   onMount(async () => {
-    if (data.posts.length > 0) {
-      oldestBeforeLastFetch = new Date(data.posts[data.posts.length - 1].created_at).getTime();
+    posts = data.posts;
+    if (posts.length > 0) {
+      oldestBeforeLastFetch = new Date(posts[posts.length - 1].created_at).getTime();
     }
     interval = setInterval(refresh, refreshInterval);
 
@@ -125,8 +127,8 @@
   function loadOlderPosts() {
     loadingOlderPosts = true;
     const filter: FetchOptions = { count: 20 };
-    if (data.posts.length > 0) {
-      const before = data.posts[data.posts.length - 1].created_at;
+    if (posts.length > 0) {
+      const before = posts[posts.length - 1].created_at;
       filter.before = before;
       oldestBeforeLastFetch = new Date(before).getTime();
     }
@@ -136,7 +138,7 @@
         if (resp.length > 0) {
           // Append old posts, filter dupes
           // There shouldn't be any duplicates, but better be safe than sorry
-          data.posts = filterDuplicates(data.posts.concat(resp));
+          posts = filterDuplicates(posts.concat(resp));
           // If we got less than we expected, there are no older posts available
           moreOlderPostsAvailable = resp.length >= (filter.count ?? 20);
         } else {
@@ -158,10 +160,10 @@
 <div class="wrapper">
   <div></div>
   <div class="posts">
-    {#if data.posts.length === 0}
+    {#if posts.length === 0}
       Sorry, no posts recommending music have been found yet
     {/if}
-    {#each data.posts as post (post.url)}
+    {#each posts as post (post.url)}
       <div
         class="post"
         transition:edgeFly|global={{