refactor: create util namespace

src/util.ts → src/util/index.ts

@@ -8,6 +8,7 @@ import {
   ComputedGetter,
   ComputedRef,
   DebuggerOptions,
+  isReadonly,
   MaybeRefOrGetter,
   readonly,
   Ref,
@@ -22,6 +23,7 @@ import {
 } from 'vue'
 import { useI18n } from '@/i18n'
 import { SteeringUser } from '@/stores/auth'
+import { APIObject, RetrieveMultipleOperation } from '@rokoli/bnb'
 
 const dateFnLocales = {
   de: () => import('date-fns/locale/de'),
@@ -410,18 +412,18 @@ export function humanJoin(iterable: Iterable<string>, glue: string, lastGlue: st
 }
 
 export function toQuery(
-  query: Record<string, string | number | null | undefined>,
+  query: Record<string, string | number | boolean | Date | null | undefined>,
 ): URLSearchParams {
   const _query: Record<string, string> = {}
   for (const [key, value] of Object.entries(query)) {
     if (value === null || value === undefined) continue
-    _query[key] = value.toString()
+    _query[key] = value instanceof Date ? value.toISOString() : value.toString()
   }
   return new URLSearchParams(_query)
 }
 
 export function useQuery(
-  query: MaybeRefOrGetter<Record<string, string | number | null | undefined>>,
+  query: MaybeRefOrGetter<Record<string, string | number | boolean | Date | null | undefined>>,
 ) {
   return computed(() => toQuery(toValue(query)))
 }
@@ -462,3 +464,50 @@ export function makeRandomString(length: number, options?: { alphabet?: string }
   }
   return result
 }
+
+export function useObjectListFromStore<T extends APIObject>(
+  ids: Ref<T['id'][]>,
+  store: { itemMap: Map<T['id'], T>; retrieveMultiple: RetrieveMultipleOperation<T> },
+): { isLoading: Readonly<Ref<boolean>>; objects: Ref<T[]> }
+export function useObjectListFromStore<T extends APIObject>(
+  ids: Readonly<Ref<T['id'][]>> | (() => T['id'][]) | T['id'][],
+  store: { itemMap: Map<T['id'], T>; retrieveMultiple: RetrieveMultipleOperation<T> },
+): { isLoading: Readonly<Ref<boolean>>; objects: Readonly<Ref<T[]>> }
+export function useObjectListFromStore<T extends APIObject>(
+  ids: MaybeRefOrGetter<T['id'][]>,
+  store: { itemMap: Map<T['id'], T>; retrieveMultiple: RetrieveMultipleOperation<T> },
+) {
+  const idsRef = toRef(ids) as Ref<T['id'][]> | Readonly<Ref<T['id'][]>>
+  const isLoading = ref(false)
+  const objects = computed({
+    get() {
+      const result = toValue(idsRef)
+        .map((id) => store.itemMap.get(id))
+        .filter((item) => item !== undefined)
+      return result as T[]
+    },
+    set(value: T[]) {
+      if (!isReadonly(idsRef)) (idsRef as Ref<T['id'][]>).value = value.map((obj) => obj.id)
+    },
+  })
+  watchEffect(async () => {
+    isLoading.value = true
+    try {
+      void (await store.retrieveMultiple(toValue(ids), { useCached: true }))
+    } finally {
+      isLoading.value = false
+    }
+  })
+  return {
+    objects,
+    isLoading: readonly(isLoading),
+  }
+}
+
+export function useMap<T extends { id: unknown }>(iterable: T[]) {
+  return computed(() => {
+    const map = new Map<T['id'], T>()
+    for (const item of iterable) map.set(item.id, item)
+    return map
+  })
+}