From 84f47b10164faacdc3b532862ccc48b2079640c5 Mon Sep 17 00:00:00 2001
From: Alexandre Bodin <bodin.alex@gmail.com>
Date: Wed, 28 Aug 2024 16:59:48 +0200
Subject: [PATCH] fix: issue 21079 on v5

---
 packages/core/admin/shared/contracts/user.ts  |  2 +-
 .../src/pages/ListView/components/Filters.tsx | 21 ++++++++++++++-----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/packages/core/admin/shared/contracts/user.ts b/packages/core/admin/shared/contracts/user.ts
index 556adb75c2..b2f9d9a8e8 100644
--- a/packages/core/admin/shared/contracts/user.ts
+++ b/packages/core/admin/shared/contracts/user.ts
@@ -46,7 +46,7 @@ export declare namespace FindAll {
   // TODO make the types for this
   export interface Request {
     body: {};
-    query: Modules.EntityService.Params.Pick<'admin::user', 'filters'> & {
+    query: Modules.EntityService.Params.Pick<'admin::user', 'filters' | '_q'> & {
       [key: string]: any;
     };
   }
diff --git a/packages/core/content-manager/admin/src/pages/ListView/components/Filters.tsx b/packages/core/content-manager/admin/src/pages/ListView/components/Filters.tsx
index 23eafb0bb2..4a8a69c24a 100644
--- a/packages/core/content-manager/admin/src/pages/ListView/components/Filters.tsx
+++ b/packages/core/content-manager/admin/src/pages/ListView/components/Filters.tsx
@@ -13,6 +13,7 @@ import { useIntl } from 'react-intl';
 
 import { CREATOR_FIELDS } from '../../../constants/attributes';
 import { useContentTypeSchema } from '../../../hooks/useContentTypeSchema';
+import { useDebounce } from '../../../hooks/useDebounce';
 import { Schema } from '../../../hooks/useDocument';
 import { useGetContentTypeConfigurationQuery } from '../../../services/contentTypes';
 import { getMainField } from '../../../utils/attributes';
@@ -224,20 +225,26 @@ const FiltersImpl = ({ disabled, schema }: FiltersProps) => {
  * -----------------------------------------------------------------------------------------------*/
 
 const AdminUsersFilter = ({ name }: Filters.ValueInputProps) => {
-  const [page, setPage] = React.useState(1);
+  const [pageSize, setPageSize] = React.useState(10);
+  const [search, setSearch] = React.useState('');
   const { formatMessage } = useIntl();
+
+  const debouncedSearch = useDebounce(search, 300);
+
   const { data, isLoading } = useAdminUsers({
-    page,
+    pageSize,
+    _q: debouncedSearch,
   });
   const field = useField(name);
 
   const handleOpenChange = (isOpen?: boolean) => {
     if (!isOpen) {
-      setPage(1);
+      setPageSize(10);
     }
   };
 
-  const users = data?.users || [];
+  const { users = [], pagination } = data ?? {};
+  const { pageCount = 1, page = 1 } = pagination ?? {};
 
   return (
     <Combobox
@@ -249,7 +256,11 @@ const AdminUsersFilter = ({ name }: Filters.ValueInputProps) => {
       onOpenChange={handleOpenChange}
       onChange={(value) => field.onChange(name, value)}
       loading={isLoading}
-      onLoadMore={() => setPage((prev) => prev + 1)}
+      onLoadMore={() => setPageSize(pageSize + 10)}
+      hasMoreItems={page < pageCount}
+      onInputChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+        setSearch(e.currentTarget.value);
+      }}
     >
       {users.map((user) => {
         return (