lwc - Paginated Data Table

📋 Paginated Data Table – Reusable Salesforce LWC

A reusable Lightning Web Component built on lightning-datatable that adds server-side sorting, pagination controls, row selection, loading states, and complete backend independence.

📖 Project Overview

Paginated Data Table is a fully controlled Salesforce Lightning Web Component that extends the standard lightning-datatable with enterprise-ready pagination and sorting capabilities.

Unlike traditional datatable implementations, this component never performs data retrieval itself. Instead, it simply renders the current page of data and communicates user actions back to the parent component using custom events. This makes it reusable with Apex, REST APIs, GraphQL services, wired adapters, or even static datasets.

The repository also includes a complete demo implementation powered by Apex using secure SOQL queries with WITH SECURITY_ENFORCED.

🔗 View Source Code ⬇ Download ZIP

✨ Features

Feature	Description
Server-side Sorting	Fires sort events instead of sorting locally, allowing Apex or external services to perform sorting.
Pagination Controls	First, Previous, Next, Last navigation with configurable page size.
Row Selection	Supports standard lightning-datatable row selection events.
Row Actions	Fully compatible with Edit, Delete and custom row action menus.
Loading State	Built-in spinner overlay while data is loading.
Error Handling	Displays configurable error banners for backend failures.
Empty State	Shows custom messages when no records are available.
Imperative API	Provides getSelectedRows() for parent components.
Backend Agnostic	Works with Apex, REST APIs, GraphQL or static arrays.

🏗 Component Architecture

📁 Project Structure

force-app
│
├── classes
│   ├── PaginatedTableController.cls
│   └── PaginatedTableControllerTest.cls
│
├── lwc
│   ├── paginatedDataTable
│   └── paginatedDataTableDemo
│
└── README.md

⚙️ Public API

Property	Purpose
columns	Column configuration for the datatable.
data	Current page records.
totalRecords	Total number of available records.
pageSize	Records displayed per page.
currentPage	Current active page.
sortedBy	Current sorted field.
sortedDirection	Ascending or Descending order.
isLoading	Displays loading spinner.

🔄 User Workflow

Load Page
    │
    ▼
Parent Fetches Records
    │
    ▼
Render Current Page
    │
    ▼
User Sorts Column
    │
    ▼
Sort Event Fired
    │
    ▼
Parent Retrieves Data
    │
    ▼
Refresh Table

📡 Supported Events

• sort — User changes column sorting.
• pagechange — User navigates between pages.
• rowselection — Selected rows change.
• rowaction — Standard row actions.

🎯 Business Use Cases

• Large Contact Lists
• Opportunity Management
• Account Dashboards
• Service Case Management
• Lead Administration
• Experience Cloud Data Tables
• External REST Data
• Enterprise Reporting Dashboards

🔒 Security

• Supports Salesforce CRUD/FLS.
• Uses WITH SECURITY_ENFORCED in Apex demo.
• Backend-independent architecture.
• Compatible with enterprise security best practices.

🚀 Deployment

sf org login web --alias my-org

sf project deploy start \
--source-dir force-app \
--target-org my-org

sf apex run test \
--class-names PaginatedTableControllerTest

🔗 View Source Code ⬇ Download ZIP

📌 Conclusion

Paginated Data Table is a lightweight, reusable, and enterprise-ready Lightning Web Component that extends the standard Salesforce datatable with server-side pagination, sorting, row selection, and configurable states. By separating presentation from data retrieval, it can be seamlessly integrated with Apex controllers, REST services, GraphQL APIs, or any custom backend while remaining highly reusable across Salesforce applications.