@umbraco-cms/backoffice 14.0.0--preview004-b3446294 → 14.0.0--preview003

package/dist-cms/packages/users/users/workspace/user-workspace-editor.element.js

@@ -4,8 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { getDisplayStateFromUserStatus } from '../../utils.js';
-import { UmbUserRepository } from '../index.js';
+import { getLookAndColorFromUserStatus } from '../../utils.js';
 import { UUIInputEvent } from '../../../../external/uui/index.js';
 import { css, html, nothing, customElement, state, ifDefined, repeat, } from '../../../../external/lit/index.js';
 import { firstValueFrom } from '../../../../external/rxjs/index.js';
@@ -13,7 +12,9 @@ import { UMB_CHANGE_PASSWORD_MODAL } from '../../../core/modal/index.js';
 import { UmbLitElement } from '../../../../shared/lit-element/index.js';
 import { UMB_WORKSPACE_CONTEXT } from '../../../core/workspace/index.js';
 import { UserStateModel } from '../../../../external/backend-api/index.js';
+import { createExtensionClass } from '../../../../libs/extension-api/index.js';
 import { umbExtensionsRegistry } from '../../../core/extension-registry/index.js';
+import { UmbObserverController } from '../../../../libs/observable-api/index.js';
 import { UMB_AUTH } from '../../../../shared/auth/index.js';
 import { UmbTextStyles } from '../../../../shared/style/index.js';
 export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement extends UmbLitElement {
@@ -24,7 +25,6 @@ export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement e
     constructor() {
         super();
         this.languages = [];
-        this.#userRepository = new UmbUserRepository(this);
         this.consumeContext(UMB_AUTH, (instance) => {
             this.#auth = instance;
             this.#observeCurrentUser();
@@ -33,6 +33,18 @@ export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement e
             this.#workspaceContext = workspaceContext;
             this.#observeUser();
         });
+        // TODO: this code is reused in multiple places, so it should be extracted to a function
+        new UmbObserverController(this, umbExtensionsRegistry.getByTypeAndAlias('repository', 'Umb.Repository.User'), async (repositoryManifest) => {
+            if (!repositoryManifest)
+                return;
+            try {
+                const result = await createExtensionClass(repositoryManifest, [this]);
+                this.#userRepository = result;
+            }
+            catch (error) {
+                throw new Error('Could not create repository with alias: Umb.Repository.User');
+            }
+        });
     }
     #observeUser() {
         if (!this.#workspaceContext)
@@ -140,63 +152,52 @@ export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement e
             return nothing;
         return html ` <uui-box>
 				<div slot="headline"><umb-localize key="user_profile">Profile</umb-localize></div>
-				<umb-workspace-property-layout label="${this.localize.term('general_email')}">
-					<uui-input
-						slot="editor"
-						name="email"
-						label="${this.localize.term('general_email')}"
-						readonly
-						value=${ifDefined(this._user.email)}></uui-input>
+				<umb-workspace-property-layout label="Email">
+					<uui-input slot="editor" name="email" label="email" readonly value=${ifDefined(this._user.email)}></uui-input>
 				</umb-workspace-property-layout>
-				<umb-workspace-property-layout
-					label="${this.localize.term('user_language')}"
-					description=${this.localize.term('user_languageHelp')}>
+				<umb-workspace-property-layout label="Language" description="The language of the UI in the Backoffice">
 					<uui-select
 						slot="editor"
 						name="language"
-						label="${this.localize.term('user_language')}"
+						label="language"
 						.options=${this.languages}
 						@change="${this.#onLanguageChange}">
 					</uui-select>
 				</umb-workspace-property-layout>
 			</uui-box>
 			<uui-box>
-				<div slot="headline"><umb-localize key="user_assignAccess">Assign Access</umb-localize></div>
+				<div slot="headline">Assign access</div>
 				<div id="assign-access">
-					<umb-workspace-property-layout
-						label="${this.localize.term('general_groups')}"
-						description="${this.localize.term('user_groupsHelp')}">
+					<umb-workspace-property-layout label="Groups" description="Add groups to assign access and permissions">
 						<umb-user-group-input
 							slot="editor"
 							.selectedIds=${this._user.userGroupIds ?? []}
 							@change=${(e) => this.#onUserGroupsChange(e.target.selectedIds)}></umb-user-group-input>
 					</umb-workspace-property-layout>
 					<umb-workspace-property-layout
-						label=${this.localize.term('user_startnodes')}
-						description=${this.localize.term('user_startnodeshelp')}>
+						label="Content start node"
+						description="Limit the content tree to specific start nodes">
 						<umb-property-editor-ui-document-picker
 							.value=${this._user.contentStartNodeIds ?? []}
 							@property-value-change=${(e) => this.#workspaceContext?.updateProperty('contentStartNodeIds', e.target.value)}
 							slot="editor"></umb-property-editor-ui-document-picker>
 					</umb-workspace-property-layout>
 					<umb-workspace-property-layout
-						label=${this.localize.term('user_mediastartnodes')}
-						description=${this.localize.term('user_mediastartnodeshelp')}>
+						label="Media start nodes"
+						description="Limit the media library to specific start nodes">
 						<b slot="editor">NEED MEDIA PICKER</b>
 					</umb-workspace-property-layout>
 				</div>
 			</uui-box>
-			<uui-box headline=${this.localize.term('user_access')}>
+			<uui-box headline="Access">
 				<div slot="header" class="faded-text">
-					<umb-localize key="user_accessHelp"
-						>Based on the assigned groups and start nodes, the user has access to the following nodes</umb-localize
-					>
+					Based on the assigned groups and start nodes, the user has access to the following nodes
 				</div>
 
-				<b><umb-localize key="sections_content">Content</umb-localize></b>
+				<b>Content</b>
 				${this.#renderContentStartNodes()}
 				<hr />
-				<b><umb-localize key="sections_media">Media</umb-localize></b>
+				<b>Media</b>
 				<uui-ref-node name="Media Root">
 					<uui-icon slot="icon" name="folder"></uui-icon>
 				</uui-ref-node>
@@ -205,42 +206,41 @@ export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement e
     #renderRightColumn() {
         if (!this._user || !this.#workspaceContext)
             return nothing;
-        const displayState = getDisplayStateFromUserStatus(this._user.state);
+        const statusLook = getLookAndColorFromUserStatus(this._user.state);
         return html ` <uui-box>
 			<div id="user-info">
 				<uui-avatar .name=${this._user?.name || ''}></uui-avatar>
-				<uui-button label=${this.localize.term('user_changePhoto')}></uui-button>
+				<uui-button label="Change photo"></uui-button>
 				<hr />
 				${this.#renderActionButtons()}
 
 				<div>
-					<b><umb-localize key="general_status">Status</umb-localize>:</b>
-					<uui-tag look="${ifDefined(displayState?.look)}" color="${ifDefined(displayState?.color)}">
-						${this.localize.term('user_' + displayState.key)}
+					<b>Status:</b>
+					<uui-tag look="${ifDefined(statusLook?.look)}" color="${ifDefined(statusLook?.color)}">
+						${this._user.state}
 					</uui-tag>
 				</div>
 
 				${this._user?.state === UserStateModel.INVITED
             ? html `
-							<uui-textarea placeholder=${this.localize.term('placeholders_enterMessage')}></uui-textarea>
-							<uui-button look="primary" label=${this.localize.term('actions_resendInvite')}></uui-button>
+							<uui-textarea placeholder="Enter a message..."> </uui-textarea>
+							<uui-button look="primary" label="Resend invitation"></uui-button>
 					  `
             : nothing}
-				${this.#renderInfoItem('user_lastLogin', this.localize.date(this._user.lastLoginDate) ||
-            `${this._user.name + ' ' + this.localize.term('user_noLogin')} `)}
-				${this.#renderInfoItem('user_failedPasswordAttempts', this._user.failedLoginAttempts)}
-				${this.#renderInfoItem('user_lastLockoutDate', this._user.lastLockoutDate || `${this._user.name + ' ' + this.localize.term('user_noLockouts')}`)}
-				${this.#renderInfoItem('user_lastPasswordChangeDate', this._user.lastLoginDate || `${this._user.name + ' ' + this.localize.term('user_noPasswordChange')}`)}
-				${this.#renderInfoItem('user_createDate', this.localize.date(this._user.createDate))}
-				${this.#renderInfoItem('user_updateDate', this.localize.date(this._user.updateDate))}
-				${this.#renderInfoItem('general_id', this._user.id)}
+				${this.#renderInfoItem('Last login', this._user.lastLoginDate || `${this._user.name} has not logged in yet`)}
+				${this.#renderInfoItem('Failed login attempts', this._user.failedLoginAttempts)}
+				${this.#renderInfoItem('Last lockout date', this._user.lastLockoutDate || `${this._user.name} has not been locked out`)}
+				${this.#renderInfoItem('Password last changed', this._user.lastLoginDate || `${this._user.name} has not changed password`)}
+				${this.#renderInfoItem('User created', this._user.createDate)}
+				${this.#renderInfoItem('User last updated', this._user.updateDate)}
+				${this.#renderInfoItem('Key', this._user.id)}
 			</div>
 		</uui-box>`;
     }
-    #renderInfoItem(labelkey, value) {
+    #renderInfoItem(label, value) {
         return html `
 			<div>
-				<b><umb-localize key=${labelkey}></umb-localize></b>
+				<b>${label}</b>
 				<span>${value}</span>
 			</div>
 		`;
@@ -251,40 +251,23 @@ export let UmbUserWorkspaceEditorElement = class UmbUserWorkspaceEditorElement e
         //TODO: Find out if the current user is an admin. If not, show no buttons.
         // if (this._currentUserStore?.isAdmin === false) return nothing;
         const buttons = [];
-        if (this._user.id !== this._currentUser?.id) {
-            if (this._user.state === UserStateModel.DISABLED) {
-                buttons.push(html `
-					<uui-button
-						@click=${this.#onUserStatusChange}
-						look="secondary"
-						color="positive"
-						label=${this.localize.term('actions_enable')}></uui-button>
-				`);
-            }
-            if (this._user.state === UserStateModel.ACTIVE || this._user.state === UserStateModel.INACTIVE) {
-                buttons.push(html `
-					<uui-button
-						@click=${this.#onUserStatusChange}
-						look="secondary"
-						color="warning"
-						label=${this.localize.term('actions_disable')}></uui-button>
-				`);
-            }
+        if (this._user.state === UserStateModel.DISABLED) {
+            buttons.push(html `
+				<uui-button @click=${this.#onUserStatusChange} look="secondary" color="positive" label="Enable"></uui-button>
+			`);
+        }
+        if (this._user.state === UserStateModel.ACTIVE || this._user.state === UserStateModel.INACTIVE) {
+            buttons.push(html `
+				<uui-button @click=${this.#onUserStatusChange} look="secondary" color="warning" label="Disable"></uui-button>
+			`);
         }
         if (this._currentUser?.id !== this._user?.id) {
             const button = html `
-				<uui-button
-					@click=${this.#onUserDelete}
-					look="secondary"
-					color="danger"
-					label=${this.localize.term('user_deleteUser')}></uui-button>
+				<uui-button @click=${this.#onUserDelete} look="secondary" color="danger" label="Delete User"></uui-button>
 			`;
             buttons.push(button);
         }
-        buttons.push(html `<uui-button
-				@click=${this.#onPasswordChange}
-				look="secondary"
-				label=${this.localize.term('general_changePassword')}></uui-button>`);
+        buttons.push(html `<uui-button @click=${this.#onPasswordChange} look="secondary" label="Change password"></uui-button>`);
         return buttons;
     }
     #renderContentStartNodes() {

package/dist-cms/packages/users/utils.d.ts

@@ -1,9 +1,6 @@
 import { InterfaceColor, InterfaceLook } from '../../external/uui/index.js';
 import { UserStateModel } from '../../external/backend-api/index.js';
-interface DisplayStatus {
+export declare const getLookAndColorFromUserStatus: (status?: UserStateModel) => {
     look: InterfaceLook;
     color: InterfaceColor;
-    key: string;
-}
-export declare const getDisplayStateFromUserStatus: (status?: UserStateModel) => DisplayStatus;
-export {};
+};

package/dist-cms/packages/users/utils.js

@@ -1,14 +1,14 @@
-const userStates = [
-    { "key": "All", color: "positive", look: "secondary" },
-    { "key": "Active", "color": "positive", look: "primary" },
-    { "key": "Disabled", "color": "danger", look: "primary" },
-    { "key": "LockedOut", "color": "danger", look: "secondary" },
-    { "key": "Invited", "color": "warning", look: "primary" },
-    { "key": "Inactive", "color": "warning", look: "primary" }
-];
-export const getDisplayStateFromUserStatus = (status) => userStates
-    .filter(state => state.key === status)
-    .map(state => ({
-    ...state,
-    key: 'state' + state.key
-}))[0];
+import { UserStateModel } from '../../external/backend-api/index.js';
+export const getLookAndColorFromUserStatus = (status) => {
+    switch (status) {
+        case UserStateModel.INACTIVE:
+        case UserStateModel.INVITED:
+            return { look: 'primary', color: 'warning' };
+        case UserStateModel.ACTIVE:
+            return { look: 'primary', color: 'positive' };
+        case UserStateModel.DISABLED:
+            return { look: 'primary', color: 'danger' };
+        default:
+            return { look: 'secondary', color: 'default' };
+    }
+};

package/dist-cms/shared/auth/auth-flow.d.ts

@@ -59,6 +59,10 @@ export declare class UmbAuthFlow {
      * saved the state in local storage before redirecting the user to the login page.
      */
     completeAuthorizationIfPossible(): Promise<void>;
+    /**
+     * This method will query the server for the service configuration usually found at /.well-known/openid-configuration.
+     */
+    fetchServiceConfiguration(): Promise<void>;
     /**
      * This method will make an authorization request to the server.
      *

package/dist-cms/shared/auth/auth-flow.js

@@ -69,6 +69,7 @@ export class UmbAuthFlow {
     #storageBackend;
     // state
     #configuration;
+    #openIdConnectUrl;
     #redirectUri;
     #clientId;
     #scope;
@@ -76,15 +77,10 @@ export class UmbAuthFlow {
     #refreshToken;
     #accessTokenResponse;
     constructor(openIdConnectUrl, redirectUri, clientId = 'umbraco-back-office', scope = 'offline_access') {
+        this.#openIdConnectUrl = openIdConnectUrl;
         this.#redirectUri = redirectUri;
         this.#clientId = clientId;
         this.#scope = scope;
-        this.#configuration = new AuthorizationServiceConfiguration({
-            authorization_endpoint: `${openIdConnectUrl}/umbraco/management/api/v1/security/back-office/authorize`,
-            token_endpoint: `${openIdConnectUrl}/umbraco/management/api/v1/security/back-office/token`,
-            revocation_endpoint: `${openIdConnectUrl}/umbraco/management/api/v1/security/back-office/revoke`,
-            end_session_endpoint: `${openIdConnectUrl}/umbraco/management/api/v1/security/back-office/signout`,
-        });
         this.#notifier = new AuthorizationNotifier();
         this.#tokenHandler = new BaseTokenRequestHandler(requestor);
         this.#storageBackend = new LocalStorageBackend();
@@ -122,6 +118,10 @@ export class UmbAuthFlow {
      * - If there is no new authorization to be made, do nothing
      */
     async setInitialState() {
+        // Ensure there is a connection to the server
+        if (!this.#configuration) {
+            await this.fetchServiceConfiguration();
+        }
         const tokenResponseJson = await this.#storageBackend.getItem(TOKEN_RESPONSE_NAME);
         if (tokenResponseJson) {
             const response = new TokenResponse(JSON.parse(tokenResponseJson));
@@ -142,12 +142,23 @@ export class UmbAuthFlow {
     completeAuthorizationIfPossible() {
         return this.#authorizationHandler.completeAuthorizationRequestIfPossible();
     }
+    /**
+     * This method will query the server for the service configuration usually found at /.well-known/openid-configuration.
+     */
+    async fetchServiceConfiguration() {
+        const response = await AuthorizationServiceConfiguration.fetchFromIssuer(this.#openIdConnectUrl, requestor);
+        this.#configuration = response;
+    }
     /**
      * This method will make an authorization request to the server.
      *
      * @param username The username to use for the authorization request. It will be provided to the OpenID server as a hint.
      */
     makeAuthorizationRequest(username) {
+        if (!this.#configuration) {
+            console.log('Unknown service configuration');
+            throw new Error('Unknown service configuration');
+        }
         const extras = { prompt: 'consent', access_type: 'offline' };
         if (username) {
             extras['login_hint'] = username;
@@ -188,6 +199,10 @@ export class UmbAuthFlow {
      * @returns The access token for the user.
      */
     async performWithFreshTokens() {
+        if (!this.#configuration) {
+            console.log('Unknown service configuration');
+            return Promise.reject('Unknown service configuration');
+        }
         if (!this.#refreshToken) {
             console.log('Missing refreshToken.');
             return Promise.resolve('Missing refreshToken.');
@@ -220,6 +235,10 @@ export class UmbAuthFlow {
      * This method will make a token request to the server using the authorization code.
      */
     async #makeRefreshTokenRequest(code, codeVerifier) {
+        if (!this.#configuration) {
+            console.log('Unknown service configuration');
+            return Promise.reject();
+        }
         const extras = {};
         if (codeVerifier) {
             extras.code_verifier = codeVerifier;

package/dist-cms/shared/repository/repository-items.manager.js

@@ -29,11 +29,6 @@ export class UmbRepositoryItemsManager {
     setUniques(uniques) {
         this.#uniques.next(uniques);
         //TODO: Check if it's safe to call requestItems here.
-        // We don't have to request items if there is no uniques.
-        if (uniques.length === 0) {
-            this.#items.next([]);
-            return;
-        }
         this.#requestItems();
     }
     getItems() {

package/dist-cms/shared/umb-events/index.d.ts

@@ -2,4 +2,3 @@ export * from './input.event.js';
 export * from './change.event.js';
 export * from './delete.event.js';
 export * from './executed.event.js';
-export * from './selected.event.js';

package/dist-cms/shared/umb-events/index.js

@@ -2,4 +2,3 @@ export * from './input.event.js';
 export * from './change.event.js';
 export * from './delete.event.js';
 export * from './executed.event.js';
-export * from './selected.event.js';

package/dist-cms/tinymce/CHANGELOG.md

@@ -6,54 +6,6 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
-## 6.7.0 - 2023-08-30
-
-### Added
-- New `help_accessibility` option displays the keyboard shortcut to open the in-application help in the status bar. #TINY-9379
-- Added a new `InsertNewBlockBefore` command which inserts an empty block before the block containing the current selection. #TINY-10022
-- Added a new `InsertNewBlockAfter` command which inserts an empty block after the block containing the current selection. #TINY-10022
-
-### Improved
-- Adding a newline after a table would, in some specific cases, not work. #TINY-9863
-- Menus now have a slight margin at the top and bottom to more clearly separate them from the frame edge. #TINY-9978
-- Updated **More** toolbar button tooltip text from *More...* to *Reveal or hide additional toolbar items*. #TINY-9629
-- Where multiple case sensitive variants of a translation key are provided, they will now all be preserved in the translation object instead of just the lowercase variant. #TINY-10115
-- Improved screen reader announcements of the column and row selection in the grid presented by the **Table** menu and toolbar item. #TINY-10140
-- Improved the keyboard focus visibility for links inside dialogs. #TINY-10124
-
-### Changed
-- Change `UndoLevelType` from `enum` to union type so that it is easier to use. #TINY-9764
-- The pattern replacement removed spaces if they were contained within a tag that only contained a space and the text to replace. #TINY-9744
-- If loading content CSS takes more than 500ms, the editor will be set to an *in progress* state until the CSS is ready. #TINY-10008
-
-### Fixed
-- Applying an ordered or unordered list to a selected checklist incorrectly turned the list into paragraphs. #TINY-9975
-- Returning an empty string in a custom context menu update function resulted in a small white line appearing on right-click and the browser-native context menu would not present. #TINY-9842
-- For sufficiently long URLs and sufficiently wide windows, URL autocompletion hid middle portions of the URL from view. #TINY-10017
-- Numeric input in toolbar items did not disable when a switching from edit to read-only mode. #TINY-10129
-- The Quick Toolbars plugin showed text alignment buttons on pagebreaks. #TINY-10054
-- Creating lists in empty blocks sometimes, and incorrectly, converted adjacent block elements into list items. #TINY-10136
-- Creating a list from multiple `<div>` elements only created a partial list. #TINY-9872
-- Tab navigation incorrectly stopped around `iframe` dialog components. #TINY-9815
-- It was possible to delete the sole empty block immediately before a `<details>` element if it was nested within another `<details>` element. #TINY-9965
-- Deleting `<li>` elements that only contained `<br>` tags sometimes caused a crash. #TINY-6888
-- It was possible to remove the `<summary>` element from a `<details>` element by dragging and dropping. #TINY-9960
-- It was possible to break `<summary>` elements if content containing block elements was dragged-and-dropped inside them. #TINY-9960
-- Contents were not removed from the drag start source if dragging and dropping internally into a transparent block element. #TINY-9960
-- Using the Media plugin unexpectedly changed `<script>` tags in the editor body to `<image>` tags. #TINY-10007
-- In some circumstances, pressing the **Enter** key scrolled the entire page. #TINY-9828
-- The border styles of a table were incorrectly split into a longhand form after table dialog updates. #TINY-9843
-- Links in **Help → Help → Plugins** and **Help → Help → Version** were not navigable by keyboard. #TINY-10071
-- Fixed the inability to insert content next to the `<details>` element when it is the first or last content element. Pressing the **Up** or **Down** arrow key now inserts a block element before or after the `<details>` element. #TINY-9827
-- An empty element with a `contenteditable="true"` attribute within a noneditable root was deleted when the Backspace key was pressed. #TINY-10011
-- The `color_cols` option was not respected when set to the value 5 with a custom `color_map` specified. #TINY-10126
-- In Safari on macOS, deleting backwards within a `<summary>` element removed the entire `<details>` element if it had no other content. #TINY-10123
-
-## 6.6.2 - 2023-08-09
-
-### Fixed
-- An "Uncaught TypeError: Cannot read properties of null" error would sometimes be thrown when updating the content of a `streamContent: true` iframe dialog component. #TINY-10128
-
 ## 6.6.1 - 2023-08-02
 
 ### Added

package/dist-cms/tinymce/composer.json

@@ -1,6 +1,6 @@
 {
 	"name": "tinymce/tinymce",
-	"version": "6.7.0",
+	"version": "6.6.1",
 	"description": "Web based JavaScript HTML WYSIWYG editor control.",
 	"license": [
 		"MIT-only"

package/dist-cms/tinymce/models/dom/model.js

@@ -1,5 +1,5 @@
 /**
- * TinyMCE version 6.7.0 (2023-08-30)
+ * TinyMCE version 6.6.1 (2023-08-02)
  */
 
 (function () {