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

rename to property type settings modal

Browse Source
This commit is contained in:
Niels Lyngsø
2024-03-13 16:31:57 +01:00
parent 30133ca766
commit c912bbb2d0
7 changed files with 35 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/index.ts
View File

@@ -1,2 +1,2 @@
export * from './composition-picker/composition-picker-modal.token.js';
export * from './property-settings/property-settings-modal.token.js';
export * from './property-type-settings/property-type-settings-modal.token.js';

6
src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/manifests.ts
View File

@@ -9,9 +9,9 @@ const modals: Array<ManifestModal> = [
},
{
type: 'modal',
alias: 'Umb.Modal.PropertySettings',
name: 'Property Settings Modal',
js: () => import('.//property-settings/property-settings-modal.element.js'),
alias: 'Umb.Modal.PropertyTypeSettings',
name: 'Property Type Settings Modal',
js: () => import('./property-type-settings/property-type-settings-modal.element.js'),
},
];

2
src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-settings/property-settings-modal.context.ts → src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-type-settings/property-type-settings-modal.context.ts
View File

@@ -6,7 +6,7 @@ import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
export const UMB_PROPERTY_TYPE_WORKSPACE_ALIAS = 'Umb.Workspace.PropertyType';
/**
* This is a very simplified workspace context, just to serve one for the imitated property type workspace. (As its not a real workspace)
* This is a very simplified workspace context, just to serve one for the imitated property type workspace. (As its not a real workspace, but this does as well provide the ability for extension-conditions to match with this workspace, as entity type and alias is available.) [NL]
*/
export class UmbPropertyTypeWorkspaceContext
extends UmbContextBase<UmbPropertyTypeWorkspaceContext>

37
src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-settings/property-settings-modal.element.ts → src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-type-settings/property-type-settings-modal.element.ts
View File

@@ -1,8 +1,11 @@
import {
UMB_PROPERTY_TYPE_WORKSPACE_ALIAS,
UmbPropertyTypeWorkspaceContext,
} from './property-settings-modal.context.js';
import type { UmbPropertySettingsModalData, UmbPropertySettingsModalValue } from './property-settings-modal.token.js';
} from './property-type-settings-modal.context.js';
import type {
UmbPropertyTypeSettingsModalData,
UmbPropertyTypeSettingsModalValue,
} from './property-type-settings-modal.token.js';
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import type { UUIBooleanInputEvent, UUIInputEvent, UUISelectEvent } from '@umbraco-cms/backoffice/external/uui';
import type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';
@@ -10,14 +13,14 @@ import { css, html, nothing, customElement, state } from '@umbraco-cms/backoffic
import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
import { generateAlias } from '@umbraco-cms/backoffice/utils';
import { UMB_CONTENT_TYPE_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/content-type';
// TODO: Could base take a token to get its types?.
@customElement('umb-property-settings-modal')
export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
UmbPropertySettingsModalData,
UmbPropertySettingsModalValue
// TODO: Could base take a token to get its types? [NL]
@customElement('umb-property-type-settings-modal')
export class UmbPropertyTypeSettingsModalElement extends UmbModalBaseElement<
UmbPropertyTypeSettingsModalData,
UmbPropertyTypeSettingsModalValue
> {
//TODO: Should these options come from the server?
// TODO: Or should they come from a extension point?
//TODO: Should these options come from the server? [NL]
// TODO: Or should they come from a extension point? [NL]
@state() private _customValidationOptions: Array<Option> = [
{
name: 'No validation',
@@ -44,7 +47,7 @@ export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
@state() private _aliasLocked = true;
protected _originalPropertyData!: UmbPropertySettingsModalValue;
protected _originalPropertyData!: UmbPropertyTypeSettingsModalValue;
/** Indicates if the currently edited property is a new property or an existing */
#isNew = false;
@@ -92,7 +95,7 @@ export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void {
super.firstUpdated(_changedProperties);
// TODO: Make a general way to put focus on a input in a modal. (also make sure it only happens if its the top-most-modal.)
// TODO: Make a general way to put focus on a input in a modal. (also make sure it only happens if its the top-most-modal.) [NL]
requestAnimationFrame(() => {
(this.shadowRoot!.querySelector('#name-input') as HTMLElement).focus();
});
@@ -116,7 +119,7 @@ export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
this.updateValue({ name: event.target.value.toString() });
if (this._aliasLocked) {
const expectedOldAlias = generateAlias(oldName ?? '');
// Only update the alias if the alias matches a generated alias of the old name (otherwise the alias is considered one written by the user.)
// Only update the alias if the alias matches a generated alias of the old name (otherwise the alias is considered one written by the user.) [NL]
if (expectedOldAlias === oldAlias) {
this.updateValue({ alias: generateAlias(this.value.name ?? '') });
}
@@ -215,9 +218,9 @@ export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
});
}
// TODO: This would conceptually be a Property Type Workspace, should be changed at one point in the future.
// For now this is hacky made available by giving the element an fixed alias.
// This would allow for workspace views and workspace actions.
// TODO: This would conceptually be a Property Type Workspace, should be changed at one point in the future. [NL]
// For now this is hacky made available by giving the element an fixed alias. [NL]
// This would allow for workspace views and workspace actions. [NL]
render() {
return html`
<uui-form>
@@ -510,10 +513,10 @@ export class UmbPropertySettingsModalElement extends UmbModalBaseElement<
];
}
export default UmbPropertySettingsModalElement;
export default UmbPropertyTypeSettingsModalElement;
declare global {
interface HTMLElementTagNameMap {
'umb-property-settings-modal': UmbPropertySettingsModalElement;
'umb-property-type-settings-modal': UmbPropertyTypeSettingsModalElement;
}
}

12
src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-settings/property-settings-modal.token.ts → src/Umbraco.Web.UI.Client/src/packages/core/content-type/modals/property-type-settings/property-type-settings-modal.token.ts
View File

@@ -1,15 +1,15 @@
import { UmbModalToken } from '../../../modal/token/modal-token.js';
import type { UmbPropertyTypeModel, UmbPropertyTypeScaffoldModel } from '@umbraco-cms/backoffice/content-type';
export type UmbPropertySettingsModalData = {
export type UmbPropertyTypeSettingsModalData = {
contentTypeId: string;
};
export type UmbPropertySettingsModalValue = UmbPropertyTypeModel | UmbPropertyTypeScaffoldModel;
export type UmbPropertyTypeSettingsModalValue = UmbPropertyTypeModel | UmbPropertyTypeScaffoldModel;
export const UMB_PROPERTY_SETTINGS_MODAL = new UmbModalToken<
UmbPropertySettingsModalData,
UmbPropertySettingsModalValue
>('Umb.Modal.PropertySettings', {
export const UMB_PROPERTY_TYPE_SETTINGS_MODAL = new UmbModalToken<
UmbPropertyTypeSettingsModalData,
UmbPropertyTypeSettingsModalValue
>('Umb.Modal.PropertyTypeSettings', {
modal: {
type: 'sidebar',
size: 'small',

4
src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-properties.element.ts
View File

@@ -12,7 +12,7 @@ import type {
} from '@umbraco-cms/backoffice/content-type';
import {
UmbContentTypePropertyStructureHelper,
UMB_PROPERTY_SETTINGS_MODAL,
UMB_PROPERTY_TYPE_SETTINGS_MODAL,
} from '@umbraco-cms/backoffice/content-type';
import { type UmbSorterConfig, UmbSorterController } from '@umbraco-cms/backoffice/sorter';
import {
@@ -189,7 +189,7 @@ export class UmbContentTypeDesignEditorPropertiesElement extends UmbLitElement {
});
// Note: Route for adding a new property
this.#addPropertyModal = new UmbModalRouteRegistrationController(this, UMB_PROPERTY_SETTINGS_MODAL)
this.#addPropertyModal = new UmbModalRouteRegistrationController(this, UMB_PROPERTY_TYPE_SETTINGS_MODAL)
.addUniquePaths(['container-id'])
.addAdditionalPath('add-property/:sortOrder')
.onSetup(async (params) => {

4
src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-property.element.ts
View File

@@ -7,7 +7,7 @@ import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import { generateAlias } from '@umbraco-cms/backoffice/utils';
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import {
UMB_PROPERTY_SETTINGS_MODAL,
UMB_PROPERTY_TYPE_SETTINGS_MODAL,
type UmbContentTypeModel,
type UmbContentTypePropertyStructureHelper,
type UmbPropertyTypeModel,
@@ -90,7 +90,7 @@ export class UmbContentTypeDesignEditorPropertyElement extends UmbLitElement {
constructor() {
super();
this.#settingsModal = new UmbModalRouteRegistrationController(this, UMB_PROPERTY_SETTINGS_MODAL)
this.#settingsModal = new UmbModalRouteRegistrationController(this, UMB_PROPERTY_TYPE_SETTINGS_MODAL)
.addUniquePaths(['propertyId'])
.onSetup(() => {
const id = this.ownerContentTypeId;