Merge branch '1069-times-are-not-sorted-in-infinite-scrolling-crud-iterator' into 'master'

Resolve "Times are not sorted in infinite scrolling crud iterator"

Closes #1069

See merge request !1549

aleksis/core/frontend/components/generic/InfiniteScrollingDateSortedCRUDIterator.vue

@@ -13,6 +13,7 @@ import { DateTime } from "luxon";
     v-bind="$attrs"
     v-on="$listeners"
     @lastQuery="lastQuery = $event"
+    @items="handleItems"
     fixed-header
     disable-pagination
     hide-default-footer
@@ -44,7 +45,7 @@ import { DateTime } from "luxon";
 
       <v-list-item
         two-line
-        v-for="{ date, itemsOfDay } in groupItemsByDay(items)"
+        v-for="{ date, itemsOfDay } in groupedItems"
         v-intersect="{
           handler: intersectHandler(date),
           options: {
@@ -202,9 +203,13 @@ export default {
       // Next two: Indicates the first and last date currently displayed.
       firstDate: null,
       lastDate: null,
+      groupedItems: [],
     };
   },
   methods: {
+    handleItems(items) {
+      this.groupedItems = this.groupItemsByDay(items);
+    },
     resetDate(toDate) {
       console.log("Resetting date range", this.$route.hash);
       // Assure current date
@@ -227,13 +232,48 @@ export default {
       this.initDate = false;
       this.ready = true;
     },
+    findDateSortedArrayLocation(itemDatetime, array, start, end) {
+      const innerStart = start || 0;
+      const innerEnd = end || array.length;
+      const pivot = parseInt(innerStart + (innerEnd - innerStart) / 2);
+      if (innerEnd - innerStart <= 1) {
+        return pivot + 1;
+      }
+      const pivotDatetime = DateTime.fromISO(array[pivot].datetimeStart);
+      if (pivotDatetime.toMillis() === itemDatetime.toMillis()) {
+        return pivot;
+      } else if (pivotDatetime < itemDatetime) {
+        return this.findDateSortedArrayLocation(
+          itemDatetime,
+          array,
+          pivot,
+          innerEnd,
+        );
+      } else {
+        return this.findDateSortedArrayLocation(
+          itemDatetime,
+          array,
+          innerStart,
+          pivot,
+        );
+      }
+    },
     groupItemsByDay(items) {
       // Group items by date
       // => {dt: {date: dt, itemsOfDay: item ...} ...}
       const itemsByDay = items.reduce((byDay, item) => {
-        const day = DateTime.fromISO(item.datetimeStart).startOf("day");
+        const datetime = DateTime.fromISO(item.datetimeStart);
+        const day = datetime.startOf("day");
         byDay[day] ??= { date: day, itemsOfDay: [] };
-        byDay[day].itemsOfDay.push(item);
+        if (byDay[day].itemsOfDay.length === 0) {
+          byDay[day].itemsOfDay.push(item);
+        } else {
+          const index = this.findDateSortedArrayLocation(
+            datetime,
+            byDay[day].itemsOfDay,
+          );
+          byDay[day].itemsOfDay.splice(index, 0, item);
+        }
         return byDay;
       }, {});
       // Determine for each item group whether its date