sort notifications

src/views/Notifications.vue

@@ -4,13 +4,13 @@
     <Tabs :tabs="tabs" @update:currentTab="changeTab" />
     <button
       class="btn | absolute top-0 right-gutter"
-      :disabled="!notifications.length"
+      :disabled="!sortedNotifications.length"
     >
       Marquer tout come lu
     </button>
 
     <div
-      v-if="notifications.length === 0"
+      v-if="sortedNotifications.length === 0"
       class="flex flex-col justify-center | text-grey-700 | absolute inset-0 -z-1"
     >
       <svg
@@ -32,7 +32,10 @@
       <p>Vous n’avez pas de nouvelles notifications</p>
     </div>
     <section v-else class="notifications | flow">
-      <template v-for="notification in notifications" :key="notification.id">
+      <template
+        v-for="notification in sortedNotifications"
+        :key="notification.id"
+      >
         <router-link
           v-if="currentTab === 'all' || !notification.isRead"
           :to="notification.page.uri + '?fileUuid=' + notification.file.uuid"
@@ -132,17 +135,22 @@ const tabs = computed(() => {
   ];
 });
 
-const allNotifications = computed(() => {
-  return Object.values(notifications.value);
+const sortedNotifications = computed(() => {
+  const allNotifications = [
+    ...Object.values(notifications.value.comments || {}),
+    ...Object.values(notifications.value.content || {}),
+  ];
+
+  const sortedNotifications = allNotifications.sort((a, b) => {
+    dayjs(b.date).diff(dayjs(a.date));
+  });
+
+  return sortedNotifications;
 });
 
 function changeTab(newValue) {
   currentTab.value = newValue;
 }
-
-const isEmpty = computed(() => {
-  return notifications.value.length === 0;
-});
 </script>
 
 <style scoped>