@vc-shell/framework 1.2.4-beta.8 → 2.0.0-alpha.0

package/core/composables/index.ts

@@ -1,29 +0,0 @@
-export * from "@core/composables/useFunctions";
-export * from "@core/composables/useUser";
-export * from "@core/composables/useNotifications";
-export * from "@core/composables/useSettings";
-export * from "@core/composables/usePermissions";
-export * from "@core/composables/useAsync";
-export * from "@core/composables/useApiClient";
-export * from "@core/composables/useLoading";
-export * from "@core/composables/useErrorHandler";
-export * from "@core/composables/useAssets";
-export * from "@core/composables/useMenuService";
-export * from "@core/composables/useBeforeUnload";
-export * from "@core/composables/useLanguages";
-export * from "@core/composables/useBreadcrumbs";
-export * from "@core/composables/useAppInsights";
-export * from "@core/composables/useTheme";
-export * from "@core/composables/useWidgets";
-export * from "@core/composables/useDashboard";
-export * from "@core/composables/useAppBarWidget";
-export * from "@core/composables/useSettingsMenu";
-export * from "@core/composables/useToolbar";
-export * from "@core/composables/useDynamicProperties";
-export * from "@core/composables/useBlade";
-export * from "@core/composables/useSidebarState";
-export * from "@core/composables/useWebVitals";
-// Note: useConnectionStatus is NOT re-exported here to avoid circular
-// dependency. Import directly from "@core/composables/useConnectionStatus".
-// useBladeSelection and useAiAgent are now part of the ai-agent plugin
-// export * from "./core/plugins/ai-agent";

package/core/composables/useApiClient/index.ts

@@ -1,22 +0,0 @@
-export interface IAuthApiBase {
-  authToken: string;
-  setAuthToken(token: string): void;
-  getBaseUrl(defaultUrl: string, baseUrl: string): string;
-}
-
-interface UseApiClient<ApiClient extends IAuthApiBase> {
-  getApiClient: () => Promise<ApiClient>;
-}
-
-export function useApiClient<ApiClient extends IAuthApiBase>(
-  c: new (baseUrl?: string, http?: { fetch(url: RequestInfo, init?: RequestInit): Promise<Response> }) => ApiClient,
-): UseApiClient<ApiClient> {
-  async function getApiClient() {
-    const client = new c();
-    return client;
-  }
-
-  return {
-    getApiClient,
-  };
-}

package/core/composables/useAppBarMobileButtons/index.ts

@@ -1,33 +0,0 @@
-import { inject, provide, getCurrentScope, onScopeDispose } from "vue";
-import { AppBarMobileButtonsServiceKey } from "@framework/injection-keys";
-import { createAppBarMobileButtonsService, IAppBarMobileButtonsService } from "@core/services/app-bar-mobile-buttons-service";
-import { createLogger, InjectionError } from "@core/utilities";
-
-const logger = createLogger("use-app-bar-mobile-buttons");
-
-export function provideAppBarMobileButtonsService(): IAppBarMobileButtonsService {
-  const existingService = inject(AppBarMobileButtonsServiceKey, null);
-  if (existingService) {
-    return existingService;
-  }
-
-  const service = createAppBarMobileButtonsService();
-  provide(AppBarMobileButtonsServiceKey, service);
-
-  if (getCurrentScope()) {
-    onScopeDispose(() => {
-      // Service cleanup on scope disposal
-    });
-  }
-
-  return service;
-}
-
-export function useAppBarMobileButtons() {
-  const service = inject(AppBarMobileButtonsServiceKey);
-  if (!service) {
-    logger.error("AppBarMobileButtonsService not found");
-    throw new InjectionError("AppBarMobileButtonsService");
-  }
-  return service;
-}

package/core/composables/useAppBarWidget/index.test.ts

@@ -1,86 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { defineComponent, h, inject } from "vue";
-import { mount } from "@vue/test-utils";
-import { AppBarWidgetServiceKey } from "@framework/injection-keys";
-import { provideAppBarWidget, useAppBarWidget } from "@core/composables/useAppBarWidget";
-import { createAppBarWidgetService } from "@core/services/app-bar-menu-service";
-
-describe("useAppBarWidget", () => {
-  it("throws InjectionError when no service is provided", () => {
-    const TestComp = defineComponent({
-      setup() {
-        expect(() => useAppBarWidget()).toThrow("AppBarWidgetService");
-        return () => h("div");
-      },
-    });
-
-    mount(TestComp);
-  });
-
-  it("returns injected service", () => {
-    const service = createAppBarWidgetService();
-
-    const TestComp = defineComponent({
-      setup() {
-        const result = useAppBarWidget();
-        expect(result).toBe(service);
-        return () => h("div");
-      },
-    });
-
-    mount(TestComp, {
-      global: {
-        provide: { [AppBarWidgetServiceKey as symbol]: service },
-      },
-    });
-  });
-});
-
-describe("provideAppBarWidget", () => {
-  it("creates and provides a service", () => {
-    let providedService: any;
-    let injectedService: any;
-
-    const Parent = defineComponent({
-      setup() {
-        providedService = provideAppBarWidget();
-        return () => h(Child);
-      },
-    });
-
-    const Child = defineComponent({
-      setup() {
-        injectedService = inject(AppBarWidgetServiceKey);
-        return () => h("div");
-      },
-    });
-
-    mount(Parent);
-
-    expect(providedService).toBeDefined();
-    expect(injectedService).toBe(providedService);
-  });
-
-  it("is idempotent — returns existing service if already provided", () => {
-    let firstResult: any;
-    let secondResult: any;
-
-    const GrandParent = defineComponent({
-      setup() {
-        firstResult = provideAppBarWidget();
-        return () => h(Parent);
-      },
-    });
-
-    const Parent = defineComponent({
-      setup() {
-        secondResult = provideAppBarWidget();
-        return () => h("div");
-      },
-    });
-
-    mount(GrandParent);
-
-    expect(firstResult).toBe(secondResult);
-  });
-});

package/core/composables/useAppBarWidget/index.ts

@@ -1,31 +0,0 @@
-import { inject, provide, getCurrentScope, onScopeDispose } from "vue";
-import { createAppBarWidgetService, IAppBarWidgetService, appBarWidgetBus } from "@core/services/app-bar-menu-service";
-import { AppBarWidgetServiceKey } from "@framework/injection-keys";
-import { createLogger, InjectionError } from "@core/utilities";
-
-const logger = createLogger("use-app-bar-widget");
-
-export function provideAppBarWidget(): IAppBarWidgetService {
-  const existingService = inject(AppBarWidgetServiceKey, null);
-  if (existingService) {
-    return existingService;
-  }
-
-  const service = createAppBarWidgetService();
-  provide(AppBarWidgetServiceKey, service);
-
-  if (getCurrentScope()) {
-    onScopeDispose(() => appBarWidgetBus.dispose(service));
-  }
-
-  return service;
-}
-
-export function useAppBarWidget(): IAppBarWidgetService {
-  const service = inject(AppBarWidgetServiceKey);
-  if (!service) {
-    logger.error("AppBarWidgetService not found");
-    throw new InjectionError("AppBarWidgetService");
-  }
-  return service;
-}

package/core/composables/useAppInsights/index.ts

@@ -1,56 +0,0 @@
-import { inject, type InjectionKey } from "vue";
-import { AppInsightsPluginOptions, useAppInsights as useInsights } from "vue3-application-insights";
-import { generateW3CId } from "@microsoft/applicationinsights-core-js";
-import { useUserManagement } from "@core/composables/useUserManagement";
-import { ApplicationInsights, Snippet } from "@microsoft/applicationinsights-web";
-
-export const AppInsightsOptionsKey: InjectionKey<AppInsightsPluginOptions> = Symbol("AppInsightsOptions");
-
-export interface IUseAppInsights {
-  setupPageTracking: {
-    beforeEach: (route: { name: string }) => void;
-    afterEach: (route: { name: string; fullPath: string }) => void;
-  };
-  appInsights: ApplicationInsights;
-}
-
-export function useAppInsights(): IUseAppInsights {
-  const appInsights = useInsights();
-  const { user } = useUserManagement();
-  const appInsightsOptions = inject(AppInsightsOptionsKey, undefined);
-
-  function setupPageTracking() {
-    const appName = appInsightsOptions?.appName ? `[${appInsightsOptions.appName}] ` : "";
-
-    const pageName = (route: { name: string }) => `${appName}${route.name as string}`;
-
-    function beforeEach(route: { name: string }) {
-      if (!appInsights) return;
-      const name = pageName(route);
-      appInsights.context.telemetryTrace.traceID = generateW3CId();
-      appInsights.context.telemetryTrace.name = route.name as string;
-
-      appInsights.startTrackPage(name);
-    }
-
-    function afterEach(route: { name: string; fullPath: string }) {
-      if (!appInsights) return;
-      const name = pageName(route);
-      const url = location.protocol + "//" + location.host + route.fullPath;
-      appInsights.stopTrackPage(name, url, {
-        userId: user.value?.id ?? "",
-        userName: user.value?.userName ?? "",
-      });
-    }
-
-    return {
-      beforeEach,
-      afterEach,
-    };
-  }
-
-  return {
-    setupPageTracking: setupPageTracking(),
-    appInsights,
-  };
-}

package/core/composables/useAssets/index.ts

@@ -1,144 +0,0 @@
-import { computed, ref, ComputedRef } from "vue";
-import * as _ from "lodash-es";
-import type { ICommonAsset } from "@core/types";
-import { createLogger } from "@core/utilities";
-
-const logger = createLogger("use-assets");
-
-/** Maximum number of concurrent uploads */
-const MAX_CONCURRENT_UPLOADS = 4;
-
-export interface IUseAssets {
-  upload: (files: FileList, uploadPath: string, startingSortOrder?: number) => Promise<ICommonAsset[]>;
-  remove: (filesToDelete: ICommonAsset[], initialAssetArr: ICommonAsset[]) => ICommonAsset[];
-  edit: (updatedFiles: ICommonAsset[], initialAssetArr: ICommonAsset[]) => ICommonAsset[];
-  loading: ComputedRef<boolean>;
-}
-
-/**
- * Uploads a single file and returns the asset
- */
-async function uploadSingleFile(
-  file: File,
-  uploadPath: string,
-  index: number,
-  startingSortOrder?: number,
-): Promise<ICommonAsset | null> {
-  const formData = new FormData();
-  formData.append("file", file);
-
-  const result = await fetch(`/api/assets?folderUrl=/${uploadPath}`, {
-    method: "POST",
-    body: formData,
-  });
-
-  const response = await result.json();
-
-  if (response?.length) {
-    const uploadedFile = response[0];
-    uploadedFile.createdDate = new Date();
-    uploadedFile.sortOrder = startingSortOrder !== undefined && startingSortOrder >= 0 ? startingSortOrder + index + 1 : 0;
-    uploadedFile.url = uploadedFile.url ? decodeURI(uploadedFile.url) : "";
-
-    if ("size" in uploadedFile) {
-      uploadedFile.size = file.size;
-    }
-
-    return uploadedFile;
-  }
-
-  return null;
-}
-
-/**
- * Processes items in batches with concurrency limit
- */
-async function processBatched<T, R>(
-  items: T[],
-  processor: (item: T, index: number) => Promise<R>,
-  concurrency: number,
-): Promise<R[]> {
-  const results: R[] = [];
-
-  for (let i = 0; i < items.length; i += concurrency) {
-    const batch = items.slice(i, i + concurrency);
-    const batchResults = await Promise.all(batch.map((item, batchIndex) => processor(item, i + batchIndex)));
-    results.push(...batchResults);
-  }
-
-  return results;
-}
-
-export function useAssets(): IUseAssets {
-  const loading = ref(false);
-
-  async function upload(files: FileList, uploadPath: string, startingSortOrder?: number): Promise<ICommonAsset[]> {
-    try {
-      loading.value = true;
-
-      const fileArray = Array.from(files);
-
-      // Upload files in parallel batches
-      const uploadResults = await processBatched(
-        fileArray,
-        (file, index) => uploadSingleFile(file, uploadPath, index, startingSortOrder),
-        MAX_CONCURRENT_UPLOADS,
-      );
-
-      // Filter out null results and return successful uploads
-      return uploadResults.filter((asset): asset is ICommonAsset => asset !== null);
-    } catch (error) {
-      logger.error("Upload failed:", error);
-      throw error;
-    } finally {
-      loading.value = false;
-    }
-  }
-
-  function remove(filesToDelete: ICommonAsset[], initialAssetArr: ICommonAsset[], assetKey = "url"): ICommonAsset[] {
-    try {
-      loading.value = true;
-
-      let updatedAssetArr = _.cloneDeep(initialAssetArr) || [];
-
-      if (updatedAssetArr && updatedAssetArr.length && filesToDelete.length > 0) {
-        updatedAssetArr = _.differenceWith(updatedAssetArr, filesToDelete, (x, y) => x[assetKey] === y[assetKey]);
-      }
-
-      return updatedAssetArr;
-    } catch (error) {
-      logger.error("Remove failed:", error);
-      throw error;
-    } finally {
-      loading.value = false;
-    }
-  }
-
-  function edit(updatedFiles: ICommonAsset[], initialAssetArr: ICommonAsset[]): ICommonAsset[] {
-    // When all items are passed (e.g. reorder), preserve the order of updatedFiles.
-    // When a subset is passed (e.g. single asset edit), update in place within initial order.
-    if (updatedFiles.length === initialAssetArr.length) {
-      return updatedFiles.map((file) => ({ ...file }));
-    }
-
-    const updatedAssetArr = _.cloneDeep(initialAssetArr) || [];
-
-    if (updatedAssetArr && updatedAssetArr.length) {
-      updatedFiles.forEach((updatedFile) => {
-        const index = updatedAssetArr.findIndex((asset) => asset.url === updatedFile.url);
-        if (index !== -1) {
-          updatedAssetArr[index] = { ...updatedAssetArr[index], ...updatedFile };
-        }
-      });
-    }
-
-    return updatedAssetArr;
-  }
-
-  return {
-    upload,
-    remove,
-    edit,
-    loading: computed(() => loading.value),
-  };
-}

package/core/composables/useAsync/index.test.ts

@@ -1,137 +0,0 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
-import { useAsync } from "./index";
-import { DisplayableError, parseError } from "@core/utilities/error";
-import { cancelPendingErrorNotification } from "@core/utilities/pendingErrorNotifications";
-
-vi.mock("@shared/components/notifications/core/notification", () => ({
-  notification: { error: vi.fn(), remove: vi.fn() },
-}));
-
-import { notification } from "@shared/components/notifications/core/notification";
-
-describe("useAsync", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    vi.useFakeTimers();
-  });
-
-  afterEach(() => {
-    vi.useRealTimers();
-  });
-
-  it("should return error ref alongside loading and action", () => {
-    const { loading, action, error } = useAsync(async () => {});
-    expect(loading.value).toBe(false);
-    expect(error.value).toBeNull();
-    expect(typeof action).toBe("function");
-  });
-
-  it("should set error ref on failure", async () => {
-    const { action, error } = useAsync(async () => {
-      throw new Error("test");
-    });
-    await expect(action()).rejects.toThrow("test");
-    expect(error.value).toBeInstanceOf(DisplayableError);
-    expect(error.value!.message).toBe("test");
-  });
-
-  it("should clear error on next successful invocation", async () => {
-    let shouldFail = true;
-    const { action, error } = useAsync(async () => {
-      if (shouldFail) throw new Error("fail");
-    });
-
-    await expect(action()).rejects.toThrow();
-    expect(error.value).not.toBeNull();
-
-    shouldFail = false;
-    await action();
-    expect(error.value).toBeNull();
-  });
-
-  it("should schedule deferred notification by default", async () => {
-    const { action } = useAsync(async () => {
-      throw new Error("notify me");
-    });
-    await expect(action()).rejects.toThrow();
-
-    // Before timer fires, notification not yet shown
-    expect(notification.error).not.toHaveBeenCalled();
-
-    // After timer fires (+ microtask flush for dynamic import), notification appears
-    await vi.runAllTimersAsync();
-    expect(notification.error).toHaveBeenCalledWith(
-      "notify me",
-      expect.objectContaining({ notificationId: expect.any(String) }),
-    );
-  });
-
-  it("should allow ErrorInterceptor to cancel deferred notification", async () => {
-    const { action } = useAsync(async () => {
-      throw new Error("cancellable");
-    });
-
-    let caughtError: unknown;
-    try {
-      await action();
-    } catch (e) {
-      caughtError = e;
-    }
-
-    // Simulate what ErrorInterceptor does — cancel before timer fires
-    const cancelled = cancelPendingErrorNotification(caughtError);
-    expect(cancelled).toBe(true);
-
-    await vi.runAllTimersAsync();
-    expect(notification.error).not.toHaveBeenCalled();
-  });
-
-  it("should cancel via DisplayableError.originalError (real ErrorInterceptor flow)", async () => {
-    const { action } = useAsync(async () => {
-      throw new Error("wrapped-cancel");
-    });
-
-    let caughtError: unknown;
-    try {
-      await action();
-    } catch (e) {
-      caughtError = e;
-    }
-
-    // useErrorHandler wraps the error via parseError() → DisplayableError.
-    // The watch in ErrorInterceptor receives this wrapped object, not the original.
-    const wrappedError = parseError(caughtError);
-
-    const cancelled = cancelPendingErrorNotification(wrappedError);
-    expect(cancelled).toBe(true);
-
-    await vi.runAllTimersAsync();
-    expect(notification.error).not.toHaveBeenCalled();
-  });
-
-  it("should suppress notification when notify: false", async () => {
-    const { action } = useAsync(
-      async () => {
-        throw new Error("silent");
-      },
-      { notify: false },
-    );
-    await expect(action()).rejects.toThrow();
-    await vi.runAllTimersAsync();
-    expect(notification.error).not.toHaveBeenCalled();
-  });
-
-  it("should still re-throw (backward compat)", async () => {
-    const { action } = useAsync(async () => {
-      throw new Error("rethrow");
-    });
-    await expect(action()).rejects.toThrow("rethrow");
-  });
-
-  it("backward compat: destructuring without error works", async () => {
-    const { loading, action } = useAsync(async () => "result");
-    const result = await action();
-    expect(result).toBe("result");
-    expect(loading.value).toBe(false);
-  });
-});

package/core/composables/useAsync/index.ts

@@ -1,89 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { readonly, ref, type Ref, type DeepReadonly } from "vue";
-import { HasLoading } from "@core/composables/useLoading";
-import { parseError, DisplayableError } from "@core/utilities/error";
-import { setPendingErrorNotification } from "@core/utilities/pendingErrorNotifications";
-import { createLogger } from "@core/utilities";
-
-// Lazy-resolved reference to the notification singleton.
-// We avoid a top-level import of `@shared/components/notifications/core/notification`
-// because that module transitively pulls in UI components (@ui/components) which
-// import from @core/composables — creating a circular dependency at module load time.
-let _notification: typeof import("@shared/components/notifications/core/notification").notification | undefined;
-
-const logger = createLogger("use-async");
-
-export type AsyncAction<Payload = void, Result = void> = (payload?: Payload, ...rest: any[]) => Promise<Result>;
-
-export interface UseAsyncOptions {
-  /**
-   * Show error notification on failure. Default: true.
-   *
-   * Notifications are deferred via setTimeout(0) so that ErrorInterceptor
-   * can cancel them when it catches the same error for blade banner display.
-   * This prevents duplicate toast+banner for load errors while still
-   * showing toasts for save/delete errors caught by module try/catch.
-   */
-  notify?: boolean;
-  /** Notification timeout in ms. Default: 8000 */
-  notifyTimeout?: number;
-}
-
-export interface UseAsync<Payload = void, Result = void> extends HasLoading {
-  action: AsyncAction<Payload, Result>;
-  /** Reactive error state — set on failure, cleared on next invocation */
-  error: DeepReadonly<Ref<DisplayableError | null>>;
-}
-
-export function useAsync<Payload = void, Result = void>(
-  innerAction: AsyncAction<Payload, Result>,
-  options?: UseAsyncOptions,
-): UseAsync<Payload, Result> {
-  const loading = ref(false);
-  const error = ref<DisplayableError | null>(null);
-
-  const shouldNotify = options?.notify !== false;
-  const notifyTimeout = options?.notifyTimeout ?? 8000;
-
-  async function action(payload?: Payload, ...rest: any[]): Promise<Result> {
-    loading.value = true;
-    error.value = null;
-
-    try {
-      return await innerAction(payload, ...rest);
-    } catch (e) {
-      const parsed = parseError(e);
-      error.value = parsed;
-      logger.error("Async action failed:", e);
-
-      if (shouldNotify && e && typeof e === "object") {
-        const notifId = `async-error-${parsed.message.slice(0, 80)}`;
-
-        // Defer notification so ErrorInterceptor can cancel it
-        // when onErrorCaptured fires (synchronously, before setTimeout(0) callback)
-        const timerId = setTimeout(async () => {
-          if (!_notification) {
-            const mod = await import("@shared/components/notifications/core/notification");
-            _notification = mod.notification;
-          }
-          _notification.error(parsed.message, {
-            timeout: notifyTimeout,
-            notificationId: notifId,
-          });
-        }, 0);
-
-        setPendingErrorNotification(e, timerId, notifId);
-      }
-
-      throw e;
-    } finally {
-      loading.value = false;
-    }
-  }
-
-  return {
-    loading: readonly(loading),
-    error: readonly(error),
-    action,
-  };
-}

package/core/composables/useBeforeUnload/index.ts

@@ -1,25 +0,0 @@
-import { onBeforeMount, onBeforeUnmount, unref, ComputedRef } from "vue";
-
-/**
- * Prevents the user from closing the tab if the modified flag is set to true.
- * @param modified - The flag that indicates whether the user has made changes.
- * @returns The modified flag.
- */
-export const useBeforeUnload = (modified: ComputedRef<boolean>) => {
-  onBeforeMount(() => {
-    window.addEventListener("beforeunload", preventUnload);
-  });
-
-  onBeforeUnmount(() => {
-    window.removeEventListener("beforeunload", preventUnload);
-  });
-
-  function preventUnload(event: Event) {
-    if (!unref(modified)) return;
-    event.preventDefault();
-  }
-
-  return {
-    modified,
-  };
-};