Media Picker: only allow navigating to folders/media with children + other fixes

src/Umbraco.Cms.Api.Management/Factories/DocumentPresentationFactory.cs

@@ -22,19 +22,22 @@
     private readonly ITemplateService _templateService;
     private readonly IPublicAccessService _publicAccessService;
     private readonly TimeProvider _timeProvider;
+    private readonly IIdKeyMap _idKeyMap;
 
     public DocumentPresentationFactory(
         IUmbracoMapper umbracoMapper,
         IDocumentUrlFactory documentUrlFactory,
         ITemplateService templateService,
         IPublicAccessService publicAccessService,
-        TimeProvider timeProvider)
+        TimeProvider timeProvider,
+        IIdKeyMap idKeyMap)
     {
         _umbracoMapper = umbracoMapper;
         _documentUrlFactory = documentUrlFactory;
         _templateService = templateService;
         _publicAccessService = publicAccessService;
         _timeProvider = timeProvider;
+        _idKeyMap = idKeyMap;
     }
 
     public async Task<DocumentResponseModel> CreateResponseModelAsync(IContent content)
@@ -73,10 +76,14 @@
 
     public DocumentItemResponseModel CreateItemResponseModel(IDocumentEntitySlim entity)
     {
+        Attempt<Guid> parentKeyAttempt = _idKeyMap.GetKeyForId(entity.ParentId, UmbracoObjectTypes.Document);
+
         var responseModel = new DocumentItemResponseModel
         {
             Id = entity.Key,
-            IsTrashed = entity.Trashed
+            IsTrashed = entity.Trashed,
+            Parent = parentKeyAttempt.Success ? new ReferenceByIdModel { Id = parentKeyAttempt.Result } : null,
+            HasChildren = entity.HasChildren,
         };
 
         responseModel.IsProtected = _publicAccessService.IsProtected(entity.Path);

src/Umbraco.Cms.Api.Management/Factories/MediaPresentationFactory.cs

@@ -1,24 +1,30 @@
-using Umbraco.Cms.Api.Management.ViewModels.Content;
+using Umbraco.Cms.Api.Management.ViewModels;
+using Umbraco.Cms.Api.Management.ViewModels.Content;
 using Umbraco.Cms.Api.Management.ViewModels.Media;
 using Umbraco.Cms.Api.Management.ViewModels.Media.Item;
 using Umbraco.Cms.Api.Management.ViewModels.MediaType;
+using Umbraco.Cms.Core;
 using Umbraco.Cms.Core.Mapping;
 using Umbraco.Cms.Core.Models;
 using Umbraco.Cms.Core.Models.Entities;
+using Umbraco.Cms.Core.Services;
 
 namespace Umbraco.Cms.Api.Management.Factories;
 
 internal sealed class MediaPresentationFactory : IMediaPresentationFactory
 {
     private readonly IUmbracoMapper _umbracoMapper;
     private readonly IMediaUrlFactory _mediaUrlFactory;
+    private readonly IIdKeyMap _idKeyMap;
 
     public MediaPresentationFactory(
         IUmbracoMapper umbracoMapper,
-        IMediaUrlFactory mediaUrlFactory)
+        IMediaUrlFactory mediaUrlFactory,
+        IIdKeyMap idKeyMap)
     {
         _umbracoMapper = umbracoMapper;
         _mediaUrlFactory = mediaUrlFactory;
+        _idKeyMap = idKeyMap;
     }
 
     public MediaResponseModel CreateResponseModel(IMedia media)
@@ -32,10 +38,14 @@ public MediaResponseModel CreateResponseModel(IMedia media)
 
     public MediaItemResponseModel CreateItemResponseModel(IMediaEntitySlim entity)
     {
+        Attempt<Guid> parentKeyAttempt = _idKeyMap.GetKeyForId(entity.ParentId, UmbracoObjectTypes.Media);
+
         var responseModel = new MediaItemResponseModel
         {
             Id = entity.Key,
-            IsTrashed = entity.Trashed
+            IsTrashed = entity.Trashed,
+            Parent = parentKeyAttempt.Success ? new ReferenceByIdModel { Id = parentKeyAttempt.Result } : null,
+            HasChildren = entity.HasChildren,
         };
 
         responseModel.MediaType = _umbracoMapper.Map<MediaTypeReferenceResponseModel>(entity)!;

src/Umbraco.Cms.Api.Management/OpenApi.json

@@ -36738,6 +36738,7 @@
       "DocumentItemResponseModel": {
         "required": [
           "documentType",
+          "hasChildren",
           "id",
           "isProtected",
           "isTrashed",
@@ -36755,6 +36756,17 @@
           "isProtected": {
             "type": "boolean"
           },
+          "parent": {
+            "oneOf": [
+              {
+                "$ref": "#/components/schemas/ReferenceByIdModel"
+              }
+            ],
+            "nullable": true
+          },
+          "hasChildren": {
+            "type": "boolean"
+          },
           "documentType": {
             "oneOf": [
               {
@@ -38895,6 +38907,7 @@
       },
       "MediaItemResponseModel": {
         "required": [
+          "hasChildren",
           "id",
           "isTrashed",
           "mediaType",
@@ -38909,6 +38922,17 @@
           "isTrashed": {
             "type": "boolean"
           },
+          "parent": {
+            "oneOf": [
+              {
+                "$ref": "#/components/schemas/ReferenceByIdModel"
+              }
+            ],
+            "nullable": true
+          },
+          "hasChildren": {
+            "type": "boolean"
+          },
           "mediaType": {
             "oneOf": [
               {

src/Umbraco.Cms.Api.Management/ViewModels/Document/Item/DocumentItemResponseModel.cs

@@ -10,6 +10,10 @@ public class DocumentItemResponseModel : ItemResponseModelBase
 
     public bool IsProtected { get; set; }
 
+    public ReferenceByIdModel? Parent { get; set; }
+
+    public bool HasChildren { get; set; }
+
     public DocumentTypeReferenceResponseModel DocumentType { get; set; } = new();
 
     public IEnumerable<DocumentVariantItemResponseModel> Variants { get; set; } = Enumerable.Empty<DocumentVariantItemResponseModel>();

src/Umbraco.Cms.Api.Management/ViewModels/Media/Item/MediaItemResponseModel.cs

@@ -8,6 +8,10 @@ public class MediaItemResponseModel : ItemResponseModelBase
 {
     public bool IsTrashed { get; set; }
 
+    public ReferenceByIdModel? Parent { get; set; }
+
+    public bool HasChildren { get; set; }
+
     public MediaTypeReferenceResponseModel MediaType { get; set; } = new();
 
     public IEnumerable<VariantItemResponseModel> Variants { get; set; } = Enumerable.Empty<VariantItemResponseModel>();

src/Umbraco.Web.UI.Client/src/external/backend-api/src/types.gen.ts

@@ -653,6 +653,8 @@ export type DocumentItemResponseModel = {
     id: string;
     isTrashed: boolean;
     isProtected: boolean;
+    parent?: ((ReferenceByIdModel) | null);
+    hasChildren: boolean;
     documentType: (DocumentTypeReferenceResponseModel);
     variants: Array<(DocumentVariantItemResponseModel)>;
 };
@@ -1185,6 +1187,8 @@ export type MediaConfigurationResponseModel = {
 export type MediaItemResponseModel = {
     id: string;
     isTrashed: boolean;
+    parent?: ((ReferenceByIdModel) | null);
+    hasChildren: boolean;
     mediaType: (MediaTypeReferenceResponseModel);
     variants: Array<(VariantItemResponseModel)>;
 };

src/Umbraco.Web.UI.Client/src/mocks/data/document-blueprint/document-blueprint.db.ts

@@ -101,9 +101,11 @@ const itemMapper = (model: UmbMockDocumentBlueprintModel): DocumentItemResponseM
 			icon: model.documentType.icon,
 			id: model.documentType.id,
 		},
+		hasChildren: model.hasChildren,
 		id: model.id,
 		isProtected: model.isProtected,
 		isTrashed: model.isTrashed,
+		parent: model.parent,
 		variants: model.variants,
 	};
 };

src/Umbraco.Web.UI.Client/src/mocks/data/document/document.db.ts

@@ -126,9 +126,11 @@ const itemMapper = (model: UmbMockDocumentModel): DocumentItemResponseModel => {
 			icon: model.documentType.icon,
 			id: model.documentType.id,
 		},
+		hasChildren: model.hasChildren,
 		id: model.id,
 		isProtected: model.isProtected,
 		isTrashed: model.isTrashed,
+		parent: model.parent,
 		variants: model.variants,
 	};
 };

src/Umbraco.Web.UI.Client/src/mocks/data/media/media.db.ts

@@ -99,8 +99,10 @@ const itemMapper = (model: UmbMockMediaModel): MediaItemResponseModel => {
 			icon: model.mediaType.icon,
 			id: model.mediaType.id,
 		},
+		hasChildren: model.hasChildren,
 		id: model.id,
 		isTrashed: model.isTrashed,
+		parent: model.parent,
 		variants: model.variants,
 	};
 };

src/Umbraco.Web.UI.Client/src/packages/core/models/index.ts

@@ -14,6 +14,7 @@ export interface UmbNumberRangeValueType {
 	max?: number;
 }
 
+// TODO: this needs to use the UmbEntityUnique so we ensure that unique can be null
 export interface UmbReferenceByUnique {
 	unique: string;
 }

src/Umbraco.Web.UI.Client/src/packages/documents/documents/repository/item/document-item.server.data-source.ts

@@ -32,22 +32,24 @@ const getItems = (uniques: Array<string>) => DocumentService.getItemDocument({ i
 
 const mapper = (item: DocumentItemResponseModel): UmbDocumentItemModel => {
 	return {
-		entityType: UMB_DOCUMENT_ENTITY_TYPE,
-		unique: item.id,
-		isTrashed: item.isTrashed,
-		isProtected: item.isProtected,
 		documentType: {
-			unique: item.documentType.id,
-			icon: item.documentType.icon,
 			collection: item.documentType.collection ? { unique: item.documentType.collection.id } : null,
+			icon: item.documentType.icon,
+			unique: item.documentType.id,
 		},
+		entityType: UMB_DOCUMENT_ENTITY_TYPE,
+		hasChildren: item.hasChildren,
+		isProtected: item.isProtected,
+		isTrashed: item.isTrashed,
+		name: item.variants[0]?.name, // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
+		parent: item.parent ? { unique: item.parent.id } : null,
+		unique: item.id,
 		variants: item.variants.map((variant) => {
 			return {
 				culture: variant.culture || null,
 				name: variant.name,
 				state: variant.state,
 			};
 		}),
-		name: item.variants[0]?.name, // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
 	};
 };

src/Umbraco.Web.UI.Client/src/packages/documents/documents/repository/item/types.ts

@@ -1,18 +1,21 @@
+import type { UmbEntityUnique } from '@umbraco-cms/backoffice/entity';
 import type { UmbDocumentEntityType } from '../../entity.js';
 import type { DocumentVariantStateModel } from '@umbraco-cms/backoffice/external/backend-api';
 import type { UmbReferenceByUnique } from '@umbraco-cms/backoffice/models';
 
 export interface UmbDocumentItemModel {
-	entityType: UmbDocumentEntityType;
-	name: string; // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
-	unique: string;
-	isTrashed: boolean;
-	isProtected: boolean;
 	documentType: {
 		unique: string;
 		icon: string;
 		collection: UmbReferenceByUnique | null;
 	};
+	entityType: UmbDocumentEntityType;
+	hasChildren: boolean;
+	isProtected: boolean;
+	isTrashed: boolean;
+	name: string; // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
+	parent: { unique: UmbEntityUnique } | null; // TODO: Use UmbReferenceByUnique when it support unique as null
+	unique: string;
 	variants: Array<UmbDocumentItemVariantModel>;
 }
 

src/Umbraco.Web.UI.Client/src/packages/documents/documents/search/document-search.repository.ts

@@ -1,9 +1,9 @@
 import { UmbDocumentSearchServerDataSource } from './document-search.server.data-source.js';
-import type { UmbDocumentSearchItemModel } from './document.search-provider.js';
 import type { UmbSearchRepository, UmbSearchRequestArgs } from '@umbraco-cms/backoffice/search';
 import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 import type { UmbApi } from '@umbraco-cms/backoffice/extension-api';
+import type { UmbDocumentSearchItemModel } from './types.js';
 
 export class UmbDocumentSearchRepository
 	extends UmbControllerBase

src/Umbraco.Web.UI.Client/src/packages/documents/documents/search/document-search.server.data-source.ts

@@ -1,9 +1,9 @@
 import { UMB_DOCUMENT_ENTITY_TYPE } from '../entity.js';
-import type { UmbDocumentSearchItemModel } from './document.search-provider.js';
 import type { UmbSearchDataSource, UmbSearchRequestArgs } from '@umbraco-cms/backoffice/search';
 import type { UmbControllerHost } from '@umbraco-cms/backoffice/controller-api';
 import { DocumentService } from '@umbraco-cms/backoffice/external/backend-api';
 import { tryExecuteAndNotify } from '@umbraco-cms/backoffice/resources';
+import type { UmbDocumentSearchItemModel } from './types.js';
 
 /**
  * A data source for the Rollback that fetches data from the server
@@ -40,24 +40,26 @@ export class UmbDocumentSearchServerDataSource implements UmbSearchDataSource<Um
 		if (data) {
 			const mappedItems: Array<UmbDocumentSearchItemModel> = data.items.map((item) => {
 				return {
-					href: '/section/content/workspace/document/edit/' + item.id,
-					entityType: UMB_DOCUMENT_ENTITY_TYPE,
-					unique: item.id,
-					isTrashed: item.isTrashed,
-					isProtected: item.isProtected,
 					documentType: {
-						unique: item.documentType.id,
-						icon: item.documentType.icon,
 						collection: item.documentType.collection ? { unique: item.documentType.collection.id } : null,
+						icon: item.documentType.icon,
+						unique: item.documentType.id,
 					},
+					entityType: UMB_DOCUMENT_ENTITY_TYPE,
+					hasChildren: item.hasChildren,
+					href: '/section/content/workspace/document/edit/' + item.id,
+					isProtected: item.isProtected,
+					isTrashed: item.isTrashed,
+					name: item.variants[0]?.name, // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
+					parent: item.parent ? { unique: item.parent.id } : null,
+					unique: item.id,
 					variants: item.variants.map((variant) => {
 						return {
 							culture: variant.culture || null,
 							name: variant.name,
 							state: variant.state,
 						};
 					}),
-					name: item.variants[0]?.name, // TODO: this is not correct. We need to get it from the variants. This is a temp solution.
 				};
 			});
 

src/Umbraco.Web.UI.Client/src/packages/documents/documents/search/document.search-provider.ts

@@ -1,10 +1,7 @@
-import type { UmbDocumentItemModel } from '../index.js';
 import { UmbDocumentSearchRepository } from './document-search.repository.js';
 import type { UmbSearchProvider, UmbSearchRequestArgs } from '@umbraco-cms/backoffice/search';
 import { UmbControllerBase } from '@umbraco-cms/backoffice/class-api';
-export interface UmbDocumentSearchItemModel extends UmbDocumentItemModel {
-	href: string;
-}
+import type { UmbDocumentSearchItemModel } from './types.js';
 
 export class UmbDocumentSearchProvider
 	extends UmbControllerBase

src/Umbraco.Web.UI.Client/src/packages/documents/documents/search/types.ts

@@ -0,0 +1,5 @@
+import type { UmbDocumentItemModel } from '../repository/index.js';
+
+export interface UmbDocumentSearchItemModel extends UmbDocumentItemModel {
+	href: string;
+}

src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-media/input-media.element.ts

@@ -246,7 +246,6 @@ export class UmbInputMediaElement extends UmbFormControlMixin<string | undefined
 		return html`
 			<uui-card-media
 				name=${ifDefined(item.name === null ? undefined : item.name)}
-				detail=${ifDefined(item.unique)}
 				href="${ifDefined(href)}"
 				?readonly=${this.readonly}>
 				<umb-imaging-thumbnail

src/Umbraco.Web.UI.Client/src/packages/media/media/index.ts

@@ -1,11 +1,12 @@
-export * from './repository/index.js';
-export * from './workspace/index.js';
-export * from './reference/index.js';
 export * from './components/index.js';
 export * from './dropzone/index.js';
 export * from './entity.js';
 export * from './paths.js';
+export * from './reference/index.js';
+export * from './repository/index.js';
+export * from './search/index.js';
 export * from './utils/index.js';
+export * from './workspace/index.js';
 
 export { UMB_MEDIA_TREE_ALIAS, UMB_MEDIA_TREE_PICKER_MODAL } from './tree/index.js';
 export { UMB_MEDIA_COLLECTION_ALIAS } from './collection/index.js';