diff --git a/changes/issue-7144-pagination-defaults-to-20 b/changes/issue-7144-pagination-defaults-to-20
new file mode 100644
index 0000000000..5b7ac058dc
--- /dev/null
+++ b/changes/issue-7144-pagination-defaults-to-20
@@ -0,0 +1 @@
+* Fix pages so pagination dfaults to 20 items per page
\ No newline at end of file
diff --git a/frontend/components/TableContainer/DataTable/DataTable.tests.tsx b/frontend/components/TableContainer/DataTable/DataTable.tests.tsx
index 97b2c38255..0f7f991e5a 100644
--- a/frontend/components/TableContainer/DataTable/DataTable.tests.tsx
+++ b/frontend/components/TableContainer/DataTable/DataTable.tests.tsx
@@ -3,7 +3,7 @@ import { render, screen } from "@testing-library/react";
import { noop } from "lodash";
import DataTable from "./DataTable";
-const DEFAULT_PAGE_SIZE = 100;
+const DEFAULT_PAGE_SIZE = 20;
describe("DataTable - component", () => {
it("renders a data table based on the columns and data passed in", () => {
diff --git a/frontend/components/TableContainer/TableContainer.tsx b/frontend/components/TableContainer/TableContainer.tsx
index 368131db25..e4104a30f6 100644
--- a/frontend/components/TableContainer/TableContainer.tsx
+++ b/frontend/components/TableContainer/TableContainer.tsx
@@ -80,7 +80,7 @@ interface ITableContainerProps {
const baseClass = "table-container";
-const DEFAULT_PAGE_SIZE = 100;
+const DEFAULT_PAGE_SIZE = 20;
const DEFAULT_PAGE_INDEX = 0;
const TableContainer = ({
diff --git a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
index deb6c8a17a..ec129d919c 100644
--- a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
@@ -479,7 +479,6 @@ const ManagePolicyPage = ({
isLoading={isFetchingGlobalPolicies}
policiesList={globalPolicies || []}
onDeletePoliciesClick={noop}
- resultsTitle="policies"
canAddOrDeletePolicy={canAddOrDeletePolicy}
tableType="inheritedPolicies"
currentTeam={currentTeam}
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
index cdb171fcb0..672cb78574 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
@@ -26,7 +26,6 @@ interface IPoliciesTableProps {
isLoading: boolean;
onAddPolicyClick?: () => void;
onDeletePoliciesClick: (selectedTableIds: number[]) => void;
- resultsTitle?: string;
canAddOrDeletePolicy?: boolean;
tableType?: string;
currentTeam: ITeamSummary | undefined;
@@ -38,7 +37,6 @@ const PoliciesTable = ({
isLoading,
onAddPolicyClick,
onDeletePoliciesClick,
- resultsTitle,
canAddOrDeletePolicy,
tableType,
currentTeam,
@@ -116,7 +114,7 @@ const PoliciesTable = ({
) : (
)}
diff --git a/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx b/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
index 374018ffea..aaf2189a84 100644
--- a/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
@@ -219,7 +219,6 @@ const ManageQueriesPage = ({
isLoading={isTableDataLoading}
onCreateQueryClick={onCreateQueryClick}
onDeleteQueryClick={onDeleteQueryClick}
- searchable={!!queriesList}
customControl={renderPlatformDropdown}
selectedDropdownFilter={selectedDropdownFilter}
isOnlyObserver={isOnlyObserver}
diff --git a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
index b4fb79aa39..363d9451b0 100644
--- a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
@@ -22,7 +22,6 @@ interface IQueriesTableProps {
isLoading: boolean;
onDeleteQueryClick: (selectedTableQueryIds: number[]) => void;
onCreateQueryClick: () => void;
- searchable: boolean;
customControl?: () => JSX.Element;
selectedDropdownFilter: string;
isOnlyObserver?: boolean;
@@ -33,7 +32,6 @@ const QueriesTable = ({
isLoading,
onDeleteQueryClick,
onCreateQueryClick,
- searchable,
customControl,
selectedDropdownFilter,
isOnlyObserver,
@@ -122,8 +120,7 @@ const QueriesTable = ({
isAllPagesSelected={false}
onQueryChange={handleSearchChange}
inputPlaceHolder="Search by name"
- searchable={searchable}
- disablePagination
+ searchable={!!queriesList}
onPrimarySelectActionClick={onDeleteQueryClick}
primarySelectActionButtonVariant="text-icon"
primarySelectActionButtonIcon="delete"
diff --git a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
index 02e91fafdb..950fd58537 100644
--- a/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
+++ b/frontend/pages/schedule/ManageSchedulePage/ManageSchedulePage.tsx
@@ -48,7 +48,7 @@ const renderTable = (
toggleScheduleEditorModal: () => void,
isOnGlobalTeam: boolean,
selectedTeamData: ITeam | undefined,
- isFetchingGlobalScheduledQueries: boolean,
+ isLoadingGlobalScheduledQueries: boolean,
isLoadingTeamScheduledQueries: boolean,
errorQueries: Error | null
): JSX.Element => {
@@ -63,7 +63,7 @@ const renderTable = (
toggleScheduleEditorModal={toggleScheduleEditorModal}
isOnGlobalTeam={isOnGlobalTeam}
selectedTeamData={selectedTeamData}
- loadingInheritedQueriesTableData={isFetchingGlobalScheduledQueries}
+ loadingInheritedQueriesTableData={isLoadingGlobalScheduledQueries}
loadingTeamQueriesTableData={isLoadingTeamScheduledQueries}
/>
);
@@ -75,7 +75,7 @@ const renderAllTeamsTable = (
allTeamsScheduledQueriesError: Error | null,
isOnGlobalTeam: boolean,
selectedTeamData: ITeam | undefined,
- isFetchingGlobalScheduledQueries: boolean,
+ isLoadingGlobalScheduledQueries: boolean,
isLoadingTeamScheduledQueries: boolean
): JSX.Element => {
return allTeamsScheduledQueriesError ? (
@@ -88,7 +88,7 @@ const renderAllTeamsTable = (
allScheduledQueriesList={allTeamsScheduledQueriesList}
isOnGlobalTeam={isOnGlobalTeam}
selectedTeamData={selectedTeamData}
- loadingInheritedQueriesTableData={isFetchingGlobalScheduledQueries}
+ loadingInheritedQueriesTableData={isLoadingGlobalScheduledQueries}
loadingTeamQueriesTableData={isLoadingTeamScheduledQueries}
/>
@@ -180,7 +180,7 @@ const ManageSchedulePage = ({
const {
data: globalScheduledQueries,
error: globalScheduledQueriesError,
- isFetching: isFetchingGlobalScheduledQueries,
+ isLoading: isLoadingGlobalScheduledQueries,
refetch: refetchGlobalScheduledQueries,
} = useQuery<
ILoadAllGlobalScheduledQueriesResponse,
@@ -499,7 +499,7 @@ const ManageSchedulePage = ({
{isLoadingTeams ||
isLoadingFleetQueries ||
- isFetchingGlobalScheduledQueries ||
+ isLoadingGlobalScheduledQueries ||
isLoadingTeamScheduledQueries ? (
) : (
@@ -512,7 +512,7 @@ const ManageSchedulePage = ({
toggleScheduleEditorModal,
isOnGlobalTeam || false,
selectedTeamData,
- isFetchingGlobalScheduledQueries,
+ isLoadingGlobalScheduledQueries,
isLoadingTeamScheduledQueries,
errorQueries
)
@@ -542,7 +542,7 @@ const ManageSchedulePage = ({
inheritedScheduledQueriesError,
isOnGlobalTeam || false,
selectedTeamData,
- isFetchingGlobalScheduledQueries,
+ isLoadingGlobalScheduledQueries,
isLoadingTeamScheduledQueries
)}
{showScheduleEditorModal && fleetQueries && (
diff --git a/frontend/pages/schedule/ManageSchedulePage/components/ScheduleTable/ScheduleTable.tsx b/frontend/pages/schedule/ManageSchedulePage/components/ScheduleTable/ScheduleTable.tsx
index 2c18b5a3ba..a0df56893b 100644
--- a/frontend/pages/schedule/ManageSchedulePage/components/ScheduleTable/ScheduleTable.tsx
+++ b/frontend/pages/schedule/ManageSchedulePage/components/ScheduleTable/ScheduleTable.tsx
@@ -183,12 +183,12 @@ const ScheduleTable = ({
isAllPagesSelected={false}
inputPlaceHolder="Search"
searchable={false}
- disablePagination
onPrimarySelectActionClick={onRemoveScheduledQueryClick}
primarySelectActionButtonVariant="text-icon"
primarySelectActionButtonIcon="remove"
primarySelectActionButtonText={"Remove"}
emptyComponent={NoScheduledQueries}
+ isClientSidePagination
/>
);