diff --git a/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Audit/ConfigurationAuditLog.razor b/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Audit/ConfigurationAuditLog.razor
index 50de2e71..19690234 100644
--- a/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Audit/ConfigurationAuditLog.razor
+++ b/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Audit/ConfigurationAuditLog.razor
@@ -58,21 +58,10 @@
                    @bind="_filterAction"
                    placeholder="e.g. Create" />
         </div>
-        <div class="col-md-2">
-            <label class="form-label small" for="audit-filter-from">From</label>
-            <input id="audit-filter-from"
-                   type="datetime-local"
-                   class="form-control form-control-sm"
-                   aria-label="From timestamp"
-                   @bind="_filterFrom" />
-        </div>
-        <div class="col-md-2">
-            <label class="form-label small" for="audit-filter-to">To</label>
-            <input id="audit-filter-to"
-                   type="datetime-local"
-                   class="form-control form-control-sm"
-                   aria-label="To timestamp"
-                   @bind="_filterTo" />
+        <div class="col-md-4">
+            <DateTimeRangeFilter From="_filterFrom" FromChanged="(v => _filterFrom = v)"
+                                 To="_filterTo" ToChanged="(v => _filterTo = v)"
+                                 IdPrefix="audit-filter" />
         </div>
         <div class="col-md-2 d-flex gap-1">
             <button class="btn btn-primary btn-sm" @onclick="Search" disabled="@_searching">
@@ -174,13 +163,7 @@
             </tbody>
         </table>
 
-        <div class="d-flex justify-content-between align-items-center">
-            <span class="text-muted small">Page @_page of @TotalPages (@_totalCount total)</span>
-            <div>
-                <button class="btn btn-outline-secondary btn-sm me-1" @onclick="PrevPage" disabled="@(_page <= 1)">Previous</button>
-                <button class="btn btn-outline-secondary btn-sm" @onclick="NextPage" disabled="@(!HasMore)">Next</button>
-            </div>
-        </div>
+        <OffsetPager Page="_page" PageChanged="OnPageChanged" HasNextPage="HasMore" TotalCount="_totalCount" PageSize="_pageSize" />
     }
 
     @if (_modalEntry != null)
@@ -238,7 +221,6 @@
 
     private ToastNotification _toast = default!;
 
-    private int TotalPages => _pageSize > 0 ? Math.Max(1, (_totalCount + _pageSize - 1) / _pageSize) : 1;
     private bool HasMore => _page * _pageSize < _totalCount;
 
     // Tracks the BundleImportId we last fetched against so a re-render with the
@@ -310,8 +292,7 @@
         await FetchPage();
     }
 
-    private async Task PrevPage() { _page--; await FetchPage(); }
-    private async Task NextPage() { _page++; await FetchPage(); }
+    private async Task OnPageChanged(int page) { _page = page; await FetchPage(); }
 
     private async Task FetchPage()
     {