From f2306733fd25adfdcbd4bb156b67684e49eb797e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= Date: Tue, 30 Jul 2024 16:19:17 +0200 Subject: [PATCH] media composition --- .../repository/composition/index.ts | 1 - .../repository/composition/manifests.ts | 4 +- .../src/packages/media/media-types/index.ts | 7 +- .../repository/composition/index.ts | 1 + .../repository/composition/manifests.ts | 12 +++ .../media-type-composition.repository.ts | 36 ++++++++ ...dia-type-composition.server.data-source.ts | 86 +++++++++++++++++++ .../media/media-types/repository/index.ts | 3 +- .../src/packages/media/media-types/types.ts | 13 ++- .../media/media-types/workspace/manifests.ts | 2 + 10 files changed, 156 insertions(+), 9 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/index.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/manifests.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.repository.ts create mode 100644 src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.server.data-source.ts diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/index.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/index.ts index 99c179ec94..8a9f7eae16 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/index.ts +++ b/src/Umbraco.Web.UI.Client/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'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/manifests.ts index 1732701de6..b01f3b0be9 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/repository/composition/manifests.ts +++ b/src/Umbraco.Web.UI.Client/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 = [queryRepository]; +export const manifests: Array = [compositionRepository]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/index.ts index 39c2b4ea8b..4fdc741116 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/index.ts +++ b/src/Umbraco.Web.UI.Client/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'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/index.ts new file mode 100644 index 0000000000..e9c3158173 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/index.ts @@ -0,0 +1 @@ +export { UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS } from './manifests.js'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/manifests.ts new file mode 100644 index 0000000000..16ad5b903c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/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 = [compositionRepository]; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.repository.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.repository.ts new file mode 100644 index 0000000000..a73570e069 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/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 }; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/composition/media-type-composition.server.data-source.ts new file mode 100644 index 0000000000..81e1e7d28b --- /dev/null +++ b/src/Umbraco.Web.UI.Client/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 | 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 | undefined = response.data?.map((composition) => { + return { + unique: composition.id, + name: composition.name, + icon: composition.icon, + folderPath: composition.folderPath, + isCompatible: composition.isCompatible, + }; + }); + + return { data, error }; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/index.ts index e84c58d982..e3bd416604 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/repository/index.ts +++ b/src/Umbraco.Web.UI.Client/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'; diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/types.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/types.ts index 828514db06..17acb2e86e 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/types.ts +++ b/src/Umbraco.Web.UI.Client/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 {} diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/manifests.ts index a0cb73a866..01293d0d96 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/workspace/manifests.ts +++ b/src/Umbraco.Web.UI.Client/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 = [ label: '#general_design', pathname: 'design', icon: 'icon-document-dashed-line', + compositionRepositoryAlias: UMB_MEDIA_TYPE_COMPOSITION_REPOSITORY_ALIAS, }, conditions: [ {