Sync RecentRequestsTable with URL and debounce

Refactor RecentRequestsTable to manage filters client-side and sync them to the browser URL. Removed next/navigation hooks (useRouter, usePathname, useSearchParams) and added getInitialParams + local useState for page, pageSize, status, userId, sortBy, sortOrder and a debouncedSearch. Added keepPreviousData to SWR to avoid layout shifts, implemented history.replaceState to shallow-sync URL when filters change, and a popstate handler to support back/forward navigation. Consolidated filter updates via updateFilter, added page reset behavior on filter/search changes, and improved search debouncing logic. Also removed Suspense usage and import around RecentRequestsTable in admin/page.tsx.
This commit is contained in:
kikootwo
2026-02-02 12:13:51 -05:00
parent 770cd5165f
commit 0864fa7b43
2 changed files with 154 additions and 70 deletions
+4 -14
View File
@@ -13,7 +13,7 @@ import { ActiveDownloadsTable } from './components/ActiveDownloadsTable';
import { RecentRequestsTable } from './components/RecentRequestsTable';
import { ToastProvider, useToast } from '@/components/ui/Toast';
import { formatDistanceToNow } from 'date-fns';
import { useState, Suspense } from 'react';
import { useState } from 'react';
interface PendingApprovalRequest {
id: string;
@@ -488,19 +488,9 @@ function AdminDashboardContent() {
<h2 className="text-xl font-bold text-gray-900 dark:text-gray-100 mb-4">
Request Management
</h2>
<Suspense
fallback={
<div className="bg-white dark:bg-gray-800 rounded-lg border border-gray-200 dark:border-gray-700 p-8">
<div className="flex items-center justify-center">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
</div>
</div>
}
>
<RecentRequestsTable
ebookSidecarEnabled={settingsData?.ebook?.enabled || false}
/>
</Suspense>
<RecentRequestsTable
ebookSidecarEnabled={settingsData?.ebook?.enabled || false}
/>
</div>
{/* Quick Actions */}