diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/modals/allowed-document-types/allowed-document-types-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/modals/allowed-document-types/allowed-document-types-modal.element.ts
index ec849a09f3..a81630fd76 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/modals/allowed-document-types/allowed-document-types-modal.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/document-types/modals/allowed-document-types/allowed-document-types-modal.element.ts
@@ -3,7 +3,7 @@ import { html, nothing, customElement, state, ifDefined } from '@umbraco-cms/bac
 import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
 import { UmbAllowedDocumentTypesModalData, UmbAllowedDocumentTypesModalResult } from '@umbraco-cms/backoffice/modal';
 import { UmbModalBaseElement } from '@umbraco-cms/internal/modal';
-import { DocumentTypeTreeItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
+import { DocumentTypeResponseModel, DocumentTypeTreeItemResponseModel } from '@umbraco-cms/backoffice/backend-api';
 
 @customElement('umb-allowed-document-types-modal')
 export class UmbAllowedDocumentTypesModalElement extends UmbModalBaseElement<
@@ -21,17 +21,20 @@ export class UmbAllowedDocumentTypesModalElement extends UmbModalBaseElement<
 	public connectedCallback() {
 		super.connectedCallback();
 
+		const parentId = this.data?.parentId;
 		const parentName = this.data?.parentName;
 		if (parentName) {
 			this._headline = `Create at '${parentName}'`;
 		} else {
 			this._headline = `Create`;
 		}
-		if (this.data?.parentId) {
+		if (parentId) {
 			// TODO: Support root aka. id of null? or maybe its an active prop, like 'atRoot'.
 			// TODO: show error
 
-			this._retrieveAllowedChildrenOf(this.data.parentId);
+			this._retrieveAllowedChildrenOf(parentId);
+		} else {
+			this._retrieveAllowedChildrenOfRoot();
 		}
 	}
 
@@ -43,6 +46,25 @@ export class UmbAllowedDocumentTypesModalElement extends UmbModalBaseElement<
 		}
 	}
 
+	private async _retrieveAllowedChildrenOfRoot() {
+		// TODO: This is a hack until we get the right end points (Which will become a Document end point. meaning this modal should have another name, it should be named so its clear that this is for documents, not document types. ex.: 'create-document-modal')
+		const { data } = await this.#documentTypeRepository.requestRootTreeItems();
+		if (!data) return;
+
+		const allFullModels: Array<DocumentTypeResponseModel & {$type: ''}> = [];
+		await Promise.all(
+			data.items.map((item) => {
+				if (item.id) {
+					return this.#documentTypeRepository.requestById(item.id).then((result) => {if(result.data) {allFullModels.push({$type: '', ...result.data})}});
+				}
+				return Promise.resolve();
+			})
+		);
+
+		this._allowedDocumentTypes = allFullModels.filter((item) => item.allowedAsRoot) ?? [];
+		// End of hack...^^
+	}
+
 	private _handleCancel() {
 		this.modalContext?.reject();
 	}