Fleet UI: Bug fix user page pagination (#7584)

This commit is contained in:
RachelElysia
2022-09-06 11:40:20 -04:00
committed by GitHub
parent e86aa9d99b
commit 4083aefd8e
3 changed files with 20 additions and 59 deletions
+1
View File
@@ -0,0 +1 @@
* Fleet UI to use Client side pagination which fixes bug hiding users over 20 users
+9 -27
View File
@@ -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;
+10 -32
View File
@@ -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;