feat/#3 binary decoder for occupancy events and stubs

frontend/src/components/RoomOccupationOffline.vue

@@ -31,6 +31,7 @@ import { useQuery } from "@tanstack/vue-query";
 import { watch } from "vue";
 import { fetchRoomOccupancy } from "@/api/fetchRoomOccupancy";
 import { isValid } from "date-fns";
+import { RoomOccupancyList } from "@/model/roomOccupancyList";
 
 const { t } = useI18n({ useScope: "global" });
 
@@ -70,6 +71,22 @@ const mobilePage = inject("mobilePage") as Ref<boolean>;
 
 const selectedRoom = computed(() => props.room);
 
+/**
+ * Transform decoded JSON object with binary data
+ * to anonymized occupancy events 
+ * @param data RoomOccupancyList with binary data
+ * @returns Anonymized occupancy events
+ */
+function transformData(data: RoomOccupancyList) {
+  const events = data
+    .decodeOccupancy(selectedRoom.value, new Date(currentDateFrom.value), new Date(currentDateTo.value))
+    .map((event, index) => ({
+      id: index,
+      event: event,
+    }));
+    return events;
+}
+
 const { data: occupations } = useQuery({
   queryKey: ["roomOccupation", selectedRoom, currentDateFrom, currentDateTo],
   queryFn: () =>
@@ -77,12 +94,7 @@ const { data: occupations } = useQuery({
       new Date(currentDateFrom.value).toISOString(),
       new Date(currentDateTo.value).toISOString()
     ),
-  select: (data) => data
-        .decodeOccupancy(selectedRoom.value, new Date(currentDateFrom.value), new Date(currentDateTo.value))
-        .map((event, index) => ({
-          id: index,
-          event: event,
-        })),
+  select: (data) => transformData(data),
   enabled: () => selectedRoom.value !== "" && currentDateFrom.value !== "",
   staleTime: 5000000, // 500 seconds
 });