diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/constants.ts
index 82db47391590..15ea9ece9b98 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/constants.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/constants.ts
@@ -1,4 +1,4 @@
 export * from './menu/constants.js';
 export * from './repository/constants.js';
+export * from './root/constants.js';
 export * from './tree/constants.js';
-export const UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE = 'document-recycle-bin-root';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/manifests.ts
index 55c305be6e6c..3bf5f764f56f 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/manifests.ts
@@ -1,6 +1,7 @@
 import { manifests as entityActionManifests } from './entity-action/manifests.js';
 import { manifests as menuManifests } from './menu/manifests.js';
 import { manifests as repositoryManifests } from './repository/manifests.js';
+import { manifests as rootManifests } from './root/manifests.js';
 import { manifests as treeManifests } from './tree/manifests.js';
 
 export const manifests: Array<UmbExtensionManifest> = [
@@ -13,5 +14,6 @@ export const manifests: Array<UmbExtensionManifest> = [
 	...entityActionManifests,
 	...menuManifests,
 	...repositoryManifests,
+	...rootManifests,
 	...treeManifests,
 ];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/constants.ts
new file mode 100644
index 000000000000..2fb39332b0ca
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/constants.ts
@@ -0,0 +1,2 @@
+export { UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE } from './entity.js';
+export * from './workspace/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/entity.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/entity.ts
new file mode 100644
index 000000000000..56a25afd0f86
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/entity.ts
@@ -0,0 +1,3 @@
+export const UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE = 'document-recycle-bin-root';
+
+export type UmbDocumentRecycleBinRootEntityType = typeof UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE;
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/manifests.ts
new file mode 100644
index 000000000000..f3edde04ca19
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/manifests.ts
@@ -0,0 +1,3 @@
+import { manifests as workspaceManifests } from './workspace/manifests.js';
+
+export const manifests: Array<UmbExtensionManifest> = [...workspaceManifests];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/constants.ts
new file mode 100644
index 000000000000..7ed8ef928603
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/constants.ts
@@ -0,0 +1 @@
+export const UMB_DOCUMENT_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS = 'Umb.Workspace.Document.RecycleBin.Root';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/manifests.ts
new file mode 100644
index 000000000000..fb21ec4e50db
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/root/workspace/manifests.ts
@@ -0,0 +1,35 @@
+import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../../tree/constants.js';
+import { UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../entity.js';
+import { UMB_DOCUMENT_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS } from './constants.js';
+import { UMB_WORKSPACE_CONDITION_ALIAS } from '@umbraco-cms/backoffice/workspace';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'workspace',
+		kind: 'default',
+		alias: UMB_DOCUMENT_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS,
+		name: 'Document Recycle Bin Root Workspace',
+		meta: {
+			entityType: UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE,
+			headline: '#general_recycleBin',
+		},
+	},
+	{
+		type: 'workspaceView',
+		kind: 'collection',
+		alias: 'Umb.WorkspaceView.DocumentRecycleBinRoot.Root',
+		name: 'Document Recycle Bin Root Collection Workspace View',
+		meta: {
+			label: 'Collection',
+			pathname: 'collection',
+			icon: 'icon-layers',
+			collectionAlias: UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+		},
+		conditions: [
+			{
+				alias: UMB_WORKSPACE_CONDITION_ALIAS,
+				match: UMB_DOCUMENT_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS,
+			},
+		],
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/constants.ts
index f6af6f8ac015..2eb9967b5091 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/constants.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/constants.ts
@@ -6,3 +6,5 @@ export const UMB_DOCUMENT_RECYCLE_BIN_TREE_STORE_ALIAS = 'Umb.Store.Document.Rec
 export const UMB_DOCUMENT_RECYCLE_BIN_TREE_ALIAS = 'Umb.Tree.Document.RecycleBin';
 
 export { UMB_DOCUMENT_RECYCLE_BIN_TREE_STORE_CONTEXT } from './data/document-recycle-bin-tree.store.context-token.js';
+
+export * from './tree-item-children/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/manifests.ts
index c4b3774d97f0..17637d2cbdaa 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/manifests.ts
@@ -1,8 +1,8 @@
-import { UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../constants.js';
 import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ALIAS, UMB_DOCUMENT_RECYCLE_BIN_TREE_REPOSITORY_ALIAS } from './constants.js';
 import { manifests as dataManifests } from './data/manifests.js';
 import { manifests as reloadTreeItemChildrenManifests } from './reload-tree-item-children/manifests.js';
 import { manifests as rootTreeItemManifests } from './tree-item/manifests.js';
+import { manifests as treeItemChildrenManifests } from './tree-item-children/manifests.js';
 
 export const manifests: Array<UmbExtensionManifest> = [
 	{
@@ -14,17 +14,8 @@ export const manifests: Array<UmbExtensionManifest> = [
 			repositoryAlias: UMB_DOCUMENT_RECYCLE_BIN_TREE_REPOSITORY_ALIAS,
 		},
 	},
-	{
-		type: 'workspace',
-		kind: 'default',
-		alias: 'Umb.Workspace.Document.RecycleBin.Root',
-		name: 'Document Recycle Bin Root Workspace',
-		meta: {
-			entityType: UMB_DOCUMENT_RECYCLE_BIN_ROOT_ENTITY_TYPE,
-			headline: '#general_recycleBin',
-		},
-	},
 	...dataManifests,
 	...reloadTreeItemChildrenManifests,
 	...rootTreeItemManifests,
+	...treeItemChildrenManifests,
 ];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/constants.ts
new file mode 100644
index 000000000000..a5b3be645966
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/constants.ts
@@ -0,0 +1,3 @@
+export const UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS =
+	'Umb.Collection.DocumentRecycleBin.TreeItemChildren';
+export * from './repository/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/index.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/index.ts
new file mode 100644
index 000000000000..6c11f6abbb12
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/index.ts
@@ -0,0 +1,2 @@
+export * from './constants.js';
+export * from './repository/index.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/manifests.ts
new file mode 100644
index 000000000000..356876e06670
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/manifests.ts
@@ -0,0 +1,18 @@
+import { manifests as repositoryManifests } from './repository/manifests.js';
+import { manifests as viewManifests } from './views/manifests.js';
+import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from './constants.js';
+import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './repository/index.js';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'collection',
+		kind: 'default',
+		alias: UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+		name: 'Document Recycle Bin Tree Item Children Collection',
+		meta: {
+			repositoryAlias: UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS,
+		},
+	},
+	...repositoryManifests,
+	...viewManifests,
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/constants.ts
new file mode 100644
index 000000000000..9b43b2127654
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/constants.ts
@@ -0,0 +1,2 @@
+export const UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS =
+	'Umb.Repository.DocumentRecycleBin.TreeItemChildrenCollection';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/document-recycle-bin-tree-item-children-collection.repository.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/document-recycle-bin-tree-item-children-collection.repository.ts
new file mode 100644
index 000000000000..a14b067aa8bb
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/document-recycle-bin-tree-item-children-collection.repository.ts
@@ -0,0 +1,33 @@
+import { UmbDocumentRecycleBinTreeRepository } from '../../../index.js';
+import type { UmbCollectionFilterModel, UmbCollectionRepository } from '@umbraco-cms/backoffice/collection';
+import { UmbRepositoryBase } from '@umbraco-cms/backoffice/repository';
+import { UMB_ENTITY_CONTEXT, type UmbEntityModel } from '@umbraco-cms/backoffice/entity';
+
+export class UmbDocumentRecycleBinTreeItemChildrenCollectionRepository
+	extends UmbRepositoryBase
+	implements UmbCollectionRepository
+{
+	#treeRepository = new UmbDocumentRecycleBinTreeRepository(this);
+
+	async requestCollection(filter: UmbCollectionFilterModel) {
+		// TODO: get parent from args
+		const entityContext = await this.getContext(UMB_ENTITY_CONTEXT);
+		if (!entityContext) throw new Error('Entity context not found');
+
+		const entityType = entityContext.getEntityType();
+		const unique = entityContext.getUnique();
+
+		if (!entityType) throw new Error('Entity type not found');
+		if (unique === undefined) throw new Error('Unique not found');
+
+		const parent: UmbEntityModel = { entityType, unique };
+
+		if (parent.unique === null) {
+			return this.#treeRepository.requestTreeRootItems({ skip: filter.skip, take: filter.take });
+		} else {
+			return this.#treeRepository.requestTreeItemsOf({ parent, skip: filter.skip, take: filter.take });
+		}
+	}
+}
+
+export { UmbDocumentRecycleBinTreeItemChildrenCollectionRepository as api };
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/index.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/index.ts
new file mode 100644
index 000000000000..4f07201dcf0a
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/index.ts
@@ -0,0 +1 @@
+export * from './constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts
new file mode 100644
index 000000000000..437753a9afc8
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts
@@ -0,0 +1,10 @@
+import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './constants.js';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'repository',
+		alias: UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS,
+		name: 'Document Recycle Bin Tree Item Children Collection Repository',
+		api: () => import('./document-recycle-bin-tree-item-children-collection.repository.js'),
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/types.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/types.ts
new file mode 100644
index 000000000000..ac2209ac74b4
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/types.ts
@@ -0,0 +1,6 @@
+import type { UmbCollectionFilterModel } from '@umbraco-cms/backoffice/collection';
+import type { UmbEntityModel } from '@umbraco-cms/backoffice/entity';
+
+export interface UmbDocumentRecycleBinTreeItemChildrenCollectionFilterModel extends UmbCollectionFilterModel {
+	parent: UmbEntityModel;
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/document-recycle-bin-tree-item-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/document-recycle-bin-tree-item-table-collection-view.element.ts
new file mode 100644
index 000000000000..58feca6dd5b2
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/document-recycle-bin-tree-item-table-collection-view.element.ts
@@ -0,0 +1,101 @@
+import type { UmbDocumentRecycleBinTreeItemModel } from '../../../types.js';
+import type { UmbDefaultCollectionContext } from '@umbraco-cms/backoffice/collection';
+import { UMB_COLLECTION_CONTEXT } from '@umbraco-cms/backoffice/collection';
+import type { UmbTableColumn, UmbTableConfig, UmbTableItem } from '@umbraco-cms/backoffice/components';
+import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
+import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { UmbIsTrashedEntityContext } from '@umbraco-cms/backoffice/recycle-bin';
+
+import './trashed-document-name-table-column.element.js';
+
+@customElement('umb-document-recycle-bin-tree-item-table-collection-view')
+export class UmbDocumentRecycleBinTreeItemTableCollectionViewElement extends UmbLitElement {
+	@state()
+	private _tableConfig: UmbTableConfig = {
+		allowSelection: false,
+	};
+
+	@state()
+	private _tableColumns: Array<UmbTableColumn> = [
+		{
+			name: this.localize.term('general_name'),
+			alias: 'name',
+			elementName: 'umb-trashed-document-name-table-column',
+		},
+		{
+			name: '',
+			alias: 'entityActions',
+			align: 'right',
+		},
+	];
+
+	@state()
+	private _tableItems: Array<UmbTableItem> = [];
+
+	#collectionContext?: UmbDefaultCollectionContext;
+	#isTrashedContext = new UmbIsTrashedEntityContext(this);
+
+	constructor() {
+		super();
+		this.#isTrashedContext.setIsTrashed(true);
+
+		this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
+			this.#collectionContext = instance;
+			this.#observeCollectionItems();
+		});
+	}
+
+	#observeCollectionItems() {
+		if (!this.#collectionContext) return;
+		this.observe(this.#collectionContext.items, (items) => this.#createTableItems(items), 'umbCollectionItemsObserver');
+	}
+
+	#createTableItems(items: Array<UmbDocumentRecycleBinTreeItemModel>) {
+		this._tableItems = items.map((item) => {
+			return {
+				id: item.unique,
+				icon: item.documentType.icon,
+				data: [
+					{
+						columnAlias: 'name',
+						value: item,
+					},
+					{
+						columnAlias: 'entityActions',
+						value: html`<umb-entity-actions-table-column-view
+							.value=${{
+								entityType: item.entityType,
+								unique: item.unique,
+								name: item.name,
+							}}></umb-entity-actions-table-column-view>`,
+					},
+				],
+			};
+		});
+	}
+
+	override render() {
+		return html`
+			<umb-table .config=${this._tableConfig} .columns=${this._tableColumns} .items=${this._tableItems}></umb-table>
+		`;
+	}
+
+	static override styles = [
+		UmbTextStyles,
+		css`
+			:host {
+				display: flex;
+				flex-direction: column;
+			}
+		`,
+	];
+}
+
+export { UmbDocumentRecycleBinTreeItemTableCollectionViewElement as element };
+
+declare global {
+	interface HTMLElementTagNameMap {
+		['umb-document-recycle-bin-tree-item-table-collection-view']: UmbDocumentRecycleBinTreeItemTableCollectionViewElement;
+	}
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/manifests.ts
new file mode 100644
index 000000000000..ef40a35fe2ee
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/manifests.ts
@@ -0,0 +1,23 @@
+import { UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../constants.js';
+import { UMB_COLLECTION_ALIAS_CONDITION } from '@umbraco-cms/backoffice/collection';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'collectionView',
+		alias: 'Umb.CollectionView.DocumentRecycleBin.TreeItem.Table',
+		name: 'Document Recycle Bin Tree Item Table Collection View',
+		element: () => import('./document-recycle-bin-tree-item-table-collection-view.element.js'),
+		weight: 300,
+		meta: {
+			label: 'Table',
+			icon: 'icon-list',
+			pathName: 'table',
+		},
+		conditions: [
+			{
+				alias: UMB_COLLECTION_ALIAS_CONDITION,
+				match: UMB_DOCUMENT_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+			},
+		],
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/trashed-document-name-table-column.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/trashed-document-name-table-column.element.ts
new file mode 100644
index 000000000000..fffd779a9ef1
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/collection/views/trashed-document-name-table-column.element.ts
@@ -0,0 +1,62 @@
+import { UmbDocumentItemDataResolver } from '../../../../../item/index.js';
+import type { UmbDocumentRecycleBinTreeItemModel } from '../../../types.js';
+import { UMB_EDIT_DOCUMENT_WORKSPACE_PATH_PATTERN } from '../../../../../paths.js';
+import { css, customElement, html, nothing, property, state } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import type { UmbTableColumn, UmbTableColumnLayoutElement, UmbTableItem } from '@umbraco-cms/backoffice/components';
+
+@customElement('umb-trashed-document-name-table-column')
+export class UmbTrashedDocumentNameTableColumnElement extends UmbLitElement implements UmbTableColumnLayoutElement {
+	#resolver = new UmbDocumentItemDataResolver(this);
+
+	@state()
+	private _name = '';
+
+	@state()
+	private _editPath = '';
+
+	column!: UmbTableColumn;
+	item!: UmbTableItem;
+
+	@property({ attribute: false })
+	public set value(value: UmbDocumentRecycleBinTreeItemModel) {
+		this.#value = value;
+
+		if (value) {
+			this.#resolver.setData(value);
+
+			this._editPath = UMB_EDIT_DOCUMENT_WORKSPACE_PATH_PATTERN.generateAbsolute({
+				unique: value.unique,
+			});
+		}
+	}
+	public get value(): UmbDocumentRecycleBinTreeItemModel {
+		return this.#value;
+	}
+	#value!: UmbDocumentRecycleBinTreeItemModel;
+
+	constructor() {
+		super();
+		this.#resolver.observe(this.#resolver.name, (name) => (this._name = name || ''));
+	}
+
+	override render() {
+		if (!this.value) return nothing;
+		if (!this._name) return nothing;
+		return html`<uui-button compact href=${this._editPath} label=${this._name}></uui-button>`;
+	}
+
+	static override styles = [
+		css`
+			uui-button {
+				text-align: left;
+			}
+		`,
+	];
+}
+
+declare global {
+	interface HTMLElementTagNameMap {
+		'umb-trashed-document-name-table-column': UmbTrashedDocumentNameTableColumnElement;
+	}
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/constants.ts
new file mode 100644
index 000000000000..d7b529d49c8c
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/constants.ts
@@ -0,0 +1 @@
+export * from './collection/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/manifests.ts
new file mode 100644
index 000000000000..bfab902d3c4e
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/recycle-bin/tree/tree-item-children/manifests.ts
@@ -0,0 +1,3 @@
+import { manifests as collectionManifests } from './collection/manifests.js';
+
+export const manifests: Array<UmbExtensionManifest> = [...collectionManifests];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/constants.ts
index 49ba8c883607..6ba1d184de3d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/constants.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/constants.ts
@@ -1,4 +1,4 @@
 export * from './menu/constants.js';
 export * from './repository/constants.js';
 export * from './tree/constants.js';
-export const UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE = 'media-recycle-bin-root';
+export * from './root/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/entity-action/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/entity-action/manifests.ts
index 144684b99cd4..a043847c9991 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/entity-action/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/entity-action/manifests.ts
@@ -2,9 +2,10 @@ import {
 	UMB_MEDIA_ITEM_REPOSITORY_ALIAS,
 	UMB_MEDIA_TREE_PICKER_MODAL,
 	UMB_MEDIA_ENTITY_TYPE,
+	UMB_MEDIA_RECYCLE_BIN_REPOSITORY_ALIAS,
 } from '../../constants.js';
-import { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE, UMB_MEDIA_RECYCLE_BIN_REPOSITORY_ALIAS } from '../constants.js';
 import { UMB_MEDIA_REFERENCE_REPOSITORY_ALIAS } from '../../reference/constants.js';
+import { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../root/entity.js';
 import { manifests as bulkTrashManifests } from './bulk-trash/manifests.js';
 import { UMB_ENTITY_HAS_CHILDREN_CONDITION_ALIAS } from '@umbraco-cms/backoffice/entity-action';
 import {
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/manifests.ts
index 5f87f5fcf49b..ff4bb517f2c0 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/manifests.ts
@@ -1,6 +1,7 @@
 import { manifests as entityActionManifests } from './entity-action/manifests.js';
 import { manifests as menuManifests } from './menu/manifests.js';
 import { manifests as repositoryManifests } from './repository/manifests.js';
+import { manifests as rootManifests } from './root/manifests.js';
 import { manifests as treeManifests } from './tree/manifests.js';
 
 export const manifests: Array<UmbExtensionManifest> = [
@@ -13,5 +14,6 @@ export const manifests: Array<UmbExtensionManifest> = [
 	...entityActionManifests,
 	...menuManifests,
 	...repositoryManifests,
+	...rootManifests,
 	...treeManifests,
 ];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/constants.ts
new file mode 100644
index 000000000000..27491976dc79
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/constants.ts
@@ -0,0 +1,2 @@
+export { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE } from './entity.js';
+export * from './workspace/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/entity.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/entity.ts
new file mode 100644
index 000000000000..60448b8919fa
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/entity.ts
@@ -0,0 +1,3 @@
+export const UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE = 'media-recycle-bin-root';
+
+export type UmbMediaRecycleBinRootEntityType = typeof UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE;
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/manifests.ts
new file mode 100644
index 000000000000..f3edde04ca19
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/manifests.ts
@@ -0,0 +1,3 @@
+import { manifests as workspaceManifests } from './workspace/manifests.js';
+
+export const manifests: Array<UmbExtensionManifest> = [...workspaceManifests];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/constants.ts
new file mode 100644
index 000000000000..48a3bf749a3d
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/constants.ts
@@ -0,0 +1 @@
+export const UMB_MEDIA_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS = 'Umb.Workspace.Media.RecycleBin.Root';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/manifests.ts
new file mode 100644
index 000000000000..22276ca6a64b
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/root/workspace/manifests.ts
@@ -0,0 +1,35 @@
+import { UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../../tree/constants.js';
+import { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../entity.js';
+import { UMB_MEDIA_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS } from './constants.js';
+import { UMB_WORKSPACE_CONDITION_ALIAS } from '@umbraco-cms/backoffice/workspace';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'workspace',
+		kind: 'default',
+		alias: UMB_MEDIA_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS,
+		name: 'Media Recycle Bin Root Workspace',
+		meta: {
+			entityType: UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE,
+			headline: '#general_recycleBin',
+		},
+	},
+	{
+		type: 'workspaceView',
+		kind: 'collection',
+		alias: 'Umb.WorkspaceView.Media.RecycleBin.Root',
+		name: 'Media Recycle Bin Root Collection Workspace View',
+		meta: {
+			label: 'Collection',
+			pathname: 'collection',
+			icon: 'icon-layers',
+			collectionAlias: UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+		},
+		conditions: [
+			{
+				alias: UMB_WORKSPACE_CONDITION_ALIAS,
+				match: UMB_MEDIA_RECYCLE_BIN_ROOT_WORKSPACE_ALIAS,
+			},
+		],
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/constants.ts
index d5a44c7ff581..e84b5d520f2d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/constants.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/constants.ts
@@ -6,3 +6,5 @@ export const UMB_MEDIA_RECYCLE_BIN_TREE_STORE_ALIAS = 'Umb.Store.Media.RecycleBi
 export const UMB_MEDIA_RECYCLE_BIN_TREE_ALIAS = 'Umb.Tree.Media.RecycleBin';
 
 export { UMB_MEDIA_RECYCLE_BIN_TREE_STORE_CONTEXT } from './media-recycle-bin-tree.store.context-token.js';
+
+export * from './tree-item-children/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/manifests.ts
index 956585aea832..e51d86f3c173 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/manifests.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/manifests.ts
@@ -1,11 +1,12 @@
 import { UMB_MEDIA_ENTITY_TYPE } from '../../entity.js';
-import { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../constants.js';
+import { UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE } from '../root/entity.js';
 import {
 	UMB_MEDIA_RECYCLE_BIN_TREE_ALIAS,
 	UMB_MEDIA_RECYCLE_BIN_TREE_REPOSITORY_ALIAS,
 	UMB_MEDIA_RECYCLE_BIN_TREE_STORE_ALIAS,
 } from './constants.js';
 import { manifests as reloadTreeItemChildrenManifests } from './reload-tree-item-children/manifests.js';
+import { manifests as treeItemChildrenManifests } from './tree-item-children/manifests.js';
 
 export const manifests: Array<UmbExtensionManifest> = [
 	{
@@ -39,15 +40,6 @@ export const manifests: Array<UmbExtensionManifest> = [
 			supportedEntityTypes: [UMB_MEDIA_ENTITY_TYPE],
 		},
 	},
-	{
-		type: 'workspace',
-		kind: 'default',
-		alias: 'Umb.Workspace.Media.RecycleBin.Root',
-		name: 'Media Recycle Bin Root Workspace',
-		meta: {
-			entityType: UMB_MEDIA_RECYCLE_BIN_ROOT_ENTITY_TYPE,
-			headline: '#general_recycleBin',
-		},
-	},
 	...reloadTreeItemChildrenManifests,
+	...treeItemChildrenManifests,
 ];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/constants.ts
new file mode 100644
index 000000000000..334e56bcd88a
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/constants.ts
@@ -0,0 +1,3 @@
+export const UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS =
+	'Umb.Collection.Media.RecycleBin.TreeItemChildren';
+export * from './repository/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/index.ts
new file mode 100644
index 000000000000..6c11f6abbb12
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/index.ts
@@ -0,0 +1,2 @@
+export * from './constants.js';
+export * from './repository/index.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/manifests.ts
new file mode 100644
index 000000000000..9239b10314a5
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/manifests.ts
@@ -0,0 +1,18 @@
+import { manifests as repositoryManifests } from './repository/manifests.js';
+import { manifests as viewManifests } from './views/manifests.js';
+import { UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from './constants.js';
+import { UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './repository/index.js';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'collection',
+		kind: 'default',
+		alias: UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+		name: 'Media Recycle Bin Tree Item Children Collection',
+		meta: {
+			repositoryAlias: UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS,
+		},
+	},
+	...repositoryManifests,
+	...viewManifests,
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/constants.ts
new file mode 100644
index 000000000000..2124b318d990
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/constants.ts
@@ -0,0 +1,2 @@
+export const UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS =
+	'Umb.Repository.Media.RecycleBin.TreeItemChildrenCollection';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/index.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/index.ts
new file mode 100644
index 000000000000..4f07201dcf0a
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/index.ts
@@ -0,0 +1 @@
+export * from './constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts
new file mode 100644
index 000000000000..8e354bc7a50f
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/manifests.ts
@@ -0,0 +1,10 @@
+import { UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS } from './constants.js';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'repository',
+		alias: UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_REPOSITORY_ALIAS,
+		name: 'Media Recycle Bin Tree Item Children Collection Repository',
+		api: () => import('./media-recycle-bin-tree-item-children-collection.repository.js'),
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/media-recycle-bin-tree-item-children-collection.repository.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/media-recycle-bin-tree-item-children-collection.repository.ts
new file mode 100644
index 000000000000..bd0de3d1261c
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/repository/media-recycle-bin-tree-item-children-collection.repository.ts
@@ -0,0 +1,33 @@
+import { UmbMediaRecycleBinTreeRepository } from '../../../index.js';
+import type { UmbCollectionFilterModel, UmbCollectionRepository } from '@umbraco-cms/backoffice/collection';
+import { UmbRepositoryBase } from '@umbraco-cms/backoffice/repository';
+import { UMB_ENTITY_CONTEXT, type UmbEntityModel } from '@umbraco-cms/backoffice/entity';
+
+export class UmbMediaRecycleBinTreeItemChildrenCollectionRepository
+	extends UmbRepositoryBase
+	implements UmbCollectionRepository
+{
+	#treeRepository = new UmbMediaRecycleBinTreeRepository(this);
+
+	async requestCollection(filter: UmbCollectionFilterModel) {
+		// TODO: get parent from args
+		const entityContext = await this.getContext(UMB_ENTITY_CONTEXT);
+		if (!entityContext) throw new Error('Entity context not found');
+
+		const entityType = entityContext.getEntityType();
+		const unique = entityContext.getUnique();
+
+		if (!entityType) throw new Error('Entity type not found');
+		if (unique === undefined) throw new Error('Unique not found');
+
+		const parent: UmbEntityModel = { entityType, unique };
+
+		if (parent.unique === null) {
+			return this.#treeRepository.requestTreeRootItems({ skip: filter.skip, take: filter.take });
+		} else {
+			return this.#treeRepository.requestTreeItemsOf({ parent, skip: filter.skip, take: filter.take });
+		}
+	}
+}
+
+export { UmbMediaRecycleBinTreeItemChildrenCollectionRepository as api };
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/types.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/types.ts
new file mode 100644
index 000000000000..ec21427cb0d6
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/types.ts
@@ -0,0 +1,6 @@
+import type { UmbCollectionFilterModel } from '@umbraco-cms/backoffice/collection';
+import type { UmbEntityModel } from '@umbraco-cms/backoffice/entity';
+
+export interface UmbMediaRecycleBinTreeItemChildrenCollectionFilterModel extends UmbCollectionFilterModel {
+	parent: UmbEntityModel;
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/manifests.ts
new file mode 100644
index 000000000000..abf3fab48f28
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/manifests.ts
@@ -0,0 +1,23 @@
+import { UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS } from '../constants.js';
+import { UMB_COLLECTION_ALIAS_CONDITION } from '@umbraco-cms/backoffice/collection';
+
+export const manifests: Array<UmbExtensionManifest> = [
+	{
+		type: 'collectionView',
+		alias: 'Umb.CollectionView.Media.RecycleBin.TreeItem.Table',
+		name: 'Media Recycle Bin Tree Item Table Collection View',
+		element: () => import('./media-recycle-bin-tree-item-table-collection-view.element.js'),
+		weight: 300,
+		meta: {
+			label: 'Table',
+			icon: 'icon-list',
+			pathName: 'table',
+		},
+		conditions: [
+			{
+				alias: UMB_COLLECTION_ALIAS_CONDITION,
+				match: UMB_MEDIA_RECYCLE_BIN_TREE_ITEM_CHILDREN_COLLECTION_ALIAS,
+			},
+		],
+	},
+];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/media-recycle-bin-tree-item-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/media-recycle-bin-tree-item-table-collection-view.element.ts
new file mode 100644
index 000000000000..a6fc25185809
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/media-recycle-bin-tree-item-table-collection-view.element.ts
@@ -0,0 +1,101 @@
+import type { UmbMediaRecycleBinTreeItemModel } from '../../../types.js';
+import type { UmbDefaultCollectionContext } from '@umbraco-cms/backoffice/collection';
+import { UMB_COLLECTION_CONTEXT } from '@umbraco-cms/backoffice/collection';
+import type { UmbTableColumn, UmbTableConfig, UmbTableItem } from '@umbraco-cms/backoffice/components';
+import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
+import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import { UmbIsTrashedEntityContext } from '@umbraco-cms/backoffice/recycle-bin';
+
+import './trashed-media-name-table-column.element.js';
+
+@customElement('umb-media-recycle-bin-tree-item-table-collection-view')
+export class UmbMediaRecycleBinTreeItemTableCollectionViewElement extends UmbLitElement {
+	@state()
+	private _tableConfig: UmbTableConfig = {
+		allowSelection: false,
+	};
+
+	@state()
+	private _tableColumns: Array<UmbTableColumn> = [
+		{
+			name: this.localize.term('general_name'),
+			alias: 'name',
+			elementName: 'umb-trashed-media-name-table-column',
+		},
+		{
+			name: '',
+			alias: 'entityActions',
+			align: 'right',
+		},
+	];
+
+	@state()
+	private _tableItems: Array<UmbTableItem> = [];
+
+	#collectionContext?: UmbDefaultCollectionContext;
+	#isTrashedContext = new UmbIsTrashedEntityContext(this);
+
+	constructor() {
+		super();
+		this.#isTrashedContext.setIsTrashed(true);
+
+		this.consumeContext(UMB_COLLECTION_CONTEXT, (instance) => {
+			this.#collectionContext = instance;
+			this.#observeCollectionItems();
+		});
+	}
+
+	#observeCollectionItems() {
+		if (!this.#collectionContext) return;
+		this.observe(this.#collectionContext.items, (items) => this.#createTableItems(items), 'umbCollectionItemsObserver');
+	}
+
+	#createTableItems(items: Array<UmbMediaRecycleBinTreeItemModel>) {
+		this._tableItems = items.map((item) => {
+			return {
+				id: item.unique,
+				icon: item.mediaType.icon,
+				data: [
+					{
+						columnAlias: 'name',
+						value: item,
+					},
+					{
+						columnAlias: 'entityActions',
+						value: html`<umb-entity-actions-table-column-view
+							.value=${{
+								entityType: item.entityType,
+								unique: item.unique,
+								name: item.name,
+							}}></umb-entity-actions-table-column-view>`,
+					},
+				],
+			};
+		});
+	}
+
+	override render() {
+		return html`
+			<umb-table .config=${this._tableConfig} .columns=${this._tableColumns} .items=${this._tableItems}></umb-table>
+		`;
+	}
+
+	static override styles = [
+		UmbTextStyles,
+		css`
+			:host {
+				display: flex;
+				flex-direction: column;
+			}
+		`,
+	];
+}
+
+export { UmbMediaRecycleBinTreeItemTableCollectionViewElement as element };
+
+declare global {
+	interface HTMLElementTagNameMap {
+		['umb-media-recycle-bin-tree-item-table-collection-view']: UmbMediaRecycleBinTreeItemTableCollectionViewElement;
+	}
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/trashed-media-name-table-column.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/trashed-media-name-table-column.element.ts
new file mode 100644
index 000000000000..3a797d224f5d
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/collection/views/trashed-media-name-table-column.element.ts
@@ -0,0 +1,54 @@
+import type { UmbMediaRecycleBinTreeItemModel } from '../../../types.js';
+import { UMB_EDIT_MEDIA_WORKSPACE_PATH_PATTERN } from '../../../../../paths.js';
+import { css, customElement, html, nothing, property, state } from '@umbraco-cms/backoffice/external/lit';
+import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
+import type { UmbTableColumn, UmbTableColumnLayoutElement, UmbTableItem } from '@umbraco-cms/backoffice/components';
+
+@customElement('umb-trashed-media-name-table-column')
+export class UmbTrashedMediaNameTableColumnElement extends UmbLitElement implements UmbTableColumnLayoutElement {
+	@state()
+	private _name = '';
+
+	@state()
+	private _editPath = '';
+
+	column!: UmbTableColumn;
+	item!: UmbTableItem;
+
+	@property({ attribute: false })
+	public set value(value: UmbMediaRecycleBinTreeItemModel) {
+		this.#value = value;
+
+		if (value) {
+			this._name = value.variants[0]?.name || '';
+
+			this._editPath = UMB_EDIT_MEDIA_WORKSPACE_PATH_PATTERN.generateAbsolute({
+				unique: value.unique,
+			});
+		}
+	}
+	public get value(): UmbMediaRecycleBinTreeItemModel {
+		return this.#value;
+	}
+	#value!: UmbMediaRecycleBinTreeItemModel;
+
+	override render() {
+		if (!this.value) return nothing;
+		if (!this._name) return nothing;
+		return html`<uui-button compact href=${this._editPath} label=${this._name}></uui-button>`;
+	}
+
+	static override styles = [
+		css`
+			uui-button {
+				text-align: left;
+			}
+		`,
+	];
+}
+
+declare global {
+	interface HTMLElementTagNameMap {
+		'umb-trashed-media-name-table-column': UmbTrashedMediaNameTableColumnElement;
+	}
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/constants.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/constants.ts
new file mode 100644
index 000000000000..d7b529d49c8c
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/constants.ts
@@ -0,0 +1 @@
+export * from './collection/constants.js';
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/manifests.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/manifests.ts
new file mode 100644
index 000000000000..bfab902d3c4e
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/recycle-bin/tree/tree-item-children/manifests.ts
@@ -0,0 +1,3 @@
+import { manifests as collectionManifests } from './collection/manifests.js';
+
+export const manifests: Array<UmbExtensionManifest> = [...collectionManifests];