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

package/core/composables/useMenuService/index.ts

@@ -1,43 +0,0 @@
-import { provide, inject, getCurrentInstance, getCurrentScope, onScopeDispose } from "vue";
-import {
-  MenuService,
-  createMenuService,
-  addMenuItem,
-  removeRegisteredMenuItem,
-  setMenuBadge,
-  getMenuBadge,
-  removeMenuBadge,
-  getMenuBadges,
-  menuServiceBus,
-} from "@core/services/menu-service";
-import { MenuServiceKey } from "@framework/injection-keys";
-import { createLogger, InjectionError } from "@core/utilities";
-
-const logger = createLogger("use-menu-service");
-
-export function provideMenuService(): MenuService {
-  const existingService = inject(MenuServiceKey, null);
-  if (existingService) {
-    return existingService;
-  }
-
-  const service = createMenuService();
-  provide(MenuServiceKey, service);
-
-  if (getCurrentScope()) {
-    onScopeDispose(() => menuServiceBus.dispose(service));
-  }
-
-  return service;
-}
-
-export function useMenuService(): MenuService {
-  const service = inject(MenuServiceKey);
-  if (!service) {
-    logger.error("Menu service not found in current context. Injection chain:", getCurrentInstance());
-    throw new InjectionError("MenuService");
-  }
-  return service;
-}
-
-export { addMenuItem, removeRegisteredMenuItem, setMenuBadge, getMenuBadge, removeMenuBadge, getMenuBadges };

package/core/composables/useNotifications/index.ts

@@ -1,200 +0,0 @@
-import { PushNotification, PushNotificationClient } from "@core/api/platform";
-import { computed, ComputedRef, ref, onUnmounted } from "vue";
-import { orderBy } from "lodash-es";
-import { createLogger } from "@core/utilities";
-
-const logger = createLogger("use-notifications");
-
-const notificationsClient = new PushNotificationClient();
-
-/** Notification types excluded from the dropdown history list. */
-const EXCLUDED_NOTIFICATION_TYPES = ["IndexProgressPushNotification"];
-
-interface INotifications {
-  readonly notifications: ComputedRef<PushNotification[]>;
-  readonly moduleNotifications: ComputedRef<PushNotification[]>;
-  loadFromHistory(take?: number): Promise<void>;
-  addNotification(message: PushNotification): void;
-  markAsRead(message: PushNotification): void;
-  markAllAsRead(): void;
-  setNotificationHandler(handler: (notification: PushNotification) => void): void;
-}
-
-/**
- * All notifications loaded from history and received via push.
- * This is the source of truth for the notification dropdown.
- */
-const notifications = ref<PushNotification[]>([]);
-
-/**
- * Real-time push notifications. Used by module-level subscribers
- * (via `notifyType` parameter) to react to specific notification types.
- */
-const pushNotifications = ref<PushNotification[]>([]);
-
-/** Whether any notification in the history list is unread. */
-export const hasUnreadNotifications = computed(() => notifications.value.some((item) => item.isNew));
-
-// Global subscribers storage and their handlers
-const subscribers = new Map<
-  string,
-  {
-    id: number;
-    handler?: (notification: PushNotification) => void;
-  }
->();
-
-let subscriberCounter = 0;
-
-/**
- * Composable for managing push notifications.
- *
- * Uses module-level singleton refs so all callers share the same state.
- * When `notifyType` is provided, registers a subscriber that receives
- * real-time notifications of that type and cleans up on unmount.
- */
-export function useNotifications(notifyType?: string | string[]): INotifications {
-  if (notifyType) {
-    const types = Array.isArray(notifyType) ? notifyType : [notifyType];
-
-    // Check existing subscriptions
-    types.forEach((type) => {
-      if (!subscribers.has(type)) {
-        subscribers.set(type, {
-          id: ++subscriberCounter,
-        });
-      }
-    });
-
-    onUnmounted(() => {
-      types.forEach((type) => {
-        subscribers.delete(type);
-      });
-    });
-  }
-
-  /**
-   * Loads notification history from the server.
-   * Uses raw fetch as a workaround — the generated API client returns incorrect types.
-   */
-  async function loadFromHistory(take = 10) {
-    try {
-      const result = await fetch("/api/platform/pushnotifications", {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json-patch+json",
-          Accept: "application/json",
-        },
-        body: JSON.stringify({ take }),
-      });
-
-      result.text().then((response) => {
-        notifications.value = <PushNotification[]>JSON.parse(response).notifyEvents ?? [];
-      });
-    } catch (e) {
-      logger.error("loadFromHistory failed:", e);
-      throw e;
-    }
-  }
-
-  /** Adds or updates a notification in both the history and push lists. */
-  function addNotification(message: PushNotification) {
-    if (!message.notifyType || !EXCLUDED_NOTIFICATION_TYPES.includes(message.notifyType)) {
-      const existsNotification = notifications.value.find((x: PushNotification) => x.id == message.id);
-      const existPushNotification = pushNotifications.value.find((x: PushNotification) => x.id == message.id);
-
-      if (existsNotification) {
-        message.isNew = existsNotification.isNew;
-        Object.assign(existsNotification, message);
-      } else {
-        notifications.value.push(new PushNotification(message));
-      }
-
-      if (existPushNotification) {
-        message.isNew = existPushNotification.isNew;
-        Object.assign(existPushNotification, message);
-      } else {
-        pushNotifications.value.push(new PushNotification(message));
-      }
-
-      // Check if there is a handler for this type of notification
-      if (message.isNew && message.notifyType && subscribers.has(message.notifyType)) {
-        const subscriber = subscribers.get(message.notifyType);
-        if (subscriber?.handler) {
-          subscriber.handler(message);
-        }
-      }
-    }
-  }
-
-  /** Marks a single notification as read in both the history and push lists. */
-  function markAsRead(message: PushNotification) {
-    const inHistory = notifications.value.find((x) => x.id === message.id);
-    if (inHistory) {
-      inHistory.isNew = false;
-    }
-
-    const inPush = pushNotifications.value.find((x) => x.id === message.id);
-    if (inPush) {
-      inPush.isNew = false;
-    }
-  }
-
-  async function markAllAsRead() {
-    try {
-      notifications.value = notifications.value.map((x) => {
-        if (x.isNew) {
-          x.isNew = false;
-        }
-        return x;
-      });
-      pushNotifications.value = pushNotifications.value.map((x) => {
-        if (x.isNew) {
-          x.isNew = false;
-        }
-        return x;
-      });
-      await notificationsClient.markAllAsRead();
-    } catch (e) {
-      logger.error("markAllAsRead failed:", e);
-      throw e;
-    }
-  }
-
-  function setNotificationHandler(handler: (notification: PushNotification) => void) {
-    if (notifyType) {
-      const types = Array.isArray(notifyType) ? notifyType : [notifyType];
-      types.forEach((type) => {
-        const subscriber = subscribers.get(type);
-        if (subscriber) {
-          subscriber.handler = handler;
-        }
-      });
-    }
-  }
-
-  const moduleNotifications = computed(() => {
-    if (!notifyType) {
-      return [];
-    }
-
-    const types = Array.isArray(notifyType) ? notifyType : [notifyType];
-
-    return (
-      pushNotifications.value.filter(
-        (item: PushNotification) =>
-          item.isNew && item.notifyType && types.includes(item.notifyType) && subscribers.has(item.notifyType),
-      ) ?? []
-    );
-  });
-
-  return {
-    notifications: computed(() => orderBy(notifications.value, ["created"], ["desc"])),
-    moduleNotifications,
-    loadFromHistory,
-    addNotification,
-    markAsRead,
-    markAllAsRead,
-    setNotificationHandler,
-  };
-}

package/core/composables/usePermissions/index.ts

@@ -1,30 +0,0 @@
-import { Ref, ref } from "vue";
-import { useUserManagement } from "@core/composables/useUserManagement";
-
-interface IUsePermissions {
-  hasAccess(permissions: string | string[] | undefined): boolean;
-}
-const userPermissions: Ref<string[]> = ref([]);
-export function usePermissions(): IUsePermissions {
-  const { user } = useUserManagement();
-
-  if (user.value) {
-    userPermissions.value = user.value?.permissions ?? [];
-  }
-
-  function hasAccess(permissions: string | string[] | undefined) {
-    if (!permissions || user.value?.isAdministrator) {
-      return true;
-    } else if (Array.isArray(permissions)) {
-      return permissions.some((permission) => userPermissions.value.includes(permission));
-    } else if (typeof permissions === "string") {
-      return userPermissions.value.includes(permissions);
-    } else {
-      throw new Error("Permissions must be a string or an array of strings");
-    }
-  }
-
-  return {
-    hasAccess,
-  };
-}

package/core/composables/useSettings/index.ts

@@ -1,64 +0,0 @@
-import { useAsync } from "@core/composables/useAsync";
-import { useApiClient } from "@core/composables/useApiClient";
-import { computed, Ref, ref, ComputedRef, onMounted } from "vue";
-import { SettingClient } from "@core/api/platform";
-import { useLoading } from "@core/composables/useLoading";
-
-interface IUISetting {
-  contrast_logo?: string;
-  logo?: string;
-  title?: string;
-  avatar?: string;
-  role?: string;
-}
-
-interface IUseSettings {
-  readonly uiSettings: Ref<IUISetting>;
-  readonly loading: ComputedRef<boolean>;
-  applySettings: (args: { logo?: string; title?: string; avatar?: string; role?: string }) => void;
-}
-
-export function useSettings(): IUseSettings {
-  const uiSettings = ref<IUISetting | undefined>();
-  const customSettingsApplied = ref(false);
-
-  const { getApiClient } = useApiClient(SettingClient);
-
-  const { loading, action: getUiCustomizationSettings } = useAsync(async () => {
-    if (customSettingsApplied.value) return;
-
-    const result = await (await getApiClient()).getUICustomizationSetting();
-    const settings = await JSON.parse(result.defaultValue ?? null);
-
-    if (settings && !uiSettings.value) {
-      uiSettings.value = {
-        contrast_logo: settings.contrast_logo,
-        logo: settings.logo,
-        title: settings.title,
-      };
-    }
-  });
-
-  function applySettings(args: { logo?: string; title?: string; avatar?: string; role?: string }) {
-    customSettingsApplied.value = true;
-    uiSettings.value = {
-      ...uiSettings.value,
-      logo: args.logo,
-      title: args.title,
-      avatar: args.avatar,
-      role: args.role,
-    };
-  }
-
-  onMounted(async () => {
-    if (!uiSettings.value && !customSettingsApplied.value) {
-      await getUiCustomizationSettings();
-    }
-  });
-
-  return {
-    uiSettings: computed(() => uiSettings.value ?? {}),
-    applySettings,
-    loading: useLoading(loading),
-  };
-}

package/core/composables/useSettingsMenu/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 { SettingsMenuServiceKey } from "@framework/injection-keys";
-import { provideSettingsMenu, useSettingsMenu } from "@core/composables/useSettingsMenu";
-import { createSettingsMenuService } from "@core/services/settings-menu-service";
-
-describe("useSettingsMenu", () => {
-  it("throws InjectionError when no service is provided", () => {
-    const TestComp = defineComponent({
-      setup() {
-        expect(() => useSettingsMenu()).toThrow("SettingsMenuService");
-        return () => h("div");
-      },
-    });
-
-    mount(TestComp);
-  });
-
-  it("returns injected service", () => {
-    const service = createSettingsMenuService();
-
-    const TestComp = defineComponent({
-      setup() {
-        const result = useSettingsMenu();
-        expect(result).toBe(service);
-        return () => h("div");
-      },
-    });
-
-    mount(TestComp, {
-      global: {
-        provide: { [SettingsMenuServiceKey as symbol]: service },
-      },
-    });
-  });
-});
-
-describe("provideSettingsMenu", () => {
-  it("creates and provides a service", () => {
-    let providedService: any;
-    let injectedService: any;
-
-    const Parent = defineComponent({
-      setup() {
-        providedService = provideSettingsMenu();
-        return () => h(Child);
-      },
-    });
-
-    const Child = defineComponent({
-      setup() {
-        injectedService = inject(SettingsMenuServiceKey);
-        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 = provideSettingsMenu();
-        return () => h(Parent);
-      },
-    });
-
-    const Parent = defineComponent({
-      setup() {
-        secondResult = provideSettingsMenu();
-        return () => h("div");
-      },
-    });
-
-    mount(GrandParent);
-
-    expect(firstResult).toBe(secondResult);
-  });
-});

package/core/composables/useSettingsMenu/index.ts

@@ -1,31 +0,0 @@
-import { inject, provide, getCurrentScope, onScopeDispose } from "vue";
-import { createSettingsMenuService, ISettingsMenuService, settingsMenuBus } from "@core/services/settings-menu-service";
-import { SettingsMenuServiceKey } from "@framework/injection-keys";
-import { createLogger, InjectionError } from "@core/utilities";
-
-const logger = createLogger("use-settings-menu");
-
-export function provideSettingsMenu(): ISettingsMenuService {
-  const existingService = inject(SettingsMenuServiceKey, null);
-  if (existingService) {
-    return existingService;
-  }
-
-  const settingsMenuService = createSettingsMenuService();
-  provide(SettingsMenuServiceKey, settingsMenuService);
-
-  if (getCurrentScope()) {
-    onScopeDispose(() => settingsMenuBus.dispose(settingsMenuService));
-  }
-
-  return settingsMenuService;
-}
-
-export function useSettingsMenu(): ISettingsMenuService {
-  const settingsMenuService = inject(SettingsMenuServiceKey);
-  if (!settingsMenuService) {
-    logger.error("Settings menu service not found");
-    throw new InjectionError("SettingsMenuService");
-  }
-  return settingsMenuService;
-}

package/core/composables/useSidebarState/index.ts

@@ -1,90 +0,0 @@
-import { ref, computed, provide, inject } from "vue";
-import type { Ref, ComputedRef, InjectionKey } from "vue";
-import { useMenuExpanded } from "@shared/composables/useMenuExpanded";
-
-export interface SidebarState {
-  /** Sidebar is pinned open by user (persisted to localStorage) */
-  isPinned: Ref<boolean>;
-  /** Sidebar is temporarily expanded on mouse hover (desktop only) */
-  isHoverExpanded: Ref<boolean>;
-  /** Mobile menu overlay is visible */
-  isMenuOpen: Ref<boolean>;
-  /** Derived: sidebar content should render in expanded mode (pinned OR hovered) */
-  isExpanded: ComputedRef<boolean>;
-}
-
-export interface SidebarActions {
-  /** Toggle the pinned state (persists to localStorage) */
-  togglePin: () => void;
-  /** Set hover expansion state with delay for opening */
-  setHoverExpanded: (value: boolean) => void;
-  /** Open the mobile menu / widget overlay */
-  openMenu: () => void;
-  /** Close the mobile menu / widget overlay */
-  closeMenu: () => void;
-}
-
-export type SidebarStateReturn = SidebarState & SidebarActions;
-
-const SIDEBAR_STATE_KEY: InjectionKey<SidebarStateReturn> = Symbol("SidebarState");
-
-/**
- * Provides sidebar state to the component tree. Must be called once in VcApp setup.
- * Idempotent: returns existing instance if already provided in the current tree.
- * Internally delegates to useMenuExpanded() for shared reactive state,
- * ensuring UserDropdownButton (which uses useMenuExpanded directly) stays in sync.
- */
-export function provideSidebarState(): SidebarStateReturn {
-  const existing = inject(SIDEBAR_STATE_KEY, null);
-  if (existing) return existing;
-
-  // Delegate to shared useMenuExpanded composable for reactive state sync
-  const {
-    isExpanded: isPinned,
-    isHoverExpanded,
-    toggleExpanded: togglePin,
-    toggleHoverExpanded,
-  } = useMenuExpanded();
-
-  const isMenuOpen = ref(false);
-
-  const isExpanded = computed(() => isPinned.value || isHoverExpanded.value);
-
-  const setHoverExpanded = (value: boolean) => {
-    toggleHoverExpanded(value);
-  };
-
-  const openMenu = () => {
-    isMenuOpen.value = true;
-  };
-
-  const closeMenu = () => {
-    isMenuOpen.value = false;
-  };
-
-  const instance: SidebarStateReturn = {
-    isPinned,
-    isHoverExpanded,
-    isMenuOpen,
-    isExpanded,
-    togglePin,
-    setHoverExpanded,
-    openMenu,
-    closeMenu,
-  };
-
-  provide(SIDEBAR_STATE_KEY, instance);
-  return instance;
-}
-
-/**
- * Access sidebar state from any descendant of VcApp.
- * Throws if called outside the VcApp component tree.
- */
-export function useSidebarState(): SidebarStateReturn {
-  const injected = inject(SIDEBAR_STATE_KEY);
-  if (!injected) {
-    throw new Error("useSidebarState() requires provideSidebarState() in a parent component");
-  }
-  return injected;
-}

package/core/composables/useTheme/index.ts

@@ -1,115 +0,0 @@
-import { BasicColorSchema, useColorMode, useCycleList } from "@vueuse/core";
-import { computed, watchEffect, ref, type Ref } from "vue";
-import { useI18n } from "vue-i18n";
-import * as _ from "lodash-es";
-import { i18n } from "@core/plugins/i18n";
-import { createLogger } from "@core/utilities";
-
-const logger = createLogger("use-theme");
-
-export interface ThemeDefinition {
-  key: string;
-  localizationKey?: string;
-}
-
-export interface DisplayTheme {
-  key: string;
-  name: string; // localized name
-}
-
-export interface IUseTheme {
-  themes: Ref<DisplayTheme[]>;
-  currentThemeKey: Ref<string>;
-  currentLocalizedName: Ref<string>;
-  next: () => void;
-  register: (themesToAdd: ThemeDefinition | ThemeDefinition[]) => void;
-  unregister: (themeKeysToRemove: string | string[]) => void;
-  setTheme: (themeKey: string) => void;
-}
-
-// Initialize with a default "light" theme, assuming a convention for its localization key.
-const _themeRegistry: Ref<ThemeDefinition[]> = ref([{ key: "light", localizationKey: "CORE.THEMES.LIGHT" }]);
-
-export const useTheme = (): IUseTheme => {
-  const { t } = i18n.global;
-
-  function register(themesToAdd: ThemeDefinition | ThemeDefinition[]) {
-    (Array.isArray(themesToAdd) ? themesToAdd : [themesToAdd]).forEach((themeDef) => {
-      if (!_themeRegistry.value.some((t) => t.key === themeDef.key)) {
-        _themeRegistry.value.push(themeDef);
-      }
-    });
-  }
-
-  function unregister(themeKeysToRemove: string | string[]) {
-    (Array.isArray(themeKeysToRemove) ? themeKeysToRemove : [themeKeysToRemove]).forEach((keyToRemove) => {
-      const index = _themeRegistry.value.findIndex((t) => t.key === keyToRemove);
-      if (index >= 0) {
-        // Ensure we don't unregister the last theme if it's active, or handle active theme change.
-        // For simplicity now, just remove. Consider active theme implications if this is an issue.
-        // Especially if 'light' is removed and it's the initial/fallback.
-        // However, 'light' is added by default and this function is for custom themes.
-        _themeRegistry.value.splice(index, 1);
-      }
-    });
-  }
-
-  const themeKeys = computed(() => _themeRegistry.value.map((t) => t.key));
-
-  const mode = useColorMode({
-    attribute: "data-theme",
-    emitAuto: true,
-    initialValue: "light", // Should align with a default theme in _themeRegistry
-    modes: {
-      // Dynamically build modes from registered theme keys
-      ...themeKeys.value.reduce(
-        (acc, name) => {
-          acc[name] = name; // Maps theme key to itself (e.g., "ocean": "ocean")
-          return acc;
-        },
-        {} as Record<string, string>,
-      ),
-    },
-  });
-
-  const { state, next } = useCycleList(themeKeys, { initialValue: mode });
-
-  watchEffect(() => {
-    if (state.value) {
-      // Ensure state.value is not undefined
-      mode.value = state.value as BasicColorSchema; // state.value is a theme key
-    }
-  });
-
-  function setTheme(themeKey: string) {
-    if (themeKeys.value.includes(themeKey)) {
-      state.value = themeKey;
-    } else {
-      logger.warn(`Attempted to set an unregistered theme: ${themeKey}`);
-    }
-  }
-
-  const currentLocalizedName = computed(() => {
-    const currentDef = _themeRegistry.value.find((t) => t.key === state.value);
-    if (currentDef) {
-      return currentDef.localizationKey ? t(currentDef.localizationKey) : _.capitalize(currentDef.key);
-    }
-    // Fallback if current theme key somehow not in registry (should not happen with proper setTheme guard)
-    return state.value ? _.capitalize(state.value) : "";
-  });
-
-  return {
-    themes: computed(() =>
-      _themeRegistry.value.map((themeDef) => ({
-        key: themeDef.key,
-        name: themeDef.localizationKey ? t(themeDef.localizationKey) : _.capitalize(themeDef.key),
-      })),
-    ),
-    currentThemeKey: state,
-    currentLocalizedName,
-    next,
-    register,
-    unregister,
-    setTheme,
-  };
-};