@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
59 lines • 5.13 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Button, ButtonVariant, Dropdown, DropdownItem, DropdownList, InputGroup, InputGroupItem, MenuToggle, SearchInput, ToolbarItem, } from "@patternfly/react-core";
import { ArrowRightIcon, EllipsisVIcon } from "@patternfly/react-icons";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { useAccess } from "../../context/access/Access";
import { SearchDropdown } from "../../user/details/SearchFilter";
import DropdownPanel from "../../components/dropdown-panel/DropdownPanel";
import { UserDataTableAttributeSearchForm } from "../../components/users/UserDataTableAttributeSearchForm";
export function UserDataTableToolbarItems({ searchDropdownOpen, setSearchDropdownOpen, realm, hasSelectedRows, toggleDeleteDialog, toggleUnlockUsersDialog, goToCreate, searchType, setSearchType, searchUser, setSearchUser, activeFilters, setActiveFilters, refresh, profile, clearAllFilters, createAttributeSearchChips, searchUserWithAttributes, }) {
const { t } = useTranslation();
const [kebabOpen, setKebabOpen] = useState(false);
const { hasAccess } = useAccess();
// Only needs query-users access to attempt add/delete of users.
// This is because the user could have fine-grained access to users
// of a group. There is no way to know this without searching the
// permissions of every group.
const isManager = hasAccess("query-users");
const searchItem = () => {
return (_jsx(ToolbarItem, { children: _jsxs(InputGroup, { children: [_jsx(InputGroupItem, { children: _jsx(SearchDropdown, { searchType: searchType, onSelect: (searchType) => {
clearAllFilters();
setSearchType(searchType);
} }) }), searchType === "default" && defaultSearchInput(), searchType === "attribute" && attributeSearchInput()] }) }));
};
const defaultSearchInput = () => {
return (_jsx(ToolbarItem, { children: _jsx(SearchInput, { "data-testid": "table-search-input", placeholder: t("searchForUser"), "aria-label": t("search"), value: searchUser, onSearch: (_, _v, attribute) => {
setSearchUser(attribute["haswords"]);
refresh();
}, onKeyDown: (e) => {
if (e.key === "Enter") {
const target = e.target;
setSearchUser(target.value);
refresh();
}
}, onClear: () => {
setSearchUser("");
refresh();
} }) }));
};
const attributeSearchInput = () => {
return (_jsxs(_Fragment, { children: [_jsx(DropdownPanel, { "data-testid": "select-attributes-dropdown", buttonText: t("selectAttributes"), setSearchDropdownOpen: setSearchDropdownOpen, searchDropdownOpen: searchDropdownOpen, width: "15vw", children: _jsx(UserDataTableAttributeSearchForm, { activeFilters: activeFilters, setActiveFilters: setActiveFilters, profile: profile, createAttributeSearchChips: createAttributeSearchChips, searchUserWithAttributes: () => {
searchUserWithAttributes();
setSearchDropdownOpen(false);
} }) }), _jsx(Button, { icon: _jsx(ArrowRightIcon, {}), variant: "control", onClick: () => {
searchUserWithAttributes();
setSearchDropdownOpen(false);
}, "aria-label": t("searchAttributes") })] }));
};
const bruteForceProtectionToolbarItem = !realm.bruteForceProtected ? (_jsx(ToolbarItem, { children: _jsx(Button, { variant: ButtonVariant.link, onClick: toggleDeleteDialog, "data-testid": "delete-user-btn", isDisabled: hasSelectedRows, children: t("deleteUser") }) })) : (_jsx(ToolbarItem, { children: _jsx(Dropdown, { onOpenChange: (isOpen) => setKebabOpen(isOpen), toggle: (ref) => (_jsx(MenuToggle, { ref: ref, isExpanded: kebabOpen, variant: "plain", onClick: () => setKebabOpen(!kebabOpen), children: _jsx(EllipsisVIcon, {}) })), isOpen: kebabOpen, shouldFocusToggleOnSelect: true, children: _jsxs(DropdownList, { children: [_jsx(DropdownItem, { component: "button", isDisabled: hasSelectedRows, onClick: () => {
toggleDeleteDialog();
setKebabOpen(false);
}, children: t("deleteUser") }, "deleteUser"), _jsx(DropdownItem, { component: "button", onClick: () => {
toggleUnlockUsersDialog();
setKebabOpen(false);
}, children: t("unlockAllUsers") }, "unlock")] }) }) }));
const actionItems = (_jsxs(_Fragment, { children: [_jsx(ToolbarItem, { children: _jsx(Button, { "data-testid": "add-user", onClick: goToCreate, children: t("addUser") }) }), bruteForceProtectionToolbarItem] }));
return (_jsxs(_Fragment, { children: [searchItem(), isManager ? actionItems : null] }));
}
//# sourceMappingURL=UserDataTableToolbarItems.js.map