Merge branch 'main' into dev

src/lib/api.js

@@ -149,6 +149,7 @@ export async function getStreamingHealth(host) {
  * @param {string} host - The domain of the target server.
  * @param {string} token - The application token.
  * @param {string} min_id - If provided, only shows notifications after this ID.
+ * @param {string} max_id - If provided, only shows notifications before this ID.
  * @param {string} limit - The maximum number of notifications to retrieve (default 40).
  * @param {string} types - A list of notification types to filter to.
  */

src/lib/notifications.js

@@ -8,6 +8,7 @@ import { parsePost } from '$lib/post.js';
 import { parseAccount } from '$lib/account.js';
 
 const prefix = app_name + '_notif_';
+const notification_limit = 40;
 
 export const notifications = writable([]);
 export const unread_notif_count = writable(load("unread_count"));
@@ -41,29 +42,29 @@ function load(name) {
     return data ? data : false;
 }
 
-let loading;
 export async function getNotifications(min_id, max_id) {
-    if (loading) return; // no spamming!!
-    loading = true;
-
-    const notif_data = await api.getNotifications(
+    const new_notifications = await api.getNotifications(
         get(server).host,
         get(app).token,
         min_id,
         max_id,
+        notification_limit,
     );
 
-    if (!notif_data) {
+    if (!new_notifications) {
         console.error(`Failed to retrieve notifications.`);
         loading = false;
         return;
     }
 
-    for (let i in notif_data) {
-        let notif = notif_data[i];
+    for (let i in new_notifications) {
+        let notif = new_notifications[i];
         notif.accounts = [ await parseAccount(notif.account) ];
-        if (get(notifications).length > 0) {
-            let prev = get(notifications)[get(notifications).length - 1];
+
+        const _notifications = get(notifications);
+        if (_notifications.length > 0) {
+            let prev = _notifications[_notifications.length - 1];
+
             if (notif.type === prev.type) {
                 if (prev.status && notif.status && prev.status.id === notif.status.id) {
                     notifications.update(notifications => {
@@ -74,8 +75,8 @@ export async function getNotifications(min_id, max_id) {
                 }
             }
         }
+
         notif.status = notif.status ? await parsePost(notif.status, 0, false) : null;
         notifications.update(notifications => [...notifications, notif]);
     }
-    loading = false;
 }

src/lib/ui/Modal.svelte

@@ -55,8 +55,8 @@
         left: 0;
         z-index: 100;
         
-        background-color: rgba(0,0,0,0.2);
-        backdrop-filter: blur(32px) saturate(1.25);
+        background-color: rgba(0,0,0,0.5);
+        backdrop-filter: blur(10px) saturate(1.25);
         user-select: none;
 
         animation: modal_bg .15s cubic-bezier(0.22, 1, 0.36, 1);
@@ -75,10 +75,12 @@
             background-color: rgba(0,0,0,0);
             backdrop-filter: blur(0px) saturate(1.0);
         }
+        /*
         to {
-            background-color: rgba(0,0,0,0.2);
-            backdrop-filter: blur(32px) saturate(1.25);
+            background-color: rgba(0,0,0,0.5);
+            backdrop-filter: blur(10px) saturate(1.25);
         }
+        */
     }
 
     @keyframes modal_pop_up {
@@ -92,4 +94,4 @@
             transform: translateY(0px) scale(1);
         }
     }
-</style>
+</style>

src/lib/ui/Notification.svelte

@@ -106,7 +106,7 @@
                     {data.status.warning}
                 </div>
             {:else}
-                {@html data.status.html}
+                {@html data.status.rich_text}
             {/if}
 
             {#if data.status.media && data.status.media.length > 0}
@@ -148,6 +148,7 @@
         text-decoration: inherit;
         color: inherit;
         transition: background-color .1s;
+        cursor: pointer;
     }
 
     .notification:hover {

src/lib/ui/post/Post.svelte

@@ -87,6 +87,7 @@
         padding: 16px;
         border-radius: 8px;
         transition: background-color .1s;
+        cursor: pointer;
     }
     
     .post:not(.focused) {