yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move sorter config outside of class

Browse Source
This commit is contained in:
Niels Lyngsø
2024-03-06 20:08:38 +01:00
parent bb8dbb0db2
commit 4e7dda3dde
3 changed files with 38 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/Umbraco.Web.UI.Client/src/packages/documents/document-types/workspace/views/design/document-type-workspace-view-edit-properties.element.ts
View File

@@ -7,27 +7,31 @@ import { css, html, customElement, property, state, repeat, ifDefined } from '@u
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import type { UmbPropertyContainerTypes, UmbPropertyTypeModel } from '@umbraco-cms/backoffice/content-type';
import { UmbContentTypePropertyStructureHelper } from '@umbraco-cms/backoffice/content-type';
import { UmbSorterController } from '@umbraco-cms/backoffice/sorter';
import { type UmbSorterConfig, UmbSorterController } from '@umbraco-cms/backoffice/sorter';
import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
import { UMB_PROPERTY_SETTINGS_MODAL, UmbModalRouteRegistrationController } from '@umbraco-cms/backoffice/modal';
const SORTER_CONFIG: UmbSorterConfig<UmbPropertyTypeModel, UmbDocumentTypeWorkspacePropertyElement> = {
getUniqueOfElement: (element) => {
return element.getAttribute('data-umb-property-id');
},
getUniqueOfModel: (modelEntry) => {
return modelEntry.id;
},
identifier: 'document-type-property-sorter',
itemSelector: 'umb-document-type-workspace-view-edit-property',
//disabledItemSelector: '[inherited]',
//TODO: Set the property list (sorter wrapper) to inherited, if its inherited
// This is because we don't want to move local properties into an inherited group container.
// Or maybe we do, but we still need to check if the group exists locally, if not, then it needs to be created before we move a property into it.
// TODO: Fix bug where a local property turn into an inherited when moved to a new group container.
containerSelector: '#property-list',
};
@customElement('umb-document-type-workspace-view-edit-properties')
export class UmbDocumentTypeWorkspaceViewEditPropertiesElement extends UmbLitElement {
#sorter = new UmbSorterController<UmbPropertyTypeModel, UmbDocumentTypeWorkspacePropertyElement>(this, {
getUniqueOfElement: (element) => {
return element.getAttribute('data-umb-property-id');
},
getUniqueOfModel: (modelEntry) => {
return modelEntry.id;
},
identifier: 'document-type-property-sorter',
itemSelector: 'umb-document-type-workspace-view-edit-property',
//disabledItemSelector: '[inherited]',
//TODO: Set the property list (sorter wrapper) to inherited, if its inherited
// This is because we don't want to move local properties into an inherited group container.
// Or maybe we do, but we still need to check if the group exists locally, if not, then it needs to be created before we move a property into it.
// TODO: Fix bug where a local property turn into an inherited when moved to a new group container.
containerSelector: '#property-list',
...SORTER_CONFIG,
onChange: ({ model }) => {
this._propertyStructure = model;
},
@@ -158,8 +162,8 @@ export class UmbDocumentTypeWorkspaceViewEditPropertiesElement extends UmbLitEle
new UmbModalRouteRegistrationController(this, UMB_PROPERTY_SETTINGS_MODAL)
.addAdditionalPath('new-property')
.onSetup(async () => {
const documentTypeId = this._ownerDocumentTypes?.find(
(types) => types.containers?.find((containers) => containers.id === this.containerId),
const documentTypeId = this._ownerDocumentTypes?.find((types) =>
types.containers?.find((containers) => containers.id === this.containerId),
)?.unique;
if (documentTypeId === undefined) return false;
const propertyData = await this._propertyStructureHelper.createPropertyScaffold(this._containerId);
@@ -189,8 +193,8 @@ export class UmbDocumentTypeWorkspaceViewEditPropertiesElement extends UmbLitEle
(property) => '' + property.container?.id + property.id + '' + property.sortOrder,
(property) => {
// Note: This piece might be moved into the property component
const inheritedFromDocument = this._ownerDocumentTypes?.find(
(types) => types.containers?.find((containers) => containers.id === property.container?.id),
const inheritedFromDocument = this._ownerDocumentTypes?.find((types) =>
types.containers?.find((containers) => containers.id === property.container?.id),
);
return html`
@@ -220,7 +224,7 @@ export class UmbDocumentTypeWorkspaceViewEditPropertiesElement extends UmbLitEle
look="placeholder"
href=${ifDefined(this._modalRouteNewProperty)}>
<umb-localize key="contentTypeEditor_addProperty">Add property</umb-localize>
</uui-button> `
</uui-button> `
: ''}
`;
}

21
src/Umbraco.Web.UI.Client/src/packages/documents/document-types/workspace/views/design/document-type-workspace-view-edit-tab.element.ts
View File

@@ -12,19 +12,24 @@ import {
import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
import './document-type-workspace-view-edit-properties.element.js';
import { UmbSorterController } from '@umbraco-cms/backoffice/sorter';
import { type UmbSorterConfig, UmbSorterController } from '@umbraco-cms/backoffice/sorter';
const SORTER_CONFIG: UmbSorterConfig<UmbPropertyTypeContainerModel, UmbDocumentTypeWorkspaceViewEditPropertiesElement> =
{
getUniqueOfElement: (element) =>
element.querySelector('umb-document-type-workspace-view-edit-properties')!.getAttribute('container-id'),
getUniqueOfModel: (modelEntry) => modelEntry.id,
identifier: 'document-type-container-sorter',
itemSelector: '.container-handle',
containerSelector: '.container-list',
};
@customElement('umb-document-type-workspace-view-edit-tab')
export class UmbDocumentTypeWorkspaceViewEditTabElement extends UmbLitElement {
#sorter = new UmbSorterController<UmbPropertyTypeContainerModel, UmbDocumentTypeWorkspaceViewEditPropertiesElement>(
this,
{
getUniqueOfElement: (element) =>
element.querySelector('umb-document-type-workspace-view-edit-properties')!.getAttribute('container-id'),
getUniqueOfModel: (modelEntry) => modelEntry.id,
identifier: 'document-type-container-sorter',
itemSelector: '.container-handle',
containerSelector: '.container-list',
...SORTER_CONFIG,
onChange: ({ model }) => {
this._groups = model;
},
@@ -173,7 +178,7 @@ export class UmbDocumentTypeWorkspaceViewEditTabElement extends UmbLitElement {
container-type="Tab"
container-name=${this.tabName || ''}></umb-document-type-workspace-view-edit-properties>
</uui-box>
`
`
: ''
}
<div class="container-list" ?sort-mode-active=${this._sortModeActive}>

2
src/Umbraco.Web.UI.Client/src/packages/documents/documents/workspace/views/edit/document-workspace-view-edit-tab.element.ts
View File

@@ -85,7 +85,7 @@ export class UmbDocumentWorkspaceViewEditTabElement extends UmbLitElement {
: ''}
${repeat(
this._groups,
(group) => group.name,
(group) => group.id,
(group) =>
html`<uui-box .headline=${group.name || ''}>
<umb-document-workspace-view-edit-properties