const rework

This commit is contained in:
Niels Lyngsø
2024-04-25 13:47:15 +02:00
parent 7c3ad9da5b
commit 3af29a3e69
11 changed files with 45 additions and 23 deletions

View File

@@ -1,7 +1,7 @@
import type { UmbBackofficeContext } from '../backoffice.context.js';
import { UMB_BACKOFFICE_CONTEXT } from '../backoffice.context.js';
import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
import { UmbSectionContext, UMB_SECTION_CONTEXT } from '@umbraco-cms/backoffice/section';
import { UmbSectionContext, UMB_SECTION_CONTEXT, UMB_SECTION_PATH_PATTERN } from '@umbraco-cms/backoffice/section';
import type { UmbRoute, UmbRouterSlotChangeEvent } from '@umbraco-cms/backoffice/router';
import type { ManifestSection, UmbSectionElement } from '@umbraco-cms/backoffice/extension-registry';
import type { UmbExtensionManifestInitializer } from '@umbraco-cms/backoffice/extension-api';
@@ -16,7 +16,6 @@ export class UmbBackofficeMainElement extends UmbLitElement {
@state()
private _sections: Array<UmbExtensionManifestInitializer<ManifestSection>> = [];
private _routePrefix = 'section/';
private _backofficeContext?: UmbBackofficeContext;
private _sectionContext?: UmbSectionContext;
@@ -56,7 +55,7 @@ export class UmbBackofficeMainElement extends UmbLitElement {
} else {
return {
alias: section.alias,
path: this._routePrefix + (section.manifest as ManifestSection).meta.pathname,
path: UMB_SECTION_PATH_PATTERN.generateLocal({ name: section.manifest!.meta.pathname }),
component: () => createExtensionElement(section.manifest!, 'umb-section-default'),
setup: (component) => {
(component as UmbSectionElement).manifest = section.manifest as ManifestSection;
@@ -78,7 +77,9 @@ export class UmbBackofficeMainElement extends UmbLitElement {
private _onRouteChange = async (event: UmbRouterSlotChangeEvent) => {
const currentPath = event.target.localActiveViewPath || '';
const section = this._sections.find((s) => this._routePrefix + s.manifest?.meta.pathname === currentPath);
const section = this._sections.find(
(s) => UMB_SECTION_PATH_PATTERN.generateLocal({ name: s.manifest!.meta.pathname }) === currentPath,
);
if (!section) return;
await section.asPromise();
if (section.manifest) {

View File

@@ -25,7 +25,12 @@ export class UmbPathPattern<LocalParamsType extends UmbPathPatternParamsType = U
generateLocal(params: LocalParamsType) {
return umbUrlPatternToString(this.#local, params);
}
generateGlobal(params: LocalParamsType) {
/**
* generate an absolute path from the path pattern
* @param params
* @returns
*/
generateAbsolute(params: LocalParamsType) {
return this.#base + umbUrlPatternToString(this.#local, params);
}

View File

@@ -1,4 +1,5 @@
export * from './components/index.js';
export * from './paths.js';
export * from './section-default.element.js';
export * from './section-main/index.js';
export * from './section-picker-modal/section-picker-modal.token.js';

View File

@@ -0,0 +1,3 @@
import { UmbPathPattern } from '../router/path-pattern.class.js';
export const UMB_SECTION_PATH_PATTERN = new UmbPathPattern<{ name: string }>('section/:name');

View File

@@ -24,6 +24,9 @@ export class UmbTreePickerModalElement<TreeItemType extends UmbTreeItemModelBase
@state()
_createPath?: string;
@state()
_createLabel?: string;
connectedCallback() {
super.connectedCallback();
@@ -44,29 +47,28 @@ export class UmbTreePickerModalElement<TreeItemType extends UmbTreeItemModelBase
// To remove the hardcoded URLs for workspaces of entity types, we could make an create event from the tree, which either this or the sidebar impl. will pick up and react to. [NL]
// Or maybe the tree item context base can handle this? [NL]
// Maybe its a general item context problem to be solved. [NL]
const createActionData = this.data?.createAction;
if (createActionData) {
const createAction = this.data?.createAction;
if (createAction) {
this._createLabel = createAction.label;
new UmbModalRouteRegistrationController(
this,
(createActionData.modalToken as typeof UMB_WORKSPACE_MODAL) ?? UMB_WORKSPACE_MODAL,
(createAction.modalToken as typeof UMB_WORKSPACE_MODAL) ?? UMB_WORKSPACE_MODAL,
)
.onSetup(() => {
return { data: createActionData.modalData };
return { data: createAction.modalData };
})
.onSubmit((value) => {
if (value) {
this.value = { selection: [value.unique] };
this._submitModal();
} else {
throw new Error('No value returned from workspace modal');
this._rejectModal();
}
})
.observeRouteBuilder((routeBuilder) => {
const oldPath = this._createPath;
this._createPath =
routeBuilder({}) +
createActionData.extendWithPathPattern.generateLocal(createActionData.extendWithPathParams);
routeBuilder({}) + createAction.extendWithPathPattern.generateLocal(createAction.extendWithPathParams);
this.requestUpdate('_createPath', oldPath);
});
}
@@ -110,7 +112,7 @@ export class UmbTreePickerModalElement<TreeItemType extends UmbTreeItemModelBase
<uui-button label=${this.localize.term('general_close')} @click=${this._rejectModal}></uui-button>
${this._createPath
? html` <uui-button
label=${this.localize.term('content_createEmpty')}
label=${this.localize.string(this._createLabel ?? 'general_create')}
look="secondary"
href=${this._createPath}></uui-button>`
: nothing}

View File

@@ -4,6 +4,7 @@ import { UmbModalToken } from '@umbraco-cms/backoffice/modal';
import type { UmbPathPattern, UmbPathPatternParamsType } from '@umbraco-cms/backoffice/router';
export interface UmbTreePickerModalCreateActionData<PathPatternParamsType extends UmbPathPatternParamsType> {
label: string;
modalData: UmbWorkspaceModalData;
modalToken?: UmbModalToken;
extendWithPathPattern: UmbPathPattern;

View File

@@ -1,4 +1,4 @@
import { UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH } from '../paths.js';
import { UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN } from '../paths.js';
import { UmbModalToken } from '@umbraco-cms/backoffice/modal';
import type { UmbDocumentTypeTreeItemModel } from '@umbraco-cms/backoffice/document-type';
import {
@@ -12,7 +12,7 @@ import {
*/
export type UmbDocumentTypePickerModalData = UmbTreePickerModalData<
UmbDocumentTypeTreeItemModel,
typeof UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH.PARAMS
typeof UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN.PARAMS
>;
export interface UmbDocumentTypePickerModalValue extends UmbTreePickerModalValue {}
@@ -28,11 +28,12 @@ export const UMB_DOCUMENT_TYPE_PICKER_MODAL = new UmbModalToken<
data: {
treeAlias: 'Umb.Tree.DocumentType',
createAction: {
label: '#content_createEmpty',
modalData: {
entityType: 'document-type',
preset: {},
},
extendWithPathPattern: UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH,
extendWithPathPattern: UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN,
extendWithPathParams: {
entityType: 'document-type',
parentUnique: null,

View File

@@ -1,3 +1,4 @@
import { UMB_SETTINGS_SECTION_PATH } from '@umbraco-cms/backoffice/settings';
import type { UmbDocumentTypeEntityTypeUnion } from './entity.js';
import { UmbPathPattern } from '@umbraco-cms/backoffice/router';
@@ -13,10 +14,10 @@ export type UmbCreateDocumentTypeWorkspacePresetType =
| UmbCreateDocumentTypeWorkspacePresetTemplateType
| UmbCreateDocumentTypeWorkspacePresetElementType;
export const UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH = new UmbPathPattern<{
export const UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN = new UmbPathPattern<{
entityType: UmbDocumentTypeEntityTypeUnion;
parentUnique?: string | null;
presetAlias?: UmbCreateDocumentTypeWorkspacePresetType | null;
}>('create/:entityType/:parentUnique/:presetAlias');
}>('create/:entityType/:parentUnique/:presetAlias', UMB_SETTINGS_SECTION_PATH);
export const UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH = new UmbPathPattern<{ id: string }>('edit/:id');
export const UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN = new UmbPathPattern<{ id: string }>('edit/:id');

View File

@@ -2,10 +2,10 @@ import { UmbDocumentTypeDetailRepository } from '../repository/detail/document-t
import { UMB_DOCUMENT_TYPE_ENTITY_TYPE } from '../entity.js';
import type { UmbDocumentTypeDetailModel } from '../types.js';
import {
UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH,
UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN,
UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PRESET_ELEMENT,
UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PRESET_TEMPLATE,
UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH,
UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN,
type UmbCreateDocumentTypeWorkspacePresetType,
} from '../paths.js';
import { UmbDocumentTypeWorkspaceEditorElement } from './document-type-workspace-editor.element.js';
@@ -96,7 +96,7 @@ export class UmbDocumentTypeWorkspaceContext
this.routes.setRoutes([
{
path: UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH.toString(),
path: UMB_CREATE_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN.toString(),
component: UmbDocumentTypeWorkspaceEditorElement,
setup: (_component, info) => {
const parentEntityType = info.match.params.entityType;
@@ -112,7 +112,7 @@ export class UmbDocumentTypeWorkspaceContext
},
},
{
path: UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH.toString(),
path: UMB_EDIT_DOCUMENT_TYPE_WORKSPACE_PATH_PATTERN.toString(),
component: UmbDocumentTypeWorkspaceEditorElement,
setup: (_component, info) => {
this.removeUmbControllerByAlias('isNewRedirectController');

View File

@@ -0,0 +1 @@
export * from './paths.js';

View File

@@ -0,0 +1,6 @@
import { UMB_SECTION_PATH_PATTERN } from '@umbraco-cms/backoffice/section';
export const UMB_SETTINGS_SECTION_PATHNAME = 'settings';
export const UMB_SETTINGS_SECTION_PATH = UMB_SECTION_PATH_PATTERN.generateAbsolute({
name: UMB_SETTINGS_SECTION_PATHNAME,
});