@keycloakify/keycloak-admin-ui/client-scopes/details/SearchFilter.js

Repackaged Keycloak Admin UI

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { Dropdown, DropdownItem, DropdownList, MenuToggle, Select, SelectList, SelectOption, ToolbarItem, } from "@patternfly/react-core";
import { FilterIcon } from "@patternfly/react-icons";
import { AllClientScopes, clientScopeTypesSelectOptions, } from "../../components/client-scope/ClientScopeTypes";
export const PROTOCOLS = ["all", "saml", "openid-connect"];
export const nameFilter = (search = "") => (scope) => { var _a; return (_a = scope.name) === null || _a === void 0 ? void 0 : _a.includes(search); };
export const typeFilter = (type) => (scope) => type === AllClientScopes.none || scope.type === type;
export const protocolFilter = (protocol) => (scope) => protocol === "all" || scope.protocol === protocol;
export const SearchDropdown = ({ searchType, withProtocol = false, onSelect, }) => {
    const { t } = useTranslation();
    const [searchToggle, setSearchToggle] = useState(false);
    const createDropdown = (searchType) => (_jsx(DropdownItem, { onClick: () => {
            onSelect(searchType);
            setSearchToggle(false);
        }, children: t(`clientScopeSearch.${searchType}`) }, searchType));
    const options = [createDropdown("name"), createDropdown("type")];
    if (withProtocol) {
        options.push(createDropdown("protocol"));
    }
    return (_jsx(Dropdown, { onOpenChange: (isOpen) => setSearchToggle(isOpen), toggle: (ref) => (_jsxs(MenuToggle, { "data-testid": "clientScopeSearch", ref: ref, id: "toggle-id", onClick: () => setSearchToggle(!searchToggle), children: [_jsx(FilterIcon, {}), " ", t(`clientScopeSearch.${searchType}`)] })), isOpen: searchToggle, children: _jsx(DropdownList, { children: options }) }));
};
export const SearchToolbar = ({ searchType, onSelect, type, onType, protocol, onProtocol, }) => {
    const { t } = useTranslation();
    const [open, setOpen] = useState(false);
    return (_jsxs(_Fragment, { children: [searchType === "type" && (_jsxs(_Fragment, { children: [_jsx(ToolbarItem, { children: _jsx(SearchDropdown, { searchType: searchType, onSelect: onSelect, withProtocol: !!protocol }) }), _jsx(ToolbarItem, { children: _jsx(Select, { toggle: (ref) => (_jsx(MenuToggle, { "data-testid": "clientScopeSearchType", ref: ref, isExpanded: open, onClick: () => setOpen(!open), children: type === AllClientScopes.none
                                    ? t("allTypes")
                                    : t(`clientScopeTypes.${type}`) })), onOpenChange: (val) => setOpen(val), isOpen: open, selected: type === AllClientScopes.none
                                ? t("allTypes")
                                : t(`clientScopeTypes.${type}`), onSelect: (_, value) => {
                                onType(value);
                                setOpen(false);
                            }, children: _jsxs(SelectList, { children: [_jsx(SelectOption, { value: AllClientScopes.none, children: t("allTypes") }), clientScopeTypesSelectOptions(t)] }) }) })] })), searchType === "protocol" && !!protocol && (_jsxs(_Fragment, { children: [_jsx(ToolbarItem, { children: _jsx(SearchDropdown, { searchType: searchType, onSelect: onSelect, withProtocol: true }) }), _jsx(ToolbarItem, { children: _jsx(Select, { toggle: (ref) => (_jsx(MenuToggle, { "data-testid": "clientScopeSearchProtocol", ref: ref, isExpanded: open, onClick: () => setOpen(!open), children: t(`protocolTypes.${protocol}`) })), onOpenChange: (val) => setOpen(val), isOpen: open, selected: t(`protocolTypes.${protocol}`), onSelect: (_, value) => {
                                onProtocol === null || onProtocol === void 0 ? void 0 : onProtocol(value);
                                setOpen(false);
                            }, children: _jsx(SelectList, { children: PROTOCOLS.map((type) => (_jsx(SelectOption, { value: type, children: t(`protocolTypes.${type}`) }, type))) }) }) })] }))] }));
};
//# sourceMappingURL=SearchFilter.js.map