Block workspace view validation badges

src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-element-manager.ts

@@ -14,11 +14,16 @@ import { type UmbClassInterface, UmbControllerBase } from '@umbraco-cms/backoffi
 import { UmbDocumentTypeDetailRepository } from '@umbraco-cms/backoffice/document-type';
 import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
 import { UmbValidationController } from '@umbraco-cms/backoffice/validation';
-import { UmbElementWorkspaceDataManager, type UmbElementPropertyDataOwner } from '@umbraco-cms/backoffice/content';
+import {
+	UmbContentValidationToHintsManager,
+	UmbElementWorkspaceDataManager,
+	type UmbElementPropertyDataOwner,
+} from '@umbraco-cms/backoffice/content';
 import { UmbReadOnlyVariantGuardManager } from '@umbraco-cms/backoffice/utils';
 
 import { UmbDataTypeItemRepositoryManager } from '@umbraco-cms/backoffice/data-type';
 import { UmbVariantPropertyGuardManager } from '@umbraco-cms/backoffice/property';
+import { UmbHintContext, type UmbVariantHint } from '@umbraco-cms/backoffice/hint';
 
 export class UmbBlockElementManager<LayoutDataType extends UmbBlockLayoutBaseModel = UmbBlockLayoutBaseModel>
 	extends UmbControllerBase
@@ -62,9 +67,21 @@ export class UmbBlockElementManager<LayoutDataType extends UmbBlockLayoutBaseMod
 
 	readonly validation = new UmbValidationController(this);
 
-	constructor(host: UmbBlockWorkspaceContext<LayoutDataType>, dataPathPropertyName: string) {
+	readonly hints;
+
+	constructor(
+		host: UmbBlockWorkspaceContext<LayoutDataType>,
+		dataPathPropertyName: string,
+		workspaceViewAlias: string,
+	) {
 		super(host);
 
+		this.hints = new UmbHintContext<UmbVariantHint>(this, { viewAlias: workspaceViewAlias });
+		this.hints.inherit();
+		new UmbContentValidationToHintsManager<UmbContentTypeModel>(this, this.structure, this.validation, this.hints, [
+			workspaceViewAlias,
+		]);
+
 		// Ugly, but we just inherit these from the workspace context: [NL]
 		this.name = host.name;
 		this.getName = host.getName;
@@ -241,6 +258,8 @@ export class UmbBlockElementManager<LayoutDataType extends UmbBlockLayoutBaseMod
 
 		// Provide Validation Context for this view:
 		this.validation.provideAt(host);
+
+		this.hints.provideAt(host);
 	}
 
 	public override destroy(): void {

src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/block-workspace.context.ts

@@ -23,6 +23,7 @@ import { decodeFilePath, UmbReadOnlyVariantGuardManager } from '@umbraco-cms/bac
 
 import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
 import type { UUIModalSidebarSize } from '@umbraco-cms/backoffice/external/uui';
+import { UMB_BLOCK_WORKSPACE_VIEW_CONTENT, UMB_BLOCK_WORKSPACE_VIEW_SETTINGS } from './constants.js';
 
 export type UmbBlockWorkspaceElementManagerNames = 'content' | 'settings';
 export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseModel = UmbBlockLayoutBaseModel>
@@ -58,9 +59,8 @@ export class UmbBlockWorkspaceContext<LayoutDataType extends UmbBlockLayoutBaseM
 	readonly unique = this.#layout.asObservablePart((x) => x?.contentKey);
 	readonly contentKey = this.#layout.asObservablePart((x) => x?.contentKey);
 
-	readonly content = new UmbBlockElementManager(this, 'contentData');
-
-	readonly settings = new UmbBlockElementManager(this, 'settingsData');
+	readonly content = new UmbBlockElementManager(this, 'contentData', UMB_BLOCK_WORKSPACE_VIEW_CONTENT);
+	readonly settings = new UmbBlockElementManager(this, 'settingsData', UMB_BLOCK_WORKSPACE_VIEW_SETTINGS);
 
 	#name = new UmbStringState<string | undefined>(undefined);
 	readonly name = this.#name.asObservable();

src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/constants.ts

@@ -0,0 +1,4 @@
+export const UMB_BLOCK_WORKSPACE_ALIAS = 'Umb.Workspace.Block';
+
+export const UMB_BLOCK_WORKSPACE_VIEW_CONTENT = 'Umb.WorkspaceView.Block.Content';
+export const UMB_BLOCK_WORKSPACE_VIEW_SETTINGS = 'Umb.WorkspaceView.Block.Settings';

src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/index.ts

@@ -1,5 +1,4 @@
 export * from './block-element-property-dataset.context-token.js';
 export * from './block-workspace.context-token.js';
 export * from './block-workspace.modal-token.js';
-
-export const UMB_BLOCK_WORKSPACE_ALIAS = 'Umb.Workspace.Block';
+export * from './constants.js';

src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/manifests.ts

@@ -1,4 +1,8 @@
-import { UMB_BLOCK_WORKSPACE_ALIAS } from './index.js';
+import {
+	UMB_BLOCK_WORKSPACE_ALIAS,
+	UMB_BLOCK_WORKSPACE_VIEW_CONTENT,
+	UMB_BLOCK_WORKSPACE_VIEW_SETTINGS,
+} from './constants.js';
 import { UMB_WORKSPACE_CONDITION_ALIAS, UmbSubmitWorkspaceAction } from '@umbraco-cms/backoffice/workspace';
 
 export const manifests: Array<UmbExtensionManifest> = [
@@ -57,7 +61,7 @@ export const manifests: Array<UmbExtensionManifest> = [
 	},
 	{
 		type: 'workspaceView',
-		alias: 'Umb.WorkspaceView.Block.Content',
+		alias: UMB_BLOCK_WORKSPACE_VIEW_CONTENT,
 		name: 'Block Workspace Content View',
 		element: () => import('./views/edit/block-workspace-view-edit.element.js'),
 		weight: 1000,
@@ -83,7 +87,7 @@ export const manifests: Array<UmbExtensionManifest> = [
 	// TODO: Fix manifest types so it support additional properties.
 	{
 		type: 'workspaceView',
-		alias: 'Umb.WorkspaceView.Block.Settings',
+		alias: UMB_BLOCK_WORKSPACE_VIEW_SETTINGS,
 		name: 'Block Workspace Settings View',
 		element: () => import('./views/edit/block-workspace-view-edit.element.js'),
 		weight: 900,

src/Umbraco.Web.UI.Client/src/packages/content/content/workspace/content-validation-to-hints.manager.ts

@@ -6,7 +6,7 @@ import type {
 } from '@umbraco-cms/backoffice/content-type';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 import type { UmbHintController, UmbVariantHint } from '@umbraco-cms/backoffice/hint';
-import { extractJsonQueryProps, type UmbValidationContext } from '@umbraco-cms/backoffice/validation';
+import { extractJsonQueryProps, type UmbValidationController } from '@umbraco-cms/backoffice/validation';
 import { UmbVariantId } from '@umbraco-cms/backoffice/variant';
 
 /*
@@ -39,8 +39,9 @@ export class UmbContentValidationToHintsManager<
 	constructor(
 		host: UmbControllerHost,
 		structure: UmbContentTypeStructureManager<ContentTypeDetailModelType>,
-		validation: UmbValidationContext,
+		validation: UmbValidationController,
 		hints: UmbHintController<UmbVariantHint>,
+		hintsPathPrefix: Array<string> = ['Umb.WorkspaceView.Document.Edit'],
 	) {
 		super(host);
 
@@ -77,7 +78,7 @@ export class UmbContentValidationToHintsManager<
 
 					hints.addOne({
 						unique: message.key,
-						path: ['Umb.WorkspaceView.Document.Edit', ...path],
+						path: [...hintsPathPrefix, ...path],
 						text: '!',
 						/*label: message.body,*/
 						color: 'invalid',

src/Umbraco.Web.UI.Client/src/packages/content/content/workspace/index.ts

@@ -1,2 +1,3 @@
 export * from './content-detail-workspace-base.js';
+export * from './content-validation-to-hints.manager.js';
 export type * from './content-workspace-context.interface.js';

src/Umbraco.Web.UI.Client/src/packages/core/hint/context/hints.context.ts

@@ -1,15 +1,15 @@
 import type { UmbHint, UmbIncomingHintBase } from '../types.js';
 import { UMB_HINT_CONTEXT } from './hint.context-token.js';
-import { UmbHintController } from './hints.controller.js';
+import { UmbHintController, type UmbHintControllerArgs } from './hints.controller.js';
 import type { UmbPartialSome } from '@umbraco-cms/backoffice/utils';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 
 export class UmbHintContext<
 	HintType extends UmbHint = UmbHint,
 	IncomingHintType extends UmbIncomingHintBase = UmbPartialSome<HintType, 'unique' | 'weight' | 'path'>,
 > extends UmbHintController<HintType, IncomingHintType> {
-	constructor(host: UmbControllerHost) {
-		super(host);
+	constructor(host: UmbControllerHost, args?: UmbHintControllerArgs<HintType>) {
+		super(host, args);
 		this.provideContext(UMB_HINT_CONTEXT, this as unknown as UmbHintContext);
 	}
 }

src/Umbraco.Web.UI.Client/src/packages/core/hint/context/hints.controller.ts

@@ -6,6 +6,11 @@ import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 import { UmbArrayState, UmbObjectState, type Observable } from '@umbraco-cms/backoffice/observable-api';
 import type { UmbContextProviderController } from '@umbraco-cms/backoffice/context-api';
 
+export interface UmbHintControllerArgs<HintType extends UmbHint = UmbHint> {
+	viewAlias?: string;
+	scaffold?: Partial<HintType>;
+}
+
 export class UmbHintController<
 	HintType extends UmbHint = UmbHint,
 	IncomingHintType extends UmbIncomingHintBase = UmbPartialSome<HintType, 'unique' | 'weight' | 'path'>,
@@ -35,7 +40,7 @@ export class UmbHintController<
 		return this.#scaffold.getValue();
 	}
 
-	constructor(host: UmbControllerHost, args?: { viewAlias?: string; scaffold?: Partial<HintType> }) {
+	constructor(host: UmbControllerHost, args?: UmbHintControllerArgs<HintType>) {
 		super(host);
 
 		this.#viewAlias = args?.viewAlias;