diff --git a/src/Umbraco.Web.UI.Client/src/packages/user/user-group/workspace/user-group-workspace-editor.element.ts b/src/Umbraco.Web.UI.Client/src/packages/user/user-group/workspace/user-group-workspace-editor.element.ts index 1677018db2..99a968f205 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/user/user-group/workspace/user-group-workspace-editor.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/user/user-group/workspace/user-group-workspace-editor.element.ts @@ -1,7 +1,7 @@ import type { UmbUserGroupDetailModel } from '../index.js'; import { UMB_USER_GROUP_ENTITY_TYPE } from '../index.js'; import { UMB_USER_GROUP_WORKSPACE_CONTEXT } from './user-group-workspace.context-token.js'; -import type { UUIInputElement } from '@umbraco-cms/backoffice/external/uui'; +import type { UUIBooleanInputEvent, UUIInputElement } from '@umbraco-cms/backoffice/external/uui'; import { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui'; import { css, html, nothing, customElement, state, ifDefined } from '@umbraco-cms/backoffice/external/lit'; import { UmbLitElement, umbFocus } from '@umbraco-cms/backoffice/lit-element'; @@ -14,6 +14,7 @@ import { UMB_ICON_PICKER_MODAL, UMB_MODAL_MANAGER_CONTEXT } from '@umbraco-cms/b import './components/user-group-entity-user-permission-list.element.js'; import './components/user-group-granular-permission-list.element.js'; +import type { UmbInputLanguageElement } from '@umbraco-cms/backoffice/language'; @customElement('umb-user-group-workspace-editor') export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { @@ -29,6 +30,12 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { @state() private _sections: UmbUserGroupDetailModel['sections'] = []; + @state() + private _languages: UmbUserGroupDetailModel['languages'] = []; + + @state() + private _hasAccessToAllLanguages: UmbUserGroupDetailModel['hasAccessToAllLanguages'] = false; + @state() private _documentStartNode?: UmbUserGroupDetailModel['documentStartNode']; @@ -52,6 +59,13 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { this.observe(this.#workspaceContext.name, (value) => (this._name = value), '_observeName'); this.observe(this.#workspaceContext.icon, (value) => (this._icon = value), '_observeIcon'); this.observe(this.#workspaceContext.sections, (value) => (this._sections = value), '_observeSections'); + this.observe(this.#workspaceContext.languages, (value) => (this._languages = value), '_observeLanguages'); + this.observe( + this.#workspaceContext.hasAccessToAllLanguages, + (value) => (this._hasAccessToAllLanguages = value), + '_observeHasAccessToAllLanguages', + ); + this.observe( this.#workspaceContext.documentStartNode, (value) => (this._documentStartNode = value), @@ -70,6 +84,18 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { this.#workspaceContext?.updateProperty('sections', target.selection); } + #onAllowAllLanguagesChange(event: UUIBooleanInputEvent) { + event.stopPropagation(); + const target = event.target; + this.#workspaceContext?.updateProperty('hasAccessToAllLanguages', target.checked); + } + + #onLanguagePermissionChange(event: UmbChangeEvent) { + event.stopPropagation(); + const target = event.target as UmbInputLanguageElement; + this.#workspaceContext?.updateProperty('languages', target.selection); + } + #onDocumentStartNodeChange(event: CustomEvent) { event.stopPropagation(); const target = event.target as UmbInputDocumentElement; @@ -152,6 +178,7 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { return html`
+ @@ -160,6 +187,9 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { .selection=${this._sections} @change=${this.#onSectionsChange}> + + ${this.#renderLanguagePermissions()} + @@ -169,6 +199,7 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { .selection=${this._documentStartNode?.unique ? [this._documentStartNode.unique] : []} @change=${this.#onDocumentStartNodeChange}> + @@ -195,6 +226,31 @@ export class UmbUserGroupWorkspaceEditorElement extends UmbLitElement { `; } + #renderLanguagePermissions() { + return html` + +
+ + + ${this._hasAccessToAllLanguages === false + ? html` + + ` + : nothing} +
+
+ `; + } + #renderRightColumn() { return html`