fix(ui): various issues around documents lists, listQuery provider and search params (#8081)

This PR fixes and improves:
- ListQuery provider is now the source of truth for searchParams instead
of having components use the `useSearchParams` hook
- Various issues with search params and filters sticking around when
navigating between collections
- Pagination and limits not working inside DocumentDrawer
- Searching and filtering causing a flash of overlay in DocumentDrawer,
this now only shows for the first load and on slow networks
- Preferences are now respected in DocumentDrawer
- Changing the limit now resets your page back to 1 in case the current
page no longer exists

Fixes https://github.com/payloadcms/payload/issues/7085
Fixes https://github.com/payloadcms/payload/pull/8081
Fixes https://github.com/payloadcms/payload/issues/8086

test/fields/components/AfterNavLinks.tsx

@@ -0,0 +1,31 @@
+'use client'
+
+import type { PayloadClientReactComponent, SanitizedConfig } from 'payload'
+
+import { NavGroup, useConfig } from '@payloadcms/ui'
+import LinkImport from 'next/link.js'
+const Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default
+import React from 'react'
+
+const baseClass = 'after-nav-links'
+
+export const AfterNavLinks: PayloadClientReactComponent<
+  SanitizedConfig['admin']['components']['afterNavLinks'][0]
+> = () => {
+  const {
+    config: {
+      routes: { admin: adminRoute },
+    },
+  } = useConfig()
+
+  return (
+    <NavGroup key="extra-links" label="Extra Links">
+      {/* Open link to payload admin url */}
+      {/* <Link href={`${adminRoute}/collections/uploads`}>Internal Payload Admin Link</Link> */}
+      {/* Open link to payload admin url with prefiltered query */}
+      <Link href={`${adminRoute}/collections/uploads?page=1&search=jpg&limit=10`}>
+        Prefiltered Media
+      </Link>
+    </NavGroup>
+  )
+}

test/fields/config.ts

@@ -105,6 +105,9 @@ export default buildConfigWithDefaults({
     importMap: {
       baseDir: path.resolve(dirname),
     },
+    components: {
+      afterNavLinks: ['/components/AfterNavLinks.js#AfterNavLinks'],
+    },
     custom: {
       client: {
         'new-value': 'client available',