@antelopejs/dms 0.0.1

package/frontend-vue/layers/dms-layout/app/plugins/command-palette-personal-pages.client.ts

@@ -0,0 +1,97 @@
+import type { CommandPaletteGroup, CommandPaletteItem } from "@nuxt/ui";
+
+const PERSONAL_PAGES_SOURCE_ID = "dms-personal-pages";
+const PERSONAL_PAGES_SOURCE_ORDER = 20;
+const FAVORITES_GROUP_ID = "favorite-pages";
+const RECENT_MODULES_GROUP_ID = "recent-modules";
+
+type AccessibleModules = Record<string, ModuleWithAccess> | undefined;
+
+type PathLabelResolver = (path: string) => string | undefined;
+
+function buildFavoritesGroup(
+  favorites: FavoritePage[],
+  translate: I18nTranslate,
+): CommandPaletteGroup | null {
+  if (favorites.length === 0) return null;
+
+  return {
+    id: FAVORITES_GROUP_ID,
+    label: translate("menu.favorites", {}),
+    items: favorites.map((favorite) => ({
+      label: resolveI18nKey(translate, favorite.title),
+      icon: favorite.icon ?? DEFAULT_PAGE_ICON,
+      to: favorite.path,
+    })),
+  };
+}
+
+function buildRecentModuleItem(
+  entry: ModuleHistoryEntry,
+  modules: AccessibleModules,
+  translate: I18nTranslate,
+  resolvePathLabel: PathLabelResolver,
+): CommandPaletteItem | null {
+  const module = modules?.[entry.moduleId];
+  if (!module?.hasAccess) return null;
+
+  return {
+    label: resolveI18nKey(translate, module.title),
+    suffix: resolvePathLabel(entry.path),
+    icon: module.icon,
+    to: entry.path,
+  };
+}
+
+function buildRecentModulesGroup(
+  entries: ModuleHistoryEntry[],
+  modules: AccessibleModules,
+  translate: I18nTranslate,
+  resolvePathLabel: PathLabelResolver,
+): CommandPaletteGroup | null {
+  const items = entries
+    .slice()
+    .reverse()
+    .map((entry) =>
+      buildRecentModuleItem(entry, modules, translate, resolvePathLabel),
+    )
+    .filter((item): item is CommandPaletteItem => item !== null);
+  if (items.length === 0) return null;
+
+  return {
+    id: RECENT_MODULES_GROUP_ID,
+    label: translate("commandPalette.groups.recentModules", {}),
+    items,
+  };
+}
+
+export default defineDmsPlugin(() => {
+  const { translate } = getPluginI18n();
+  const { sortedFavorites } = useFavoritePages();
+  const { entries } = useModuleHistory();
+  const { modules, findMatchingRoute } = useSiteLayout();
+
+  const resolvePathLabel: PathLabelResolver = (path) => {
+    const match = findMatchingRoute(path);
+    if (!match) return undefined;
+    return resolveI18nKey(translate, match.metadata.displayName);
+  };
+
+  const groups = computed<CommandPaletteGroup[]>(() =>
+    [
+      buildFavoritesGroup(sortedFavorites.value, translate),
+      buildRecentModulesGroup(
+        entries.value,
+        modules.value,
+        translate,
+        resolvePathLabel,
+      ),
+    ].filter((group): group is CommandPaletteGroup => group !== null),
+  );
+
+  registerCommandPaletteSource({
+    id: PERSONAL_PAGES_SOURCE_ID,
+    order: PERSONAL_PAGES_SOURCE_ORDER,
+    groups: () => groups.value,
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/command-palette-quick-actions.client.ts

@@ -0,0 +1,44 @@
+import type { CommandPaletteGroup, CommandPaletteItem } from "@nuxt/ui";
+
+const QUICK_ACTIONS_SOURCE_ID = "dms-quick-actions";
+const QUICK_ACTIONS_SOURCE_ORDER = 10;
+const QUICK_ACTIONS_GROUP_PREFIX = "quick-actions";
+
+function buildActionItem(
+  action: QuickActionInfo,
+  translate: I18nTranslate,
+): CommandPaletteItem {
+  return {
+    label: resolveI18nKey(translate, action.displayName),
+    icon: action.icon,
+    onSelect: () => {
+      void dispatchQuickActionTarget(action.target);
+    },
+  };
+}
+
+function buildQuickActionGroups(
+  categoryGroups: QuickActionCategoryGroup[],
+  translate: I18nTranslate,
+): CommandPaletteGroup[] {
+  return categoryGroups.map((group) => ({
+    id: `${QUICK_ACTIONS_GROUP_PREFIX}-${group.category.id}`,
+    label: resolveI18nKey(translate, group.category.displayName),
+    items: group.actions.map((action) => buildActionItem(action, translate)),
+  }));
+}
+
+export default defineDmsPlugin(() => {
+  const { translate } = getPluginI18n();
+  const { categoryGroups } = useQuickActions();
+
+  const groups = computed<CommandPaletteGroup[]>(() =>
+    buildQuickActionGroups(categoryGroups.value, translate),
+  );
+
+  registerCommandPaletteSource({
+    id: QUICK_ACTIONS_SOURCE_ID,
+    order: QUICK_ACTIONS_SOURCE_ORDER,
+    groups: () => groups.value,
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/command-palette-session.client.ts

@@ -0,0 +1,96 @@
+import { useClipboard } from "@vueuse/core";
+import type { CommandPaletteGroup, CommandPaletteItem } from "@nuxt/ui";
+
+const SESSION_SOURCE_ID = "dms-session";
+const SESSION_SOURCE_ORDER = 50;
+const SESSION_GROUP_ID = "session";
+const LANGUAGE_ICON = "i-ph-translate-light";
+const COPY_URL_ICON = "i-ph-link-light";
+const LOGOUT_ICON = "i-ph-sign-out-light";
+
+interface LocaleOption {
+  code: string;
+  name?: string;
+}
+
+function uniqueByCode<T extends LocaleOption>(locales: T[]): T[] {
+  const seen = new Set<string>();
+  return locales.filter((locale) => {
+    if (seen.has(locale.code)) return false;
+    seen.add(locale.code);
+    return true;
+  });
+}
+
+function buildAccountItems(translate: I18nTranslate): CommandPaletteItem[] {
+  return ACCOUNT_MENU_ENTRIES.map((entry) => ({
+    label: translate(entry.labelKey, {}),
+    icon: entry.icon,
+    to: entry.to,
+  }));
+}
+
+export default defineDmsPlugin(() => {
+  const { i18n, translate } = getPluginI18n();
+  const toast = useToast();
+  const { logout } = useLogout();
+  const { copy } = useClipboard({ legacy: true });
+
+  const localeItems = (): CommandPaletteItem[] =>
+    uniqueByCode(i18n.locales.value).map((locale) => ({
+      label: locale.name ?? locale.code,
+      active: i18n.locale.value === locale.code,
+      onSelect: () => {
+        void i18n.setLocale(locale.code);
+      },
+    }));
+
+  async function copyCurrentUrl(): Promise<void> {
+    try {
+      await copy(window.location.href);
+      toast.add({ title: translate("commandPalette.session.urlCopied", {}) });
+    } catch {
+      toast.add({
+        title: translate("commandPalette.session.copyFailed", {}),
+        color: "error",
+      });
+    }
+  }
+
+  function buildSessionGroup(): CommandPaletteGroup {
+    return {
+      id: SESSION_GROUP_ID,
+      label: translate("commandPalette.groups.session", {}),
+      items: [
+        ...buildAccountItems(translate),
+        {
+          label: translate("commandPalette.session.changeLanguage", {}),
+          icon: LANGUAGE_ICON,
+          children: localeItems(),
+        },
+        {
+          label: translate("commandPalette.session.copyUrl", {}),
+          icon: COPY_URL_ICON,
+          onSelect: () => {
+            void copyCurrentUrl();
+          },
+        },
+        {
+          label: translate("button.logout", {}),
+          icon: LOGOUT_ICON,
+          onSelect: () => {
+            void logout();
+          },
+        },
+      ],
+    };
+  }
+
+  const groups = computed<CommandPaletteGroup[]>(() => [buildSessionGroup()]);
+
+  registerCommandPaletteSource({
+    id: SESSION_SOURCE_ID,
+    order: SESSION_SOURCE_ORDER,
+    groups: () => groups.value,
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/dms-dev-reload.client.ts

@@ -0,0 +1,45 @@
+const RELOAD_EVENT_NAME = "reload";
+const RELOAD_ENDPOINT_PATH = "/dms/dev/reload";
+
+function resolveBackendBase(): string | null {
+  const config = useDmsRuntimeConfig();
+  const dmsConfig = (config.public as { dms?: { baseURL?: string } }).dms;
+  const baseURL = dmsConfig?.baseURL?.replace(/\/+$/, "");
+  return baseURL || null;
+}
+
+/**
+ * Dev-only: turn the backend's `reload` stream into a soft refresh.
+ *
+ * All the waiting lives in the dev-reload coordinator (see `useDevReload`), so
+ * this plugin and the `useDmsDevReload().awaitRoute` module frontends call
+ * share one route-readiness loop and one in-flight refresh.
+ */
+export default defineDmsPlugin(() => {
+  if (!import.meta.env.DEV) return;
+
+  const backendBase = resolveBackendBase();
+  if (!backendBase) return;
+
+  const endpoint = `${backendBase}${RELOAD_ENDPOINT_PATH}`;
+  const { coordinator } = useDevReloadHolder();
+  const source = new EventSource(endpoint);
+
+  source.addEventListener("error", () => {
+    console.warn(
+      "[dms-dev-reload] SSE connection lost, waiting for backend...",
+    );
+  });
+
+  source.addEventListener(RELOAD_EVENT_NAME, () => {
+    void coordinator.requestRefresh().catch((err: unknown) => {
+      console.error("[dms-dev-reload] Reload handler failed:", err);
+    });
+  });
+
+  if (import.meta.hot) {
+    import.meta.hot.dispose(() => {
+      source.close();
+    });
+  }
+});

package/frontend-vue/layers/dms-layout/app/plugins/dms-menu-sync.client.ts

@@ -0,0 +1,45 @@
+const MENU_CHANGED_EVENT_TYPE = "menu-changed";
+
+// A module signalled that the data behind the menu changed (a project created,
+// an access scope edited). The event carries no data: the site layout and the
+// permission set are re-fetched, each resolved server-side against this user.
+export default defineDmsPlugin(() => {
+  const realtime = useUserRealtime();
+  const siteLayout = useSiteLayout();
+  const permissions = usePermissions();
+  // A burst of changes (a batch of projects) collapses into one trailing pass.
+  const resync = useTrailingDeduper("menu-sync");
+
+  const refresh = (): Promise<void> =>
+    resync
+      .run(async () => {
+        await Promise.all([
+          // Background resync: a transient failure is logged below, never
+          // escalated to the fatal error page over a working session.
+          siteLayout.refresh({ fatal: false }),
+          permissions.fetchPermissions(),
+        ]);
+      })
+      .catch((error: unknown) => {
+        console.error("[dms-menu-sync] Menu resync failed:", error);
+      });
+
+  // The topic also carries presence snapshots, which have no `type`.
+  const onMenuEvent: RealtimeTopicHandler = (event) => {
+    if (!("type" in event) || event.type !== MENU_CHANGED_EVENT_TYPE) return;
+    void refresh();
+  };
+
+  const unsubscribes: Array<() => void> = [];
+
+  watch(
+    () => realtime.menuTopics.value,
+    (topics) => {
+      for (const unsubscribe of unsubscribes.splice(0)) unsubscribe();
+      for (const topic of topics) {
+        unsubscribes.push(realtime.subscribe(topic, onMenuEvent));
+      }
+    },
+    { immediate: true },
+  );
+});

package/frontend-vue/layers/dms-layout/app/plugins/interface-scale.ts

@@ -0,0 +1,9 @@
+export default defineDmsPlugin(() => {
+  const interfaceScale = useInterfaceScale();
+
+  useHead({
+    htmlAttrs: {
+      "data-scale": interfaceScale,
+    },
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/language-sync.ts

@@ -0,0 +1,10 @@
+export default defineDmsPlugin((dmsApp) => {
+  const { user } = useUserSession();
+  const { setLocale } = dmsApp.$i18n;
+
+  dmsApp.hook("app:mounted", () => {
+    if (user.value?.language) {
+      setLocale(user.value.language as "en" | "fr");
+    }
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/notification-stream.client.ts

@@ -0,0 +1,61 @@
+import type { UserNotification } from "../composables/notification/useNotifications";
+
+const NOTIFICATION_TOPIC_PREFIX = "notifications:user:";
+const NOTIFICATION_NEW_TYPE = "notification:new";
+const NOTIFICATION_READ_TYPE = "notification:read";
+const NOTIFICATION_ALL_READ_TYPE = "notification:all-read";
+
+interface IncomingPayload {
+  notification?: UserNotification;
+  ids?: string[];
+}
+
+const isNotificationEvent = (
+  event: unknown,
+): event is { type: string; payload?: IncomingPayload } =>
+  !!event &&
+  typeof event === "object" &&
+  typeof (event as Record<string, unknown>).type === "string";
+
+type Handler = (payload: IncomingPayload | undefined) => void | Promise<void>;
+
+export default defineDmsPlugin(() => {
+  const { user, loggedIn } = useUserSession();
+  const { handleIncomingNotification, handleRemoteRead, handleRemoteAllRead } =
+    useNotifications();
+  const realtime = useUserRealtime();
+
+  const handlers: Record<string, Handler> = {
+    [NOTIFICATION_NEW_TYPE]: (payload) => {
+      if (payload?.notification)
+        handleIncomingNotification(payload.notification);
+    },
+    [NOTIFICATION_READ_TYPE]: async (payload) => {
+      if (Array.isArray(payload?.ids)) await handleRemoteRead(payload.ids);
+    },
+    [NOTIFICATION_ALL_READ_TYPE]: async () => {
+      await handleRemoteAllRead();
+    },
+  };
+
+  let unsubscribe: (() => void) | undefined;
+
+  watch(
+    () => (loggedIn.value ? user.value?._id : undefined),
+    (userId) => {
+      unsubscribe?.();
+      unsubscribe = undefined;
+      if (!userId) return;
+      unsubscribe = realtime.subscribe(
+        `${NOTIFICATION_TOPIC_PREFIX}${userId}`,
+        (event) => {
+          if (!isNotificationEvent(event)) return;
+          const handler = handlers[event.type];
+          if (!handler) return;
+          void handler(event.payload);
+        },
+      );
+    },
+    { immediate: true },
+  );
+});

package/frontend-vue/layers/dms-layout/app/plugins/profile-sync.client.ts

@@ -0,0 +1,24 @@
+import { FormEvents } from "#dms-ui/app/composables/form/types/events";
+import type { ComponentEventData } from "#dms-core/app/types/component";
+
+interface FormSubmitSuccessPayload {
+  submitUrl?: string;
+}
+
+/**
+ * Keeps the global user identity in sync with the profile form: when the
+ * profile page's form saves successfully, refresh the session user so the
+ * header menu and the switch-account page pick up the new name immediately.
+ */
+export default defineDmsPlugin(() => {
+  const { refresh } = useCurrentUser();
+
+  window.addEventListener(FormEvents.SUBMIT_SUCCESS, (event) => {
+    const detail = (event as CustomEvent<ComponentEventData>).detail;
+    const payload = detail?.data as FormSubmitSuccessPayload | undefined;
+    if (payload?.submitUrl !== PROFILE_ROUTE) {
+      return;
+    }
+    void refresh().catch(() => undefined);
+  });
+});

package/frontend-vue/layers/dms-layout/app/plugins/seo.ts

@@ -0,0 +1,29 @@
+export default defineDmsPlugin(async () => {
+  const { metaTitle, metaDescription, refresh } = useSystemState();
+
+  useSeoMeta({
+    titleTemplate(title) {
+      return title ? `${title} | ${metaTitle.value}` : metaTitle.value;
+    },
+    description: metaDescription,
+    ogTitle: metaTitle,
+    ogDescription: metaDescription,
+    twitterTitle: metaTitle,
+    twitterDescription: metaDescription,
+    twitterCard: "summary_large_image",
+  });
+
+  useHead({
+    titleTemplate(title) {
+      return title ? `${title} | ${metaTitle.value}` : metaTitle.value;
+    },
+    meta: [
+      {
+        name: "description",
+        content: metaDescription,
+      },
+    ],
+  });
+
+  if (!metaTitle.value) await refresh();
+});

package/frontend-vue/layers/dms-layout/app/types/page-setup.ts

@@ -0,0 +1,31 @@
+import type { PageInfo } from "./page";
+
+/** Cleanup callback returned by a PageSetupFunction. Called on page unmount. */
+export type PageSetupCleanup = () => void;
+
+/**
+ * Context passed to a PageSetupFunction. Use on(component, event, handler)
+ * to subscribe (returns an unsubscribe). Use emit(component, event, data) to
+ * dispatch on the shared window event bus.
+ */
+export interface PageSetupContext {
+  pageInfo: PageInfo;
+  permissions: Set<string>;
+  on(
+    component: string,
+    event: string,
+    handler: (data: unknown) => void,
+  ): () => void;
+  emit(component: string, event: string, data?: unknown): void;
+}
+
+/**
+ * Page-level setup function referenced by MenuOptions.setupId. Register on the
+ * frontend via useDefinedFunctions().registerFunction(). Runs in onMounted;
+ * cleanup runs on onUnmounted.
+ */
+/* eslint-disable @typescript-eslint/no-invalid-void-type -- void permits callers to omit return */
+export type PageSetupFunction = (
+  context: PageSetupContext,
+) => Promise<PageSetupCleanup | void> | PageSetupCleanup | void;
+/* eslint-enable @typescript-eslint/no-invalid-void-type */

package/frontend-vue/layers/dms-layout/app/types/page.ts

@@ -0,0 +1,129 @@
+export type MenuItemType = "label" | "link";
+// MenuItemVariant / MenuItemStatus / MenuItemQuery live in dms-core, the layer
+// that renders them: this one only consumes them.
+
+export interface PageValidation {
+  requiredQueryParams?: string[];
+  customFunctionId?: string;
+}
+
+export interface MenuOptions {
+  displayName: string;
+  category: CategoryInfo;
+  urlSlug?: string;
+  description?: string;
+  order?: number;
+  icon?: string;
+  hidden?: boolean;
+  publicAccess?: boolean;
+  permission?: string;
+  type?: MenuItemType;
+  validation?: PageValidation;
+  setupId?: string;
+  query?: MenuItemQuery;
+  variant?: MenuItemVariant;
+  status?: MenuItemStatus;
+  bypassTenantAccessGate?: boolean;
+}
+
+export interface CategoryInfo extends Omit<MenuOptions, "category"> {
+  id: string;
+  fullId: string;
+  fullSlug: string;
+  hasAccess?: boolean;
+  isModuleRoot?: boolean;
+}
+
+// Mirror of ModuleInfo and MODULE_URL_PREFIX from @antelopejs/interface-dms/page.
+// The frontend module cannot import backend types directly, so any change to the
+// backend definitions must be reflected here (and vice versa).
+export interface ModuleInfo {
+  id: string;
+  title: string;
+  description: string;
+  icon: string;
+  landingPage?: string;
+  defaultCategory?: {
+    displayName?: string;
+    icon?: string;
+    order?: number;
+    urlSlug?: string;
+  };
+}
+
+export type ModuleWithAccess = ModuleInfo & { hasAccess: boolean };
+
+export const MODULE_URL_PREFIX = "/modules";
+
+export interface PageInfo extends Omit<CategoryInfo, "category"> {
+  layoutUrl: string;
+}
+
+export type SiteLayoutTree = Omit<PageInfo, "layoutUrl"> & {
+  children: Record<string, SiteLayoutTree>;
+  childrenOrders: string[];
+  layoutUrl?: string;
+  hasAccess?: boolean;
+};
+export type SiteLayout = {
+  pages: Record<string, PageInfo>;
+  categories: Record<string, CategoryInfo>;
+};
+
+export interface QuickActionCategoryInfo {
+  id: string;
+  displayName: string;
+  icon?: string;
+  order?: number;
+}
+
+export type QuickActionTarget =
+  | { type: "navigate"; to: string; query?: Record<string, string> }
+  | { type: "openForm"; to: string; component: string }
+  | { type: "event"; name: string; payload?: unknown };
+
+/**
+ * The payload only ever carries actions the caller can run: the server leaves
+ * the others out entirely, so there is no access flag to read here.
+ */
+export interface QuickActionInfo {
+  id: string;
+  category: QuickActionCategoryInfo;
+  displayName: string;
+  icon: string;
+  order?: number;
+  target: QuickActionTarget;
+}
+
+export interface QuickActionsPayload {
+  categories: Record<string, QuickActionCategoryInfo>;
+  actions: Record<string, QuickActionInfo>;
+}
+
+export interface ComponentChild<T = object> {
+  id: string;
+  component: ComponentInfo<T>;
+  slot?: string;
+  [key: string]: unknown;
+}
+
+export interface ComponentInfo<T = object> {
+  componentName?: string;
+  options?: T;
+  children?: ComponentChild<T>[];
+}
+
+export interface ResolvedComponentInfo<T = object> {
+  id: string;
+  options?: T;
+  component: unknown;
+  componentName?: string;
+  children: ResolvedComponentInfo[];
+  slot?: string;
+  [key: string]: unknown;
+}
+
+export interface PageLayout {
+  components: Record<string, ComponentInfo>;
+  layout: ComponentInfo;
+}

package/frontend-vue/layers/dms-layout/app/utils/account-menu.ts

@@ -0,0 +1,28 @@
+export interface AccountMenuEntry {
+  labelKey: string;
+  icon: string;
+  to: string;
+}
+
+export const PROFILE_ROUTE = "/settings/user/profile";
+export const SETTINGS_ROUTE = "/settings";
+export const SWITCH_ACCOUNT_ROUTE = "/auth/accounts";
+
+/**
+ * Canonical account navigation entries, rendered by both the header user
+ * menu and the command palette's session source so the two surfaces cannot
+ * drift.
+ */
+export const ACCOUNT_MENU_ENTRIES: AccountMenuEntry[] = [
+  { labelKey: "menu.profile", icon: "i-ph-user-light", to: PROFILE_ROUTE },
+  {
+    labelKey: "menu.section.settings",
+    icon: "i-ph-gear-light",
+    to: SETTINGS_ROUTE,
+  },
+  {
+    labelKey: "menu.switch_account",
+    icon: "i-ph-users-light",
+    to: SWITCH_ACCOUNT_ROUTE,
+  },
+];

package/frontend-vue/layers/dms-layout/app/utils/dms-icons.ts

@@ -0,0 +1 @@
+export const DEFAULT_PAGE_ICON = "i-ph-file-light";