fix(content-drive): fix totalItems calculation and type paginate event (#34890)

## Summary

- **Fix off-by-one in `$totalItems`**: `pagination.page` is already
1-indexed — removed the erroneous `+ 1` (and the trailing `- 1`) that
inflated the total by a full page on every page
- **Correct `hasMoreContent = true` formula**: changed from
`items.length * currentPage` to `limit * (currentPage + 1)` so PrimeNG's
next-page button is reliably enabled regardless of partial page sizes
- **Extract `DotContentDrivePaginateEvent` type**: moved `LazyLoadEvent
& { page: number }` into `@dotcms/dotcms-models` and used it across the
`paginate` output in `DotFolderListViewComponent` and the `onPaginate`
handler in the shell component
- **Add ES2022 lib to portlet tsconfig**: scoped to `dot-content-drive`
portlet only to enable `Array.prototype.at()` without a workspace-wide
change

## Test plan

- [ ] Navigate to Content Drive, verify pagination numbers are correct
on each page
- [ ] Verify "next page" button is enabled when `hasMoreContent = true`
- [ ] Verify "next page" button is disabled on the last page
(`hasMoreContent = false`)
- [ ] Verify page resets to 1 when changing path, filters, or
rows-per-page
- [ ] Verify no TypeScript errors on `paginate` output / `onPaginate`
handler

🤖 Generated with [Claude Code](https://claude.com/claude-code)

This PR fixes: #34354

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: zJaaal

core-web/libs/dotcms-models/src/lib/dot-content-drive.model.ts

@@ -1,3 +1,5 @@
+import { LazyLoadEvent } from 'primeng/api';
+
 import { DotCMSContentlet } from './dot-contentlet.model';
 
 export interface DotContentDriveFolder {
@@ -28,6 +30,12 @@ export interface DotContentDriveFolder {
 // but for now we will just use the DotCMSContentlet until we have folders on the request response
 export type DotContentDriveItem = DotCMSContentlet | DotContentDriveFolder;
 
+/**
+ * Pagination event emitted by the folder list view,
+ * extending PrimeNG's LazyLoadEvent with a resolved 1-indexed page number.
+ */
+export type DotContentDrivePaginateEvent = LazyLoadEvent & { page: number };
+
 /**
  * Interface representing data needed for context menu interactions
  * @interface ContextMenuData
@@ -125,10 +133,16 @@ export interface DotContentDriveSearchRequest {
     filters?: DotContentDriveQueryFilters;
 
     /**
-     * Number of results to skip for pagination.
+     * Number of content items to skip for pagination.
+     * @default 0
+     */
+    contentCursor?: number;
+
+    /**
+     * Number of folder items to skip for pagination.
      * @default 0
      */
-    offset?: number;
+    folderCursor?: number;
 
     /**
      * Maximum number of results to return.
@@ -174,8 +188,11 @@ export interface DotContentDriveSearchRequest {
  * @property {DotContentDriveItem[]} list - The list of content items
  */
 export interface DotContentDriveSearchResponse {
-    contentTotalCount: number;
     folderCount: number;
     contentCount: number;
     list: DotContentDriveItem[];
+    hasMoreContent: boolean;
+    hasMoreFolders: boolean;
+    nextContentCursor: number;
+    nextFolderCursor: number;
 }

core-web/libs/portlets/dot-content-drive/portlet/src/lib/dot-content-drive-shell/dot-content-drive-shell.component.html

@@ -48,8 +48,8 @@
     class="overflow-auto col-start-2 row-start-3">
     <dot-folder-list-view
         [items]="$items()"
-        [totalItems]="$totalItems()"
         [loading]="$loading()"
+        [totalItems]="$totalItems()"
         [offset]="$offset()"
         (paginate)="onPaginate($event)"
         (sort)="onSort($event)"

core-web/libs/portlets/dot-content-drive/portlet/src/lib/dot-content-drive-shell/dot-content-drive-shell.component.spec.ts

@@ -46,6 +46,7 @@ import { CoreWebServiceMock } from '@dotcms/utils-testing';
 import { DotContentDriveShellComponent } from './dot-content-drive-shell.component';
 
 import {
+    DEFAULT_PAGE,
     DEFAULT_PAGINATION,
     DIALOG_TYPE,
     HIDE_MESSAGE_BANNER_LOCALSTORAGE_KEY,
@@ -147,7 +148,7 @@ describe('DotContentDriveShellComponent', () => {
                     sort: jest
                         .fn()
                         .mockReturnValue({ field: 'modDate', order: DotContentDriveSortOrder.ASC }),
-                    totalItems: jest.fn().mockReturnValue(MOCK_ITEMS.length),
+                    pages: jest.fn().mockReturnValue([DEFAULT_PAGE]),
                     setItems: jest.fn(),
                     setStatus: jest.fn(),
                     setPagination: jest.fn(),
@@ -368,15 +369,52 @@ describe('DotContentDriveShellComponent', () => {
         });
     });
 
+    describe('$totalItems', () => {
+        it('should return limit * (currentPage + 1) when hasMoreContent is true', () => {
+            // DEFAULT_PAGINATION: { page: 1, limit: 20 }, DEFAULT_PAGE: { hasMoreContent: true }
+            store.pagination.mockReturnValue({ page: 1, limit: 20, offset: 0 });
+            store.pages.mockReturnValue([DEFAULT_PAGE]);
+            store.items.mockReturnValue(MOCK_ITEMS);
+            spectator.detectChanges();
+
+            // hasMoreContent = true, page=1, limit=20 → 20 * (1+1) = 40
+            expect(spectator.component.$totalItems()).toBe(40);
+        });
+
+        it('should return exact total when hasMoreContent is false', () => {
+            store.pagination.mockReturnValue({ page: 1, limit: 20, offset: 0 });
+            store.pages.mockReturnValue([{ ...DEFAULT_PAGE, hasMoreContent: false }]);
+            store.items.mockReturnValue(MOCK_ITEMS);
+            spectator.detectChanges();
+
+            // hasMoreContent = false, page=1, limit=20, items=MOCK_ITEMS.length → 20*(1-1) + MOCK_ITEMS.length
+            expect(spectator.component.$totalItems()).toBe(MOCK_ITEMS.length);
+        });
+
+        it('should account for previous pages when hasMoreContent is false on page 2', () => {
+            store.pagination.mockReturnValue({ page: 2, limit: 20, offset: 20 });
+            store.pages.mockReturnValue([{ ...DEFAULT_PAGE, hasMoreContent: false }]);
+            store.items.mockReturnValue(MOCK_ITEMS);
+            spectator.detectChanges();
+
+            // hasMoreContent = false, page=2, limit=20, items=MOCK_ITEMS.length → 20*(2-1) + MOCK_ITEMS.length
+            expect(spectator.component.$totalItems()).toBe(20 + MOCK_ITEMS.length);
+        });
+    });
+
     describe('onPaginate', () => {
         it('should set pagination with provided values', () => {
             const folderListView = spectator.debugElement.query(
                 By.directive(DotFolderListViewComponent)
             );
 
-            spectator.triggerEventHandler(folderListView, 'paginate', { rows: 10, first: 0 });
+            spectator.triggerEventHandler(folderListView, 'paginate', {
+                rows: 10,
+                first: 0,
+                page: 1
+            });
 
-            expect(store.setPagination).toHaveBeenCalledWith({ limit: 10, offset: 0 });
+            expect(store.setPagination).toHaveBeenCalledWith({ limit: 10, page: 1, offset: 0 });
         });
 
         it('should not set pagination if rows are not provided', () => {

core-web/libs/portlets/dot-content-drive/portlet/src/lib/dot-content-drive-shell/dot-content-drive-shell.component.ts

@@ -14,7 +14,7 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { LazyLoadEvent, MessageService, SortEvent } from 'primeng/api';
+import { MessageService, SortEvent } from 'primeng/api';
 import { ButtonModule } from 'primeng/button';
 import { DialogModule } from 'primeng/dialog';
 import { MessageModule } from 'primeng/message';
@@ -30,7 +30,11 @@ import {
     DotMessageService,
     DotWorkflowActionsFireService
 } from '@dotcms/data-access';
-import { ContextMenuData, DotContentDriveItem } from '@dotcms/dotcms-models';
+import {
+    ContextMenuData,
+    DotContentDriveItem,
+    DotContentDrivePaginateEvent
+} from '@dotcms/dotcms-models';
 import {
     DotFolderListViewComponent,
     DotContentDriveUploadFiles,
@@ -97,7 +101,6 @@ export class DotContentDriveShellComponent {
     readonly #localStorageService = inject(DotLocalstorageService);
 
     readonly $items = this.#store.items;
-    readonly $totalItems = this.#store.totalItems;
     readonly $status = this.#store.status;
     readonly $treeExpanded = this.#store.isTreeExpanded;
 
@@ -116,6 +119,22 @@ export class DotContentDriveShellComponent {
 
     readonly $fileInput = viewChild<ElementRef>('fileInput');
 
+    readonly $totalItems = computed(() => {
+        const pagination = untracked(() => this.#store.pagination());
+        const currentPage = pagination.page; // 1-indexed
+        const limit = pagination.limit;
+        const page = this.#store.pages().at(-1);
+
+        const items = untracked(() => this.#store.items());
+
+        // The API uses cursor-based pagination and does not return a total count.
+        // When hasMoreContent is true, we return one page beyond current so PrimeNG enables the next-page button.
+        // When hasMoreContent is false, we can calculate the exact total.
+        return page.hasMoreContent
+            ? limit * (currentPage + 1)
+            : limit * (currentPage - 1) + items.length;
+    });
+
     readonly updateQueryParamsEffect = effect(() => {
         const isTreeExpanded = this.#store.isTreeExpanded();
         const path = this.#store.path();
@@ -167,15 +186,16 @@ export class DotContentDriveShellComponent {
         );
     }
 
-    protected onPaginate(event: LazyLoadEvent) {
+    protected onPaginate(event: DotContentDrivePaginateEvent) {
         // Explicit check because it can potentially be 0
         if (event.rows === undefined || event.first === undefined) {
             return;
         }
 
         this.#store.setPagination({
             limit: event.rows,
-            offset: event.first
+            page: event.page ?? 1,
+            offset: event.first ?? 0
         });
     }
 

core-web/libs/portlets/dot-content-drive/portlet/src/lib/shared/constants.ts

@@ -1,6 +1,6 @@
 import { DotCMSBaseTypesContentTypes, DotSite } from '@dotcms/dotcms-models';
 
-import { DotContentDrivePagination, DotContentDriveSortOrder } from './models';
+import { DotContentDrivePage, DotContentDrivePagination, DotContentDriveSortOrder } from './models';
 
 export const HIDE_MESSAGE_BANNER_LOCALSTORAGE_KEY = 'content-drive-hide-message-banner';
 
@@ -18,6 +18,7 @@ export const BASE_QUERY = '+systemType:false -contentType:forms -contentType:Hos
 // Default pagination
 export const DEFAULT_PAGINATION: DotContentDrivePagination = {
     limit: 20,
+    page: 1,
     offset: 0
 };
 
@@ -38,6 +39,14 @@ export const DEFAULT_TREE_EXPANDED = true;
 // Default path, it needs to be undefined to show the root folder
 export const DEFAULT_PATH = undefined;
 
+export const DEFAULT_PAGE: DotContentDrivePage = {
+    hasMoreContent: true,
+    hasMoreFolders: true,
+    folderCursor: 0,
+    contentCursor: 0,
+    offset: 0
+};
+
 // Map numbers to base types, ticket: https://github.com/dotCMS/core/issues/32991
 export const MAP_NUMBERS_TO_BASE_TYPES = {
     1: DotCMSBaseTypesContentTypes.CONTENT,

core-web/libs/portlets/dot-content-drive/portlet/src/lib/shared/models.ts

@@ -39,6 +39,7 @@ export enum DotContentDriveSortOrder {
  */
 export interface DotContentDrivePagination {
     limit: number;
+    page: number;
     offset: number;
 }
 
@@ -84,6 +85,14 @@ export interface DotContentDriveDialog {
     payload?: DotContentDriveFolder;
 }
 
+export interface DotContentDrivePage {
+    hasMoreContent: boolean;
+    hasMoreFolders: boolean;
+    folderCursor: number;
+    contentCursor: number;
+    offset: number;
+}
+
 /**
  * The state of the content drive.
  *
@@ -94,10 +103,10 @@ export interface DotContentDriveState extends DotContentDriveInit {
     items: DotContentDriveItem[];
     selectedItems: DotContentDriveItem[];
     status: DotContentDriveStatus;
-    totalItems: number;
     pagination: DotContentDrivePagination;
     sort: DotContentDriveSort;
     contextMenu?: DotContentDriveContextMenu;
+    pages: DotContentDrivePage[];
 }
 
 /**