+
- 
-
- ([
- {
- name: 'My Package Name',
- version: '1.0.0',
- extensions: [
- {
- type: 'bundle',
- alias: 'My.Package.Bundle',
- name: 'My Package Bundle',
- js: '/App_Plugins/custom-bundle-package/index.js',
- },
- ],
- },
- {
- name: 'Named Package',
- version: '1.0.0',
- extensions: [
- {
- type: 'section',
- alias: 'My.Section.Custom',
- name: 'Custom Section',
- js: '/App_Plugins/section.js',
- elementName: 'my-section-custom',
- weight: 1,
- meta: {
- label: 'Custom',
- pathname: 'my-custom',
- },
- },
- {
- type: 'propertyEditorUi',
- alias: 'My.PropertyEditorUI.Custom',
- name: 'My Custom Property Editor UI',
- js: '/App_Plugins/property-editor.js',
- elementName: 'my-property-editor-ui-custom',
- meta: {
- label: 'My Custom Property',
- icon: 'document',
- group: 'Common',
- propertyEditorSchema: 'Umbraco.TextBox',
- },
- },
- ],
- },
- {
- name: 'Package with an entry point',
- extensions: [
- {
- type: 'backofficeEntryPoint',
- name: 'My Custom Entry Point',
- alias: 'My.Entrypoint.Custom',
- js: '/App_Plugins/custom-entrypoint.js',
- },
- ],
- },
- {
- name: 'My MFA Package',
- extensions: [
- {
- type: 'mfaLoginProvider',
- alias: 'My.MfaLoginProvider.Custom.Google',
- name: 'My Custom Google MFA Provider',
- forProviderName: 'Google Authenticator',
- },
- {
- type: 'mfaLoginProvider',
- alias: 'My.MfaLoginProvider.Custom.SMS',
- name: 'My Custom SMS MFA Provider',
- forProviderName: 'sms',
- meta: {
- label: 'Setup SMS Verification',
- },
- },
- ],
- },
- {
- name: 'Package with a view',
- extensions: [
- {
- type: 'packageView',
- alias: 'My.PackageView.Custom',
- name: 'My Custom Package View',
- js: '/App_Plugins/package-view.js',
- meta: {
- packageName: 'Package with a view',
- },
- },
- ],
- },
- {
- name: 'My MFA Package',
- extensions: [
- {
- type: 'mfaLoginProvider',
- alias: 'My.MfaLoginProvider.Custom',
- name: 'My Custom MFA Provider',
- forProviderName: 'sms',
- meta: {
- label: 'Setup SMS Verification',
- },
- },
- ],
- },
- ]),
+ ctx.json(privateManifests),
);
}),
rest.get(umbracoPath('/manifest/manifest/public'), (_req, res, ctx) => {
- return res(
- ctx.status(200),
- ctx.json([
- {
- name: 'My Auth Package',
- extensions: [
- {
- type: 'authProvider',
- alias: 'My.AuthProvider.Google',
- name: 'My Custom Auth Provider',
- forProviderName: 'Umbraco.Google',
- meta: {
- label: 'Sign in with Google',
- },
- },
- {
- type: 'authProvider',
- alias: 'My.AuthProvider.Github',
- name: 'My Github Auth Provider',
- forProviderName: 'Umbraco.Github',
- meta: {
- label: 'GitHub',
- defaultView: {
- look: 'primary',
- icon: 'icon-github',
- color: 'success',
- },
- },
- },
- ],
- },
- ]),
- );
+ return res(ctx.status(200), ctx.json(publicManifests));
+ }),
+ rest.get(umbracoPath('/manifest/manifest'), (_req, res, ctx) => {
+ return res(ctx.status(200), ctx.json([...privateManifests, ...publicManifests]));
}),
];
@@ -158,4 +171,7 @@ export const manifestEmptyHandlers = [
rest.get(umbracoPath('/manifest/manifest/public'), (_req, res, ctx) => {
return res(ctx.status(200), ctx.json([]));
}),
+ rest.get(umbracoPath('/manifest/manifest'), (_req, res, ctx) => {
+ return res(ctx.status(200), ctx.json([]));
+ }),
];
diff --git a/src/Umbraco.Web.UI.Client/src/mocks/handlers/user/current.handlers.ts b/src/Umbraco.Web.UI.Client/src/mocks/handlers/user/current.handlers.ts
index 248e9e92a8..9454d23c56 100644
--- a/src/Umbraco.Web.UI.Client/src/mocks/handlers/user/current.handlers.ts
+++ b/src/Umbraco.Web.UI.Client/src/mocks/handlers/user/current.handlers.ts
@@ -1,6 +1,7 @@
const { rest } = window.MockServiceWorker;
import { umbUserMockDb } from '../../data/user/user.db.js';
import { UMB_SLUG } from './slug.js';
+import type { LinkedLoginsRequestModel } from '@umbraco-cms/backoffice/external/backend-api';
import { umbracoPath } from '@umbraco-cms/backoffice/utils';
export const handlers = [
@@ -8,6 +9,19 @@ export const handlers = [
const loggedInUser = umbUserMockDb.getCurrentUser();
return res(ctx.status(200), ctx.json(loggedInUser));
}),
+ rest.get(umbracoPath(`${UMB_SLUG}/current/logins`), (_req, res, ctx) => {
+ return res(
+ ctx.status(200),
+ ctx.json({
+ linkedLogins: [
+ {
+ providerKey: 'google',
+ providerName: 'Umbraco.Google',
+ },
+ ],
+ }),
+ );
+ }),
rest.get(umbracoPath(`${UMB_SLUG}/current/2fa`), (_req, res, ctx) => {
const mfaLoginProviders = umbUserMockDb.getMfaLoginProviders();
return res(ctx.status(200), ctx.json(mfaLoginProviders));
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/extension-slot/extension-slot.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/extension-slot/extension-slot.element.ts
index f4e8f8679a..a09e8f9bf0 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/components/extension-slot/extension-slot.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/extension-slot/extension-slot.element.ts
@@ -92,7 +92,10 @@ export class UmbExtensionSlotElement extends UmbLitElement {
public defaultElement?: string;
@property()
- public renderMethod?: (extension: UmbExtensionElementInitializer) => TemplateResult | HTMLElement | null | undefined;
+ public renderMethod?: (
+ extension: UmbExtensionElementInitializer,
+ index: number,
+ ) => TemplateResult | HTMLElement | null | undefined;
connectedCallback(): void {
super.connectedCallback();
@@ -130,7 +133,7 @@ export class UmbExtensionSlotElement extends UmbLitElement {
? repeat(
this._permitted,
(ext) => ext.alias,
- (ext) => (this.renderMethod ? this.renderMethod(ext) : ext.component),
+ (ext, i) => (this.renderMethod ? this.renderMethod(ext, i) : ext.component),
)
: html` {
+ if (container.name === '') {
+ const newName = 'Unnamed';
+ this.updateContainer(null, container.id, {
+ name: this.makeContainerNameUniqueForOwnerContentType(container.id, newName, type, parentId) ?? newName,
+ });
+ }
+ });
+ }
+
async createContainer(
contentTypeUnique: string | null,
parentId: string | null = null,
@@ -295,9 +311,11 @@ export class UmbContentTypeStructureManager<
sortOrder: sortOrder ?? 0,
};
- const containers = [
- ...(this.#contentTypes.getValue().find((x) => x.unique === contentTypeUnique)?.containers ?? []),
- ];
+ // Ensure
+ this.ensureContainerNames(contentTypeUnique, type, parentId);
+
+ const contentTypes = this.#contentTypes.getValue();
+ const containers = [...(contentTypes.find((x) => x.unique === contentTypeUnique)?.containers ?? [])];
containers.push(container);
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -308,7 +326,7 @@ export class UmbContentTypeStructureManager<
return container;
}
- async insertContainer(contentTypeUnique: string | null, container: UmbPropertyTypeContainerModel) {
+ /*async insertContainer(contentTypeUnique: string | null, container: UmbPropertyTypeContainerModel) {
await this.#init;
contentTypeUnique = contentTypeUnique ?? this.#ownerContentTypeUnique!;
@@ -330,24 +348,34 @@ export class UmbContentTypeStructureManager<
// @ts-ignore
// TODO: fix TS partial complaint
this.#contentTypes.updateOne(contentTypeUnique, { containers });
- }
+ }*/
+ makeEmptyContainerName(
+ containerId: string,
+ containerType: UmbPropertyContainerTypes,
+ parentId: string | null = null,
+ ) {
+ return (
+ this.makeContainerNameUniqueForOwnerContentType(containerId, 'Unnamed', containerType, parentId) ?? 'Unnamed'
+ );
+ }
makeContainerNameUniqueForOwnerContentType(
+ containerId: string,
newName: string,
- containerType: UmbPropertyContainerTypes = 'Tab',
+ containerType: UmbPropertyContainerTypes,
parentId: string | null = null,
) {
const ownerRootContainers = this.getOwnerContainers(containerType, parentId); //getRootContainers() can't differentiates between compositions and locals
+ if (!ownerRootContainers) {
+ return null;
+ }
let changedName = newName;
- if (ownerRootContainers) {
- while (ownerRootContainers.find((tab) => tab.name === changedName && tab.id !== parentId)) {
- changedName = incrementString(changedName);
- }
-
- return changedName === newName ? null : changedName;
+ while (ownerRootContainers.find((con) => con.name === changedName && con.id !== containerId)) {
+ changedName = incrementString(changedName);
}
- return null;
+
+ return changedName === newName ? null : changedName;
}
async updateContainer(
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/content-type/types.ts b/src/Umbraco.Web.UI.Client/src/packages/core/content-type/types.ts
index 76eeb7a5c7..4d513c7b4d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/content-type/types.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/content-type/types.ts
@@ -6,7 +6,7 @@ export type UmbPropertyContainerTypes = 'Group' | 'Tab';
export interface UmbPropertyTypeContainerModel {
id: string;
parent: { id: string } | null; // TODO: change to unique
- name: string | null;
+ name: string;
type: UmbPropertyContainerTypes;
sortOrder: number;
}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-group.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-group.element.ts
index fcd24ef4f9..540d32257f 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-group.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/content-type/workspace/views/design/content-type-design-editor-group.element.ts
@@ -1,6 +1,6 @@
import type { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';
-import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
-import { css, html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement, umbFocus } from '@umbraco-cms/backoffice/lit-element';
+import { css, html, customElement, property, state, nothing } from '@umbraco-cms/backoffice/external/lit';
import type {
UmbContentTypeContainerStructureHelper,
UmbContentTypeModel,
@@ -92,11 +92,24 @@ export class UmbContentTypeWorkspaceViewEditGroupElement extends UmbLitElement {
let newName = (e.target as HTMLInputElement).value;
const changedName = this.groupStructureHelper
.getStructureManager()!
- .makeContainerNameUniqueForOwnerContentType(newName, 'Group', this._group.parent?.id ?? null);
+ .makeContainerNameUniqueForOwnerContentType(this._group.id, newName, 'Group', this._group.parent?.id ?? null);
if (changedName) {
newName = changedName;
}
this._singleValueUpdate('name', newName);
+ (e.target as HTMLInputElement).value = newName;
+ }
+
+ #blurGroup(e: InputEvent) {
+ if (!this.groupStructureHelper || !this._group) return;
+ const newName = (e.target as HTMLInputElement).value;
+ if (newName === '') {
+ const changedName = this.groupStructureHelper
+ .getStructureManager()!
+ .makeEmptyContainerName(this._group.id, 'Group', this._group.parent?.id ?? null);
+ this._singleValueUpdate('name', changedName);
+ (e.target as HTMLInputElement).value = changedName;
+ }
}
render() {
@@ -118,9 +131,11 @@ export class UmbContentTypeWorkspaceViewEditGroupElement extends UmbLitElement {
${this.sortModeActive
? html` Something went wrong
-${this.errorMessage}
+
+
+ (location.href = '')}>
+
`;
- static styles = css`
- #background {
- position: fixed;
- overflow: hidden;
- background-position: 50%;
- background-repeat: no-repeat;
- background-size: cover;
- background-image: url('/umbraco/backoffice/assets/umbraco_background.jpg');
- width: 100vw;
- height: 100vh;
- }
+ static styles = [
+ UmbTextStyles,
+ css`
+ #background {
+ position: fixed;
+ overflow: hidden;
+ background-position: 50%;
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-image: url('/umbraco/backoffice/assets/installer-illustration.svg');
+ width: 100vw;
+ height: 100vh;
+ }
- #logo {
- position: fixed;
- top: var(--uui-size-space-5);
- left: var(--uui-size-space-5);
- height: 30px;
- }
+ #logo {
+ position: fixed;
+ top: var(--uui-size-space-5);
+ left: var(--uui-size-space-5);
+ height: 30px;
+ }
- #logo img {
- height: 100%;
- }
+ #logo img {
+ height: 100%;
+ }
- #container {
- position: relative;
- display: flex;
- align-items: center;
- justify-content: center;
- width: 100vw;
- height: 100vh;
- }
+ #container {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 100vw;
+ height: 100vh;
+ }
- #box {
- width: 50vw;
- padding: var(--uui-size-space-6) var(--uui-size-space-5) var(--uui-size-space-5) var(--uui-size-space-5);
- }
+ #box {
+ width: 400px;
+ max-width: 80vw;
+ }
- details {
- padding: var(--uui-size-space-2) var(--uui-size-space-3);
- background: var(--uui-color-surface-alt);
- }
+ #message {
+ margin-bottom: var(--uui-size-space-3);
+ }
- pre {
- width: 100%;
- overflow: auto;
- }
- `;
+ details {
+ padding: var(--uui-size-space-2) var(--uui-size-space-3);
+ background: var(--uui-color-surface-alt);
+ }
+
+ details summary {
+ cursor: pointer;
+ }
+
+ pre {
+ width: 100%;
+ overflow: auto;
+ }
+ `,
+ ];
}
export default UmbAppErrorElement;
diff --git a/src/Umbraco.Web.UI.Client/src/apps/app/app.element.ts b/src/Umbraco.Web.UI.Client/src/apps/app/app.element.ts
index 3991d8ad3e..475daede32 100644
--- a/src/Umbraco.Web.UI.Client/src/apps/app/app.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/apps/app/app.element.ts
@@ -7,7 +7,6 @@ import type { UMB_AUTH_CONTEXT } from '@umbraco-cms/backoffice/auth';
import { UmbAuthContext } from '@umbraco-cms/backoffice/auth';
import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
import { UUIIconRegistryEssential } from '@umbraco-cms/backoffice/external/uui';
-import { UmbIconRegistry } from '@umbraco-cms/backoffice/icon';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import type { Guard, UmbRoute } from '@umbraco-cms/backoffice/router';
import { pathWithoutBasePath } from '@umbraco-cms/backoffice/router';
@@ -50,6 +49,10 @@ export class UmbAppElement extends UmbLitElement {
bypassAuth = false;
private _routes: UmbRoute[] = [
+ {
+ path: 'error',
+ component: () => import('./app-error.element.js'),
+ },
{
path: 'install',
component: () => import('../installer/installer.element.js'),
@@ -85,7 +88,6 @@ export class UmbAppElement extends UmbLitElement {
new UmbBundleExtensionInitializer(this, umbExtensionsRegistry);
new UmbAppEntryPointExtensionInitializer(this, umbExtensionsRegistry);
- new UmbIconRegistry().attach(this);
new UUIIconRegistryEssential().attach(this);
new UmbContextDebugController(this);
diff --git a/src/Umbraco.Web.UI.Client/src/apps/backoffice/backoffice.element.ts b/src/Umbraco.Web.UI.Client/src/apps/backoffice/backoffice.element.ts
index 2bf0c934e5..79b526fe29 100644
--- a/src/Umbraco.Web.UI.Client/src/apps/backoffice/backoffice.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/apps/backoffice/backoffice.element.ts
@@ -10,33 +10,31 @@ import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
import './components/index.js';
-// TODO: temp solution to load core packages
const CORE_PACKAGES = [
- import('../../packages/audit-log/umbraco-package.js'),
- import('../../packages/block/umbraco-package.js'),
- import('../../packages/data-type/umbraco-package.js'),
- import('../../packages/dictionary/umbraco-package.js'),
+ import('../../packages/umbraco-news/umbraco-package.js'),
import('../../packages/documents/umbraco-package.js'),
- import('../../packages/dynamic-root/umbraco-package.js'),
- import('../../packages/health-check/umbraco-package.js'),
- import('../../packages/language/umbraco-package.js'),
- import('../../packages/log-viewer/umbraco-package.js'),
- import('../../packages/markdown-editor/umbraco-package.js'),
+ import('../../packages/data-type/umbraco-package.js'),
import('../../packages/media/umbraco-package.js'),
import('../../packages/members/umbraco-package.js'),
- import('../../packages/models-builder/umbraco-package.js'),
- //import('../../packages/object-type/umbraco-package.js'),// This had nothing to register.
- import('../../packages/packages/umbraco-package.js'),
- import('../../packages/relations/umbraco-package.js'),
import('../../packages/search/umbraco-package.js'),
import('../../packages/settings/umbraco-package.js'),
+ import('../../packages/language/umbraco-package.js'),
import('../../packages/static-file/umbraco-package.js'),
+ import('../../packages/dynamic-root/umbraco-package.js'),
+ import('../../packages/block/umbraco-package.js'),
import('../../packages/tags/umbraco-package.js'),
- import('../../packages/templating/umbraco-package.js'),
import('../../packages/tiny-mce/umbraco-package.js'),
- import('../../packages/umbraco-news/umbraco-package.js'),
+ import('../../packages/markdown-editor/umbraco-package.js'),
+ import('../../packages/templating/umbraco-package.js'),
+ import('../../packages/dictionary/umbraco-package.js'),
import('../../packages/user/umbraco-package.js'),
+ import('../../packages/health-check/umbraco-package.js'),
+ import('../../packages/audit-log/umbraco-package.js'),
import('../../packages/webhook/umbraco-package.js'),
+ import('../../packages/relations/umbraco-package.js'),
+ import('../../packages/models-builder/umbraco-package.js'),
+ import('../../packages/log-viewer/umbraco-package.js'),
+ import('../../packages/packages/umbraco-package.js'),
];
@customElement('umb-backoffice')
@@ -55,13 +53,13 @@ export class UmbBackofficeElement extends UmbLitElement {
new UmbBackofficeEntryPointExtensionInitializer(this, umbExtensionsRegistry);
new UmbEntryPointExtensionInitializer(this, umbExtensionsRegistry);
- new UmbServerExtensionRegistrator(this, umbExtensionsRegistry).registerPrivateExtensions();
-
// So far local packages are this simple to registerer, so no need for a manager to do that:
CORE_PACKAGES.forEach(async (packageImport) => {
const packageModule = await packageImport;
umbExtensionsRegistry.registerMany(packageModule.extensions);
});
+
+ new UmbServerExtensionRegistrator(this, umbExtensionsRegistry).registerPrivateExtensions();
}
render() {
diff --git a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts
index 5dd782a1a0..2fa50ce543 100644
--- a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts
@@ -81,7 +81,7 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
#tabs {
height: 60px;
flex-basis: 100%;
- font-size: 16px;
+ font-size: 16px; /* specific for the header */
--uui-tab-text: var(--uui-color-header-contrast);
--uui-tab-text-hover: var(--uui-color-header-contrast-emphasis);
--uui-tab-text-active: var(--uui-color-header-contrast-emphasis);
diff --git a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-main.element.ts b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-main.element.ts
index a04f0fad35..0eddd8fbc8 100644
--- a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-main.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-main.element.ts
@@ -1,6 +1,6 @@
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 { css, html, customElement, state, nothing } from '@umbraco-cms/backoffice/external/lit';
import { UmbSectionContext, UMB_SECTION_CONTEXT } from '@umbraco-cms/backoffice/section';
import type { UmbRoute, UmbRouterSlotChangeEvent } from '@umbraco-cms/backoffice/router';
import type { ManifestSection, UmbSectionElement } from '@umbraco-cms/backoffice/extension-registry';
@@ -99,17 +99,18 @@ export class UmbBackofficeMainElement extends UmbLitElement {
render() {
return this._routes.length > 0
? html`
+ ${this.errorHeadline
+ ? this.errorHeadline
+ : html` An unknown failure has occured `}
+
+ ${this.errorMessage}
${this.error
? html`
-
+ ${this.#renderError(this.error)}
- `
+ `
: nothing}