diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/entity-actions/create/modal/media-type-create-options-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/entity-actions/create/modal/media-type-create-options-modal.element.ts
index 50c43b78f1..3dc2b8563d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media-types/entity-actions/create/modal/media-type-create-options-modal.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media-types/entity-actions/create/modal/media-type-create-options-modal.element.ts
@@ -1,30 +1,38 @@
 import { UMB_MEDIA_TYPE_FOLDER_REPOSITORY_ALIAS } from '../../../tree/index.js';
 import type { UmbMediaTypeCreateOptionsModalData } from './index.js';
-import { html, customElement, property } from '@umbraco-cms/backoffice/external/lit';
-import { type UmbModalContext, UMB_MODAL_MANAGER_CONTEXT } from '@umbraco-cms/backoffice/modal';
-import { UMB_FOLDER_CREATE_MODAL } from '@umbraco-cms/backoffice/tree';
-import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { html, customElement } from '@umbraco-cms/backoffice/external/lit';
+import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
+import { UmbCreateFolderEntityAction } from '@umbraco-cms/backoffice/tree';
 
 @customElement('umb-media-type-create-options-modal')
-export class UmbDataTypeCreateOptionsModalElement extends UmbLitElement {
-	@property({ attribute: false })
-	modalContext?: UmbModalContext<UmbMediaTypeCreateOptionsModalData>;
+export class UmbDataTypeCreateOptionsModalElement extends UmbModalBaseElement<UmbMediaTypeCreateOptionsModalData> {
+	#createFolderAction?: UmbCreateFolderEntityAction;
 
-	@property({ type: Object })
-	data?: UmbMediaTypeCreateOptionsModalData;
-
-	async #onClick(event: PointerEvent) {
-		event.stopPropagation();
+	connectedCallback(): void {
+		super.connectedCallback();
 		if (!this.data?.parent) throw new Error('A parent is required to create a folder');
 
-		const modalManager = await this.getContext(UMB_MODAL_MANAGER_CONTEXT);
-		const folderModalHandler = modalManager.open(this, UMB_FOLDER_CREATE_MODAL, {
-			data: {
+		// 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_MEDIA_TYPE_FOLDER_REPOSITORY_ALIAS,
-				parent: this.data?.parent,
 			},
 		});
-		folderModalHandler?.onSubmit().then(() => this.modalContext?.submit());
+	}
+
+	async #onCreateFolderClick(event: PointerEvent) {
+		event.stopPropagation();
+
+		try {
+			await this.#createFolderAction?.execute();
+			this._submitModal();
+		} catch (error) {
+			console.error(error);
+		}
 	}
 
 	// close the modal when navigating to data type
@@ -50,8 +58,8 @@ export class UmbDataTypeCreateOptionsModalElement extends UmbLitElement {
 					<uui-menu-item href=${this.#getCreateHref()} 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 @click=${this.#onCreateFolderClick} 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>