rename to dataset

This commit is contained in:
Niels Lyngsø
2023-12-08 10:11:00 +01:00
parent d032716fd8
commit 3293e23b86
24 changed files with 120 additions and 102 deletions

View File

@@ -4,9 +4,9 @@ import { css, html, nothing, customElement, property, state, ifDefined } from '@
import {
UmbWorkspaceSplitViewContext,
UMB_WORKSPACE_SPLIT_VIEW_CONTEXT,
UMB_VARIANT_CONTEXT,
UMB_PROPERTY_DATASET_CONTEXT,
ActiveVariant,
isNameablePropertySetContext,
isNameablePropertyDatasetContext,
} from '@umbraco-cms/backoffice/workspace';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
import { DocumentVariantResponseModel, ContentStateModel } from '@umbraco-cms/backoffice/backend-api';
@@ -26,7 +26,7 @@ export class UmbVariantSelectorElement extends UmbLitElement {
}
#splitViewContext?: UmbWorkspaceSplitViewContext;
#variantContext?: typeof UMB_VARIANT_CONTEXT.TYPE;
#variantContext?: typeof UMB_PROPERTY_DATASET_CONTEXT.TYPE;
@state()
private _name?: string;
@@ -54,7 +54,7 @@ export class UmbVariantSelectorElement extends UmbLitElement {
this._observeVariants();
this._observeActiveVariants();
});
this.consumeContext(UMB_VARIANT_CONTEXT, (instance) => {
this.consumeContext(UMB_PROPERTY_DATASET_CONTEXT, (instance) => {
this.#variantContext = instance;
this._observeVariantContext();
});
@@ -128,7 +128,7 @@ export class UmbVariantSelectorElement extends UmbLitElement {
if (
typeof target?.value === 'string' &&
this.#variantContext &&
isNameablePropertySetContext(this.#variantContext)
isNameablePropertyDatasetContext(this.#variantContext)
) {
this.#variantContext.setName(target.value);
}

View File

@@ -4,7 +4,7 @@ import {
UmbInvariantableWorkspaceContextInterface,
UmbEditableWorkspaceContextBase,
UmbWorkspaceContextInterface,
UmbBasicVariantContext,
UmbPropertyDatasetBaseContext,
} from '@umbraco-cms/backoffice/workspace';
import {
appendToFrozenArray,
@@ -146,7 +146,7 @@ export class UmbDataTypeWorkspaceContext
}
createVariantContext(host: UmbControllerHost) {
const context = new UmbBasicVariantContext(host);
const context = new UmbPropertyDatasetBaseContext(host);
// Observe workspace name:
this.observe(this.name, (name) => {

View File

@@ -1,4 +1,4 @@
export * from './variant-context/index.js';
export * from './property-dataset/index.js';
export * from './workspace-action-menu/index.js';
export * from './workspace-action/index.js';
export type { WorkspaceAliasConditionConfig } from './workspace-alias.condition.js';

View File

@@ -0,0 +1,6 @@
export * from './property-dataset-base-context.js';
export * from './property-dataset-context.interface.js';
export * from './property-dataset-context.token.js';
export * from './nameable-property-dataset-context.interface.js';
export * from './nameable-property-dataset-context.token.js';
export * from '../workspace-property-dataset/invariant-workspace-property-dataset-context.js';

View File

@@ -0,0 +1,8 @@
import { UmbPropertyDatasetContext } from './property-dataset-context.interface.js';
/**
* A variant context with ability to set the name of it.
*/
export interface UmbNameablePropertyDatasetContext extends UmbPropertyDatasetContext {
setName(name: string): void;
}

View File

@@ -0,0 +1,13 @@
import { type UmbPropertyDatasetContext } from './property-dataset-context.interface.js';
import { UmbNameablePropertyDatasetContext } from './nameable-property-dataset-context.interface.js';
import { UMB_PROPERTY_DATASET_CONTEXT } from './property-dataset-context.token.js';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
export const isNameablePropertyDatasetContext = (
context: UmbPropertyDatasetContext,
): context is UmbNameablePropertyDatasetContext => 'setName' in context;
export const UMB_NAMEABLE_PROPERTY_DATASET_CONTEXT = new UmbContextToken<
UmbPropertyDatasetContext,
UmbNameablePropertyDatasetContext
>(UMB_PROPERTY_DATASET_CONTEXT.toString(), undefined, isNameablePropertyDatasetContext);

View File

@@ -2,20 +2,21 @@ import type { UmbPropertyValueData } from '../types/property-value-data.type.js'
import { type UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
import {
UMB_VARIANT_CONTEXT,
type UmbNameableVariantContext,
type UmbVariantContext,
UMB_PROPERTY_DATASET_CONTEXT,
type UmbNameablePropertyDatasetContext,
type UmbPropertyDatasetContext,
} from '@umbraco-cms/backoffice/workspace';
import { UmbArrayState, UmbStringState } from '@umbraco-cms/backoffice/observable-api';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
/**
* A basic variant context, holds a name and a a set of properties.
* This is the base type for all variant contexts.
* A base property dataset context implementation.
* @class UmbPropertyDatasetBaseContext
* @extends {UmbContextBase}
*/
export class UmbBasicVariantContext
extends UmbContextBase<typeof UMB_VARIANT_CONTEXT.TYPE>
implements UmbVariantContext, UmbNameableVariantContext
export class UmbPropertyDatasetBaseContext
extends UmbContextBase<typeof UMB_PROPERTY_DATASET_CONTEXT.TYPE>
implements UmbPropertyDatasetContext, UmbNameablePropertyDatasetContext
{
#name = new UmbStringState(undefined);
name = this.#name.asObservable();
@@ -44,7 +45,7 @@ export class UmbBasicVariantContext
constructor(host: UmbControllerHost) {
// The controller alias, is a very generic name cause we want only one of these for this controller host.
super(host, UMB_VARIANT_CONTEXT);
super(host, UMB_PROPERTY_DATASET_CONTEXT);
}
/**

View File

@@ -2,19 +2,20 @@ import type { UmbVariantId } from '../../variant/variant-id.class.js';
import type { Observable } from '@umbraco-cms/backoffice/external/rxjs';
/**
* A variant context, represents a set of properties.
* A property dataset context, represents the data of a set of properties.
* This can take form as many, so to list a few:
* - A specific variant of content
* - Content that does not vary
* - A specific variant of content.
* - Content that does not vary.
* - A block.
* - A DataType configuration.
* - A property editor that hosts a set of properties.
*
* The base type of this holds a Name and some Properties.
* Some might be enriches with Variant Info, like culture and segment.
* Others might have saved publishing status.
* Also setting the name is an additional feature.
*/
export interface UmbVariantContext {
export interface UmbPropertyDatasetContext {
getType(): string;
getUnique(): string | undefined;
getVariantId: () => UmbVariantId;

View File

@@ -0,0 +1,4 @@
import { type UmbPropertyDatasetContext } from './property-dataset-context.interface.js';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
export const UMB_PROPERTY_DATASET_CONTEXT = new UmbContextToken<UmbPropertyDatasetContext>('UmbPropertyDatasetContext');

View File

@@ -1,7 +1,7 @@
import { expect, fixture, oneEvent } from '@open-wc/testing';
import type { UmbPropertyValueData } from '../types/property-value-data.type.js';
import { UMB_VARIANT_CONTEXT } from './variant-context.token.js';
import { UmbBasicVariantElement } from './basic-variant.element.js';
import { UMB_PROPERTY_DATASET_CONTEXT } from './property-dataset-context.token.js';
import { UmbPropertyDatasetElement } from './property-dataset.element.js';
import { customElement, html, property, state, LitElement } from '@umbraco-cms/backoffice/external/lit';
import { UmbChangeEvent } from '@umbraco-cms/backoffice/event';
import { UmbElementMixin } from '@umbraco-cms/backoffice/element-api';
@@ -9,7 +9,7 @@ import { UmbElementMixin } from '@umbraco-cms/backoffice/element-api';
@customElement('test-property-editor')
export class UmbTestPropertyEditorElement extends UmbElementMixin(LitElement) {
//
#variantContext?: typeof UMB_VARIANT_CONTEXT.TYPE;
#variantContext?: typeof UMB_PROPERTY_DATASET_CONTEXT.TYPE;
@property()
public get alias() {
@@ -49,7 +49,7 @@ export class UmbTestPropertyEditorElement extends UmbElementMixin(LitElement) {
constructor() {
super();
this.consumeContext(UMB_VARIANT_CONTEXT, async (variantContext) => {
this.consumeContext(UMB_PROPERTY_DATASET_CONTEXT, async (variantContext) => {
this.#variantContext = variantContext;
this._observeProperty();
});
@@ -65,21 +65,21 @@ const dataSet: Array<UmbPropertyValueData> = [
describe('UmbBasicVariantElement', () => {
describe('Data bindings', () => {
let variantElement: UmbBasicVariantElement;
let variantElement: UmbPropertyDatasetElement;
let propertyEditor: UmbTestPropertyEditorElement;
beforeEach(async () => {
variantElement = await fixture(
html`<umb-basic-variant .value=${dataSet}>
html`<umb-property-dataset .value=${dataSet}>
<test-property-editor alias="testAlias"></test-property-editor>
</umb-basic-variant>`,
</umb-property-dataset>`,
);
propertyEditor = variantElement.querySelector('test-property-editor') as UmbTestPropertyEditorElement;
});
it('basic-variant is defined with its own instance', () => {
expect(variantElement).to.be.instanceOf(UmbBasicVariantElement);
expect(variantElement).to.be.instanceOf(UmbPropertyDatasetElement);
});
it('property editor gets value', () => {

View File

@@ -1,15 +1,20 @@
import type { UmbPropertyValueData } from '../types/property-value-data.type.js';
import { UmbBasicVariantContext } from './basic-variant-context.js';
import { UmbPropertyDatasetBaseContext } from './property-dataset-base-context.js';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
import { customElement, html, property } from '@umbraco-cms/backoffice/external/lit';
import { UmbChangeEvent } from '@umbraco-cms/backoffice/event';
@customElement('umb-basic-variant')
export class UmbBasicVariantElement extends UmbLitElement {
/**
* @element umb-property-dataset
* @description - Element for hosting a property dataset. This is needed for umb-property to work.
* @slot default - Slot for rendering content within.
*/
@customElement('umb-property-dataset')
export class UmbPropertyDatasetElement extends UmbLitElement {
// A take on only firing events when the value is changed from the outside.
#silentOnce = true;
public readonly context: UmbBasicVariantContext;
public readonly context: UmbPropertyDatasetBaseContext;
/**
* The value of the dataset.
@@ -29,7 +34,7 @@ export class UmbBasicVariantElement extends UmbLitElement {
* ]
*
* html`
* <umb-basic-variant .value="${dataSet}">
* <umb-property-dataset .value="${dataSet}">
* <umb-workspace-property
* label="My label for this property"
* description="The description to show on the property"
@@ -37,7 +42,7 @@ export class UmbBasicVariantElement extends UmbLitElement {
* property-editor-ui-alias="Umb.PropertyEditorUi.TextBox"
* .config=${...}>
* </umb-workspace-property>
* </umb-basic-variant>
* </umb-property-dataset>
* `
* ```
*/
@@ -51,15 +56,16 @@ export class UmbBasicVariantElement extends UmbLitElement {
}
/**
* The name of the dataset.
* The name of the dataset, this name varies depending on the use-case. But this is either
* @type {string}
* @returns {string}
* @memberof UmbBasicVariantElement
* @example
* ```ts
* html`
* <umb-basic-variant name="My variant name">
* <umb-property-dataset name="My variant name">
* ...
* </umb-basic-variant>
* </umb-property-dataset>
* `
*/
@property({ attribute: false })
@@ -81,10 +87,9 @@ export class UmbBasicVariantElement extends UmbLitElement {
}
});
this.context = new UmbBasicVariantContext(this);
this.context = new UmbPropertyDatasetBaseContext(this);
this.observe(this.context.name, () => {
if (!this.#silentOnce) {
console.log('——— name fire event!');
this.dispatchEvent(new UmbChangeEvent());
} else {
this.#silentOnce = false;
@@ -93,7 +98,6 @@ export class UmbBasicVariantElement extends UmbLitElement {
this.#silentOnce = true;
this.observe(this.context.values, () => {
if (!this.#silentOnce) {
console.log('——— value fire event!');
this.dispatchEvent(new UmbChangeEvent());
} else {
this.#silentOnce = false;
@@ -106,10 +110,10 @@ export class UmbBasicVariantElement extends UmbLitElement {
}
}
export default UmbBasicVariantElement;
export default UmbPropertyDatasetElement;
declare global {
interface HTMLElementTagNameMap {
'umb-basic-variant': UmbBasicVariantElement;
'umb-property-dataset': UmbPropertyDatasetElement;
}
}

View File

@@ -1,6 +1,6 @@
import { UmbPropertyEditorUiElement } from '../../extension-registry/interfaces/property-editor-ui-element.interface.js';
import { type WorkspacePropertyData } from '../types/workspace-property-data.type.js';
import { UMB_VARIANT_CONTEXT } from '@umbraco-cms/backoffice/workspace';
import { UMB_PROPERTY_DATASET_CONTEXT } from '@umbraco-cms/backoffice/workspace';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
import { type UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api';
import { UmbBaseController } from '@umbraco-cms/backoffice/class-api';
@@ -44,12 +44,12 @@ export class UmbPropertyContext<ValueType = any> extends UmbBaseController {
private _variantDifference = new UmbStringState(undefined);
public readonly variantDifference = this._variantDifference.asObservable();
#variantContext?: typeof UMB_VARIANT_CONTEXT.TYPE;
#variantContext?: typeof UMB_PROPERTY_DATASET_CONTEXT.TYPE;
constructor(host: UmbControllerHostElement) {
super(host);
this.consumeContext(UMB_VARIANT_CONTEXT, (variantContext) => {
this.consumeContext(UMB_PROPERTY_DATASET_CONTEXT, (variantContext) => {
this.#variantContext = variantContext;
this._generateVariantDifferenceString();
this._observeProperty();

View File

@@ -1,6 +0,0 @@
export * from './basic-variant-context.js';
export * from './variant-context.interface.js';
export * from './variant-context.token.js';
export * from './nameable-variant-context.interface.js';
export * from './nameable-variant-context.token.js';
export * from './invariant-workspace-variant-context.js';

View File

@@ -1,8 +0,0 @@
import { UmbVariantContext } from './variant-context.interface.js';
/**
* A variant context with ability to set the name of it.
*/
export interface UmbNameableVariantContext extends UmbVariantContext {
setName(name: string): void;
}

View File

@@ -1,12 +0,0 @@
import { type UmbVariantContext } from './variant-context.interface.js';
import { UmbNameableVariantContext } from './nameable-variant-context.interface.js';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
export const isNameablePropertySetContext = (context: UmbVariantContext): context is UmbNameableVariantContext =>
'setName' in context;
export const UMB_NAMEABLE_VARIANT_CONTEXT = new UmbContextToken<UmbVariantContext, UmbNameableVariantContext>(
'UmbVariantContext',
undefined,
isNameablePropertySetContext,
);

View File

@@ -1,4 +0,0 @@
import { type UmbVariantContext } from './variant-context.interface.js';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
export const UMB_VARIANT_CONTEXT = new UmbContextToken<UmbVariantContext>('UmbVariantContext');

View File

@@ -1,5 +1,5 @@
import { UmbVariantId } from '../../variant/variant-id.class.js';
import { UmbVariantContext } from '../variant-context/variant-context.interface.js';
import { UmbPropertyDatasetContext } from '../property-dataset/property-dataset-context.interface.js';
import type { UmbSaveableWorkspaceContextInterface } from './saveable-workspace-context.interface.js';
import { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import type { Observable } from '@umbraco-cms/backoffice/external/rxjs';
@@ -16,5 +16,5 @@ export interface UmbInvariantableWorkspaceContextInterface<T = unknown>
getPropertyValue<ReturnType = unknown>(alias: string): ReturnType;
setPropertyValue(alias: string, value: unknown): Promise<void>;
createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbVariantContext;
createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbPropertyDatasetContext;
}

View File

@@ -1,5 +1,5 @@
import type { UmbWorkspaceSplitViewManager } from '../workspace-split-view-manager.class.js';
import { UmbVariantContext } from '../variant-context/variant-context.interface.js';
import { UmbPropertyDatasetContext } from '../property-dataset/property-dataset-context.interface.js';
import type { UmbSaveableWorkspaceContextInterface } from './saveable-workspace-context.interface.js';
import type { Observable } from '@umbraco-cms/backoffice/external/rxjs';
import type { UmbVariantId } from '@umbraco-cms/backoffice/variant';
@@ -27,5 +27,5 @@ export interface UmbVariantableWorkspaceContextInterface<EntityType = unknown>
setPropertyValue(alias: string, value: unknown, variantId?: UmbVariantId): Promise<void>;
//propertyDataByAlias(alias: string, variantId?: UmbVariantId): Observable<ValueModelBaseModel | undefined>;
createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbVariantContext;
createVariantContext(host: UmbControllerHost, variantId?: UmbVariantId): UmbPropertyDatasetContext;
}

View File

@@ -0,0 +1 @@
export * from './invariant-workspace-property-dataset-context.js';

View File

@@ -2,18 +2,22 @@ import { type UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { UmbBaseController } from '@umbraco-cms/backoffice/class-api';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
import {
UMB_VARIANT_CONTEXT,
UmbVariantContext,
UMB_PROPERTY_DATASET_CONTEXT,
UmbPropertyDatasetContext,
UmbInvariantableWorkspaceContextInterface,
UmbNameablePropertyDatasetContext,
} from '@umbraco-cms/backoffice/workspace';
export class UmbInvariantWorkspaceVariantContext<
/**
* A property dataset context that hooks directly into the workspace context.
*/
export class UmbInvariantWorkspacePropertyDatasetContext<
WorkspaceType extends UmbInvariantableWorkspaceContextInterface = UmbInvariantableWorkspaceContextInterface,
>
extends UmbBaseController
implements UmbVariantContext
implements UmbPropertyDatasetContext, UmbNameablePropertyDatasetContext
{
protected _workspace: WorkspaceType;
#workspace: WorkspaceType;
name;
@@ -23,39 +27,39 @@ export class UmbInvariantWorkspaceVariantContext<
return UmbVariantId.CreateInvariant();
}
getType() {
return this._workspace.getEntityType();
return this.#workspace.getEntityType();
}
getUnique() {
return this._workspace.getEntityId();
return this.#workspace.getEntityId();
}
getName() {
return this._workspace.getName();
return this.#workspace.getName();
}
setName(name: string) {
this._workspace.setName(name);
this.#workspace.setName(name);
}
constructor(host: UmbControllerHost, workspace: WorkspaceType) {
// The controller alias, is a very generic name cause we want only one of these for this controller host.
super(host, 'variantContext');
this._workspace = workspace;
this.#workspace = workspace;
this.name = this._workspace.name;
this.name = this.#workspace.name;
this.provideContext(UMB_VARIANT_CONTEXT, this);
this.provideContext(UMB_PROPERTY_DATASET_CONTEXT, this);
}
/**
* TODO: Write proper JSDocs here.
*/
async propertyValueByAlias<ReturnType = unknown>(propertyAlias: string) {
return await this._workspace.propertyValueByAlias<ReturnType>(propertyAlias);
return await this.#workspace.propertyValueByAlias<ReturnType>(propertyAlias);
}
/**
* TODO: Write proper JSDocs here.
*/
async setPropertyValue(propertyAlias: string, value: unknown) {
return this._workspace.setPropertyValue(propertyAlias, value);
return this.#workspace.setPropertyValue(propertyAlias, value);
}
}

View File

@@ -1,4 +1,4 @@
import { UmbVariantContext } from '../variant-context/index.js';
import { UmbPropertyDatasetContext } from '../property-dataset/index.js';
import { UMB_VARIANT_WORKSPACE_CONTEXT_TOKEN } from '../index.js';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
@@ -12,7 +12,7 @@ export class UmbWorkspaceSplitViewContext extends UmbBaseController {
return this.#workspaceContext;
}
#variantContext?: UmbVariantContext;
#variantContext?: UmbPropertyDatasetContext;
#index = new UmbNumberState(undefined);
index = this.#index.asObservable();

View File

@@ -1,12 +1,12 @@
import { UMB_DOCUMENT_ENTITY_TYPE } from '../entity.js';
import type { UmbDocumentVariantContext } from './document-variant-context.js';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
import { UmbVariantContext } from '@umbraco-cms/backoffice/workspace';
import { UmbPropertyDatasetContext } from '@umbraco-cms/backoffice/workspace';
export const IsDocumentVariantContext = (context: UmbVariantContext): context is UmbDocumentVariantContext =>
export const IsDocumentVariantContext = (context: UmbPropertyDatasetContext): context is UmbDocumentVariantContext =>
context.getType() === UMB_DOCUMENT_ENTITY_TYPE;
export const UMB_DOCUMENT_VARIANT_CONTEXT = new UmbContextToken<UmbVariantContext, UmbDocumentVariantContext>(
export const UMB_DOCUMENT_VARIANT_CONTEXT = new UmbContextToken<UmbPropertyDatasetContext, UmbDocumentVariantContext>(
'UmbVariantContext',
undefined,
IsDocumentVariantContext,

View File

@@ -5,12 +5,16 @@ import { UmbBaseController } from '@umbraco-cms/backoffice/class-api';
import { map } from '@umbraco-cms/backoffice/external/rxjs';
import { UmbObjectState } from '@umbraco-cms/backoffice/observable-api';
import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
import { UMB_VARIANT_CONTEXT, UmbNameableVariantContext, UmbVariantContext } from '@umbraco-cms/backoffice/workspace';
import {
UMB_PROPERTY_DATASET_CONTEXT,
UmbNameablePropertyDatasetContext,
UmbPropertyDatasetContext,
} from '@umbraco-cms/backoffice/workspace';
// TODO: This code can be split into a UmbContentTypeVariantContext, leaving just the publishing state and methods to this class.
export class UmbDocumentVariantContext
extends UmbBaseController
implements UmbVariantContext, UmbNameableVariantContext
implements UmbPropertyDatasetContext, UmbNameablePropertyDatasetContext
{
#workspace: UmbDocumentWorkspaceContext;
#variantId: UmbVariantId;
@@ -62,7 +66,7 @@ export class UmbDocumentVariantContext
);
// TODO: Refactor: use the document dataset context token.
this.provideContext(UMB_VARIANT_CONTEXT, this);
this.provideContext(UMB_PROPERTY_DATASET_CONTEXT, this);
}
#createPropertyVariantId(property: PropertyTypeModelBaseModel) {

View File

@@ -3,6 +3,8 @@ import defaultConfig from './web-test-runner.config.mjs';
/** @type {import('@web/dev-server').DevServerConfig} */
export default {
...defaultConfig,
// Only test with the first browser option ( to keep test times fast )
browsers: [defaultConfig.browsers[0]],
testRunnerHtml: (testFramework) => {
return defaultConfig.testRunnerHtml(testFramework, true);
},