@umbraco-cms/backoffice 17.3.5 → 17.4.0-rc2

package/custom-elements.json

@@ -178,6 +178,17 @@
       "name": "example-counter-status-footer-app",
       "path": "./examples/workspace-context-counter/counter-status-footer-app.element.ts"
     },
+    {
+      "name": "mock-set-header-app",
+      "path": "./mocks/backoffice-extensions/mock-set-header-app.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
+        }
+      ]
+    },
     {
       "name": "umb-app-auth",
       "path": "./src/apps/app/app-auth.element.ts"
@@ -371,7 +382,7 @@
         },
         {
           "name": "styles",
-          "default": "\"css`\\n\\t\\t:host {\\n\\t\\t\\toverflow: hidden;\\n\\t\\t\\tmin-width: 920px;\\n\\t\\t}\\n\\n\\t\\t:host,\\n\\t\\t#router-slot {\\n\\t\\t\\tdisplay: block;\\n\\t\\t\\twidth: 100%;\\n\\t\\t\\theight: 100vh;\\n\\t\\t}\\n\\t`\""
+          "default": "\"css`\\n\\t\\t:host {\\n\\t\\t\\toverflow: hidden;\\n\\t\\t\\tmin-width: 920px;\\n\\t\\t}\\n\\n\\t\\t:host,\\n\\t\\t#router-slot {\\n\\t\\t\\tdisplay: block;\\n\\t\\t\\twidth: 100%;\\n\\t\\t\\theight: 100vh;\\n\\t\\t}\\n\\n\\t\\t#loader {\\n\\t\\t\\tdisplay: flex;\\n\\t\\t\\theight: 100%;\\n\\t\\t\\tjustify-content: center;\\n\\t\\t\\talign-items: center;\\n\\t\\t\\topacity: 0;\\n\\t\\t\\tanimation: fadeIn 240ms forwards;\\n\\t\\t}\\n\\t\\t@keyframes fadeIn {\\n\\t\\t\\tto {\\n\\t\\t\\t\\topacity: 1;\\n\\t\\t\\t}\\n\\t\\t}\\n\\t`\""
         }
       ]
     },
@@ -3891,6 +3902,83 @@
         }
       ]
     },
+    {
+      "name": "umb-input-dimensions",
+      "path": "./src/packages/core/components/input-dimensions/input-dimensions.element.ts",
+      "description": "A dimension input element with width/height fields and an aspect ratio lock.",
+      "attributes": [
+        {
+          "name": "width",
+          "type": "number | undefined"
+        },
+        {
+          "name": "height",
+          "type": "number | undefined"
+        },
+        {
+          "name": "locked",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "natural-width",
+          "type": "number | undefined"
+        },
+        {
+          "name": "natural-height",
+          "type": "number | undefined"
+        }
+      ],
+      "properties": [
+        {
+          "name": "width",
+          "attribute": "width",
+          "type": "number | undefined"
+        },
+        {
+          "name": "height",
+          "attribute": "height",
+          "type": "number | undefined"
+        },
+        {
+          "name": "locked",
+          "attribute": "locked",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "naturalWidth",
+          "attribute": "natural-width",
+          "type": "number | undefined"
+        },
+        {
+          "name": "naturalHeight",
+          "attribute": "natural-height",
+          "type": "number | undefined"
+        },
+        {
+          "name": "styles",
+          "default": "\"css`\\n\\t\\t#dimensions {\\n\\t\\t\\tdisplay: flex;\\n\\t\\t\\talign-items: end;\\n\\t\\t\\tgap: var(--uui-size-space-3);\\n\\n\\t\\t\\t.dimension-field {\\n\\t\\t\\t\\tflex: 1;\\n\\t\\t\\t\\tdisplay: flex;\\n\\t\\t\\t\\tflex-direction: column;\\n\\t\\t\\t\\tgap: var(--uui-size-space-1);\\n\\n\\t\\t\\t\\tuui-input {\\n\\t\\t\\t\\t\\tmargin-bottom: 0;\\n\\t\\t\\t\\t}\\n\\n\\t\\t\\t\\t.extra {\\n\\t\\t\\t\\t\\tuser-select: none;\\n\\t\\t\\t\\t\\theight: 100%;\\n\\t\\t\\t\\t\\tpadding: 0 var(--uui-size-3);\\n\\t\\t\\t\\t\\tborder-left: 1px solid var(--uui-input-border-color, var(--uui-color-border));\\n\\t\\t\\t\\t\\tbackground: var(--uui-color-background);\\n\\t\\t\\t\\t\\tcolor: var(--uui-color-text);\\n\\t\\t\\t\\t\\tdisplay: flex;\\n\\t\\t\\t\\t\\tjustify-content: center;\\n\\t\\t\\t\\t\\talign-items: center;\\n\\t\\t\\t\\t}\\n\\t\\t\\t}\\n\\t\\t}\\n\\n\\t\\t#reset {\\n\\t\\t\\tmargin-bottom: var(--uui-size-space-1);\\n\\t\\t}\\n\\t`\""
+        }
+      ],
+      "events": [
+        {
+          "name": "UmbChangeEvent",
+          "description": "When width, height, or locked state changes."
+        }
+      ]
+    },
     {
       "name": "umb-input-dropdown-list",
       "path": "./src/packages/core/components/input-dropdown/input-dropdown-list.element.ts",
@@ -4348,6 +4436,11 @@
           "name": "valueHigh",
           "type": "number | undefined"
         },
+        {
+          "name": "min-gap",
+          "type": "number",
+          "default": "0"
+        },
         {
           "name": "enable-range",
           "type": "boolean",
@@ -4418,6 +4511,12 @@
           "attribute": "valueHigh",
           "type": "number | undefined"
         },
+        {
+          "name": "minGap",
+          "attribute": "min-gap",
+          "type": "number",
+          "default": "0"
+        },
         {
           "name": "enableRange",
           "attribute": "enable-range",
@@ -5177,6 +5276,17 @@
         }
       ]
     },
+    {
+      "name": "umb-scrollable-container",
+      "path": "./src/packages/core/components/scrollable-container/scrollable-container.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
+        }
+      ]
+    },
     {
       "name": "umb-split-panel",
       "path": "./src/packages/core/components/split-panel/split-panel.element.ts",
@@ -6089,12 +6199,23 @@
       "name": "umb-ui-culture-input",
       "path": "./src/packages/core/localization/components/ui-culture-input/ui-culture-input.element.ts",
       "attributes": [
+        {
+          "name": "label",
+          "type": "string",
+          "default": "\"\""
+        },
         {
           "name": "value",
           "type": "string | undefined"
         }
       ],
       "properties": [
+        {
+          "name": "label",
+          "attribute": "label",
+          "type": "string",
+          "default": "\"\""
+        },
         {
           "name": "value",
           "attribute": "value",
@@ -6616,6 +6737,11 @@
         {
           "name": "notificationHandler",
           "type": "UmbNotificationHandler"
+        },
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
         }
       ]
     },
@@ -8761,7 +8887,9 @@
           "type": "array",
           "default": "[\"UmbTextStyles\",null]"
         }
-      ]
+      ],
+      "deprecated": true,
+      "deprecatedMessage": "Use the `Umb.EntityAction.DocumentBlueprint.Create` entity action with `entityCreateOptionAction` extensions instead. Scheduled for removal in Umbraco 19."
     },
     {
       "name": "umb-document-blueprint-create-options-modal",
@@ -8772,12 +8900,25 @@
           "type": "array",
           "default": "[\"UmbTextStyles\",null]"
         }
-      ]
+      ],
+      "deprecated": true,
+      "deprecatedMessage": "Use the `Umb.EntityAction.DocumentBlueprint.Create` entity action with `entityCreateOptionAction` extensions instead. Scheduled for removal in Umbraco 19."
     },
     {
       "name": "umb-document-blueprint-folder-workspace-editor",
       "path": "./src/packages/documents/document-blueprints/tree/folder/workspace/document-blueprint-folder-editor.element.ts"
     },
+    {
+      "name": "umb-document-blueprint-tree-item-table-collection-view",
+      "path": "./src/packages/documents/document-blueprints/tree/tree-item-children/collection/views/document-blueprint-tree-item-table-collection-view.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-document-blueprint-workspace-editor",
       "path": "./src/packages/documents/document-blueprints/workspace/document-blueprint-workspace-editor.element.ts",
@@ -8800,6 +8941,17 @@
         }
       ]
     },
+    {
+      "name": "umb-document-blueprint-workspace-view-info",
+      "path": "./src/packages/documents/document-blueprints/workspace/views/info/document-blueprint-workspace-view-info.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
+        }
+      ]
+    },
     {
       "name": "umb-dashboard-redirect-management",
       "path": "./src/packages/documents/document-redirect-management/dashboard-redirect-management.element.ts",
@@ -13148,10 +13300,13 @@
       "name": "umb-create-member-collection-action",
       "path": "./src/packages/members/member/collection/action/create-member-collection-action.element.ts",
       "properties": [
+        {
+          "name": "manifest"
+        },
         {
           "name": "styles",
           "type": "array",
-          "default": "[\"UmbTextStyles\",null]"
+          "default": "[null]"
         }
       ]
     },
@@ -13371,6 +13526,17 @@
       "name": "umb-member-picker-search-result-item",
       "path": "./src/packages/members/member/picker/member-picker-search-result-item.element.ts"
     },
+    {
+      "name": "umb-member-profile-data-workspace-info-app",
+      "path": "./src/packages/members/member/profile-data/info-app/member-profile-data-workspace-info-app.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
+        }
+      ]
+    },
     {
       "name": "umb-property-editor-ui-member-picker",
       "path": "./src/packages/members/member/property-editor/member-picker/property-editor-ui-member-picker.element.ts",
@@ -15298,6 +15464,56 @@
         }
       ]
     },
+    {
+      "name": "umb-property-editor-ui-decimal",
+      "path": "./src/packages/property-editors/number/property-editor-ui-decimal.element.ts",
+      "description": "Decimal variant of the number property editor UI. Overrides the default\nstep to 0.000001 — matching the six decimal places supported by the\nunderlying `DECIMAL(38,6)` database column — so values with fractional\nparts are accepted by the input when no step is configured.",
+      "attributes": [
+        {
+          "name": "readonly",
+          "description": "Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.",
+          "type": "boolean",
+          "default": "\"false\""
+        },
+        {
+          "name": "mandatory",
+          "description": "Sets the input to mandatory, meaning validation will fail if the value is empty.",
+          "type": "boolean"
+        },
+        {
+          "name": "mandatoryMessage",
+          "default": "\"UMB_VALIDATION_EMPTY_LOCALIZATION_KEY\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "readonly",
+          "attribute": "readonly",
+          "description": "Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.",
+          "type": "boolean",
+          "default": "\"false\""
+        },
+        {
+          "name": "mandatory",
+          "attribute": "mandatory",
+          "description": "Sets the input to mandatory, meaning validation will fail if the value is empty.",
+          "type": "boolean"
+        },
+        {
+          "name": "mandatoryMessage",
+          "attribute": "mandatoryMessage",
+          "default": "\"UMB_VALIDATION_EMPTY_LOCALIZATION_KEY\""
+        },
+        {
+          "name": "config"
+        },
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[null]"
+        }
+      ]
+    },
     {
       "name": "umb-property-editor-ui-number",
       "path": "./src/packages/property-editors/number/property-editor-ui-number.element.ts",
@@ -16284,12 +16500,25 @@
           "type": "array",
           "default": "[null]"
         }
-      ]
+      ],
+      "deprecated": true,
+      "deprecatedMessage": "Use the `Umb.EntityAction.PartialView.Create` entity action with `entityCreateOptionAction` extensions instead. Scheduled for removal in Umbraco 19."
     },
     {
       "name": "umb-partial-view-folder-workspace-editor",
       "path": "./src/packages/templating/partial-views/tree/folder/workspace/partial-view-folder-workspace-editor.element.ts"
     },
+    {
+      "name": "umb-partial-view-tree-item-table-collection-view",
+      "path": "./src/packages/templating/partial-views/tree/tree-item-children/collection/views/partial-view-tree-item-table-collection-view.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-partial-view-workspace-editor",
       "path": "./src/packages/templating/partial-views/workspace/partial-view-workspace-editor.element.ts",
@@ -16303,12 +16532,25 @@
     },
     {
       "name": "umb-script-create-options-modal",
-      "path": "./src/packages/templating/scripts/entity-actions/create/options-modal/script-create-options-modal.element.ts"
+      "path": "./src/packages/templating/scripts/entity-actions/create/options-modal/script-create-options-modal.element.ts",
+      "deprecated": true,
+      "deprecatedMessage": "Use the `Umb.EntityAction.Script.Create` entity action with `entityCreateOptionAction` extensions instead. Scheduled for removal in Umbraco 19."
     },
     {
       "name": "umb-script-folder-workspace-editor",
       "path": "./src/packages/templating/scripts/tree/folder/workspace/script-folder-workspace-editor.element.ts"
     },
+    {
+      "name": "umb-script-tree-item-table-collection-view",
+      "path": "./src/packages/templating/scripts/tree/tree-item-children/collection/views/script-tree-item-table-collection-view.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-script-workspace-editor",
       "path": "./src/packages/templating/scripts/workspace/script-workspace-editor.element.ts",
@@ -16433,6 +16675,17 @@
       "name": "umb-stylesheet-folder-workspace-editor",
       "path": "./src/packages/templating/stylesheets/tree/folder/workspace/stylesheet-folder-workspace-editor.element.ts"
     },
+    {
+      "name": "umb-stylesheet-tree-item-table-collection-view",
+      "path": "./src/packages/templating/stylesheets/tree/tree-item-children/collection/views/stylesheet-tree-item-table-collection-view.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-stylesheet-workspace-editor",
       "path": "./src/packages/templating/stylesheets/workspace/stylesheet-workspace-editor.element.ts",
@@ -16659,6 +16912,17 @@
         }
       ]
     },
+    {
+      "name": "umb-template-tree-item-table-collection-view",
+      "path": "./src/packages/templating/templates/tree/tree-item-children/collection/views/template-tree-item-table-collection-view.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-template-workspace-editor",
       "path": "./src/packages/templating/templates/workspace/template-workspace-editor.element.ts",
@@ -17813,6 +18077,17 @@
         }
       ]
     },
+    {
+      "name": "umb-user-group-workspace-users",
+      "path": "./src/packages/user/user-group/workspace/user-group/components/user-group-workspace-users.element.ts",
+      "properties": [
+        {
+          "name": "styles",
+          "type": "array",
+          "default": "[\"UmbTextStyles\",null]"
+        }
+      ]
+    },
     {
       "name": "umb-user-group-workspace-editor",
       "path": "./src/packages/user/user-group/workspace/user-group/user-group-workspace-editor.element.ts",

package/dist-cms/apps/app/app-error.element.js

@@ -150,7 +150,7 @@ let UmbAppErrorElement = class UmbAppErrorElement extends UmbLitElement {
 					<div slot="headline">
 						${this.errorHeadline
             ? this.errorHeadline
-            : html ` <umb-localize key="errors_defaultError">An unknown failure has occured</umb-localize> `}
+            : html ` <umb-localize key="errors_defaultError">An unknown failure has occurred</umb-localize> `}
 					</div>
 					<div id="message">${this.errorMessage}</div>
 					${this.error

package/dist-cms/apps/app/app.element.js

@@ -18,17 +18,59 @@ import { UmbLitElement } from '../../packages/core/lit-element/index.js';
 import { pathWithoutBasePath } from '../../packages/core/router/index.js';
 import { RuntimeLevelModel } from '../../packages/core/backend-api/index.js';
 import { UmbContextDebugController } from '../../packages/core/debug/index.js';
-import { UmbBundleExtensionInitializer, UmbServerExtensionRegistrator } from '../../libs/extension-api/index.js';
+import { UmbBundleExtensionInitializer, UmbServerExtensionRegistrator, } from '../../libs/extension-api/index.js';
 import { UmbAppEntryPointExtensionInitializer, umbExtensionsRegistry, } from '../../packages/core/extension-registry/index.js';
-import { firstValueFrom } from '../../external/rxjs/index.js';
 import { redirectToStoredPath } from '../../packages/core/utils/index.js';
 import { umbHttpClient } from '../../packages/core/http-client/index.js';
 import { UmbViewContext } from '../../packages/core/view/index.js';
 import './app-logo.element.js';
+import { UMB_CURRENT_USER_CONTEXT } from '../../packages/user/current-user/index.js';
+const CORE_PACKAGES = [
+    import('../../packages/block/umbraco-package.js'),
+    import('../../packages/clipboard/umbraco-package.js'),
+    import('../../packages/code-editor/umbraco-package.js'),
+    import('../../packages/content/umbraco-package.js'),
+    import('../../packages/data-type/umbraco-package.js'),
+    import('../../packages/dictionary/umbraco-package.js'),
+    import('../../packages/documents/umbraco-package.js'),
+    import('../../packages/embedded-media/umbraco-package.js'),
+    import('../../packages/extension-insights/umbraco-package.js'),
+    import('../../packages/health-check/umbraco-package.js'),
+    import('../../packages/help/umbraco-package.js'),
+    import('../../packages/language/umbraco-package.js'),
+    import('../../packages/log-viewer/umbraco-package.js'),
+    import('../../packages/management-api/umbraco-package.js'),
+    import('../../packages/markdown-editor/umbraco-package.js'),
+    import('../../packages/media/umbraco-package.js'),
+    import('../../packages/members/umbraco-package.js'),
+    import('../../packages/models-builder/umbraco-package.js'),
+    import('../../packages/multi-url-picker/umbraco-package.js'),
+    import('../../packages/packages/umbraco-package.js'),
+    import('../../packages/performance-profiling/umbraco-package.js'),
+    import('../../packages/property-editors/umbraco-package.js'),
+    import('../../packages/publish-cache/umbraco-package.js'),
+    import('../../packages/relations/umbraco-package.js'),
+    import('../../packages/rte/umbraco-package.js'),
+    import('../../packages/settings/umbraco-package.js'),
+    import('../../packages/static-file/umbraco-package.js'),
+    import('../../packages/sysinfo/umbraco-package.js'),
+    import('../../packages/tags/umbraco-package.js'),
+    import('../../packages/telemetry/umbraco-package.js'),
+    import('../../packages/templating/umbraco-package.js'),
+    import('../../packages/tiptap/umbraco-package.js'),
+    import('../../packages/translation/umbraco-package.js'),
+    import('../../packages/ufm/umbraco-package.js'),
+    import('../../packages/umbraco-news/umbraco-package.js'),
+    import('../../packages/user/umbraco-package.js'),
+    import('../../packages/webhook/umbraco-package.js'),
+];
 let UmbAppElement = class UmbAppElement extends UmbLitElement {
     #authContext;
     #serverConnection;
     #authController;
+    #bundleInitializer;
+    #currentUser;
+    #packageModules;
     constructor() {
         super();
         /**
@@ -120,15 +162,21 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
             {
                 path: '**',
                 component: () => import('../backoffice/backoffice.element.js'),
-                guards: [this.#isAuthorizedGuard()],
+                guards: [this.#isAuthorizedGuard(), this.#loadedGuard()],
             },
         ];
         this.#authController = new UmbAppAuthController(this);
-        new UmbBundleExtensionInitializer(this, umbExtensionsRegistry);
+        this.#bundleInitializer = new UmbBundleExtensionInitializer(this, umbExtensionsRegistry);
         new UUIIconRegistryEssential().attach(this);
         new UmbContextDebugController(this);
         new UmbNetworkConnectionStatusManager(this);
         new UmbViewContext(this, null);
+        this.consumeContext(UMB_CURRENT_USER_CONTEXT, (userContext) => {
+            this.#currentUser = userContext;
+            if (userContext) {
+                this.#loadCurrentUser();
+            }
+        });
     }
     connectedCallback() {
         super.connectedCallback();
@@ -137,6 +185,18 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
     async #setup() {
         this.#authContext = new UmbAuthContext(this, this.serverUrl, this.backofficePath, this.bypassAuth, this.keepUserLoggedIn);
         this.#authContext.configureClient(umbHttpClient);
+        this.observe(this.#authContext.isAuthorized, async (isAuthorized) => {
+            if (isAuthorized === undefined)
+                return;
+            if (isAuthorized) {
+                // TODO: Remove dependency on current user context from the app element in future [MR]
+                this.#loadCurrentUser();
+            }
+            else {
+                // TODO: Unregistering all extensions from v.18 [NL]
+                //void this.#unregisterExtensions();
+            }
+        }, null);
         this.#serverConnection = await new UmbServerConnection(this, this.serverUrl).connect();
         new UmbServerContext(this, {
             backofficePath: this.backofficePath,
@@ -147,8 +207,7 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
         onInit(this, umbExtensionsRegistry);
         // Register public extensions (login extensions)
         await new UmbServerExtensionRegistrator(this, umbExtensionsRegistry).registerPublicExtensions();
-        const initializer = new UmbAppEntryPointExtensionInitializer(this, umbExtensionsRegistry);
-        await firstValueFrom(initializer.loaded);
+        new UmbAppEntryPointExtensionInitializer(this, umbExtensionsRegistry);
         // Try to initialise the auth flow and get the runtime status
         try {
             // If the runtime level is "install" or ?status=false is set, we should clear any cached tokens
@@ -198,6 +257,30 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
         // Auth context configures umbHttpClient in its constructor, so we only need to set initial state
         await this.#authContext.setInitialState();
     }
+    async #registerExtensions() {
+        if (this.#packageModules === undefined) {
+            this.#packageModules = Promise.all(CORE_PACKAGES);
+            this.#packageModules.then(() => {
+                this.#loadCurrentUser();
+            });
+        }
+        umbExtensionsRegistry.registerMany((await this.#packageModules).flatMap((modules) => modules.extensions));
+    }
+    // TODO (V18): Unregister extensions on sign-out. [NL]
+    /*
+        async #unregisterExtensions() {
+            if (!this.#packageModules) return;
+            (await this.#packageModules).forEach((packageModule) => {
+                const aliases = packageModule.extensions.map((extension) => extension.alias);
+                umbExtensionsRegistry.unregisterMany(aliases);
+            });
+        }
+    */
+    #loadCurrentUser() {
+        if (!this.#currentUser || !this.#packageModules)
+            return;
+        this.#currentUser.load();
+    }
     #redirect() {
         const pathname = pathWithoutBasePath({ start: true, end: false });
         // If we are on the oauth_complete or error page, we should not redirect
@@ -238,6 +321,20 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
     #isAuthorizedGuard() {
         return () => this.#authController.isAuthorized() ?? false;
     }
+    #loadedGuard() {
+        return async () => {
+            const results = await Promise.allSettled([
+                this.observe(this.#bundleInitializer?.loaded).asPromise(),
+                this.#registerExtensions(),
+                new UmbServerExtensionRegistrator(this, umbExtensionsRegistry).registerPrivateExtensions(),
+            ]);
+            const result = results.reduce((acc, curr) => acc && curr.status === 'fulfilled', true);
+            if (result === false) {
+                this.#errorPage('Extensions failed loading, this might be due to a network issue or a server error. Check that extensions registered on the server are valid.', undefined, { headline: 'Failed to load extensions' });
+            }
+            return result;
+        };
+    }
     #errorPage(errorMsg, error, options) {
         // Redirect to the error page
         this._routes = [
@@ -258,7 +355,9 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
         this.requestUpdate();
     }
     render() {
-        return html `<umb-router-slot id="router-slot" .routes=${this._routes}></umb-router-slot>`;
+        return html `<umb-router-slot id="router-slot" .routes=${this._routes}
+			><div id="loader"><uui-loader data-mark="app-router-loader"></uui-loader></div
+		></umb-router-slot>`;
     }
     static { this.styles = css `
 		:host {
@@ -272,6 +371,20 @@ let UmbAppElement = class UmbAppElement extends UmbLitElement {
 			width: 100%;
 			height: 100vh;
 		}
+
+		#loader {
+			display: flex;
+			height: 100%;
+			justify-content: center;
+			align-items: center;
+			opacity: 0;
+			animation: fadeIn 240ms forwards;
+		}
+		@keyframes fadeIn {
+			to {
+				opacity: 1;
+			}
+		}
 	`; }
 };
 __decorate([

package/dist-cms/apps/backoffice/backoffice.context.js

@@ -6,7 +6,6 @@ import { UmbContextBase } from '../../libs/class-api/index.js';
 import { UmbContextToken } from '../../libs/context-api/index.js';
 import { UmbExtensionsManifestInitializer } from '../../libs/extension-api/index.js';
 import { UmbSysinfoRepository } from '../../packages/sysinfo/index.js';
-import { UMB_AUTH_CONTEXT } from '../../packages/core/auth/index.js';
 import { UMB_CURRENT_USER_CONTEXT } from '../../packages/user/current-user/index.js';
 export class UmbBackofficeContext extends UmbContextBase {
     #activeSectionAlias;
@@ -22,14 +21,7 @@ export class UmbBackofficeContext extends UmbContextBase {
         this.allowedSections = this.#allowedSections.asObservable();
         this.#version = new UmbStringState(undefined);
         this.version = this.#version.asObservable();
-        // TODO: We need to ensure this request is called every time the user logs in, but this should be done somewhere across the app and not here [JOV]
-        this.consumeContext(UMB_AUTH_CONTEXT, (authContext) => {
-            this.observe(authContext?.isAuthorized, (isAuthorized) => {
-                if (!isAuthorized)
-                    return;
-                this.#getVersion();
-            });
-        });
+        this.#getVersion();
         this.consumeContext(UMB_CURRENT_USER_CONTEXT, (userContext) => {
             this.observe(userContext?.allowedSections, (allowedSections) => {
                 if (!allowedSections)