From ac4db1a2d142b2f90a45b8cf5c1db1add784a4d1 Mon Sep 17 00:00:00 2001 From: leekelleher Date: Tue, 20 Feb 2024 17:37:08 +0000 Subject: [PATCH] Adds mock API for Document and Media Collection --- .../document/document-collection.manager.ts | 42 +++++++++++++++++++ .../src/mocks/data/document/document.db.ts | 37 ++++++++++++---- .../data/media/media-collection.manager.ts | 40 ++++++++++++++++++ .../src/mocks/data/media/media.data.ts | 9 +++- .../src/mocks/data/media/media.db.ts | 22 +++++++++- .../handlers/document/collection.handlers.ts | 18 ++++++++ .../src/mocks/handlers/document/index.ts | 2 + .../handlers/media/collection.handlers.ts | 17 ++++++++ .../src/mocks/handlers/media/index.ts | 9 +++- 9 files changed, 183 insertions(+), 13 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/mocks/data/document/document-collection.manager.ts create mode 100644 src/Umbraco.Web.UI.Client/src/mocks/data/media/media-collection.manager.ts create mode 100644 src/Umbraco.Web.UI.Client/src/mocks/handlers/document/collection.handlers.ts create mode 100644 src/Umbraco.Web.UI.Client/src/mocks/handlers/media/collection.handlers.ts diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document-collection.manager.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document-collection.manager.ts new file mode 100644 index 0000000000..945127fc48 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document-collection.manager.ts @@ -0,0 +1,42 @@ +import type { UmbMockDocumentModel } from './document.data.js'; +import type { UmbDocumentMockDB } from './document.db.js'; +import type { DirectionModel, DocumentCollectionResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; + +export class UmbMockDocumentCollectionManager { + #documentDb: UmbDocumentMockDB; + + #collectionMapper: (item: UmbMockDocumentModel) => DocumentCollectionResponseModel; + + constructor( + documentDb: UmbDocumentMockDB, + collectionMapper: (item: UmbMockDocumentModel) => DocumentCollectionResponseModel, + ) { + this.#documentDb = documentDb; + this.#collectionMapper = collectionMapper; + } + + getCollectionDocumentById({ + id, + dataTypeId, + orderBy, + orderCulture, + orderDirection, + filter, + skip = 0, + take = 100, + }: { + id: string; + dataTypeId?: string; + orderBy?: string; + orderCulture?: string; + orderDirection?: DirectionModel; + filter?: string; + skip?: number; + take?: number; + }) { + const collection = this.#documentDb.getAll().filter((item) => item.parent?.id === id); + const items = collection.map((item) => this.#collectionMapper(item)).slice(skip, skip + take); + const total = collection.length; + return { items: items, total }; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts index 75dcb195a5..83569d63e1 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts @@ -4,18 +4,20 @@ import { UmbMockEntityDetailManager } from '../utils/entity/entity-detail.manage import { umbDocumentTypeMockDb } from '../document-type/document-type.db.js'; import { UmbEntityMockDbBase } from '../utils/entity/entity-base.js'; import { UmbEntityRecycleBin } from '../utils/entity/entity-recycle-bin.js'; -import type { UmbMockDocumentModel } from './document.data.js'; import { data } from './document.data.js'; +import { UmbMockDocumentCollectionManager } from './document-collection.manager.js'; import { UmbMockDocumentPublishingManager } from './document-publishing.manager.js'; -import { - DocumentVariantStateModel, - type CreateDocumentRequestModel, - type DocumentItemResponseModel, - type DocumentResponseModel, - type DocumentTreeItemResponseModel, - type DomainsResponseModel, -} from '@umbraco-cms/backoffice/external/backend-api'; +import type { UmbMockDocumentModel } from './document.data.js'; +import { DocumentVariantStateModel } from '@umbraco-cms/backoffice/external/backend-api'; import { UmbId } from '@umbraco-cms/backoffice/id'; +import type { + DocumentCollectionResponseModel, + CreateDocumentRequestModel, + DocumentItemResponseModel, + DocumentResponseModel, + DocumentTreeItemResponseModel, + DomainsResponseModel, +} from '@umbraco-cms/backoffice/external/backend-api'; export class UmbDocumentMockDB extends UmbEntityMockDbBase { tree = new UmbMockEntityTreeManager(this, treeItemMapper); @@ -23,6 +25,7 @@ export class UmbDocumentMockDB extends UmbEntityMockDbBase detail = new UmbMockEntityDetailManager(this, createMockDocumentMapper, detailResponseMapper); recycleBin = new UmbEntityRecycleBin(this.data, treeItemMapper); publishing = new UmbMockDocumentPublishingManager(this); + collection = new UmbMockDocumentCollectionManager(this, collectionMapper); constructor(data: Array) { super(data); @@ -118,4 +121,20 @@ const itemMapper = (model: UmbMockDocumentModel): DocumentItemResponseModel => { }; }; +const collectionMapper = (model: UmbMockDocumentModel): DocumentCollectionResponseModel => { + return { + creator: null, + documentType: { + id: model.documentType.id, + alias: '', + icon: model.documentType.icon, + }, + id: model.id, + sortOrder: 0, + updater: null, + values: model.values, + variants: model.variants, + }; +}; + export const umbDocumentMockDb = new UmbDocumentMockDB(data); diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media-collection.manager.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media-collection.manager.ts new file mode 100644 index 0000000000..bbcd972681 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media-collection.manager.ts @@ -0,0 +1,40 @@ +import type { UmbMockMediaModel } from './media.data.js'; +import type { UmbMediaMockDB } from './media.db.js'; +import type { DirectionModel, MediaCollectionResponseModel } from '@umbraco-cms/backoffice/external/backend-api'; + +export class UmbMockMediaCollectionManager { + #mediaDb: UmbMediaMockDB; + + #collectionMapper: (item: UmbMockMediaModel) => MediaCollectionResponseModel; + + constructor(mediaDb: UmbMediaMockDB, collectionMapper: (item: UmbMockMediaModel) => MediaCollectionResponseModel) { + this.#mediaDb = mediaDb; + this.#collectionMapper = collectionMapper; + } + + getCollectionMedia({ + id, + dataTypeId, + orderBy, + orderDirection, + filter, + skip = 0, + take = 100, + }: { + id?: string; + dataTypeId?: string; + orderBy?: string; + orderDirection?: DirectionModel; + filter?: string; + skip?: number; + take?: number; + }) { + const collection = !id + ? this.#mediaDb.getAll().filter((item) => item.parent === null) + : this.#mediaDb.getAll().filter((item) => item.parent?.id === id); + + const items = collection.map((item) => this.#collectionMapper(item)).slice(skip, skip + take); + const total = collection.length; + return { items: items, total }; + } +} diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts index ab0853eea0..c904b680f0 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.data.ts @@ -161,7 +161,14 @@ export const data: Array = [ value: 'Every day, a rabbit in a military costume greets me at the front door', }, ], - variants: [], + variants: [{ + publishDate: '2023-02-06T15:31:51.354764', + culture: 'en-us', + segment: null, + name: 'John Doe', + createDate: '2023-02-06T15:31:46.876902', + updateDate: '2023-02-06T15:31:51.354764', + },], urls: [], }, { diff --git a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts index 88a0f94b32..6a550904ce 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts @@ -4,21 +4,24 @@ import { UmbMockEntityDetailManager } from '../utils/entity/entity-detail.manage import { umbMediaTypeMockDb } from '../media-type/media-type.db.js'; import { UmbEntityMockDbBase } from '../utils/entity/entity-base.js'; import { UmbEntityRecycleBin } from '../utils/entity/entity-recycle-bin.js'; -import type { UmbMockMediaModel } from './media.data.js'; +import { UmbMockMediaCollectionManager } from './media-collection.manager.js'; import { data } from './media.data.js'; +import type { UmbMockMediaModel } from './media.data.js'; +import { UmbId } from '@umbraco-cms/backoffice/id'; import type { CreateMediaRequestModel, + MediaCollectionResponseModel, MediaItemResponseModel, MediaResponseModel, MediaTreeItemResponseModel, } from '@umbraco-cms/backoffice/external/backend-api'; -import { UmbId } from '@umbraco-cms/backoffice/id'; export class UmbMediaMockDB extends UmbEntityMockDbBase { tree = new UmbMockEntityTreeManager(this, treeItemMapper); item = new UmbMockEntityItemManager(this, itemMapper); detail = new UmbMockEntityDetailManager(this, createMockMediaMapper, detailResponseMapper); recycleBin = new UmbEntityRecycleBin(this.data, treeItemMapper); + collection = new UmbMockMediaCollectionManager(this, collectionMapper); constructor(data: Array) { super(data); @@ -100,4 +103,19 @@ const itemMapper = (model: UmbMockMediaModel): MediaItemResponseModel => { }; }; +const collectionMapper = (model: UmbMockMediaModel): MediaCollectionResponseModel => { + return { + creator: null, + id: model.id, + mediaType: { + id: model.mediaType.id, + alias: '', + icon: model.mediaType.icon, + }, + sortOrder: 0, + values: model.values, + variants: model.variants, + }; +}; + export const umbMediaMockDb = new UmbMediaMockDB(data); diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/collection.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/collection.handlers.ts new file mode 100644 index 0000000000..2e80e47387 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/collection.handlers.ts @@ -0,0 +1,18 @@ +const { rest } = window.MockServiceWorker; +import { umbDocumentMockDb } from '../../data/document/document.db.js'; +import { UMB_SLUG } from './slug.js'; +import { umbracoPath } from '@umbraco-cms/backoffice/utils'; + +export const collectionHandlers = [ + rest.get(umbracoPath(`/collection${UMB_SLUG}/:id`), (req, res, ctx) => { + const id = req.params.id as string; + if (!id) return res(ctx.status(400)); + + const skip = Number(req.url.searchParams.get('skip')); + const take = Number(req.url.searchParams.get('take')); + + const response = umbDocumentMockDb.collection.getCollectionDocumentById({ id, skip, take }); + + return res(ctx.status(200), ctx.json(response)); + }), +]; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/index.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/index.ts index 958b356d8a..a887a19d3b 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/index.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/document/index.ts @@ -5,6 +5,7 @@ import { permissionHandlers } from './permission.handlers.js'; import { publishingHandlers } from './publishing.handlers.js'; import { detailHandlers } from './detail.handlers.js'; import { domainHandlers } from './domain.handlers.js'; +import { collectionHandlers } from './collection.handlers.js'; export const handlers = [ ...recycleBinHandlers, @@ -14,4 +15,5 @@ export const handlers = [ ...publishingHandlers, ...detailHandlers, ...domainHandlers, + ...collectionHandlers, ]; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/collection.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/collection.handlers.ts new file mode 100644 index 0000000000..edf018ab29 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/collection.handlers.ts @@ -0,0 +1,17 @@ +const { rest } = window.MockServiceWorker; +import { umbMediaMockDb } from '../../data/media/media.db.js'; +import { UMB_SLUG } from './slug.js'; +import { umbracoPath } from '@umbraco-cms/backoffice/utils'; + +export const collectionHandlers = [ + rest.get(umbracoPath(`/collection${UMB_SLUG}`), (req, res, ctx) => { + const id = req.url.searchParams.get('id') ?? ''; + + const skip = Number(req.url.searchParams.get('skip')); + const take = Number(req.url.searchParams.get('take')); + + const response = umbMediaMockDb.collection.getCollectionMedia({ id, skip, take }); + + return res(ctx.status(200), ctx.json(response)); + }), +]; diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/index.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/index.ts index 963a027993..e8034da84d 100644 --- a/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/index.ts +++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/media/index.ts @@ -2,5 +2,12 @@ import { recycleBinHandlers } from './recycle-bin.handlers.js'; import { treeHandlers } from './tree.handlers.js'; import { itemHandlers } from './item.handlers.js'; import { detailHandlers } from './detail.handlers.js'; +import { collectionHandlers } from './collection.handlers.js'; -export const handlers = [...recycleBinHandlers, ...treeHandlers, ...itemHandlers, ...detailHandlers]; +export const handlers = [ + ...recycleBinHandlers, + ...treeHandlers, + ...itemHandlers, + ...detailHandlers, + ...collectionHandlers, +];