media composition

Author: nielslyngsoe

src/packages/documents/document-types/repository/composition/index.ts

@@ -1,2 +1 @@
-export { UmbDocumentTypeCompositionRepository } from './document-type-composition.repository.js';
 export { UMB_DOCUMENT_TYPE_COMPOSITION_REPOSITORY_ALIAS } from './manifests.js';

src/packages/documents/document-types/repository/composition/manifests.ts

@@ -2,11 +2,11 @@ import type { ManifestRepository, ManifestTypes } from '@umbraco-cms/backoffice/
 
 export const UMB_DOCUMENT_TYPE_COMPOSITION_REPOSITORY_ALIAS = 'Umb.Repository.DocumentType.Composition';
 
-const queryRepository: ManifestRepository = {
+const compositionRepository: ManifestRepository = {
 	type: 'repository',
 	alias: UMB_DOCUMENT_TYPE_COMPOSITION_REPOSITORY_ALIAS,
 	name: 'Document Type Composition Repository',
 	api: () => import('./document-type-composition.repository.js'),
 };
 
-export const manifests: Array<ManifestTypes> = [queryRepository];
+export const manifests: Array<ManifestTypes> = [compositionRepository];

src/packages/media/media-types/index.ts

@@ -1,12 +1,11 @@
 import './components/index.js';
 
 export * from './components/index.js';
-export * from './workspace/index.js';
-
+export * from './entity.js';
 export * from './repository/index.js';
 export * from './tree/types.js';
-export * from './utils.ts/index.js';
 export * from './types.js';
-export * from './entity.js';
+export * from './utils.ts/index.js';
+export * from './workspace/index.js';
 
 export { UMB_MEDIA_TYPE_PICKER_MODAL } from './tree/index.js';

src/packages/media/media-types/repository/composition/index.ts

@@ -0,0 +1 @@
+export { UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS } from './manifests.js';

src/packages/media/media-types/repository/composition/manifests.ts

@@ -0,0 +1,12 @@
+import type { ManifestRepository, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
+
+export const UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS = 'Umb.Repository.MediaType.Composition';
+
+const compositionRepository: ManifestRepository = {
+	type: 'repository',
+	alias: UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS,
+	name: 'Media Type Composition Repository',
+	api: () => import('./media-type-composition.repository.js'),
+};
+
+export const manifests: Array<ManifestTypes> = [compositionRepository];

src/packages/media/media-types/repository/composition/media-type-composition.repository.ts

@@ -0,0 +1,36 @@
+import { UmbMediaTypeCompositionServerDataSource } from './media-type-composition.server.data-source.js';
+import type { UmbContentTypeCompositionRepository } from '@umbraco-cms/backoffice/content-type';
+import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
+import type {
+	UmbMediaTypeAvailableCompositionRequestModel,
+	UmbMediaTypeCompositionCompatibleModel,
+	UmbMediaTypeCompositionReferenceModel,
+} from '@umbraco-cms/backoffice/media-type';
+import { UmbRepositoryBase } from '@umbraco-cms/backoffice/repository';
+
+export class UmbMediaTypeCompositionRepository
+	extends UmbRepositoryBase
+	implements
+		UmbContentTypeCompositionRepository<
+			UmbMediaTypeCompositionReferenceModel,
+			UmbMediaTypeCompositionCompatibleModel,
+			UmbMediaTypeAvailableCompositionRequestModel
+		>
+{
+	#compositionSource: UmbMediaTypeCompositionServerDataSource;
+
+	constructor(host: UmbControllerHost) {
+		super(host);
+		this.#compositionSource = new UmbMediaTypeCompositionServerDataSource(this);
+	}
+
+	async getReferences(unique: string) {
+		return this.#compositionSource.getReferences(unique);
+	}
+
+	async availableCompositions(args: UmbMediaTypeAvailableCompositionRequestModel) {
+		return this.#compositionSource.availableCompositions(args);
+	}
+}
+
+export { UmbMediaTypeCompositionRepository as api };

src/packages/media/media-types/repository/composition/media-type-composition.server.data-source.ts

@@ -0,0 +1,86 @@
+import type {
+	UmbMediaTypeCompositionCompatibleModel,
+	UmbMediaTypeCompositionReferenceModel,
+	UmbMediaTypeAvailableCompositionRequestModel,
+} from '../../types.js';
+import { type MediaTypeCompositionRequestModel, MediaTypeService } from '@umbraco-cms/backoffice/external/backend-api';
+import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
+import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources';
+import type { UmbContentTypeCompositionDataSource } from '@umbraco-cms/backoffice/content-type';
+
+/**
+ * A data source for the Media Type Composition that fetches data from the server
+ * @export
+ * @class UmbMediaTypeCompositionServerDataSource
+ */
+export class UmbMediaTypeCompositionServerDataSource
+	implements
+		UmbContentTypeCompositionDataSource<
+			UmbMediaTypeCompositionReferenceModel,
+			UmbMediaTypeCompositionCompatibleModel,
+			UmbMediaTypeAvailableCompositionRequestModel
+		>
+{
+	#host: UmbControllerHost;
+
+	/**
+	 * Creates an instance of UmbMediaTypeCompositionServerDataSource.
+	 * @param {UmbControllerHost} host
+	 * @memberof UmbMediaTypeCompositionServerDataSource
+	 */
+	constructor(host: UmbControllerHost) {
+		this.#host = host;
+	}
+	/**
+	 * Fetches the compatible compositions for a Media type from the server
+	 * @param {string} unique
+	 * @return {*}
+	 * @memberof UmbMediaTypeCompositionServerDataSource
+	 */
+	async getReferences(unique: string) {
+		const response = await tryExecuteAndNotify(
+			this.#host,
+			MediaTypeService.getMediaTypeByIdCompositionReferences({ id: unique }),
+		);
+		const error = response.error;
+		const data: Array<UmbMediaTypeCompositionReferenceModel> | undefined = response.data?.map((reference) => {
+			return {
+				unique: reference.id,
+				icon: reference.icon,
+				name: reference.name,
+			};
+		});
+
+		return { data, error };
+	}
+	/**
+	 * Updates the compositions for a media type on the server
+	 * @param {MediaTypeCompositionRequestModel} requestBody
+	 * @return {*}
+	 * @memberof UmbMediaTypeCompositionServerDataSource
+	 */
+	async availableCompositions(args: UmbMediaTypeAvailableCompositionRequestModel) {
+		const requestBody: MediaTypeCompositionRequestModel = {
+			id: args.unique,
+			currentCompositeIds: args.currentCompositeUniques,
+			currentPropertyAliases: args.currentPropertyAliases,
+		};
+
+		const response = await tryExecuteAndNotify(
+			this.#host,
+			MediaTypeService.postMediaTypeAvailableCompositions({ requestBody }),
+		);
+		const error = response.error;
+		const data: Array<UmbMediaTypeCompositionCompatibleModel> | undefined = response.data?.map((composition) => {
+			return {
+				unique: composition.id,
+				name: composition.name,
+				icon: composition.icon,
+				folderPath: composition.folderPath,
+				isCompatible: composition.isCompatible,
+			};
+		});
+
+		return { data, error };
+	}
+}

src/packages/media/media-types/repository/index.ts

@@ -1,3 +1,4 @@
-export * from './item/index.js';
+export * from './composition/index.js';
 export * from './detail/index.js';
+export * from './item/index.js';
 export * from './structure/index.js';

src/packages/media/media-types/types.ts

@@ -1,6 +1,17 @@
 import type { UmbMediaTypeEntityType } from './entity.js';
-import type { UmbContentTypeModel } from '@umbraco-cms/backoffice/content-type';
+import type {
+	UmbContentTypeAvailableCompositionRequestModel,
+	UmbContentTypeCompositionCompatibleModel,
+	UmbContentTypeCompositionReferenceModel,
+	UmbContentTypeModel,
+} from '@umbraco-cms/backoffice/content-type';
 
 export interface UmbMediaTypeDetailModel extends UmbContentTypeModel {
 	entityType: UmbMediaTypeEntityType;
 }
+
+export interface UmbMediaTypeAvailableCompositionRequestModel extends UmbContentTypeAvailableCompositionRequestModel {}
+
+export interface UmbMediaTypeCompositionCompatibleModel extends UmbContentTypeCompositionCompatibleModel {}
+
+export interface UmbMediaTypeCompositionReferenceModel extends UmbContentTypeCompositionReferenceModel {}

src/packages/media/media-types/workspace/manifests.ts

@@ -1,3 +1,4 @@
+import { UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS } from '../repository/index.js';
 import { UMB_MEDIA_TYPE_WORKSPACE_ALIAS } from './constants.js';
 import type {
 	ManifestWorkspaces,
@@ -29,6 +30,7 @@ const workspaceViews: Array<ManifestWorkspaceViews> = [
 			label: '#general_design',
 			pathname: 'design',
 			icon: 'icon-document-dashed-line',
+			compositionRepositoryAlias: UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS,
 		},
 		conditions: [
 			{