From eb6eb57b4134ae451a6c36e6ec7ca7f95ff79c53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Tue, 20 Dec 2022 15:34:34 +0100
Subject: [PATCH] workspace-data-type-context

---
 .../data-type/workspace-data-type.context.ts  | 18 +++++-
 .../data-type/workspace-data-type.element.ts  | 63 ++++++++++++-------
 2 files changed, 54 insertions(+), 27 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.context.ts b/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.context.ts
index 0c81b07052..eb6a143ed4 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.context.ts
@@ -1,15 +1,17 @@
 import { UmbWorkspaceNodeContext } from "../shared/workspace-context/workspace-node.context";
 import type { UmbDataTypeStore, UmbDataTypeStoreItemType } from "@umbraco-cms/stores/data-type/data-type.store";
+import { DataTypeDetails } from "@umbraco-cms/models";
 
 const DefaultDataTypeData = ({
 	key: '',
 	name: '',
 	icon: '',
-	type: '',
+	type: 'dataType',
 	hasChildren: false,
 	parentKey: '',
-	alias: '',
-	properties: [],
+	propertyEditorModelAlias: '',
+	propertyEditorUIAlias: '',
+	data: [],
 }) as UmbDataTypeStoreItemType;
 
 export class UmbWorkspaceDataTypeContext extends UmbWorkspaceNodeContext<UmbDataTypeStoreItemType, UmbDataTypeStore> {
@@ -18,6 +20,16 @@ export class UmbWorkspaceDataTypeContext extends UmbWorkspaceNodeContext<UmbData
 		super(target, DefaultDataTypeData, 'umbDataTypeStore', entityKey);
 	}
 
+	public setPropertyValue(propertyAlias: string, value: any) {
+		// TODO: what if this is a tree item?
+		const data = this._data.getValue();
+		const property = (data as DataTypeDetails).data?.find((p) => p.alias === propertyAlias);
+		if (!property) return;
+
+		property.value = value;
+		this._data.next({ ...data });
+	}
+
 }
 
 
diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.element.ts
index cfc352106a..a57c558950 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/workspaces/data-type/workspace-data-type.element.ts
@@ -2,12 +2,15 @@ import { UUIInputElement, UUIInputEvent } from '@umbraco-ui/uui';
 import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
 import { css, html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
+import { distinctUntilChanged } from 'rxjs';
 import { UmbDataTypeStore } from '../../../core/stores/data-type/data-type.store';
 import { UmbDataTypeContext } from './data-type.context';
+import { UmbWorkspaceDataTypeContext } from './workspace-data-type.context';
 import type { DataTypeDetails } from '@umbraco-cms/models';
 import { UmbObserverMixin } from '@umbraco-cms/observable-api';
 import { UmbContextProviderMixin, UmbContextConsumerMixin } from '@umbraco-cms/context-api';
 import { umbExtensionsRegistry } from '@umbraco-cms/extensions-registry';
+
 /**
  *  @element umb-workspace-data-type
  *  @description - Element for displaying a Data Type Workspace
@@ -33,28 +36,51 @@ export class UmbWorkspaceDataTypeElement extends UmbContextProviderMixin(
 		`,
 	];
 
-	@property({ type: String })
-	entityKey = '';
-
 	@state()
 	private _dataTypeName = '';
 
 	private _dataTypeContext?: UmbDataTypeContext;
 	private _dataTypeStore?: UmbDataTypeStore;
 
+
+	private _entityKey!: string;
+	@property()
+	public get entityKey(): string {
+		return this._entityKey;
+	}
+	public set entityKey(value: string) {
+		this._entityKey = value;
+		this._provideWorkspace();
+	}
+
+	private _workspaceContext?:UmbWorkspaceDataTypeContext;
+
 	constructor() {
 		super();
 
 		this._registerExtensions();
 
-		this.consumeAllContexts(['umbDataTypeStore'], (instances) => {
-			this._dataTypeStore = instances['umbDataTypeStore'];
-			this._observeDataType();
-		});
-
 		this.addEventListener('property-value-change', this._onPropertyValueChange);
 	}
 
+	connectedCallback(): void {
+		super.connectedCallback();
+		// TODO: avoid this connection, our own approach on Lit-Controller could be handling this case.
+		this._workspaceContext?.connectedCallback();
+	}
+	disconnectedCallback(): void {
+		super.connectedCallback()
+		// TODO: avoid this connection, our own approach on Lit-Controller could be handling this case.
+		this._workspaceContext?.disconnectedCallback();
+	}
+
+	protected _provideWorkspace() {
+		if(this._entityKey) {
+			this._workspaceContext = new UmbWorkspaceDataTypeContext(this, this._entityKey);
+			this.provideContext('umbWorkspaceContext', this._workspaceContext);
+			this._observeWorkspace()
+		}
+	}
 	private _registerExtensions() {
 		const extensions: Array<any> = [
 			{
@@ -100,24 +126,13 @@ export class UmbWorkspaceDataTypeElement extends UmbContextProviderMixin(
 		});
 	}
 
-	private _observeDataType() {
-		if (!this._dataTypeStore) return;
+	private _observeWorkspace() {
+		if (!this._workspaceContext) return;
 
-		this.observe<DataTypeDetails>(this._dataTypeStore.getByKey(this.entityKey), (dataType) => {
-			if (!dataType) return; // TODO: Handle nicely if there is no data type.
-
-			if (!this._dataTypeContext) {
-				this._dataTypeContext = new UmbDataTypeContext(dataType);
-				this.provideContext('umbDataTypeContext', this._dataTypeContext);
-			} else {
-				this._dataTypeContext.update(dataType);
+		this.observe<DataTypeDetails>(this._workspaceContext.data.pipe(distinctUntilChanged()), (dataType) => {
+			if (dataType && dataType.name !== this._dataTypeName) {
+				this._dataTypeName = dataType.name ?? '';
 			}
-
-			this.observe<DataTypeDetails>(this._dataTypeContext.data, (dataType) => {
-				if (dataType && dataType.name !== this._dataTypeName) {
-					this._dataTypeName = dataType.name ?? '';
-				}
-			});
 		});
 	}