@antelopejs/dms 0.5.1 → 0.5.3

package/frontend-vue/layers/dms-core/app/composables/realtime/useUserRealtime.ts

@@ -1,4 +1,8 @@
-import { isUnauthorizedStreamError, openSseStream } from "./useSseStream";
+import {
+  isUnauthorizedStreamError,
+  openSseStream,
+  type SseStreamHandle,
+} from "./useSseStream";
 
 const REALTIME_USER_PATH = "/api/realtime/user";
 const REALTIME_SUBSCRIBE_PATH_PREFIX = "/api/realtime/subscribe/";
@@ -117,57 +121,109 @@ const handleEvent =
     }
   };
 
+interface ConnectionCallbacks {
+  onConnected: () => void;
+  onDisconnected: () => void;
+  refreshSession: () => Promise<boolean>;
+  redirectToAuth: () => Promise<void>;
+}
+
+interface Reconnector {
+  isCancelled(): boolean;
+  schedule(open: () => void): void;
+  resetDelay(): void;
+  cancel(): void;
+}
+
+const createReconnector = (): Reconnector => {
+  let isCancelled = false;
+  let delay = RECONNECT_INITIAL_DELAY_MS;
+  let timer: ReturnType<typeof setTimeout> | undefined;
+  return {
+    isCancelled: () => isCancelled,
+    schedule: (open) => {
+      // A pending reconnect absorbs concurrent triggers: one stream per tab.
+      if (isCancelled || timer) return;
+      timer = setTimeout(() => {
+        timer = undefined;
+        open();
+      }, delay);
+      delay = Math.min(delay * RECONNECT_MULTIPLIER, RECONNECT_MAX_DELAY_MS);
+    },
+    resetDelay: () => {
+      delay = RECONNECT_INITIAL_DELAY_MS;
+    },
+    cancel: () => {
+      isCancelled = true;
+      if (timer) clearTimeout(timer);
+      timer = undefined;
+    },
+  };
+};
+
+const recoverFromError = (
+  error: unknown,
+  reconnect: () => void,
+  callbacks: ConnectionCallbacks,
+): void => {
+  if (!isUnauthorizedStreamError(error)) {
+    reconnect();
+    return;
+  }
+  void callbacks.refreshSession().then((isRefreshed) => {
+    if (isRefreshed) {
+      reconnect();
+    } else {
+      void callbacks.redirectToAuth();
+    }
+  }, reconnect);
+};
+
+/**
+ * Keeps one user stream open until cancelled. The server ends the stream when
+ * it stops (a dev reload included), so a clean EOF reconnects just like an
+ * error does: the user stream has no business completion.
+ */
 const connectWithBackoff = (
   url: string,
   state: UserRealtimeState,
-  onConnected: () => void,
-  refreshSession: () => Promise<boolean>,
-  redirectToAuth: () => Promise<void>,
+  callbacks: ConnectionCallbacks,
 ): (() => void) => {
-  let cancelled = false;
-  let delay = RECONNECT_INITIAL_DELAY_MS;
-  let timer: ReturnType<typeof setTimeout> | undefined;
-  let activeHandle: { close(): void } | undefined;
+  const reconnector = createReconnector();
   const dispatch = handleEvent(state);
+  let activeHandle: SseStreamHandle | undefined;
   const open = () => {
-    if (cancelled) return;
-    activeHandle = openSseStream({
+    if (reconnector.isCancelled()) return;
+    activeHandle?.close();
+    const handle: SseStreamHandle = openSseStream({
       url,
       onEvent: (eventName, data) => {
-        if (cancelled) return;
-        delay = RECONNECT_INITIAL_DELAY_MS;
+        if (handle !== activeHandle) return;
+        reconnector.resetDelay();
         dispatch(eventName, data);
-        if (eventName === HELLO_EVENT) onConnected();
+        if (eventName === HELLO_EVENT) callbacks.onConnected();
       },
       onError: (error) => {
-        if (cancelled) return;
-        state.appliedPageId.value = null;
-        const scheduleReconnect = () => {
-          if (cancelled) return;
-          timer = setTimeout(open, delay);
-          delay = Math.min(
-            delay * RECONNECT_MULTIPLIER,
-            RECONNECT_MAX_DELAY_MS,
-          );
-        };
-        if (isUnauthorizedStreamError(error)) {
-          void refreshSession().then((refreshed) => {
-            if (refreshed) {
-              scheduleReconnect();
-            } else {
-              void redirectToAuth();
-            }
-          }, scheduleReconnect);
-          return;
-        }
-        scheduleReconnect();
+        if (!retire(handle)) return;
+        recoverFromError(error, reconnect, callbacks);
+      },
+      onClose: (reason) => {
+        if (reason !== "eof" || !retire(handle)) return;
+        reconnect();
       },
     });
+    activeHandle = handle;
+  };
+  const reconnect = () => reconnector.schedule(open);
+  const retire = (handle: SseStreamHandle): boolean => {
+    if (handle !== activeHandle || reconnector.isCancelled()) return false;
+    activeHandle = undefined;
+    callbacks.onDisconnected();
+    return true;
   };
   open();
   return () => {
-    cancelled = true;
-    if (timer) clearTimeout(timer);
+    reconnector.cancel();
     activeHandle?.close();
     activeHandle = undefined;
   };
@@ -196,14 +252,29 @@ const reconcilePage = async (
   baseUrl: string,
 ): Promise<void> => {
   const desired = state.pageId.value ?? null;
+  const sessionId = state.sessionId.value;
   if (state.appliedPageId.value === desired) return;
-  if (!state.sessionId.value) return;
+  if (!sessionId) return;
   await callPageEndpoint(state, desired, baseUrl);
+  // A reconnect during the call replaced the session: the page is applied to
+  // the dead one, and the new one still needs it.
+  if (state.sessionId.value !== sessionId) return;
   if ((state.pageId.value ?? null) === desired) {
     state.appliedPageId.value = desired;
   }
 };
 
+/**
+ * Forgets what the server held for the closed session. The next greeting
+ * brings a new session id, which re-applies the page topics here and lets the
+ * components holding presence re-acquire it.
+ */
+const resetSession = (state: UserRealtimeState): void => {
+  state.sessionId.value = undefined;
+  state.appliedPageId.value = null;
+  state.snapshots.clear();
+};
+
 const buildApi = (): UserRealtimeApi => {
   const sessionId = useDmsState<string | undefined>(
     SESSION_STATE_KEY,
@@ -232,19 +303,20 @@ const buildApi = (): UserRealtimeApi => {
       (isLoggedIn) => {
         state.cancelConnect?.();
         state.cancelConnect = undefined;
-        state.sessionId.value = undefined;
+        resetSession(state);
         state.menuTopics.value = [];
-        state.appliedPageId.value = null;
-        state.snapshots.clear();
         if (!isLoggedIn) return;
         state.cancelConnect = connectWithBackoff(
           `${baseUrl}${REALTIME_USER_PATH}`,
           state,
-          () => {
-            void reconcilePage(state, baseUrl);
+          {
+            onConnected: () => {
+              void reconcilePage(state, baseUrl);
+            },
+            onDisconnected: () => resetSession(state),
+            refreshSession,
+            redirectToAuth,
           },
-          refreshSession,
-          redirectToAuth,
         );
       },
       { immediate: true },

package/frontend-vue/layers/dms-layout/app/pages/[...slug].vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { withoutTrailingSlash } from "ufo";
 
+defineOptions({ inheritAttrs: false });
+
 // Dev-only: created behind the flag so the key never reaches a production
 // SSR payload.
 const devReloading = import.meta.env.DEV ? useDevReloading() : ref(false);

package/frontend-vue/layers/dms-ui/app/components/form/components/File.vue

@@ -7,6 +7,10 @@ import {
   type FileConstraintViolation,
   type FileFieldConstraints,
 } from "../../../utils/fileConstraints";
+import {
+  isDefinitiveMetadataFailure,
+  resolveMetadataRetryDelay,
+} from "../../../utils/metadataRetry";
 
 export type FileConstraints = FileFieldConstraints;
 
@@ -53,12 +57,13 @@ const selectedFiles = ref<File | File[] | null>(null);
 const uploadingFiles = ref<UploadingFile[]>([]);
 const uploadedKeys = ref<string[]>([]);
 const fileMetadata = ref<Map<string, FileMetadataResponse>>(new Map());
+const unavailableKeys = ref<Set<string>>(new Set());
 const metadataTimers = new Map<string, ReturnType<typeof setTimeout>>();
+const metadataFailures = new Map<string, number>();
 const pendingMetadata = new Map<string, Promise<void>>();
 let isDisposed = false;
 const contentLanguage = inject(FORM_CONTENT_LANGUAGE_KEY, undefined);
 const URL_REFRESH_LEAD_MS = 5000;
-const TRANSIENT_RETRY_MS = 1000;
 
 const initializeFromModelValue = (
   val: string | string[] | null | undefined,
@@ -106,6 +111,33 @@ const fetchMetadata = async (
   await request;
 };
 
+const markUnavailable = (resourceKey: string, error: unknown) => {
+  const cached = fileMetadata.value.get(resourceKey);
+  const isExpired =
+    cached?.expiresAt !== undefined && cached.expiresAt <= Date.now();
+  if (cached && !isExpired && !isDefinitiveMetadataFailure(error)) return;
+  fileMetadata.value.set(resourceKey, {
+    resourceKey,
+    filename: cached?.filename ?? resourceKey,
+    size: cached?.size ?? 0,
+    mimetype: cached?.mimetype ?? "application/octet-stream",
+    url: "",
+  });
+  unavailableKeys.value.add(resourceKey);
+};
+
+const handleMetadataFailure = (resourceKey: string, error: unknown) => {
+  markUnavailable(resourceKey, error);
+  const failures = (metadataFailures.get(resourceKey) ?? 0) + 1;
+  metadataFailures.set(resourceKey, failures);
+  const delay = resolveMetadataRetryDelay(error, failures);
+  if (delay === null || import.meta.env.SSR) return;
+  metadataTimers.set(
+    resourceKey,
+    setTimeout(() => fetchMetadata(resourceKey, true), delay),
+  );
+};
+
 const requestMetadata = async (resourceKey: string): Promise<void> => {
   try {
     const metadata = await $authFetch<FileMetadataResponse>(
@@ -122,27 +154,12 @@ const requestMetadata = async (resourceKey: string): Promise<void> => {
     );
     if (isDisposed || !uploadedKeys.value.includes(resourceKey)) return;
     fileMetadata.value.set(resourceKey, metadata);
+    unavailableKeys.value.delete(resourceKey);
+    metadataFailures.delete(resourceKey);
     scheduleMetadataRefresh(resourceKey, metadata.expiresAt);
-  } catch (_error) {
+  } catch (error) {
     if (isDisposed || !uploadedKeys.value.includes(resourceKey)) return;
-    const cached = fileMetadata.value.get(resourceKey);
-    const isExpired =
-      cached?.expiresAt !== undefined && cached.expiresAt <= Date.now();
-    if (!cached || isExpired) {
-      fileMetadata.value.set(resourceKey, {
-        resourceKey,
-        filename: cached?.filename ?? resourceKey,
-        size: cached?.size ?? 0,
-        mimetype: cached?.mimetype ?? "application/octet-stream",
-        url: "",
-      });
-    }
-    if (!import.meta.env.SSR) {
-      metadataTimers.set(
-        resourceKey,
-        setTimeout(() => fetchMetadata(resourceKey, true), TRANSIENT_RETRY_MS),
-      );
-    }
+    handleMetadataFailure(resourceKey, error);
   } finally {
     pendingMetadata.delete(resourceKey);
   }
@@ -284,6 +301,8 @@ const removeUploadingFile = (id: string) => {
 const removeUploadedFile = (key: string) => {
   uploadedKeys.value = uploadedKeys.value.filter((k) => k !== key);
   fileMetadata.value.delete(key);
+  unavailableKeys.value.delete(key);
+  metadataFailures.delete(key);
   const timer = metadataTimers.get(key);
   if (timer) clearTimeout(timer);
   emitValue();
@@ -293,6 +312,8 @@ const getMetadata = (key: string): FileMetadataResponse | undefined => {
   return fileMetadata.value.get(key);
 };
 
+const isUnavailable = (key: string): boolean => unavailableKeys.value.has(key);
+
 const isImage = (mimetype: string): boolean => {
   return mimetype.startsWith("image/");
 };
@@ -399,6 +420,11 @@ onScopeDispose(() => {
             :alt="getMetadata(key)!.filename"
             class="h-8 w-8 rounded object-cover"
           />
+          <UIcon
+            v-else-if="isUnavailable(key)"
+            name="i-lucide-alert-circle"
+            class="text-error h-4 w-4"
+          />
           <UIcon
             v-else
             name="i-lucide-file-check"
@@ -412,7 +438,10 @@ onScopeDispose(() => {
           >
             {{ getMetadata(key)!.filename }}
           </ULink>
-          <span class="text-muted text-xs">
+          <span v-if="isUnavailable(key)" class="text-error text-xs">
+            {{ $t("dms.form.file.file_unavailable") }}
+          </span>
+          <span v-else class="text-muted text-xs">
             {{ formatFileSize(getMetadata(key)!.size) }}
           </span>
         </template>

package/frontend-vue/layers/dms-ui/app/components/form/components/Image.vue

@@ -10,6 +10,10 @@ import {
   type ImageResizeBounds,
   resizeImageToBounds,
 } from "../../../utils/imageResize";
+import {
+  isDefinitiveMetadataFailure,
+  resolveMetadataRetryDelay,
+} from "../../../utils/metadataRetry";
 
 export type ImageConstraints = FileFieldConstraints;
 
@@ -25,7 +29,11 @@ interface ImageProps {
   disabled?: boolean;
 }
 
-type ItemStatus = "uploading" | "done" | "error";
+/**
+ * `error` is a failed upload of a picked file; `unavailable` is a stored value
+ * whose metadata could not be read (deleted, swept from staging, or denied).
+ */
+type ItemStatus = "uploading" | "done" | "error" | "unavailable";
 
 interface GalleryItem {
   id: string;
@@ -67,7 +75,18 @@ const contentLanguage = inject(FORM_CONTENT_LANGUAGE_KEY, undefined);
 
 const DEFAULT_ACCEPT = "image/*";
 const URL_REFRESH_LEAD_MS = 5000;
-const TRANSIENT_RETRY_MS = 1000;
+const FAILURE_LABEL_KEYS: Partial<Record<ItemStatus, string>> = {
+  error: "dms.form.image.upload_failed",
+  unavailable: "dms.form.image.file_unavailable",
+};
+
+/**
+ * Item ids are random, so they differ between the server render and
+ * hydration; DOM ids derive from `useId()`, which both sides agree on.
+ */
+const fieldId = useId();
+const singleAltInputId = `${fieldId}-alt`;
+const detailAltInputId = `${fieldId}-alt-detail`;
 
 const items = ref<GalleryItem[]>([]);
 const fileInput = ref<HTMLInputElement | null>(null);
@@ -77,6 +96,7 @@ const dragOverItemId = ref<string | null>(null);
 const detailItemId = ref<string | null>(null);
 const detailAltDraft = ref("");
 const metadataTimers = new Map<string, ReturnType<typeof setTimeout>>();
+const metadataFailures = new Map<string, number>();
 const pendingMetadata = new Set<string>();
 let isDisposed = false;
 
@@ -120,6 +140,21 @@ const scheduleItemExpiryRefresh = (item: GalleryItem) => {
   scheduleItemMetadataRefresh(item, remaining - refreshLead);
 };
 
+const handleItemMetadataFailure = (item: GalleryItem, error: unknown) => {
+  if (
+    isDefinitiveMetadataFailure(error) ||
+    !item.url ||
+    (item.expiresAt !== undefined && item.expiresAt <= Date.now())
+  ) {
+    item.url = "";
+    item.status = "unavailable";
+  }
+  const failures = (metadataFailures.get(item.id) ?? 0) + 1;
+  metadataFailures.set(item.id, failures);
+  const delay = resolveMetadataRetryDelay(error, failures);
+  if (delay !== null) scheduleItemMetadataRefresh(item, delay);
+};
+
 const fetchItemMetadata = async (item: GalleryItem, force = false) => {
   if (isDisposed) return;
   if (!item.key || (!force && item.url) || pendingMetadata.has(item.id)) return;
@@ -141,17 +176,11 @@ const fetchItemMetadata = async (item: GalleryItem, force = false) => {
     item.size = metadata.size;
     item.expiresAt = metadata.expiresAt;
     item.status = "done";
+    metadataFailures.delete(item.id);
     scheduleItemExpiryRefresh(item);
-  } catch (_error) {
+  } catch (error) {
     if (isDisposed || !items.value.some(({ id }) => id === item.id)) return;
-    if (
-      !item.url ||
-      (item.expiresAt !== undefined && item.expiresAt <= Date.now())
-    ) {
-      item.url = "";
-      item.status = "error";
-    }
-    scheduleItemMetadataRefresh(item, TRANSIENT_RETRY_MS);
+    handleItemMetadataFailure(item, error);
   } finally {
     pendingMetadata.delete(item.id);
   }
@@ -180,6 +209,7 @@ const releaseItem = (item: GalleryItem) => {
   const timer = metadataTimers.get(item.id);
   if (timer) clearTimeout(timer);
   metadataTimers.delete(item.id);
+  metadataFailures.delete(item.id);
 };
 
 const initializeFromModelValue = () => {
@@ -524,6 +554,9 @@ const formatFileSize = (bytes: number): string => {
   return `${size.toFixed(1)} ${units[unitIndex]}`;
 };
 
+const failureLabelKey = (item: GalleryItem): string | undefined =>
+  FAILURE_LABEL_KEYS[item.status];
+
 const itemMeta = (item: GalleryItem): string => {
   const parts: string[] = [];
   if (item.width && item.height) parts.push(`${item.width}×${item.height}`);
@@ -650,13 +683,13 @@ onBeforeUnmount(() => {
           </div>
 
           <div
-            v-else-if="item.status === 'error'"
+            v-else-if="failureLabelKey(item)"
             class="bg-error/15 absolute inset-0 z-[5] flex flex-col items-center justify-center gap-2 p-2 text-center backdrop-blur-[1px]"
           >
             <span
               class="bg-error rounded-md px-2 py-0.5 text-[11px] font-semibold text-white"
             >
-              {{ t("dms.form.image.upload_failed") }}
+              {{ t(failureLabelKey(item)!) }}
             </span>
             <UButton
               v-if="item.file"
@@ -794,13 +827,13 @@ onBeforeUnmount(() => {
           </div>
 
           <div
-            v-else-if="singleItem.status === 'error'"
+            v-else-if="failureLabelKey(singleItem)"
             class="bg-error/15 absolute inset-0 z-[5] flex flex-col items-center justify-center gap-2 p-2 text-center backdrop-blur-[1px]"
           >
             <span
               class="bg-error rounded-md px-2 py-0.5 text-[11px] font-semibold text-white"
             >
-              {{ t("dms.form.image.upload_failed") }}
+              {{ t(failureLabelKey(singleItem)!) }}
             </span>
             <UButton
               v-if="singleItem.file"
@@ -835,21 +868,21 @@ onBeforeUnmount(() => {
                 t("dms.form.image.uploading", { progress: singleItem.progress })
               }}
             </template>
-            <template v-else-if="singleItem.status === 'error'">
-              {{ t("dms.form.image.upload_failed") }}
+            <template v-else-if="failureLabelKey(singleItem)">
+              {{ t(failureLabelKey(singleItem)!) }}
             </template>
             <template v-else>{{ itemMeta(singleItem) }}</template>
           </div>
 
           <div class="mt-3">
             <label
-              :for="`${singleItem.id}-alt`"
+              :for="singleAltInputId"
               class="text-muted mb-1.5 block text-xs font-semibold"
             >
               {{ t("dms.form.image.alt_label") }}
             </label>
             <UInput
-              :id="`${singleItem.id}-alt`"
+              :id="singleAltInputId"
               v-model="singleItem.alt"
               :placeholder="t('dms.form.image.alt_placeholder')"
               :disabled="disabled || singleItem.status !== 'done'"
@@ -903,13 +936,13 @@ onBeforeUnmount(() => {
 
           <div class="flex flex-col gap-2 p-4">
             <label
-              :for="`${detailItem.id}-alt-detail`"
+              :for="detailAltInputId"
               class="text-muted text-xs font-semibold"
             >
               {{ t("dms.form.image.alt_label") }}
             </label>
             <UTextarea
-              :id="`${detailItem.id}-alt-detail`"
+              :id="detailAltInputId"
               v-model="detailAltDraft"
               :placeholder="t('dms.form.image.alt_placeholder')"
               :rows="3"

package/frontend-vue/layers/dms-ui/app/components/form/components/Relation.vue

@@ -31,7 +31,7 @@ interface RelationProps extends SelectMenuProps<T, "value", M> {
     disabled?: string;
   };
   addForm?: { componentName: string; options?: FormProps };
-  addPermissionId?: string;
+  addPermissionIds?: string[];
 }
 
 const props = withDefaults(defineProps<RelationProps>(), {
@@ -48,7 +48,7 @@ const forwardedProps = computed(() => {
     deselectable: ____,
     modelValue: _____,
     addForm: ______,
-    addPermissionId: _______,
+    addPermissionIds: _______,
     ...rest
   } = props;
   return rest as SelectMenuProps<T, "value", M>;
@@ -110,7 +110,8 @@ const canAdd = computed(
   () =>
     !!props.addForm &&
     !!props.addForm.options?.submitUrl &&
-    (!props.addPermissionId || hasPermission(props.addPermissionId)),
+    (!props.addPermissionIds?.length ||
+      props.addPermissionIds.some((id) => hasPermission(id))),
 );
 
 interface RelationResponse {

package/frontend-vue/layers/dms-ui/app/composables/form/useUploadWithProgress.ts

@@ -7,6 +7,47 @@ export interface PresignResponse {
 const UPLOAD_SUCCESS_MIN = 200;
 const UPLOAD_SUCCESS_MAX = 300;
 
+/**
+ * Request headers a browser refuses to let script set (Fetch standard,
+ * "forbidden request-header"). A presign may still list them -- the storage
+ * signs `Content-Length` -- and the browser sends them itself, so copying them
+ * only logs `Refused to set unsafe header` on every upload.
+ */
+const FORBIDDEN_REQUEST_HEADERS = new Set([
+  "accept-charset",
+  "accept-encoding",
+  "access-control-request-headers",
+  "access-control-request-method",
+  "connection",
+  "content-length",
+  "cookie",
+  "cookie2",
+  "date",
+  "dnt",
+  "expect",
+  "host",
+  "keep-alive",
+  "origin",
+  "referer",
+  "set-cookie",
+  "te",
+  "trailer",
+  "transfer-encoding",
+  "upgrade",
+  "via",
+]);
+const FORBIDDEN_REQUEST_HEADER_PREFIXES = ["proxy-", "sec-"];
+
+const isForbiddenRequestHeader = (name: string): boolean => {
+  const normalized = name.trim().toLowerCase();
+  return (
+    FORBIDDEN_REQUEST_HEADERS.has(normalized) ||
+    FORBIDDEN_REQUEST_HEADER_PREFIXES.some((prefix) =>
+      normalized.startsWith(prefix),
+    )
+  );
+};
+
 /**
  * Uploads a file to the presigned storage URL with a PUT request, reporting
  * real upload progress and rejecting on a non-2xx response (a plain `fetch`
@@ -21,9 +62,9 @@ export function useUploadWithProgress() {
     new Promise((resolve, reject) => {
       const xhr = new XMLHttpRequest();
       xhr.open("PUT", presign.uploadUrl);
-      Object.entries(presign.headers ?? {}).forEach(([name, value]) =>
-        xhr.setRequestHeader(name, value),
-      );
+      Object.entries(presign.headers ?? {})
+        .filter(([name]) => !isForbiddenRequestHeader(name))
+        .forEach(([name, value]) => xhr.setRequestHeader(name, value));
       xhr.upload.onprogress = (event) => {
         if (!event.lengthComputable) return;
         onProgress(Math.round((event.loaded / event.total) * 100));

package/frontend-vue/layers/dms-ui/app/plugins/shortcuts.ts

@@ -1,4 +1,4 @@
-import aggregatedShortcuts from "../config/shortcuts-registry";
+import aggregatedShortcuts from "#shortcuts-aggregated";
 export default defineDmsPlugin(() => {
   const { registerShortcut } = useShortcutRegistry();
 

package/frontend-vue/layers/dms-ui/app/types/shortcuts-aggregated.d.ts

@@ -0,0 +1,8 @@
+// Generated by the renderer in the workspace: every module's
+// `app/config/shortcuts-registry.ts`, spread in priority order.
+declare module "#shortcuts-aggregated" {
+  import type { ComponentShortcuts } from "#dms-ui/app/types/shortcuts";
+
+  const aggregatedShortcuts: ComponentShortcuts[];
+  export default aggregatedShortcuts;
+}