diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts b/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts
index 11247ffae2..088b17a742 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/collection/default/collection-default.context.ts
@@ -31,6 +31,9 @@ export class UmbDefaultCollectionContext<
 	#manifest?: ManifestCollection;
 	#repository?: UmbCollectionRepository;
 
+	#loading = new UmbObjectState<boolean>(false);
+	public readonly loading = this.#loading.asObservable();
+
 	#items = new UmbArrayState<CollectionItemType>([], (x) => x);
 	public readonly items = this.#items.asObservable();
 
@@ -176,6 +179,8 @@ export class UmbDefaultCollectionContext<
 
 		if (!this.#repository) throw new Error(`Missing repository for ${this.#manifest}`);
 
+		this.#loading.setValue(true);
+
 		const filter = this.#filter.getValue();
 		const { data } = await this.#repository.requestCollection(filter);
 
@@ -184,6 +189,8 @@ export class UmbDefaultCollectionContext<
 			this.#totalItems.setValue(data.total);
 			this.pagination.setTotalItems(data.total);
 		}
+
+		this.#loading.setValue(false);
 	}
 
 	/**
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts
index 8ec535ba7f..01b818fb1b 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/grid/document-grid-collection-view.element.ts
@@ -39,6 +39,8 @@ export class UmbDocumentGridCollectionViewElement extends UmbLitElement {
 	#observeCollectionContext() {
 		if (!this.#collectionContext) return;
 
+		this.observe(this.#collectionContext.loading, (loading) => (this._loading = loading), '_observeLoading');
+
 		this.observe(
 			this.#collectionContext.userDefinedProperties,
 			(userDefinedProperties) => {
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts
index 943588f16e..6764068675 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/collection/views/table/document-table-collection-view.element.ts
@@ -75,6 +75,8 @@ export class UmbDocumentTableCollectionViewElement extends UmbLitElement {
 	#observeCollectionContext() {
 		if (!this.#collectionContext) return;
 
+		this.observe(this.#collectionContext.loading, (loading) => (this._loading = loading), '_observeLoading');
+
 		this.observe(
 			this.#collectionContext.userDefinedProperties,
 			(userDefinedProperties) => {