Feature: workspace info app extension

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

@@ -1,18 +1,17 @@
-import './entity-detail/global-components/index.js';
-
 export * from './components/index.js';
 export * from './conditions/const.js';
 export * from './constants.js';
 export * from './contexts/index.js';
 export * from './controllers/index.js';
-export * from './entity-detail/global-components/index.js';
 export * from './entity-detail/index.js';
 export * from './entity/index.js';
+export * from './info-app/index.js';
 export * from './modals/index.js';
 export * from './paths.js';
 export * from './submittable/index.js';
 export * from './utils/object-to-property-value-array.function.js';
 export * from './workspace-property-dataset/index.js';
 export * from './workspace.context-token.js';
 export * from './workspace.element.js';
+
 export type * from './types.js';

src/Umbraco.Web.UI.Client/src/packages/core/workspace/info-app/global-components/index.ts

@@ -0,0 +1,3 @@
+import './workspace-info-app-layout.element.js';
+
+export * from './workspace-info-app-layout.element.js';

src/Umbraco.Web.UI.Client/src/packages/core/workspace/info-app/global-components/workspace-info-app-layout.element.ts

@@ -0,0 +1,31 @@
+import { css, customElement, html, ifDefined, property } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+
+@customElement('umb-workspace-info-app-layout')
+export class UmbWorkspaceInfoAppLayoutElement extends UmbLitElement {
+	@property({ type: String })
+	headline?: string;
+
+	protected override render() {
+		return html`
+			<uui-box headline=${ifDefined(this.headline ? this.localize.string(this.headline) : undefined)}>
+				<slot name="header-actions" slot="header-actions"></slot>
+				<slot></slot>
+			</uui-box>
+		`;
+	}
+
+	static override styles = [
+		css`
+			uui-box {
+				--uui-box-default-padding: 0;
+			}
+		`,
+	];
+}
+
+declare global {
+	interface HTMLElementTagNameMap {
+		'umb-workspace-info-app-layout': UmbWorkspaceInfoAppLayoutElement;
+	}
+}

src/Umbraco.Web.UI.Client/src/packages/core/workspace/info-app/index.ts

@@ -0,0 +1,3 @@
+import './global-components/index.js';
+
+export * from './global-components/index.js';

src/Umbraco.Web.UI.Client/src/packages/core/workspace/info-app/types.ts

@@ -0,0 +1 @@
+export type * from './workspace-info-app.extension.js';

src/Umbraco.Web.UI.Client/src/packages/core/workspace/info-app/workspace-info-app.extension.ts

@@ -0,0 +1,21 @@
+import type { ManifestElement, ManifestWithDynamicConditions } from '@umbraco-cms/backoffice/extension-api';
+
+export interface UmbWorkspaceInfoAppElement extends HTMLElement {
+	manifest?: ManifestWorkspaceInfoApp;
+}
+
+export interface ManifestWorkspaceInfoApp
+	extends ManifestElement<UmbWorkspaceInfoAppElement>,
+		ManifestWithDynamicConditions<UmbExtensionConditionConfig> {
+	type: 'workspaceInfoApp';
+	meta: MetaWorkspaceInfoApp;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-object-type
+export interface MetaWorkspaceInfoApp {}
+
+declare global {
+	interface UmbExtensionManifestMap {
+		umbWorkspaceInfoApp: ManifestWorkspaceInfoApp;
+	}
+}

src/Umbraco.Web.UI.Client/src/packages/core/workspace/types.ts

@@ -1,11 +1,12 @@
 import type { UmbEntityUnique } from '@umbraco-cms/backoffice/entity';
 
-export type * from './extensions/types.js';
-export type * from './kinds/types.js';
 export type * from './conditions/types.js';
 export type * from './data-manager/types.js';
-export type * from './workspace-context.interface.js';
+export type * from './extensions/types.js';
+export type * from './info-app/types.js';
+export type * from './kinds/types.js';
 export type * from './namable/types.js';
+export type * from './workspace-context.interface.js';
 
 /**
  * @deprecated Use `UmbEntityUnique`instead.

src/Umbraco.Web.UI.Client/src/packages/documents/documents/workspace/views/info/document-workspace-view-info-history.element.ts → src/Umbraco.Web.UI.Client/src/packages/documents/documents/audit-log/info-app/document-history-workspace-info-app.element.ts

@@ -1,7 +1,8 @@
-import type { UmbDocumentAuditLogModel } from '../../../audit-log/types.js';
-import { UmbDocumentAuditLogRepository } from '../../../audit-log/index.js';
-import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from '../../document-workspace.context-token.js';
-import { getDocumentHistoryTagStyleAndText, TimeOptions } from './utils.js';
+import { UmbDocumentAuditLogRepository } from '../repository/index.js';
+import { UMB_DOCUMENT_WORKSPACE_CONTEXT } from '../../workspace/constants.js';
+import type { UmbDocumentAuditLogModel } from '../types.js';
+import { TimeOptions } from '../../utils.js';
+import { getDocumentHistoryTagStyleAndText } from './utils.js';
 import { css, customElement, html, nothing, repeat, state, when } from '@umbraco-cms/backoffice/external/lit';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 import { UmbPaginationManager } from '@umbraco-cms/backoffice/utils';
@@ -13,8 +14,8 @@ import type { ManifestEntityAction } from '@umbraco-cms/backoffice/entity-action
 import type { UmbUserItemModel } from '@umbraco-cms/backoffice/user';
 import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui';
 
-@customElement('umb-document-workspace-view-info-history')
-export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
+@customElement('umb-document-history-workspace-info-app')
+export class UmbDocumentHistoryWorkspaceInfoAppElement extends UmbLitElement {
 	#allowedActions = new Set(['Umb.EntityAction.Document.Rollback']);
 
 	#auditLogRepository = new UmbDocumentAuditLogRepository(this);
@@ -98,19 +99,22 @@ export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
 
 	override render() {
 		return html`
-			<uui-box headline=${this.localize.term('general_history')}>
+			<umb-workspace-info-app-layout headline="#general_history">
 				<umb-extension-with-api-slot
-				slot="header-actions"
-				type="entityAction"
-				.filter=${(manifest: ManifestEntityAction) => this.#allowedActions.has(manifest.alias)}></umb-extension-with-api-slot>
-			</uui-button>
-			${when(
-				this._items,
-				() => this.#renderHistory(),
-				() => html`<div id="loader"><uui-loader></uui-loader></div>`,
-			)}
-			${this.#renderPagination()}
-		</uui-box>
+					slot="header-actions"
+					type="entityAction"
+					.filter=${(manifest: ManifestEntityAction) =>
+						this.#allowedActions.has(manifest.alias)}></umb-extension-with-api-slot>
+
+				<div id="content">
+					${when(
+						this._items,
+						() => this.#renderHistory(),
+						() => html`<div id="loader"><uui-loader></uui-loader></div>`,
+					)}
+					${this.#renderPagination()}
+				</div>
+			</umb-workspace-info-app-layout>
 		`;
 	}
 
@@ -162,6 +166,11 @@ export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
 	static override styles = [
 		UmbTextStyles,
 		css`
+			#content {
+				display: block;
+				padding: var(--uui-size-space-4) var(--uui-size-space-5);
+			}
+
 			#loader {
 				display: flex;
 				justify-content: center;
@@ -173,6 +182,12 @@ export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
 				gap: var(--uui-size-layout-1);
 			}
 
+			.log-type uui-tag {
+				height: fit-content;
+				margin-top: auto;
+				margin-bottom: auto;
+			}
+
 			uui-pagination {
 				flex: 1;
 				display: flex;
@@ -183,10 +198,10 @@ export class UmbDocumentWorkspaceViewInfoHistoryElement extends UmbLitElement {
 	];
 }
 
-export default UmbDocumentWorkspaceViewInfoHistoryElement;
+export default UmbDocumentHistoryWorkspaceInfoAppElement;
 
 declare global {
 	interface HTMLElementTagNameMap {
-		'umb-document-workspace-view-info-history': UmbDocumentWorkspaceViewInfoHistoryElement;
+		'umb-document-history-workspace-info-app': UmbDocumentHistoryWorkspaceInfoAppElement;
 	}
 }

src/Umbraco.Web.UI.Client/src/packages/documents/documents/audit-log/info-app/manifests.ts

@@ -0,0 +1,18 @@
+import { UMB_DOCUMENT_WORKSPACE_ALIAS } from '../../workspace/constants.js';
+import { UMB_WORKSPACE_CONDITION_ALIAS } from '@umbraco-cms/backoffice/workspace';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'workspaceInfoApp',
+		name: 'Document History Workspace Info App',
+		alias: 'Umb.WorkspaceInfoApp.Document.History',
+		element: () => import('./document-history-workspace-info-app.element.js'),
+		weight: 80,
+		conditions: [
+			{
+				alias: UMB_WORKSPACE_CONDITION_ALIAS,
+				match: UMB_DOCUMENT_WORKSPACE_ALIAS,
+			},
+		],
+	},
+];

src/Umbraco.Web.UI.Client/src/packages/documents/documents/workspace/views/info/utils.ts → src/Umbraco.Web.UI.Client/src/packages/documents/documents/audit-log/info-app/utils.ts

@@ -1,4 +1,4 @@
-import { UmbDocumentAuditLog, type UmbDocumentAuditLogType } from '../../../audit-log/utils/index.js';
+import { UmbDocumentAuditLog, type UmbDocumentAuditLogType } from '../utils/index.js';
 
 interface HistoryStyleMap {
 	look: 'default' | 'primary' | 'secondary' | 'outline' | 'placeholder';
@@ -137,12 +137,3 @@ export function getDocumentHistoryTagStyleAndText(type: UmbDocumentAuditLogType)
 			};
 	}
 }
-
-export const TimeOptions: Intl.DateTimeFormatOptions = {
-	year: 'numeric',
-	month: 'long',
-	day: 'numeric',
-	hour: 'numeric',
-	minute: 'numeric',
-	second: 'numeric',
-};

src/Umbraco.Web.UI.Client/src/packages/documents/documents/audit-log/manifests.ts

@@ -0,0 +1,4 @@
+import { manifests as infoAppManifests } from './info-app/manifests.js';
+import type { UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-registry';
+
+export const manifests: Array<UmbExtensionManifest | UmbExtensionManifestKind> = [...infoAppManifests];

src/Umbraco.Web.UI.Client/src/packages/documents/documents/constants.ts

@@ -12,5 +12,6 @@ export * from './reference/constants.js';
 export * from './repository/constants.js';
 export * from './rollback/constants.js';
 export * from './search/constants.js';
+export * from './url/constants.js';
 export * from './user-permissions/constants.js';
 export * from './workspace/constants.js';

src/Umbraco.Web.UI.Client/src/packages/documents/documents/index.ts

@@ -1,16 +1,17 @@
 import './components/index.js';
 
-export { UmbDocumentAuditLogRepository } from './audit-log/index.js';
+export * from './audit-log/index.js';
 export * from './components/index.js';
-export * from './entity-actions/index.js';
 export * from './constants.js';
+export * from './entity-actions/index.js';
 export * from './global-contexts/index.js';
 export * from './modals/index.js';
 export * from './paths.js';
 export * from './publishing/index.js';
 export * from './recycle-bin/index.js';
 export * from './reference/index.js';
 export * from './repository/index.js';
+export * from './url/index.js';
 export * from './user-permissions/index.js';
 
 export * from './tree/index.js';

src/Umbraco.Web.UI.Client/src/packages/documents/documents/manifests.ts

@@ -1,3 +1,4 @@
+import { manifests as auditLogManifests } from './audit-log/manifests.js';
 import { manifests as collectionManifests } from './collection/manifests.js';
 import { manifests as entityActionManifests } from './entity-actions/manifests.js';
 import { manifests as entityBulkActionManifests } from './entity-bulk-actions/manifests.js';
@@ -13,12 +14,14 @@ import { manifests as rollbackManifests } from './rollback/manifests.js';
 import { manifests as searchProviderManifests } from './search/manifests.js';
 import { manifests as trackedReferenceManifests } from './reference/manifests.js';
 import { manifests as treeManifests } from './tree/manifests.js';
+import { manifests as urlManifests } from './url/manifests.js';
 import { manifests as userPermissionManifests } from './user-permissions/manifests.js';
 import { manifests as workspaceManifests } from './workspace/manifests.js';
 
 import type { UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-registry';
 
 export const manifests: Array<UmbExtensionManifest | UmbExtensionManifestKind> = [
+	...auditLogManifests,
 	...collectionManifests,
 	...entityActionManifests,
 	...entityBulkActionManifests,
@@ -34,6 +37,7 @@ export const manifests: Array<UmbExtensionManifest | UmbExtensionManifestKind> =
 	...searchProviderManifests,
 	...trackedReferenceManifests,
 	...treeManifests,
+	...urlManifests,
 	...userPermissionManifests,
 	...workspaceManifests,
 ];