create action

This commit is contained in:
Jesper Møller Jensen
2023-11-16 19:08:02 +13:00
parent 5c20b8c1ee
commit 62727fce9b
7 changed files with 146 additions and 46 deletions

View File

@@ -1,14 +0,0 @@
import { UmbMediaTypeRepository } from '../repository/media-type.repository.js';
import { UmbEntityActionBase } from '@umbraco-cms/backoffice/entity-action';
import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api';
export class UmbCreateMediaTypeEntityAction extends UmbEntityActionBase<UmbMediaTypeRepository> {
constructor(host: UmbControllerHostElement, repositoryAlias: string, unique: string) {
super(host, repositoryAlias, unique);
}
async execute() {
console.log(`execute for: ${this.unique}`);
alert('open create dialog');
}
}

View File

@@ -0,0 +1,26 @@
import { UmbMediaTypeDetailRepository } from '../../repository/detail/media-type-detail.repository.js';
import { UMB_MEDIA_TYPE_CREATE_OPTIONS_MODAL } from './modal/index.js';
import { UmbEntityActionBase } from '@umbraco-cms/backoffice/entity-action';
import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api';
import { UmbModalManagerContext, UMB_MODAL_MANAGER_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/modal';
export class UmbCreateMediaTypeEntityAction extends UmbEntityActionBase<UmbMediaTypeDetailRepository> {
#modalManagerContext?: UmbModalManagerContext;
constructor(host: UmbControllerHostElement, repositoryAlias: string, unique: string) {
super(host, repositoryAlias, unique);
this.consumeContext(UMB_MODAL_MANAGER_CONTEXT_TOKEN, (instance) => {
this.#modalManagerContext = instance;
});
}
async execute() {
if (!this.#modalManagerContext) throw new Error('Modal manager context is not available');
if (!this.repository) throw new Error('Repository is not available');
this.#modalManagerContext?.open(UMB_MEDIA_TYPE_CREATE_OPTIONS_MODAL, {
parentKey: this.unique,
});
}
}

View File

@@ -0,0 +1,28 @@
import { MEDIA_TYPE_ENTITY_TYPE, MEDIA_TYPE_FOLDER_ENTITY_TYPE, MEDIA_TYPE_ROOT_ENTITY_TYPE } from '../../index.js';
import { MEDIA_TYPE_DETAIL_REPOSITORY_ALIAS } from '../../repository/index.js';
import { UmbCreateMediaTypeEntityAction } from './create.action.js';
import { ManifestTypes } from '@umbraco-cms/backoffice/extension-registry';
const entityActions: Array<ManifestTypes> = [
{
type: 'entityAction',
alias: 'Umb.EntityAction.MediaType.Create',
name: 'Create Media Type Entity Action',
weight: 1000,
api: UmbCreateMediaTypeEntityAction,
meta: {
icon: 'icon-add',
label: 'Create...',
repositoryAlias: MEDIA_TYPE_DETAIL_REPOSITORY_ALIAS,
entityTypes: [MEDIA_TYPE_ENTITY_TYPE, MEDIA_TYPE_ROOT_ENTITY_TYPE, MEDIA_TYPE_FOLDER_ENTITY_TYPE],
},
},
{
type: 'modal',
alias: 'Umb.Modal.MediaTypeCreateOptions',
name: 'Media Type Create Options Modal',
loader: () => import('./modal/media-type-create-options-modal.element.js'),
},
];
export const manifests = [...entityActions];

View File

@@ -0,0 +1,13 @@
import { UmbModalToken } from '@umbraco-cms/backoffice/modal';
export interface UmbMediaTypeCreateOptionsModalData {
parentKey: string | null;
}
export const UMB_MEDIA_TYPE_CREATE_OPTIONS_MODAL = new UmbModalToken<UmbMediaTypeCreateOptionsModalData>(
'Umb.Modal.MediaTypeCreateOptions',
{
type: 'sidebar',
size: 'small',
},
);

View File

@@ -0,0 +1,76 @@
import { MEDIA_TYPE_DETAIL_REPOSITORY_ALIAS } from '../../../repository/index.js';
import { UmbMediaTypeCreateOptionsModalData } from './index.js';
import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
import {
UmbModalManagerContext,
UmbModalContext,
UMB_FOLDER_MODAL,
UMB_MODAL_MANAGER_CONTEXT_TOKEN,
} from '@umbraco-cms/backoffice/modal';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
@customElement('umb-media-type-create-options-modal')
export class UmbDataTypeCreateOptionsModalElement extends UmbLitElement {
@property({ attribute: false })
modalContext?: UmbModalContext<UmbMediaTypeCreateOptionsModalData>;
@property({ type: Object })
data?: UmbMediaTypeCreateOptionsModalData;
#modalContext?: UmbModalManagerContext;
constructor() {
super();
this.consumeContext(UMB_MODAL_MANAGER_CONTEXT_TOKEN, (instance) => {
this.#modalContext = instance;
});
}
#onClick(event: PointerEvent) {
event.stopPropagation();
const folderModalHandler = this.#modalContext?.open(UMB_FOLDER_MODAL, {
repositoryAlias: MEDIA_TYPE_DETAIL_REPOSITORY_ALIAS,
});
folderModalHandler?.onSubmit().then(() => this.modalContext?.submit());
}
// close the modal when navigating to data type
#onNavigate() {
this.modalContext?.submit();
}
#onCancel() {
this.modalContext?.reject();
}
render() {
return html`
<umb-body-layout headline="Create Media Type">
<uui-box>
<!-- TODO: construct url -->
<uui-menu-item
href=${`section/settings/workspace/media-type/create/${this.data?.parentKey || 'null'}`}
label="New Media Type..."
@click=${this.#onNavigate}>
<uui-icon slot="icon" name="icon-autofill"></uui-icon>
</uui-menu-item>
<uui-menu-item @click=${this.#onClick} label="New Folder...">
<uui-icon slot="icon" name="icon-folder"></uui-icon>
</uui-menu-item>
</uui-box>
<uui-button slot="actions" id="cancel" label="Cancel" @click="${this.#onCancel}">Cancel</uui-button>
</umb-body-layout>
`;
}
static styles = [UmbTextStyles];
}
export default UmbDataTypeCreateOptionsModalElement;
declare global {
interface HTMLElementTagNameMap {
'umb-media-type-create-options-modal': UmbDataTypeCreateOptionsModalElement;
}
}

View File

@@ -1,6 +1,6 @@
import { MEDIA_TYPE_DETAIL_REPOSITORY_ALIAS } from '../index.js';
import { UmbCreateMediaTypeEntityAction } from './create.action.js';
import UmbReloadMediaTypeEntityAction from './reload.action.js';
import { UmbCreateMediaTypeEntityAction } from './create/create.action.js';
import { manifests as createManifests } from './create/manifests.js';
import { UmbDeleteEntityAction, UmbMoveEntityAction, UmbCopyEntityAction } from '@umbraco-cms/backoffice/entity-action';
import type { ManifestEntityAction } from '@umbraco-cms/backoffice/extension-registry';
@@ -60,19 +60,6 @@ const entityActions: Array<ManifestEntityAction> = [
entityTypes: [entityType],
},
},
{
type: 'entityAction',
alias: 'Umb.EntityAction.MediaType.Reload',
name: 'Reload Media Type Entity Action',
weight: 100,
api: UmbReloadMediaTypeEntityAction,
meta: {
icon: 'icon-refresh',
label: 'Reload',
repositoryAlias,
entityTypes: [entityType],
},
},
];
export const manifests = [...entityActions];
export const manifests = [...entityActions, ...createManifests];

View File

@@ -1,16 +0,0 @@
import { UmbMediaTypeRepository } from '../repository/media-type.repository.js';
import { UmbTextStyles } from "@umbraco-cms/backoffice/style";
import { UmbEntityActionBase } from '@umbraco-cms/backoffice/entity-action';
import { UmbControllerHostElement } from '@umbraco-cms/backoffice/controller-api';
export default class UmbReloadMediaTypeEntityAction extends UmbEntityActionBase<UmbMediaTypeRepository> {
static styles = [UmbTextStyles];
constructor(host: UmbControllerHostElement, repositoryAlias: string, unique: string) {
super(host, repositoryAlias, unique);
}
async execute() {
alert('refresh');
}
}