diff --git a/changes/issue-7582-user-pagination-bug b/changes/issue-7582-user-pagination-bug
new file mode 100644
index 0000000000..70696733eb
--- /dev/null
+++ b/changes/issue-7582-user-pagination-bug
@@ -0,0 +1 @@
+* Fleet UI to use Client side pagination which fixes bug hiding users over 20 users
\ No newline at end of file
diff --git a/frontend/services/entities/invites.ts b/frontend/services/entities/invites.ts
index 9845b791ca..2f0c013fc2 100644
--- a/frontend/services/entities/invites.ts
+++ b/frontend/services/entities/invites.ts
@@ -2,6 +2,8 @@
 import sendRequest from "services";
 import endpoints from "utilities/endpoints";
 import helpers from "utilities/helpers";
+import { buildQueryStringFromParams } from "utilities/url";
+
 import {
   IInvite,
   ICreateInviteFormData,
@@ -40,34 +42,14 @@ export default {
 
     return sendRequest("DELETE", path);
   },
-  loadAll: ({
-    page = 0,
-    perPage = 20,
-    globalFilter = "",
-    sortBy = [],
-  }: IInviteSearchOptions) => {
-    const { INVITES } = endpoints;
+  loadAll: ({ globalFilter = "" }: IInviteSearchOptions) => {
+    const queryParams = {
+      query: globalFilter,
+    };
 
-    // NOTE: this code is duplicated from /entities/users.js
-    // we should pull this out into shared utility at some point.
-    const pagination = `page=${page}&per_page=${perPage}`;
-
-    let orderKeyParam = "";
-    let orderDirection = "";
-    if (sortBy.length !== 0) {
-      const sortItem = sortBy[0];
-      orderKeyParam += `&order_key=${sortItem.id}`;
-      orderDirection = sortItem.desc
-        ? "&order_direction=desc"
-        : "&order_direction=asc";
-    }
-
-    let searchQuery = "";
-    if (globalFilter !== "") {
-      searchQuery = `&query=${globalFilter}`;
-    }
-
-    const path = `${INVITES}?${pagination}${searchQuery}${orderKeyParam}${orderDirection}`;
+    const queryString = buildQueryStringFromParams(queryParams);
+    const endpoint = endpoints.INVITES;
+    const path = `${endpoint}?${queryString}`;
 
     return sendRequest("GET", path).then((response) => {
       const { invites } = response;
diff --git a/frontend/services/entities/users.ts b/frontend/services/entities/users.ts
index dea90bdc1c..e276ea5448 100644
--- a/frontend/services/entities/users.ts
+++ b/frontend/services/entities/users.ts
@@ -2,6 +2,8 @@
 import sendRequest from "services";
 import endpoints from "utilities/endpoints";
 import helpers from "utilities/helpers";
+import { buildQueryStringFromParams } from "utilities/url";
+
 import {
   ICreateUserFormData,
   IUpdateUserFormData,
@@ -92,39 +94,15 @@ export default {
 
     return sendRequest("POST", FORGOT_PASSWORD, { email });
   },
-  loadAll: ({
-    page = 0,
-    perPage = 20,
-    globalFilter = "",
-    sortBy = [],
-    teamId,
-  }: IUserSearchOptions = {}) => {
-    const { USERS } = endpoints;
+  loadAll: ({ globalFilter = "", teamId }: IUserSearchOptions = {}) => {
+    const queryParams = {
+      query: globalFilter,
+      team_id: teamId,
+    };
 
-    // TODO: add this query param logic to client class
-    const pagination = `page=${page}&per_page=${perPage}`;
-
-    let orderKeyParam = "";
-    let orderDirection = "";
-    if (sortBy.length !== 0) {
-      const sortItem = sortBy[0];
-      orderKeyParam += `&order_key=${sortItem.id}`;
-      orderDirection = sortItem.desc
-        ? "&order_direction=desc"
-        : "&order_direction=asc";
-    }
-
-    let searchQuery = "";
-    if (globalFilter !== "") {
-      searchQuery = `&query=${globalFilter}`;
-    }
-
-    let teamQuery = "";
-    if (teamId !== undefined) {
-      teamQuery = `&team_id=${teamId}`;
-    }
-
-    const path = `${USERS}?${pagination}${searchQuery}${orderKeyParam}${orderDirection}${teamQuery}`;
+    const queryString = buildQueryStringFromParams(queryParams);
+    const endpoint = endpoints.USERS;
+    const path = `${endpoint}?${queryString}`;
 
     return sendRequest("GET", path).then((response) => {
       const { users } = response;