diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts
index 3f8b3fc203..6efc7fa75f 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/collection/repository/media-collection.server.data-source.ts
@@ -13,9 +13,9 @@ export class UmbMediaCollectionServerDataSource implements UmbCollectionDataSour
 	}
 
 	async getCollection(query: UmbMediaCollectionFilterModel) {
-		// if (!query.dataTypeId) {
-		// 	throw new Error('Data type ID is required to fetch a collection.');
-		// }
+		if (!query.dataTypeId) {
+			throw new Error('Data type ID is required to fetch a collection.');
+		}
 
 		const params = {
 			id: query.unique ?? '',
diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/section-view/media-section-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/section-view/media-section-view.element.ts
index adc93c6514..94244fcac8 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/media/media/section-view/media-section-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/section-view/media-section-view.element.ts
@@ -1,48 +1,79 @@
 import { UMB_MEDIA_COLLECTION_ALIAS } from '../collection/index.js';
-import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit';
+import type { UmbCollectionBulkActionPermissions, UmbCollectionConfiguration } from '../../../core/collection/types.js';
+import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 import { UmbCollectionElement } from '@umbraco-cms/backoffice/collection';
+import { UmbDataTypeDetailRepository } from '@umbraco-cms/backoffice/data-type';
+import type { UmbDataTypeDetailModel } from '@umbraco-cms/backoffice/data-type';
 import type { UmbRoute } from '@umbraco-cms/backoffice/router';
+import { UmbPropertyEditorConfigCollection } from '@umbraco-cms/backoffice/property-editor';
 
 @customElement('umb-media-section-view')
 export class UmbMediaSectionViewElement extends UmbLitElement {
-	#routes: UmbRoute[] = [
-		{
-			path: 'collection',
-			component: () => {
+	// TODO: [LK] Check if we can get the default data-type ID (for the Media ListView) from the server.
+	//private readonly defaultDataTypeId: string = '3a0156c4-3b8c-4803-bdc1-6871faa83fff';
+	private readonly defaultDataTypeUnique: string = 'dt-collectionView';
 
-				// TODO: [LK] Work-in-progress. Need to get the data-type configuration for the Media Collection.
-				const config = {
-					unique: '',
-					dataTypeId: '', //'3a0156c4-3b8c-4803-bdc1-6871faa83fff', //'dt-collectionView',
-					allowedEntityBulkActions: {
-						allowBulkCopy: true,
-						allowBulkDelete: true,
-						allowBulkMove: true,
-						allowBulkPublish: false,
-						allowBulkUnpublish: false,
+	#dataTypeUnique: string = this.defaultDataTypeUnique;
+
+	#dataTypeDetailRepository = new UmbDataTypeDetailRepository(this);
+
+	@state()
+	private _routes?: UmbRoute[];
+
+	constructor() {
+		super();
+
+		this.#defineRoutes();
+	}
+
+	async #defineRoutes() {
+		await this.#dataTypeDetailRepository.requestByUnique(this.#dataTypeUnique);
+
+		this.observe(
+			await this.#dataTypeDetailRepository.byUnique(this.#dataTypeUnique),
+			(dataType) => {
+				if (!dataType) return;
+
+				const dataTypeConfig = this.#mapDataTypeConfigToCollectionConfig(dataType);
+
+				this._routes = [
+					{
+						path: 'collection',
+						component: () => {
+							const element = new UmbCollectionElement();
+							element.alias = UMB_MEDIA_COLLECTION_ALIAS;
+							element.config = dataTypeConfig;
+							return element;
+						},
 					},
-					orderBy: 'updateDate',
-					orderDirection: 'asc',
-					pageSize: 50,
-					useInfiniteEditor: false,
-					userDefinedProperties: undefined,
-				};
-
-				const element = new UmbCollectionElement();
-				element.alias = UMB_MEDIA_COLLECTION_ALIAS;
-				element.config = config;
-				return element;
+					{
+						path: '',
+						redirectTo: 'collection',
+					},
+				];
 			},
-		},
-		{
-			path: '',
-			redirectTo: 'collection',
-		},
-	];
+			'_observeConfigDataType',
+		);
+	}
+
+	#mapDataTypeConfigToCollectionConfig(dataType: UmbDataTypeDetailModel): UmbCollectionConfiguration {
+		const config = new UmbPropertyEditorConfigCollection(dataType.values);
+		return {
+			unique: '',
+			dataTypeId: dataType.unique,
+			allowedEntityBulkActions: config?.getValueByAlias<UmbCollectionBulkActionPermissions>('bulkActionPermissions'),
+			orderBy: config?.getValueByAlias('orderBy') ?? 'updateDate',
+			orderDirection: config?.getValueByAlias('orderDirection') ?? 'asc',
+			pageSize: Number(config?.getValueByAlias('pageSize')) ?? 50,
+			useInfiniteEditor: config?.getValueByAlias('useInfiniteEditor') ?? false,
+			userDefinedProperties: config?.getValueByAlias('includeProperties'),
+		};
+	}
 
 	render() {
-		return html`<umb-router-slot id="router-slot" .routes=${this.#routes}></umb-router-slot>`;
+		if (!this._routes) return;
+		return html`<umb-router-slot id="router-slot" .routes=${this._routes}></umb-router-slot>`;
 	}
 
 	static styles = [