diff --git a/apps/admin-ui/cypress/e2e/client_scopes_test.spec.ts b/apps/admin-ui/cypress/e2e/client_scopes_test.spec.ts index 46ee9a09bc..1ca3b5243f 100644 --- a/apps/admin-ui/cypress/e2e/client_scopes_test.spec.ts +++ b/apps/admin-ui/cypress/e2e/client_scopes_test.spec.ts @@ -99,17 +99,17 @@ describe("Client Scopes test", () => { .itemExist(FilterAssignedType.None, false); }); - //TODO https://github.com/keycloak/keycloak-admin-ui/issues/1959 it("should filter items by Protocol All", () => { listingPage .selectFilter(Filter.Protocol) - .selectSecondaryFilterProtocol(FilterProtocol.All) + .selectSecondaryFilterProtocol(FilterProtocol.All); + sidebarPage.waitForPageLoad(); + listingPage .showNextPageTableItems() .itemExist(FilterProtocol.SAML, true) .itemExist(openIDConnectItemText, true); //using FilterProtocol.OpenID will fail, text does not match. }); - //TODO https://github.com/keycloak/keycloak-admin-ui/issues/1959 it("should filter items by Protocol SAML", () => { listingPage .selectFilter(Filter.Protocol) @@ -118,7 +118,6 @@ describe("Client Scopes test", () => { .itemExist(openIDConnectItemText, false); //using FilterProtocol.OpenID will fail, text does not match. }); - //TODO https://github.com/keycloak/keycloak-admin-ui/issues/1959 it("should filter items by Protocol OpenID", () => { listingPage .selectFilter(Filter.Protocol) diff --git a/apps/admin-ui/src/components/table-toolbar/PaginatingTableToolbar.tsx b/apps/admin-ui/src/components/table-toolbar/PaginatingTableToolbar.tsx index 145f6489c7..f490bf879c 100644 --- a/apps/admin-ui/src/components/table-toolbar/PaginatingTableToolbar.tsx +++ b/apps/admin-ui/src/components/table-toolbar/PaginatingTableToolbar.tsx @@ -37,7 +37,11 @@ export const PaginatingTableToolbar: FunctionComponent = ({ inputGroupOnEnter, }) => { const page = Math.round(first / max); - const pagination = (variant: "top" | "bottom" = "top") => ( + const KeycloakPagination = ({ + variant = "top", + }: { + variant?: "top" | "bottom"; + }) => ( ( @@ -61,14 +65,18 @@ export const PaginatingTableToolbar: FunctionComponent = ({ toolbarItem={ <> {toolbarItem} - {count !== 0 && ( - {pagination()} - )} + + + } subToolbar={subToolbar} toolbarItemFooter={ - count !== 0 ? {pagination("bottom")} : null + count !== 0 ? ( + + + + ) : null } inputGroupName={inputGroupName} inputGroupPlaceholder={inputGroupPlaceholder}