vueless 1.2.10-beta.1 → 1.2.10-beta.11

package/ui.loader-progress/useLoaderProgress.ts

@@ -2,41 +2,51 @@ import { inject, readonly, ref } from "vue";
 
 import type { Ref } from "vue";
 
-import { getRequestWithoutQuery } from "./utilLoaderProgress";
-
-export const LoaderProgressSymbol = Symbol.for("vueless:loader-progress");
+import { getRequestWithoutQuery } from "../utils/requestQueue";
 
 type LoaderProgress = {
-  requestQueue: Readonly<Ref<readonly string[]>>;
-  loaderProgressOn: (url: string | string[]) => void;
-  loaderProgressOff: (url: string | string[]) => void;
+  isLoading: Readonly<Ref<boolean, boolean>>;
+  loaderProgressOn: (request: string | string[]) => void;
+  loaderProgressOff: (request: string | string[]) => void;
+  progressRequestQueue: Readonly<Ref<readonly string[]>>;
 };
 
-export function createLoaderProgress(): LoaderProgress {
-  const requestQueue = ref<string[]>([]);
-
-  function loaderProgressOn(url: string | string[]): void {
-    if (Array.isArray(url)) {
-      requestQueue.value.push(...url.map(getRequestWithoutQuery));
-    } else {
-      requestQueue.value.push(getRequestWithoutQuery(url));
-    }
-  }
+export const LoaderProgressSymbol = Symbol.for("vueless:loader-progress");
+
+const progressRequestQueue = ref<string[]>([]);
+
+function addToProgressRequestQueue(url: string | string[]): void {
+  Array.isArray(url)
+    ? progressRequestQueue.value.push(...url.map(getRequestWithoutQuery))
+    : progressRequestQueue.value.push(getRequestWithoutQuery(url));
+}
 
-  function loaderProgressOff(url: string | string[]): void {
-    if (Array.isArray(url)) {
-      url.map(getRequestWithoutQuery).forEach(loaderProgressOff);
-    } else {
-      requestQueue.value = requestQueue.value.filter(
-        (item) => item !== getRequestWithoutQuery(url),
-      );
-    }
+function removeFromProgressRequestQueue(url: string | string[]): void {
+  if (Array.isArray(url)) {
+    url.map(getRequestWithoutQuery).forEach(removeFromProgressRequestQueue);
+  } else {
+    progressRequestQueue.value = progressRequestQueue.value.filter(
+      (item) => item !== getRequestWithoutQuery(url),
+    );
   }
+}
+
+const isLoading = ref(true);
+
+function loaderProgressOn(request?: string | string[]): void {
+  request ? addToProgressRequestQueue(request) : (isLoading.value = true);
+}
+
+function loaderProgressOff(request?: string | string[]): void {
+  request ? removeFromProgressRequestQueue(request) : (isLoading.value = false);
+}
 
+export function createLoaderProgress(): LoaderProgress {
   return {
-    requestQueue: readonly(requestQueue),
     loaderProgressOn,
     loaderProgressOff,
+    isLoading: readonly(isLoading),
+    progressRequestQueue: readonly(progressRequestQueue) as Readonly<Ref<readonly string[]>>,
   };
 }
 
@@ -45,7 +55,7 @@ export function useLoaderProgress(): LoaderProgress {
 
   if (!loaderProgress) {
     throw new Error(
-      "LoaderProgress not provided. Ensure you are using `provide` with `LoaderProgressSymbol`.",
+      "[vueless] LoaderProgress not provided. Ensure you are using `provide` with `LoaderProgressSymbol`.",
     );
   }
 

package/ui.loader-progress/utilLoaderProgress.ts

@@ -1,3 +1,15 @@
+export function loaderProgressOn(request: string | string[]): void {
+  const loaderProgressOnEvent = new CustomEvent("loaderProgressOn", { detail: { request } });
+
+  window.dispatchEvent(loaderProgressOnEvent);
+}
+
+export function loaderProgressOff(request: string | string[]): void {
+  const loaderProgressOffEvent = new CustomEvent("loaderProgressOff", { detail: { request } });
+
+  window.dispatchEvent(loaderProgressOffEvent);
+}
+
 export function clamp(n: number, min: number, max: number): number {
   if (n < min) {
     return min;
@@ -29,21 +41,3 @@ export const queue = (() => {
     }
   };
 })();
-
-export function loaderProgressOn(resource: string): void {
-  const loaderProgressOnEvent = new CustomEvent("loaderProgressOn", { detail: { resource } });
-
-  window.dispatchEvent(loaderProgressOnEvent);
-}
-
-export function loaderProgressOff(resource: string): void {
-  const loaderProgressOffEvent = new CustomEvent("loaderProgressOff", { detail: { resource } });
-
-  window.dispatchEvent(loaderProgressOffEvent);
-}
-
-export function getRequestWithoutQuery(request: string | URL): string {
-  const [requestWithoutQuery] = String(request).split("?");
-
-  return requestWithoutQuery;
-}

package/ui.navigation-tabs/UTabs.vue

@@ -126,7 +126,6 @@ const {
           :label="item.label"
           :value="item.value"
           :disabled="item.disabled"
-          :size="size"
           v-bind="tabAttrs"
           :data-test="getDataTest(`item-${index}`)"
         />

package/utils/requestQueue.ts

@@ -0,0 +1,21 @@
+export function getRequestWithoutQuery(request: string | URL): string {
+  const [requestWithoutQuery] = String(request).split("?");
+
+  return requestWithoutQuery;
+}
+
+export function addToRequestQueue(request: string | string[]): void {
+  const addToRequestQueueEvent = new CustomEvent("addToRequestQueue", {
+    detail: { request },
+  });
+
+  window.dispatchEvent(addToRequestQueueEvent);
+}
+
+export function removeFromRequestQueue(request: string | string[]): void {
+  const removeFromRequestQueueEvent = new CustomEvent("removeFromRequestQueue", {
+    detail: { request },
+  });
+
+  window.dispatchEvent(removeFromRequestQueueEvent);
+}