diff --git a/src/Umbraco.Web.UI.Client/libs/observable-api/deep-state.ts b/src/Umbraco.Web.UI.Client/libs/observable-api/deep-state.ts index a0cd9f94fe..8b2b865b3e 100644 --- a/src/Umbraco.Web.UI.Client/libs/observable-api/deep-state.ts +++ b/src/Umbraco.Web.UI.Client/libs/observable-api/deep-state.ts @@ -1,34 +1,30 @@ -import { BehaviorSubject } from "rxjs"; -import { createObservablePart } from "./create-observable-part.method"; - +import { BehaviorSubject } from 'rxjs'; +import { createObservablePart } from './create-observable-part.method'; // TODO: Should this handle array as well? function deepFreeze(inObj: T): T { - if(inObj != null && typeof inObj === 'object') { + if (inObj != null && typeof inObj === 'object') { Object.freeze(inObj); Object.getOwnPropertyNames(inObj)?.forEach(function (prop) { // eslint-disable-next-line no-prototype-builtins - if ((inObj as any).hasOwnProperty(prop) - && (inObj as any)[prop] != null - && typeof (inObj as any)[prop] === 'object' - && !Object.isFrozen((inObj as any)[prop])) { - deepFreeze((inObj as any)[prop]); - } + if ( + (inObj as any).hasOwnProperty(prop) && + (inObj as any)[prop] != null && + typeof (inObj as any)[prop] === 'object' && + !Object.isFrozen((inObj as any)[prop]) + ) { + deepFreeze((inObj as any)[prop]); + } }); } return inObj; } - export function naiveObjectComparison(objOne: any, objTwo: any): boolean { return JSON.stringify(objOne) === JSON.stringify(objTwo); } - - - - export type MappingFunction = (mappable: T) => R; export type MemoizationFunction = (previousResult: R, currentResult: R) => boolean; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts index 829b1ea34e..64d316ae81 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/backoffice.element.ts @@ -34,7 +34,7 @@ import { UmbDictionaryTreeStore } from './translation/dictionary/dictionary.tree import { UmbDocumentBlueprintDetailStore } from './documents/document-blueprints/document-blueprint.detail.store'; import { UmbDocumentBlueprintTreeStore } from './documents/document-blueprints/document-blueprint.tree.store'; import { UmbDataTypeStore } from './settings/data-types/repository/data-type.store'; -import { UmbDataTypeTreeStore } from './settings/data-types/tree/data-type.tree.store'; +import { UmbDataTypeTreeStore } from './settings/data-types/repository/data-type.tree.store'; import { UmbTemplateTreeStore } from './templating/templates/tree/data/template.tree.store'; import { UmbTemplateDetailStore } from './templating/templates/workspace/data/template.detail.store'; import { UmbThemeContext } from './themes/theme.context'; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/views/design/workspace-view-document-type-design.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/views/design/workspace-view-document-type-design.stories.ts index 47a6a6ccc9..b3d14fe840 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/views/design/workspace-view-document-type-design.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/document-types/workspace/views/design/workspace-view-document-type-design.stories.ts @@ -15,10 +15,10 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ - } + }, ], } as Meta; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/media-type.tree.store.ts b/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/media-type.tree.store.ts index ff116139c1..c94d8cae40 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/media-type.tree.store.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/media-type.tree.store.ts @@ -5,7 +5,7 @@ import { ArrayState } from '@umbraco-cms/observable-api'; import { UmbStoreBase } from '@umbraco-cms/store'; import type { UmbControllerHostInterface } from '@umbraco-cms/controller'; -export const UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN = new UmbContextToken( +export const UMB_MEDIA_TYPE_TREE_STORE_CONTEXT_TOKEN = new UmbContextToken( 'UmbMediaTypeTreeStore' ); @@ -19,7 +19,7 @@ export class UmbMediaTypeTreeStore extends UmbStoreBase { #data = new ArrayState([], (x) => x.key); constructor(host: UmbControllerHostInterface) { - super(host, UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString()); + super(host, UMB_MEDIA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString()); } getTreeRoot() { diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/tree/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/tree/manifests.ts index d83d3c5967..f79d46c324 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/tree/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/media/media-types/tree/manifests.ts @@ -1,4 +1,4 @@ -import { UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN } from '../media-type.tree.store'; +import { UMB_MEDIA_TYPE_TREE_STORE_CONTEXT_TOKEN } from '../media-type.tree.store'; import type { ManifestTree, ManifestTreeItemAction } from '@umbraco-cms/models'; const tree: ManifestTree = { @@ -6,7 +6,7 @@ const tree: ManifestTree = { alias: 'Umb.Tree.MediaTypes', name: 'Media Types Tree', meta: { - storeAlias: UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString(), + storeAlias: UMB_MEDIA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString(), }, }; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/members/member-groups/workspace/views/info/workspace-view-member-group-info.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/members/member-groups/workspace/views/info/workspace-view-member-group-info.stories.ts index e95f947da8..50f07c06a2 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/members/member-groups/workspace/views/info/workspace-view-member-group-info.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/members/member-groups/workspace/views/info/workspace-view-member-group-info.stories.ts @@ -15,7 +15,7 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ }, diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/manifests.ts index a4edc8b4f1..7fddd3f55d 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/manifests.ts @@ -1,5 +1,6 @@ +import { manifests as repositoryManifests } from './repository/manifests'; import { manifests as sidebarMenuItemManifests } from './sidebar-menu-item/manifests'; import { manifests as treeManifests } from './tree/manifests'; import { manifests as workspaceManifests } from './workspace/manifests'; -export const manifests = [...sidebarMenuItemManifests, ...treeManifests, ...workspaceManifests]; +export const manifests = [...repositoryManifests, ...sidebarMenuItemManifests, ...treeManifests, ...workspaceManifests]; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/repository/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/repository/manifests.ts new file mode 100644 index 0000000000..fbe0167037 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/repository/manifests.ts @@ -0,0 +1,13 @@ +import { UmbDataTypeRepository } from '../repository/data-type.repository'; +import { ManifestRepository } from 'libs/extensions-registry/repository.models'; + +export const DATA_TYPE_REPOSITORY_ALIAS = 'Umb.Repository.DataTypes'; + +const repository: ManifestRepository = { + type: 'repository', + alias: DATA_TYPE_REPOSITORY_ALIAS, + name: 'Data Types Repository', + class: UmbDataTypeRepository, +}; + +export const manifests = [repository]; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/data-type.tree.store.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/data-type.tree.store.ts deleted file mode 100644 index 9ba41cf9d0..0000000000 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/data-type.tree.store.ts +++ /dev/null @@ -1,91 +0,0 @@ -import { DataTypeResource, DocumentTreeItemModel } from '@umbraco-cms/backend-api'; -import { tryExecuteAndNotify } from '@umbraco-cms/resources'; -import { UmbContextToken } from '@umbraco-cms/context-api'; -import { ArrayState } from '@umbraco-cms/observable-api'; -import { UmbStoreBase } from '@umbraco-cms/store'; -import { UmbControllerHostInterface } from '@umbraco-cms/controller'; - -export const UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN = new UmbContextToken('UmbDataTypeTreeStore'); - -/** - * @export - * @class UmbDataTypeTreeStore - * @extends {UmbStoreBase} - * @description - Tree Data Store for Data Types - */ -export class UmbDataTypeTreeStore extends UmbStoreBase { - #data = new ArrayState([], (x) => x.key); - - constructor(host: UmbControllerHostInterface) { - super(host, UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString()); - } - - // TODO: How can we avoid having this in both stores? - /** - * @description - Delete a Data Type. - * @param {string[]} keys - * @memberof UmbDataTypesStore - * @return {*} {Promise} - */ - async delete(keys: string[]) { - // TODO: use backend cli when available. - await fetch('/umbraco/backoffice/data-type/delete', { - method: 'POST', - body: JSON.stringify(keys), - headers: { - 'Content-Type': 'application/json', - }, - }); - - this.#data.remove(keys); - } - - getTreeRoot() { - tryExecuteAndNotify(this._host, DataTypeResource.getTreeDataTypeRoot({})).then(({ data }) => { - if (data) { - // TODO: how do we handle if an item has been removed during this session(like in another tab or by another user)? - this.#data.append(data.items); - } - }); - - // TODO: how do we handle trashed items? - // TODO: remove ignore when we know how to handle trashed items. - return this.#data.getObservablePart((items) => items.filter((item) => item.parentKey === null && !item.isTrashed)); - } - - getTreeItemChildren(key: string) { - tryExecuteAndNotify( - this._host, - DataTypeResource.getTreeDataTypeChildren({ - parentKey: key, - }) - ).then(({ data }) => { - if (data) { - // TODO: how do we handle if an item has been removed during this session(like in another tab or by another user)? - this.#data.append(data.items); - } - }); - - // TODO: how do we handle trashed items? - // TODO: remove ignore when we know how to handle trashed items. - return this.#data.getObservablePart((items) => items.filter((item) => item.parentKey === key && !item.isTrashed)); - } - - getTreeItems(keys: Array) { - if (keys?.length > 0) { - tryExecuteAndNotify( - this._host, - DataTypeResource.getTreeDataTypeItem({ - key: keys, - }) - ).then(({ data }) => { - if (data) { - // TODO: how do we handle if an item has been removed during this session(like in another tab or by another user)? - this.#data.append(data); - } - }); - } - - return this.#data.getObservablePart((items) => items.filter((item) => keys.includes(item.key ?? ''))); - } -} diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/manifests.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/manifests.ts index d4467cddb1..f3a81ccab9 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/manifests.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/tree/manifests.ts @@ -1,4 +1,4 @@ -import { UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN } from './data-type.tree.store'; +import { UmbDataTypeRepository } from '../repository/data-type.repository'; import type { ManifestTree, ManifestTreeItemAction } from '@umbraco-cms/models'; const tree: ManifestTree = { @@ -6,7 +6,7 @@ const tree: ManifestTree = { alias: 'Umb.Tree.DataTypes', name: 'Data Types Tree', meta: { - storeAlias: UMB_DATA_TYPE_TREE_STORE_CONTEXT_TOKEN.toString(), + repository: UmbDataTypeRepository, }, }; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.context.ts index af0aaf7d8d..9ed7f50aaf 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.context.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.context.ts @@ -1,3 +1,4 @@ +import { BehaviorSubject } from 'rxjs'; import { UmbWorkspaceContext } from '../../../shared/components/workspace/workspace-context/workspace-context'; import { UmbWorkspaceEntityContextInterface } from '../../../shared/components/workspace/workspace-context/workspace-entity-context.interface'; import { UmbDataTypeRepository } from '../repository/data-type.repository'; @@ -5,32 +6,34 @@ import type { DataTypeModel } from '@umbraco-cms/backend-api'; import { appendToFrozenArray, ObjectState } from '@umbraco-cms/observable-api'; import { UmbControllerHostInterface } from '@umbraco-cms/controller'; -type EntityType = DataTypeModel; - -export class UmbWorkspaceDataTypeContext +export class UmbDataTypeWorkspaceContext extends UmbWorkspaceContext - implements UmbWorkspaceEntityContextInterface + implements UmbWorkspaceEntityContextInterface { #isNew = false; #host: UmbControllerHostInterface; #dataTypeRepository: UmbDataTypeRepository; - #data = new ObjectState(undefined); + #data = new ObjectState(undefined); data = this.#data.asObservable(); name = this.#data.getObservablePart((data) => data?.name); key = this.#data.getObservablePart((data) => data?.key); + test = new BehaviorSubject({}); + test2 = this.test.asObservable(); + constructor(host: UmbControllerHostInterface) { super(host); this.#host = host; this.#dataTypeRepository = new UmbDataTypeRepository(this.#host); } - async load(entityKey: string) { - const { data } = await this.#dataTypeRepository.requestByKey(entityKey); + async load(key: string) { + const { data } = await this.#dataTypeRepository.requestByKey(key); if (data) { this.#isNew = false; - this.#data.next(data); + this.#data.update(data); + this.test.next(data); } } diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.element.ts index 35db70aa92..35fc7f1e52 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/data-type-workspace.element.ts @@ -2,8 +2,7 @@ import { UUIInputElement, UUIInputEvent } from '@umbraco-ui/uui'; import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { css, html } from 'lit'; import { customElement, state } from 'lit/decorators.js'; -import { distinctUntilChanged } from 'rxjs'; -import { UmbWorkspaceDataTypeContext } from './data-type-workspace.context'; +import { UmbDataTypeWorkspaceContext } from './data-type-workspace.context'; import { UmbLitElement } from '@umbraco-cms/element'; /** @@ -29,11 +28,10 @@ export class UmbDataTypeWorkspaceElement extends UmbLitElement { `, ]; - private _workspaceContext: UmbWorkspaceDataTypeContext = new UmbWorkspaceDataTypeContext(this); + private _workspaceContext = new UmbDataTypeWorkspaceContext(this); public load(value: string) { this._workspaceContext?.load(value); - //this._unique = entityKey; } public create(parentKey: string | null) { @@ -46,11 +44,16 @@ export class UmbDataTypeWorkspaceElement extends UmbLitElement { constructor() { super(); this.provideContext('umbWorkspaceContext', this._workspaceContext); + this.observe(this._workspaceContext.name, (dataTypeName) => { if (dataTypeName !== this._dataTypeName) { this._dataTypeName = dataTypeName ?? ''; } }); + + this.observe(this._workspaceContext.test2, (hello) => { + console.log('hello', hello); + }); } // TODO. find a way where we don't have to do this for all Workspaces. diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts index c90f5d2b34..fd77adf0e6 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.element.ts @@ -2,7 +2,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { css, html, nothing } from 'lit'; import { customElement, state } from 'lit/decorators.js'; import { UmbModalService, UMB_MODAL_SERVICE_CONTEXT_TOKEN } from '../../../../../../core/modal'; -import { UmbWorkspaceDataTypeContext } from '../../data-type-workspace.context'; +import { UmbDataTypeWorkspaceContext } from '../../data-type-workspace.context'; import { UmbLitElement } from '@umbraco-cms/element'; import type { DataTypeModel } from '@umbraco-cms/backend-api'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; @@ -40,7 +40,7 @@ export class UmbDataTypeWorkspaceViewEditElement extends UmbLitElement { @state() private _data: Array = []; - private _workspaceContext?: UmbWorkspaceDataTypeContext; + private _workspaceContext?: UmbDataTypeWorkspaceContext; private _modalService?: UmbModalService; constructor() { @@ -51,7 +51,7 @@ export class UmbDataTypeWorkspaceViewEditElement extends UmbLitElement { }); // TODO: Figure out if this is the best way to consume a context or if it could be strongly typed using UmbContextToken - this.consumeContext('umbWorkspaceContext', (_instance) => { + this.consumeContext('umbWorkspaceContext', (_instance) => { this._workspaceContext = _instance; this._observeDataType(); }); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.stories.ts index 34191b3ca2..5e3aab4cdf 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/edit/data-type-workspace-view-edit.stories.ts @@ -6,7 +6,7 @@ import { html } from 'lit-html'; import type { UmbDataTypeWorkspaceViewEditElement } from './data-type-workspace-view-edit.element'; import './data-type-workspace-view-edit.element'; -//import { UmbWorkspaceDataTypeContext } from '../../workspace-data-type.context'; +//import { UmbDataTypeWorkspaceContext } from '../../workspace-data-type.context'; export default { title: 'Workspaces/Data Type/Views/Edit', @@ -15,10 +15,10 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ - } + }, ], } as Meta; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.element.ts index d35877f8be..d7e9f35ac5 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.element.ts @@ -1,7 +1,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { css, html } from 'lit'; import { customElement, state } from 'lit/decorators.js'; -import { UmbWorkspaceDataTypeContext } from '../../data-type-workspace.context'; +import { UmbDataTypeWorkspaceContext } from '../../data-type-workspace.context'; import { UmbLitElement } from '@umbraco-cms/element'; import { DataTypeModel } from '@umbraco-cms/backend-api'; @@ -13,13 +13,13 @@ export class UmbWorkspaceViewDataTypeInfoElement extends UmbLitElement { @state() _dataType?: DataTypeModel; - private _workspaceContext?: UmbWorkspaceDataTypeContext; + private _workspaceContext?: UmbDataTypeWorkspaceContext; constructor() { super(); // TODO: Figure out if this is the best way to consume the context or if it can be strongly typed with an UmbContextToken - this.consumeContext('umbWorkspaceContext', (dataTypeContext) => { + this.consumeContext('umbWorkspaceContext', (dataTypeContext) => { this._workspaceContext = dataTypeContext; this._observeDataType(); }); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.stories.ts index 05c5e900ec..81ff7b8607 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/data-types/workspace/views/info/workspace-view-data-type-info.stories.ts @@ -15,10 +15,10 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ - } + }, ], } as Meta; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts index a963ec309b..93ea03ff58 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.element.ts @@ -5,7 +5,6 @@ import { repeat } from 'lit-html/directives/repeat.js'; import { UmbTreeContextBase } from './tree.context'; import type { Entity, ManifestTree } from '@umbraco-cms/models'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; -import { UmbTreeStore } from '@umbraco-cms/store'; import { UmbLitElement } from '@umbraco-cms/element'; import './tree-item.element'; @@ -62,7 +61,6 @@ export class UmbTreeElement extends UmbLitElement { private _loading = true; private _treeContext?: UmbTreeContextBase; - private _store?: UmbTreeStore; protected firstUpdated(): void { this._observeTree(); @@ -77,47 +75,27 @@ export class UmbTreeElement extends UmbLitElement { .pipe(map((trees) => trees.find((tree) => tree.alias === this.alias))), async (tree) => { if (this._tree?.alias === tree?.alias) return; - this._tree = tree; - this._provideTreeContext(); - - // TODO: remove this when repositories are in place. - if (this._tree?.meta.storeAlias) { - this._provideStore(); - } + this.#provideTreeContext(); } ); } - private _provideTreeContext() { + #provideTreeContext() { if (!this._tree || this._treeContext) return; // TODO: if a new tree comes around, which is different, then we should clean up and re provide. - this._treeContext = new UmbTreeContextBase(this, this._tree); this._treeContext.setSelectable(this.selectable); this._treeContext.setSelection(this.selection); - this._observeSelection(); - this._observeRepositoryTreeRoot(); + this.#observeSelection(); + this.#observeTreeRoot(); this.provideContext('umbTreeContext', this._treeContext); } - // TODO: remove this when repositories are in place. - private _provideStore() { - // TODO: Clean up store, if already existing. - - if (!this._tree?.meta.storeAlias) return; - - this.consumeContext(this._tree.meta.storeAlias, (store: UmbTreeStore) => { - this._store = store; - this.provideContext('umbStore', store); - this._observeStoreTreeRoot(); - }); - } - - private async _observeRepositoryTreeRoot() { + async #observeTreeRoot() { if (!this._treeContext?.requestRootItems) return; this._treeContext.requestRootItems(); @@ -127,7 +105,7 @@ export class UmbTreeElement extends UmbLitElement { }); } - private _observeSelection() { + #observeSelection() { if (!this._treeContext) return; this.observe(this._treeContext.selection, (selection) => { @@ -137,19 +115,6 @@ export class UmbTreeElement extends UmbLitElement { }); } - //TODO: remove when repositories are fully implemented: - private _observeStoreTreeRoot() { - if (!this._store?.getTreeRoot) return; - - this._loading = true; - - this.observe(this._store.getTreeRoot(), (rootItems) => { - if (rootItems?.length === 0) return; - this._items = rootItems; - this._loading = false; - }); - } - render() { return html` ${repeat( diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.stories.ts index 167937eba6..480f424808 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/edit/workspace-view-content-edit.stories.ts @@ -15,10 +15,10 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ - } + }, ], } as Meta; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/info/workspace-view-content-info.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/info/workspace-view-content-info.stories.ts index eb8607dcfb..f5eed2b094 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/info/workspace-view-content-info.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/workspace/workspace-content/views/info/workspace-view-content-info.stories.ts @@ -15,10 +15,10 @@ export default { decorators: [ (story) => { return html`TODO: make use of mocked workspace context??`; - /*html` + /*html` ${story()} `,*/ - } + }, ], } as Meta; diff --git a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts index 7d439cde58..1fb6462337 100644 --- a/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts +++ b/src/Umbraco.Web.UI.Client/src/core/mocks/data/data-type.data.ts @@ -1,9 +1,11 @@ import { UmbEntityData } from './entity.data'; import { createFolderTreeItem } from './utils'; -import type { FolderTreeItemModel, DataTypeModel } from '@umbraco-cms/backend-api'; +import type { FolderTreeItemModel, DataTypeModel, EntityTreeItemModel } from '@umbraco-cms/backend-api'; -export const data: Array = [ +// TODO: investigate why we don't get an entity type as part of the DataTypeModel +export const data: Array = [ { + type: 'data-type', key: '0cc0eba1-9960-42c9-bf9b-60e150b429ae', parentKey: null, name: 'Textstring', @@ -12,6 +14,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Text', key: 'dt-textBox', parentKey: null, @@ -25,6 +28,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Text Area', key: 'dt-textArea', parentKey: null, @@ -33,6 +37,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'My JS Property Editor', key: 'dt-custom', parentKey: null, @@ -41,6 +46,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Color Picker', key: 'dt-colorPicker', parentKey: null, @@ -58,6 +64,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Content Picker', key: 'dt-contentPicker', parentKey: null, @@ -71,6 +78,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Eye Dropper', key: 'dt-eyeDropper', parentKey: null, @@ -105,6 +113,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Multi URL Picker', key: 'dt-multiUrlPicker', parentKey: null, @@ -113,6 +122,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Multi Node Tree Picker', key: 'dt-multiNodeTreePicker', parentKey: null, @@ -121,6 +131,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Date Picker', key: 'dt-datePicker', parentKey: null, @@ -129,6 +140,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Email', key: 'dt-email', parentKey: null, @@ -137,6 +149,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Multiple Text String', key: 'dt-multipleTextString', parentKey: null, @@ -154,6 +167,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Dropdown', key: 'dt-dropdown', parentKey: null, @@ -162,6 +176,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Slider', key: 'dt-slider', parentKey: null, @@ -170,6 +185,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Toggle', key: 'dt-toggle', parentKey: null, @@ -178,6 +194,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Tags', key: 'dt-tags', parentKey: null, @@ -186,6 +203,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Markdown Editor', key: 'dt-markdownEditor', parentKey: null, @@ -194,6 +212,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Radio Button List', key: 'dt-radioButtonList', parentKey: null, @@ -202,6 +221,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Checkbox List', key: 'dt-checkboxList', parentKey: null, @@ -218,6 +238,7 @@ export const data: Array = [ ], }, { + type: 'data-type', name: 'Block List', key: 'dt-blockList', parentKey: null, @@ -226,6 +247,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Media Picker', key: 'dt-mediaPicker', parentKey: null, @@ -234,6 +256,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Image Cropper', key: 'dt-imageCropper', parentKey: null, @@ -242,6 +265,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Upload Field', key: 'dt-uploadField', parentKey: null, @@ -250,6 +274,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Block Grid', key: 'dt-blockGrid', parentKey: null, @@ -258,6 +283,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Collection View', key: 'dt-collectionView', parentKey: null, @@ -266,6 +292,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Icon Picker', key: 'dt-iconPicker', parentKey: null, @@ -274,6 +301,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Number Range', key: 'dt-numberRange', parentKey: null, @@ -282,6 +310,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Order Direction', key: 'dt-orderDirection', parentKey: null, @@ -290,6 +319,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Overlay Size', key: 'dt-overlaySize', parentKey: null, @@ -298,6 +328,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Rich Text Editor', key: 'dt-richTextEditor', parentKey: null, @@ -306,6 +337,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Label', key: 'dt-label', parentKey: null, @@ -314,6 +346,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Integer', key: 'dt-integer', parentKey: null, @@ -322,6 +355,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Decimal', key: 'dt-decimal', parentKey: null, @@ -330,6 +364,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'User Picker', key: 'dt-userPicker', parentKey: null, @@ -338,6 +373,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Member Picker', key: 'dt-memberPicker', parentKey: null, @@ -346,6 +382,7 @@ export const data: Array = [ data: [], }, { + type: 'data-type', name: 'Member Group Picker', key: 'dt-memberGroupPicker', parentKey: null,