yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature: Document Blueprint Folders

Browse Source
This commit is contained in:
Lone Iversen
2024-04-12 11:45:05 +02:00
parent 7462488efb
commit f3cfc20175
11 changed files with 200 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/entity-actions/create/modal/document-blueprint-options-create-modal.element.ts
View File

@@ -1,3 +1,4 @@
import { UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS } from '../../../tree/folder/manifests.js';
import type {
UmbDocumentBlueprintOptionsCreateModalData,
UmbDocumentBlueprintOptionsCreateModalValue,
@@ -6,13 +7,42 @@ import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import { html, customElement, css } from '@umbraco-cms/backoffice/external/lit';
import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
import { type UmbSelectedEvent, UmbSelectionChangeEvent } from '@umbraco-cms/backoffice/event';
import type { UmbTreeElement } from '@umbraco-cms/backoffice/tree';
import { UmbCreateFolderEntityAction, type UmbTreeElement } from '@umbraco-cms/backoffice/tree';
@customElement('umb-document-blueprint-options-create-modal')
export class UmbDocumentBlueprintOptionsCreateModalElement extends UmbModalBaseElement<
UmbDocumentBlueprintOptionsCreateModalData,
UmbDocumentBlueprintOptionsCreateModalValue
> {
#createFolderAction?: UmbCreateFolderEntityAction;
connectedCallback(): void {
super.connectedCallback();
if (!this.data?.parent) throw new Error('A parent is required to create a folder');
// TODO: render the info from this instance in the list of actions
this.#createFolderAction = new UmbCreateFolderEntityAction(this, {
unique: this.data.parent.unique,
entityType: this.data.parent.entityType,
meta: {
icon: 'icon-folder',
label: 'New Folder...',
folderRepositoryAlias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
},
});
}
async #onCreateFolderClick(event: PointerEvent) {
event.stopPropagation();
try {
await this.#createFolderAction?.execute();
this._submitModal();
} catch (error) {
console.error(error);
}
}
#onSelected(event: UmbSelectedEvent) {
event.stopPropagation();
const element = event.target as UmbTreeElement;
@@ -24,8 +54,12 @@ export class UmbDocumentBlueprintOptionsCreateModalElement extends UmbModalBaseE
render() {
return html`
<umb-body-layout headline=${this.localize.term('actions_createblueprint')}>
<uui-box>
<strong>Create an item under Content Templates</strong>
<uui-box headline="Create a folder under Content Templates">
<uui-menu-item @click=${this.#onCreateFolderClick} label="New Folder...">
<uui-icon slot="icon" name="icon-folder"></uui-icon>
</uui-menu-item>
</uui-box>
<uui-box headline="Create an item under Content Templates">
<umb-localize key="create_createContentBlueprint">
Select the Document Type you want to make a content blueprint for
</umb-localize>
@@ -45,8 +79,8 @@ export class UmbDocumentBlueprintOptionsCreateModalElement extends UmbModalBaseE
static styles = [
UmbTextStyles,
css`
strong {
display: block;
uui-box:first-child {
margin-bottom: var(--uui-size-6);
}
`,
];

12
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/document-blueprint-tree.server.data-source.ts
View File

@@ -1,4 +1,4 @@
import { UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE } from '../entity.js';
import { UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE, UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../entity.js';
import type { UmbDocumentBlueprintTreeItemModel } from './types.js';
import { UmbTreeServerDataSourceBase } from '@umbraco-cms/backoffice/tree';
import { DocumentBlueprintService } from '@umbraco-cms/backoffice/external/backend-api';
@@ -43,27 +43,25 @@ const getChildrenOf = (args: UmbTreeChildrenOfRequestArgs) => {
if (args.parentUnique === null) {
return getRootItems(args);
} else {
throw new Error('Not implemented');
/*
// eslint-disable-next-line local-rules/no-direct-api-import
return DocumentBlueprintService.getTreeDocumentBlueprintChildren({
parentId: args.parentUnique,
});
*/
}
};
const getAncestorsOf = (args: UmbTreeAncestorsOfRequestArgs) => {
throw new Error('Not implemented');
/** TODO: Implement when endpoint becomes available... */
};
const mapper = (item: DocumentBlueprintTreeItemResponseModel): UmbDocumentBlueprintTreeItemModel => {
return {
unique: item.id,
parentUnique: item.parent?.id || null,
name: (item as any).variants?.[0].name ?? item.name,
entityType: UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE,
isFolder: false,
name: (item as any).variants?.[0].name ?? item.name,
entityType: item.isFolder ? UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE : UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE,
isFolder: item.isFolder,
hasChildren: item.hasChildren,
};
};

16
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/folder/document-blueprint-folder.repository.ts
View File

@@ -1,9 +1,9 @@
// import { UmbDocumentBlueprintFolderServerDataSource } from './document-blueprint-folder.server.data-source.js';
// import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
// import { UmbFolderRepositoryBase } from '@umbraco-cms/backoffice/tree';
import { UmbDocumentBlueprintFolderServerDataSource } from './document-blueprint-folder.server.data-source.js';
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { UmbFolderRepositoryBase } from '@umbraco-cms/backoffice/tree';
// export class UmbDocumentBlueprintFolderRepository extends UmbFolderRepositoryBase {
// constructor(host: UmbControllerHost) {
// super(host, UmbDocumentBlueprintFolderServerDataSource);
// }
// }
export class UmbDocumentBlueprintFolderRepository extends UmbFolderRepositoryBase {
constructor(host: UmbControllerHost) {
super(host, UmbDocumentBlueprintFolderServerDataSource);
}
}

210
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/folder/document-blueprint-folder.server.data-source.ts
View File

@@ -1,122 +1,122 @@
// import type { UmbCreateFolderModel, UmbFolderDataSource, UmbUpdateFolderModel } from '@umbraco-cms/backoffice/tree';
// import { DocumentBlueprintService } 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 { UmbCreateFolderModel, UmbFolderDataSource, UmbUpdateFolderModel } from '@umbraco-cms/backoffice/tree';
import { DocumentBlueprintService } from '@umbraco-cms/backoffice/external/backend-api';
import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources';
// /**
// * A data source for a Document Blueprint folder that fetches data from the server
// * @export
// * @class UmbDocumentBlueprintFolderServerDataSource
// * @implements {RepositoryDetailDataSource}
// */
// export class UmbDocumentBlueprintFolderServerDataSource implements UmbFolderDataSource {
// #host: UmbControllerHost;
/**
* A data source for a Document Blueprint folder that fetches data from the server
* @export
* @class UmbDocumentBlueprintFolderServerDataSource
* @implements {RepositoryDetailDataSource}
*/
export class UmbDocumentBlueprintFolderServerDataSource implements UmbFolderDataSource {
#host: UmbControllerHost;
// /**
// * Creates an instance of UmbDocumentBlueprintFolderServerDataSource.
// * @param {UmbControllerHost} host
// * @memberof UmbDocumentBlueprintFolderServerDataSource
// */
// constructor(host: UmbControllerHost) {
// this.#host = host;
// }
/**
* Creates an instance of UmbDocumentBlueprintFolderServerDataSource.
* @param {UmbControllerHost} host
* @memberof UmbDocumentBlueprintFolderServerDataSource
*/
constructor(host: UmbControllerHost) {
this.#host = host;
}
// /**
// * Fetches a Document Blueprint folder from the server
// * @param {string} unique
// * @return {*}
// * @memberof UmbDocumentBlueprintFolderServerDataSource
// */
// async read(unique: string) {
// if (!unique) throw new Error('Unique is missing');
/**
* Fetches a Document Blueprint folder from the server
* @param {string} unique
* @return {*}
* @memberof UmbDocumentBlueprintFolderServerDataSource
*/
async read(unique: string) {
if (!unique) throw new Error('Unique is missing');
// const { data, error } = await tryExecuteAndNotify(
// this.#host,
// DocumentBlueprintService.getDocumentBlueprintFolderById({
// id: unique,
// }),
// );
const { data, error } = await tryExecuteAndNotify(
this.#host,
DocumentBlueprintService.getDocumentBlueprintFolderById({
id: unique,
}),
);
// if (data) {
// const mappedData = {
// unique: data.id,
// name: data.name,
// };
if (data) {
const mappedData = {
unique: data.id,
name: data.name,
};
// return { data: mappedData };
// }
return { data: mappedData };
}
// return { error };
// }
return { error };
}
// /**
// * Creates a Document Blueprint folder on the server
// * @param {UmbCreateFolderModel} args
// * @return {*}
// * @memberof UmbDocumentBlueprintFolderServerDataSource
// */
// async create(args: UmbCreateFolderModel) {
// if (args.parentUnique === undefined) throw new Error('Parent unique is missing');
// if (!args.name) throw new Error('Name is missing');
/**
* Creates a Document Blueprint folder on the server
* @param {UmbCreateFolderModel} args
* @return {*}
* @memberof UmbDocumentBlueprintFolderServerDataSource
*/
async create(args: UmbCreateFolderModel) {
if (args.parentUnique === undefined) throw new Error('Parent unique is missing');
if (!args.name) throw new Error('Name is missing');
// const requestBody = {
// id: args.unique,
// parent: args.parentUnique ? { id: args.parentUnique } : null,
// name: args.name,
// };
const requestBody = {
id: args.unique,
parent: args.parentUnique ? { id: args.parentUnique } : null,
name: args.name,
};
// const { error } = await tryExecuteAndNotify(
// this.#host,
// DocumentBlueprintService.postDocumentBlueprintFolder({
// requestBody,
// }),
// );
const { error } = await tryExecuteAndNotify(
this.#host,
DocumentBlueprintService.postDocumentBlueprintFolder({
requestBody,
}),
);
// if (!error) {
// return this.read(args.unique);
// }
if (!error) {
return this.read(args.unique);
}
// return { error };
// }
return { error };
}
// /**
// * Updates a Document Blueprint folder on the server
// * @param {UmbUpdateFolderModel} args
// * @return {*}
// * @memberof UmbDocumentBlueprintFolderServerDataSource
// */
// async update(args: UmbUpdateFolderModel) {
// if (!args.unique) throw new Error('Unique is missing');
// if (!args.name) throw new Error('Folder name is missing');
/**
* Updates a Document Blueprint folder on the server
* @param {UmbUpdateFolderModel} args
* @return {*}
* @memberof UmbDocumentBlueprintFolderServerDataSource
*/
async update(args: UmbUpdateFolderModel) {
if (!args.unique) throw new Error('Unique is missing');
if (!args.name) throw new Error('Folder name is missing');
// const { error } = await tryExecuteAndNotify(
// this.#host,
// DocumentBlueprintService.putDocumentBlueprintFolderById({
// id: args.unique,
// requestBody: { name: args.name },
// }),
// );
const { error } = await tryExecuteAndNotify(
this.#host,
DocumentBlueprintService.putDocumentBlueprintFolderById({
id: args.unique,
requestBody: { name: args.name },
}),
);
// if (!error) {
// return this.read(args.unique);
// }
if (!error) {
return this.read(args.unique);
}
// return { error };
// }
return { error };
}
// /**
// * Deletes a Document Blueprint folder on the server
// * @param {string} unique
// * @return {*}
// * @memberof UmbDocumentBlueprintServerDataSource
// */
// async delete(unique: string) {
// if (!unique) throw new Error('Unique is missing');
// return tryExecuteAndNotify(
// this.#host,
// DocumentBlueprintService.deleteDocumentBlueprintFolderById({
// id: unique,
// }),
// );
// }
// }
/**
* Deletes a Document Blueprint folder on the server
* @param {string} unique
* @return {*}
* @memberof UmbDocumentBlueprintServerDataSource
*/
async delete(unique: string) {
if (!unique) throw new Error('Unique is missing');
return tryExecuteAndNotify(
this.#host,
DocumentBlueprintService.deleteDocumentBlueprintFolderById({
id: unique,
}),
);
}
}

4
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/folder/index.ts
View File

@@ -1,2 +1,2 @@
// export { UmbDocumentBlueprintFolderRepository } from './document-blueprint-folder.repository.js';
// export { UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS } from './manifests.js';
export { UmbDocumentBlueprintFolderRepository } from './document-blueprint-folder.repository.js';
export { UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS } from './manifests.js';

66
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/folder/manifests.ts
View File

@@ -1,37 +1,37 @@
// import { UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../../entity.js';
// import { UmbDocumentBlueprintFolderRepository } from './document-blueprint-folder.repository.js';
// import type { ManifestRepository, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
import { UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../../entity.js';
import { UmbDocumentBlueprintFolderRepository } from './document-blueprint-folder.repository.js';
import type { ManifestRepository, ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
// export const UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS = 'Umb.Repository.DocumentBlueprint.Folder';
export const UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS = 'Umb.Repository.DocumentBlueprint.Folder';
// const folderRepository: ManifestRepository = {
// type: 'repository',
// alias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
// name: 'Document Blueprint Folder Repository',
// api: UmbDocumentBlueprintFolderRepository,
// };
const folderRepository: ManifestRepository = {
type: 'repository',
alias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
name: 'Document Blueprint Folder Repository',
api: UmbDocumentBlueprintFolderRepository,
};
// const entityActions: Array<ManifestTypes> = [
// {
// type: 'entityAction',
// kind: 'folderUpdate',
// alias: 'Umb.EntityAction.DocumentBlueprint.Folder.Rename',
// name: 'Rename Document Blueprint Folder Entity Action',
// forEntityTypes: [UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE],
// meta: {
// folderRepositoryAlias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
// },
// },
// {
// type: 'entityAction',
// kind: 'folderDelete',
// alias: 'Umb.EntityAction.DocumentBlueprint.Folder.Delete',
// name: 'Delete Document Blueprint Folder Entity Action',
// forEntityTypes: [UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE],
// meta: {
// folderRepositoryAlias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
// },
// },
// ];
const entityActions: Array<ManifestTypes> = [
{
type: 'entityAction',
kind: 'folderUpdate',
alias: 'Umb.EntityAction.DocumentBlueprint.Folder.Rename',
name: 'Rename Document Blueprint Folder Entity Action',
forEntityTypes: [UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE],
meta: {
folderRepositoryAlias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
},
},
{
type: 'entityAction',
kind: 'folderDelete',
alias: 'Umb.EntityAction.DocumentBlueprint.Folder.Delete',
name: 'Delete Document Blueprint Folder Entity Action',
forEntityTypes: [UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE],
meta: {
folderRepositoryAlias: UMB_DOCUMENT_BLUEPRINT_FOLDER_REPOSITORY_ALIAS,
},
},
];
// export const manifests = [folderRepository, ...entityActions];
export const manifests = [folderRepository, ...entityActions];

10
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/folder/types.ts
View File

@@ -1,6 +1,6 @@
// import type { UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../../entity.js';
// import type { UmbDocumentBlueprintTreeItemModel } from '../types.js';
import type { UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../../entity.js';
import type { UmbDocumentBlueprintTreeItemModel } from '../types.js';
// export interface UmbDocumentBlueprintFolderTreeItemModel extends UmbDocumentBlueprintTreeItemModel {
// entityType: typeof UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE;
// }
export interface UmbDocumentBlueprintFolderTreeItemModel extends UmbDocumentBlueprintTreeItemModel {
entityType: typeof UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE;
}

2
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/index.ts
View File

@@ -1,2 +1,2 @@
export { UMB_DOCUMENT_BLUEPRINT_TREE_STORE_CONTEXT } from './document-blueprint-tree.store.js';
//export * from './folder/index.js';
export * from './folder/index.js';

5
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/tree/manifests.ts
View File

@@ -1,5 +1,5 @@
import { UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE, UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE } from '../entity.js';
//import { manifests as folderManifests } from './folder/manifests.js';
import { manifests as folderManifests } from './folder/manifests.js';
import { manifests as reloadManifests } from './reload-tree-item-children/manifests.js';
import { UmbDocumentBlueprintTreeRepository } from './document-blueprint-tree.repository.js';
import { UmbDocumentBlueprintTreeStore } from './document-blueprint-tree.store.js';
@@ -46,5 +46,4 @@ const treeItem: ManifestTreeItem = {
forEntityTypes: [UMB_DOCUMENT_BLUEPRINT_ENTITY_TYPE, UMB_DOCUMENT_BLUEPRINT_FOLDER_ENTITY_TYPE],
};
export const manifests = [treeRepository, treeStore, tree, treeItem, ...reloadManifests];
//...folderManifests,
export const manifests = [treeRepository, treeStore, tree, treeItem, ...reloadManifests, ...folderManifests];

2
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/workspace/document-blueprint-workspace-editor.element.ts
View File

@@ -19,8 +19,6 @@ export class UmbDocumentBlueprintWorkspaceEditorElement extends UmbLitElement {
constructor() {
super();
console.log('editor');
this.consumeContext(UMB_DOCUMENT_BLUEPRINT_WORKSPACE_CONTEXT, (instance) => {
this.#workspaceContext = instance;
this.#observeVariants();

2
src/Umbraco.Web.UI.Client/src/packages/documents/document-blueprints/workspace/document-blueprint-workspace-split-view.element.ts
View File

@@ -15,8 +15,6 @@ export class UmbDocumentBlueprintWorkspaceSplitViewElement extends UmbLitElement
constructor() {
super();
console.log('split view');
// TODO: Refactor: use a split view workspace context token:
this.consumeContext(UMB_DOCUMENT_BLUEPRINT_WORKSPACE_CONTEXT, (context) => {
this._workspaceContext = context;