Skip to content

Commit

Permalink
Pre-alpha release tidy-up
Browse files Browse the repository at this point in the history
Added missing property-editor UI aliases on the data-sources and list-editors.
Updated the progress status dashboard.
  • Loading branch information
leekelleher committed Jun 3, 2024
1 parent d2cad23 commit 4f87b26
Show file tree
Hide file tree
Showing 36 changed files with 166 additions and 119 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const UmbMarked = new Marked({ gfm: true, breaks: true });
const elementName = 'umb-bellissima-status-dashboard-element';
@customElement(elementName)
export class UmbBellissimaStatusDashboardElement extends UmbLitElement {
#started = 36;
#started = 40;
#total = 63;
#percentage = Math.floor((this.#started / this.#total) * 100);

Expand All @@ -29,12 +29,10 @@ export class UmbBellissimaStatusDashboardElement extends UmbLitElement {
markup: `
<p>During the alpha phase of Contentment v6.0, this dashboard will appear to provide a status update of progress on Contentment for Umbraco Bellissima.</p>
<p>Once the development is out of the alpha phase, this dashboard <strong>will be removed</strong> from stable releases.</p>
<p>Development has started on <strong>${this.#started} of the ${
this.#total
}</strong> UI components. Package migration is <strong>${
this.#percentage
}% complete</strong>.</p>
<uui-progress-bar progress="${this.#percentage}" style="background-color:var(--uui-color-divider)"></uui-progress-bar>`,
<p>Development has started on <strong>${this.#started} of the ${this.#total}</strong> UI components. Package migration is <strong>${this.#percentage}% complete</strong>.</p>
<uui-progress-bar progress="${this.#percentage}" style="background-color:var(--uui-color-divider)"></uui-progress-bar>
<p>If you find any bugs, or feel something is amiss, then please raise an issue on <a href="https://github.com/leekelleher/umbraco-contentment/issues" target="_blank" rel="noopener">the Contentment source-code repository on GitHub</a>.</p>
<p>Pleaes do keep in mind that I am a solo developer on this project, working on it in my own free time.</p>`,
},
},
]);
Expand Down Expand Up @@ -92,13 +90,13 @@ Status of list-editors used by the Data List editor.
| :octocat: | Editor | Status | Comment |
| --------------- | --------------- | ----------- | ------- |
| :green_circle: | **Buttons** | **Done** | |
| :green_circle: | **Buttons** | **Done** | |
| :green_circle: | **Checkbox List** | **Done** | |
| :green_circle: | **Dropdown List** | **Done** | |
| :large_blue_circle: | **Dropdown List** | **Done** | :warning: Missing "HTML attributes" UI. |
| :grey_question: | Item Picker | _Pending_ | I haven't thought about it yet. |
| :green_circle: | **Radio Button List** | **Done** | |
| :grey_question: | Tags | _Pending_ | I haven't thought about it yet. |
| :thinking: | Templated List | _Researching_ | Exploring alternative options. |
| :thinking: | Templated List | _Researching_ | Exploring alternative options. :warning: Missing "HTML attributes" UI. |
### Data List sources
Expand All @@ -109,7 +107,7 @@ The majority of this work is reliant on the internal **Configuration Editor** UI
| --------------- | --------------- | ----------- | ------- |
| :green_circle: | **.NET Countries** | **Done** | |
| :green_circle: | **.NET Currencies** | **Done** | |
| :grey_question: | .NET Enum | _Pending_ | I haven't thought about it yet. |
| :large_blue_circle: | .NET Enum | _Reviewed_ | Missing "Enumeration type" UI. |
| :green_circle: | **.NET Languages** | **Done** | |
| :green_circle: | **.NET Time Zone** | **Done** | |
| :green_circle: | Examine | **Done** | |
Expand All @@ -120,23 +118,23 @@ The majority of this work is reliant on the internal **Configuration Editor** UI
| :green_circle: | **Text Delimited** | **Done** | |
| :green_circle: | **uCssClassName** | **Done** | |
| :thinking: | Umbraco Backoffice Sections | _Researching_ | :no_entry_sign: Backoffice sections are now registered client-side, unable to query on the server. Exploring alternative options. |
| :grey_question: | Umbraco Content | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Content Properties | _Pending_ | I haven't thought about it yet. |
| :large_blue_circle: | Umbraco Content | _Reviewed_ | Missing "Parent node" UI. |
| :large_blue_circle: | Umbraco Content Properties | _Reviewed_ | Missing "Content Type UI". |
| :grey_question: | Umbraco Content Property Value | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Content Types | _Pending_ | I haven't thought about it yet. |
| :no_entry_sign: | Umbraco Content XPath | **Deprecated** | Umbraco 14 doesn't support XPath in the content cache. |
| :grey_question: | Umbraco Dictionary | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Entity | _Pending_ | I haven't thought about it yet. |
| :large_blue_circle: | Umbraco Dictionary | _Reviewed_ | Missing "Dictionary Item" UI. |
| :green_circle: | **Umbraco Entity** | **Done** | |
| :grey_question: | Umbraco Files | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Image Crop | _Pending_ | I haven't thought about it yet. |
| :green_circle: | **Umbraco Image Crop** | **Done** | |
| :green_circle: | **Umbraco Languages** | **Done** | |
| :green_circle: | **Umbraco Member Group** | **Done** | |
| :grey_question: | Umbraco Members | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Tags | _Pending_ | I haven't thought about it yet. |
| :grey_question: | Umbraco Templates | _Pending_ | I haven't thought about it yet. |
| :large_blue_circle: | Umbraco Members | _Reviewed_ | Missing "Member Type" UI. |
| :green_circle: | **Umbraco Tags** | **Done** | |
| :green_circle: | **Umbraco Templates** | **Done** | |
| :green_circle: | **Umbraco User Group** | **Done** | |
| :grey_question: | Umbraco Users | _Pending_ | I haven't thought about it yet. |
| :grey_question: | User Defined | _Pending_ | I haven't thought about it yet. |
| :large_blue_circle: | Umbraco Users | _Reviewed_ | Missing "User Group" UI. |
| :large_blue_circle: | User Defined | _Reviewed_ | Missing "Options" UI. |
| :green_circle: | **XML** | **Done** | |
| :green_circle: | **XML Sitemap Change Frequency** | **Done** | |
| :green_circle: | **XML Sitemap Priority** | **Done** | |
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ import {
UmbPropertyEditorConfigCollection,
UmbPropertyValueChangeEvent,
} from '@umbraco-cms/backoffice/property-editor';
import { UMB_PROPERTY_CONTEXT } from '@umbraco-cms/backoffice/property';
import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
// import { UMB_PROPERTY_CONTEXT } from '@umbraco-cms/backoffice/property';
// import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace';
import type { ContentmentConfigurationEditorValue, ContentmentDataListEditor } from '../types.js';
import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';

Expand All @@ -23,14 +23,14 @@ const ELEMENT_NAME = 'contentment-property-editor-ui-data-list';
export class ContentmentPropertyEditorUIDataListElement extends UmbLitElement implements UmbPropertyEditorUiElement {
#listEditor?: ContentmentDataListEditor;

@state()
private _entityUnique?: string | null;
// @state()
// private _entityUnique?: string | null;

@state()
private _propertyAlias?: string;
// @state()
// private _propertyAlias?: string;

@state()
private _variantId?: string;
// @state()
// private _variantId?: string;

@state()
private _initialized = false;
Expand All @@ -53,15 +53,15 @@ export class ContentmentPropertyEditorUIDataListElement extends UmbLitElement im
constructor() {
super();

this.consumeContext(UMB_WORKSPACE_CONTEXT, (entityContext) => {
// @ts-ignore
this.observe(entityContext.unique, (unique) => (this._entityUnique = unique));
});
// this.consumeContext(UMB_WORKSPACE_CONTEXT, (entityContext) => {
// // @ts-ignore
// this.observe(entityContext.unique, (unique) => (this._entityUnique = unique));
// });

this.consumeContext(UMB_PROPERTY_CONTEXT, (propertyContext) => {
this.observe(propertyContext.alias, (alias) => (this._propertyAlias = alias));
this.observe(propertyContext.variantId, (variantId) => (this._variantId = variantId?.toString() || 'invariant'));
});
// this.consumeContext(UMB_PROPERTY_CONTEXT, (propertyContext) => {
// this.observe(propertyContext.alias, (alias) => (this._propertyAlias = alias));
// this.observe(propertyContext.variantId, (variantId) => (this._variantId = variantId?.toString() || 'invariant'));
// });
}

protected async firstUpdated() {
Expand Down Expand Up @@ -101,7 +101,7 @@ export class ContentmentPropertyEditorUIDataListElement extends UmbLitElement im
render() {
if (!this._initialized || !this.#listEditor) return html`<uui-loader></uui-loader>`;
if (!this.#listEditor.propertyEditorUiAlias) return html`<contentment-lee-was-here></contentment-lee-was-here>`;
console.log('data-list', [this._entityUnique, this._propertyAlias, this._variantId]);
//console.log('data-list', [this._entityUnique, this._propertyAlias, this._variantId]);
return html`
<contentment-property-editor-ui
.config=${this.#listEditor.config}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,8 @@ export class ContentmentPropertyEditorUIEditorNotesElement extends UmbLitElement
this.#alertType = config.getValueByAlias('alertType') || 'default';
this.#icon = config.getValueByAlias('icon');
this.#heading = config.getValueByAlias('heading');
const message = config.getValueByAlias('message');
this.#message = typeof message === 'string' ? message : (message as unknown as any).markup;
const message = config.getValueByAlias('message');
this.#message = (message as unknown as any)?.markup ?? message;
this.#hideLabel = parseBoolean(config.getValueByAlias('hideLabel'));

if (this.#icon) {
Expand Down Expand Up @@ -90,9 +90,9 @@ export class ContentmentPropertyEditorUIEditorNotesElement extends UmbLitElement
padding: 1rem;
}
#note > div {
flex: 1;
}
#note > div {
flex: 1;
}
umb-icon {
font-size: 3rem;
Expand All @@ -107,6 +107,7 @@ export class ContentmentPropertyEditorUIEditorNotesElement extends UmbLitElement
details > summary {
cursor: pointer;
font-weight: bold;
}
`,
];
Expand Down
Original file line number Diff line number Diff line change
@@ -1,59 +1,58 @@
import { css, customElement, html, property } from '@umbraco-cms/backoffice/external/lit';
import { customElement, html, nothing, property } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';
import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';

const ELEMENT_NAME = 'contentment-property-editor-ui-templated-label';
import '../../property-editor-ui/editor-notes/editor-notes.element.js';

const ELEMENT_NAME = 'contentment-property-editor-ui-read-only';

@customElement(ELEMENT_NAME)
export class ContentmentPropertyEditorUITemplatedLabelElement
export class ContentmentPropertyEditorUIReadOnlyElement
extends UmbLitElement
implements UmbPropertyEditorUiElement
{
@property({ attribute: false })
public value?: unknown;

@property({ attribute: false })
public config?: UmbPropertyEditorConfigCollection;
public set config(config: UmbPropertyEditorConfigCollection | undefined) {
if (!config) return;

const jsonConfig = JSON.stringify(config, null, 2);
const jsonValue = JSON.stringify(this.value, null, 2);
const markup = `
<p><em>The property value and data-type configuration are in read-only mode.</em></p>
${jsonValue ? `<details><summary>Value</summary><umb-code-block copy>${jsonValue}</umb-code-block></details>` : ''}
${jsonConfig ? `<details><summary>Configuration</summary><umb-code-block copy>${jsonConfig}</umb-code-block></details>` : ''}
`;

this.#notesConfig = new UmbPropertyEditorConfigCollection([
{ alias: 'alertType', value: 'warning' },
{ alias: 'icon', value: 'icon-alert' },
{ alias: 'heading', value: 'This editor has not been developed yet.' },
{ alias: 'message', value: { markup } },
]);
}

#notesConfig?: UmbPropertyEditorConfigCollection;

constructor() {
super();
}

render() {
if (!this.#notesConfig) return nothing;
return html`
<div>
<p><em>This is a read-only view of the property value and data-type configuration.</em></p>
<details>
<summary>Value</summary>
<umb-code-block copy>${JSON.stringify(this.value, null, 2)}</umb-code-block>
</details>
<details>
<summary>Configuration</summary>
<umb-code-block copy>${JSON.stringify(this.config, null, 2)}</umb-code-block>
</details>
</div>
<contentment-property-editor-ui-editor-notes .config=${this.#notesConfig}>
</contentment-property-editor-ui-editor-notes>
`;
}

static styles = [
css`
details > summary {
cursor: pointer;
font-weight: bold;
}
umb-code-block {
margin-bottom: 1rem;
}
`,
];
}

export { ContentmentPropertyEditorUITemplatedLabelElement as element };
export { ContentmentPropertyEditorUIReadOnlyElement as element };

declare global {
interface HTMLElementTagNameMap {
[ELEMENT_NAME]: ContentmentPropertyEditorUITemplatedLabelElement;
[ELEMENT_NAME]: ContentmentPropertyEditorUIReadOnlyElement;
}
}
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// SPDX-License-Identifier: MPL-2.0
// Copyright © 2023 Lee Kelleher

import { customElement, html, property } from '@umbraco-cms/backoffice/external/lit';
import { customElement, html, nothing, property } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
import type { UmbPropertyEditorUiElement } from '@umbraco-cms/backoffice/extension-registry';
Expand All @@ -15,15 +15,10 @@ export class ContentmentPropertyEditorUIRenderMacroElement extends UmbLitElement
@property()
public value?: string;

@property({ attribute: false })
config?: UmbPropertyEditorConfigCollection;
public set config(config: UmbPropertyEditorConfigCollection | undefined) {
if (!config) return;

#notesConfig?: UmbPropertyEditorConfigCollection;

connectedCallback() {
super.connectedCallback();

const json = JSON.stringify(this.config, null, 2);
const json = JSON.stringify(config, null, 2);
const markup = `
<p><em>Support for Macros were deprecated in Umbraco 14. Please consider alternative functionality.</em></p>
${json ? `<details><summary>Macro configuration</summary><umb-code-block copy>${json}</umb-code-block></details>` : ''}
Expand All @@ -37,7 +32,10 @@ ${json ? `<details><summary>Macro configuration</summary><umb-code-block copy>${
]);
}

#notesConfig?: UmbPropertyEditorConfigCollection;

render() {
if (!this.#notesConfig) return nothing;
return html`
<contentment-property-editor-ui-editor-notes .config=${this.#notesConfig}>
</contentment-property-editor-ui-editor-notes>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ public sealed class ButtonsDataListEditor : IDataListEditor
{
internal const string DataEditorViewPath = Constants.Internals.EditorsPathRoot + "buttons.html";

internal const string DataEditorUiAlias = "Umb.Contentment.PropertyEditorUi.Buttons";

private readonly IIOHelper _ioHelper;

public ButtonsDataListEditor(IIOHelper ioHelper)
Expand Down Expand Up @@ -106,6 +108,6 @@ public bool HasMultipleValues(Dictionary<string, object>? config)

public string View => DataEditorViewPath;

public string PropertyEditorUiAlias => "Umb.Contentment.PropertyEditorUi.Buttons";
public string PropertyEditorUiAlias => DataEditorUiAlias;
}
}
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/* Copyright © 2019 Lee Kelleher.
/* Copyright © 2019 Lee Kelleher.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
Expand All @@ -10,5 +10,8 @@ internal sealed class CascadingDropdownListDataEditor
internal const string APIs = "apis";

internal const string DataEditorViewPath = Constants.Internals.EditorsPathRoot + "cascading-dropdown-list.html";

// TODO: [LK] This property-editor UI needs to be developed.
internal const string DataEditorUiAlias = "Umb.Contentment.PropertyEditorUi.ReadOnly";
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ namespace Umbraco.Community.Contentment.DataEditors
public sealed class CheckboxListDataListEditor : IDataListEditor
{
internal const string DataEditorViewPath = Constants.Internals.EditorsPathRoot + "checkbox-list.html";
internal const string DataEditorUiAlias = "Umb.Contentment.PropertyEditorUi.CheckBoxList";

public string Name => "Checkbox List";

Expand Down Expand Up @@ -43,6 +44,6 @@ public sealed class CheckboxListDataListEditor : IDataListEditor

public string View => DataEditorViewPath;

public string PropertyEditorUiAlias => "Umb.Contentment.PropertyEditorUi.CheckBoxList";
public string PropertyEditorUiAlias => DataEditorUiAlias;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -13,5 +13,8 @@ internal sealed class ConfigurationEditorDataEditor
internal const string DataEditorInlineViewPath = Constants.Internals.EditorsPathRoot + "configuration-editor.inline.html";
internal const string DataEditorOverlayViewPath = Constants.Internals.EditorsPathRoot + "configuration-editor.overlay.html";
internal const string DataEditorIcon = UmbConstants.Icons.Package;

// TODO: [LK] This property-editor UI needs to be developed.
internal const string DataEditorUiAlias = "Umb.Contentment.PropertyEditorUi.ReadOnly";
}
}
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/* Copyright © 2020 Lee Kelleher.
/* Copyright © 2020 Lee Kelleher.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
Expand All @@ -8,5 +8,8 @@ namespace Umbraco.Community.Contentment.DataEditors
internal sealed class ContentPickerDataEditor
{
internal const string DataEditorViewPath = Constants.Internals.EditorsPathRoot + "content-source.html";

// TODO: [LK] This property-editor UI needs to be developed.
internal const string DataEditorUiAlias = "Umb.Contentment.PropertyEditorUi.ReadOnly";
}
}
Loading

0 comments on commit 4f87b26

Please sign in to comment.