@keycloakify/keycloak-account-ui/ui-shared/masthead/Masthead.js

<p align="center"> <img src="https://github.com/user-attachments/assets/e31c4910-7205-441c-9a35-e134b806b3a8"> </p> <p align="center"> <i>Repackaged Keycloak Account UI</i> <br> <br> <a href="https://github.com/keycloakify/keycloak-a

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Avatar, Brand, DropdownItem, } from "@patternfly/react-core";
import { PageHeader, PageHeaderTools, PageHeaderToolsGroup, PageHeaderToolsItem, } from "@patternfly/react-core/deprecated";
import { useTranslation } from "react-i18next";
import { DefaultAvatar } from "../../ui-shared/masthead/DefaultAvatar";
import { KeycloakDropdown } from "../../ui-shared/masthead/KeycloakDropdown";
function loggedInUserName(token, t) {
    if (!token) {
        return t("unknownUser");
    }
    const givenName = token.given_name;
    const familyName = token.family_name;
    const preferredUsername = token.preferred_username;
    if (givenName && familyName) {
        return t("fullName", { givenName, familyName });
    }
    return givenName || familyName || preferredUsername || t("unknownUser");
}
const KeycloakMasthead = (_a) => {
    var _b;
    var { keycloak } = _a, _c = _a.brand, { href: brandHref } = _c, brandProps = __rest(_c, ["href"]), { avatar, features: { hasLogout = true, hasManageAccount = true, hasUsername = true, } = {}, kebabDropdownItems, dropdownItems = [], toolbarItems } = _a, rest = __rest(_a, ["keycloak", "brand", "avatar", "features", "kebabDropdownItems", "dropdownItems", "toolbarItems"]);
    const { t } = useTranslation();
    const extraItems = [];
    if (hasManageAccount) {
        extraItems.push(_jsx(DropdownItem, { onClick: () => keycloak.accountManagement(), children: t("manageAccount") }, "manageAccount"));
    }
    if (hasLogout) {
        extraItems.push(_jsx(DropdownItem, { onClick: () => keycloak.logout(), children: t("signOut") }, "signOut"));
    }
    const picture = (_b = keycloak.idTokenParsed) === null || _b === void 0 ? void 0 : _b.picture;
    return (_jsx(PageHeader, Object.assign({}, rest, { logo: _jsx(Brand, Object.assign({}, brandProps)), logoProps: { href: brandHref }, headerTools: _jsxs(PageHeaderTools, { children: [_jsxs(PageHeaderToolsGroup, { children: [_jsx(PageHeaderToolsItem, { visibility: {
                                md: "hidden",
                            }, children: _jsx(KeycloakDropdown, { "data-testid": "options-kebab", isKebab: true, dropDownItems: [
                                    ...(kebabDropdownItems || dropdownItems),
                                    extraItems,
                                ] }) }), _jsx(PageHeaderToolsItem, { children: toolbarItems }), _jsx(PageHeaderToolsItem, { visibility: {
                                default: "hidden",
                                md: "visible",
                            }, children: _jsx(KeycloakDropdown, { "data-testid": "options", dropDownItems: [...dropdownItems, extraItems], title: hasUsername
                                    ? loggedInUserName(keycloak.idTokenParsed, t)
                                    : undefined }) })] }), picture || (avatar === null || avatar === void 0 ? void 0 : avatar.src) ? (_jsx(Avatar, Object.assign({ src: picture, alt: t("avatar") }, avatar))) : (_jsx(DefaultAvatar, Object.assign({}, avatar)))] }) })));
};
export default KeycloakMasthead;
//# sourceMappingURL=Masthead.js.map