diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/utils/pagination-manager/pagination.manager.ts b/src/Umbraco.Web.UI.Client/src/packages/core/utils/pagination-manager/pagination.manager.ts
index 9c1db36e9c..508d233482 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/utils/pagination-manager/pagination.manager.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/utils/pagination-manager/pagination.manager.ts
@@ -138,4 +138,22 @@ export class UmbPaginationManager extends EventTarget {
const skip = Math.max(0, (this.#currentPage.getValue() - 1) * this.#pageSize.getValue());
this.#skip.setValue(skip);
}
+
+ /**
+ * Gets the index of the first item on the current page (for display).
+ * @returns {number}
+ * @memberof UmbPaginationManager
+ */
+ public getDisplayStart(): number {
+ return this.getSkip() + 1;
+ }
+
+ /**
+ * Gets the index of the last item on the current page (for display).
+ * @returns {number}
+ * @memberof UmbPaginationManager
+ */
+ public getDisplayEnd(): number {
+ return Math.min(this.getSkip() + this.getPageSize(), this.getTotalItems());
+ }
}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
index 3e31005701..684bc19d31 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/views/section-view-examine-searchers.ts
@@ -8,6 +8,8 @@ import { UmbModalRouteRegistrationController } from '@umbraco-cms/backoffice/rou
import { SearcherService } from '@umbraco-cms/backoffice/external/backend-api';
import { UmbLitElement, umbFocus } from '@umbraco-cms/backoffice/lit-element';
import { tryExecute } from '@umbraco-cms/backoffice/resources';
+import { UmbPaginationManager } from '@umbraco-cms/backoffice/utils';
+import type { UUIPaginationEvent } from '@umbraco-cms/backoffice/external/uui';
interface ExposedSearchResultField {
name: string;
@@ -34,6 +36,17 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
@state()
private _workspacePath = 'aa';
+ @state()
+ _totalPages = 1;
+
+ @state()
+ _currentPage = 1;
+
+ @state()
+ _totalNumberOfResults = 0;
+
+ #paginationManager = new UmbPaginationManager();
+
private _onKeyPress(e: KeyboardEvent) {
if (e.key == 'Enter') {
this._onSearch();
@@ -44,6 +57,12 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
constructor() {
super();
+
+ this.#paginationManager.setPageSize(100);
+
+ this.observe(this.#paginationManager.currentPage, (number) => (this._currentPage = number));
+ this.observe(this.#paginationManager.totalPages, (number) => (this._totalPages = number));
+
new UmbModalRouteRegistrationController(this, UMB_WORKSPACE_MODAL)
.addAdditionalPath(':entityType')
.onSetup((routingInfo) => {
@@ -64,13 +83,15 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
path: { searcherName: this.searcherName },
query: {
term: this._searchInput.value,
- take: 100,
- skip: 0,
+ take: this.#paginationManager.getPageSize(),
+ skip: this.#paginationManager.getSkip(),
},
}),
);
this._searchResults = data?.items ?? [];
+ this.#paginationManager.setTotalItems(data.total);
+ this._totalNumberOfResults = data.total;
this._updateFieldFilter();
this._searchLoading = false;
}
@@ -158,13 +179,29 @@ export class UmbDashboardExamineSearcherElement extends UmbLitElement {
}
}
+ #onPageChange(event: UUIPaginationEvent) {
+ this.#paginationManager.setCurrentPageNumber(event.target?.current);
+ this._onSearch();
+ }
+
private renderSearchResults() {
if (this._searchLoading) return html`
${this.localize.term('examineManagement_noResults')}
`; } - return html`