@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
170 lines • 9.09 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { AlertVariant, Button, ButtonVariant, Label, PageSection, Text, TextContent, } from "@patternfly/react-core";
import { cellWidth } from "@patternfly/react-table";
import { capitalize } from "lodash-es";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
import { FormPanel } from "../ui-shared";
import { useAdminClient } from "../admin-client";
import { useAlerts } from "../ui-shared";
import { useConfirmDialog } from "../components/confirm-dialog/ConfirmDialog";
import { KeycloakDataTable } from "../ui-shared";
import { useRealm } from "../context/realm-context/RealmContext";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
import { toIdentityProvider } from "../identity-providers/routes/IdentityProvider";
import { emptyFormatter, upperCaseFormatter } from "../util";
import { UserIdpModal } from "../user/UserIdPModal";
import { useAccess } from "../context/access/Access";
export const UserIdentityProviderLinks = ({ userId, }) => {
const { adminClient } = useAdminClient();
const [key, setKey] = useState(0);
const [federatedId, setFederatedId] = useState("");
const [isLinkIdPModalOpen, setIsLinkIdPModalOpen] = useState(false);
const { realm } = useRealm();
const { addAlert, addError } = useAlerts();
const { t } = useTranslation();
const { hasAccess, hasSomeAccess } = useAccess();
const canQueryIDPDetails = hasSomeAccess("manage-identity-providers", "view-identity-providers");
const refresh = () => setKey(new Date().getTime());
const identityProviders = useServerInfo().identityProviders;
const getFederatedIdentities = async () => {
var _a;
const allFedIds = (await adminClient.users.listFederatedIdentities({
id: userId,
}));
if (canQueryIDPDetails) {
const allProviders = await adminClient.identityProviders.find();
for (const element of allFedIds) {
element.providerId = (_a = allProviders.find((item) => item.alias === element.identityProvider)) === null || _a === void 0 ? void 0 : _a.providerId;
}
}
return allFedIds;
};
const getAvailableIdPs = async () => {
return adminClient.identityProviders.find();
};
const linkedIdPsLoader = async () => {
return getFederatedIdentities();
};
const availableIdPsLoader = async () => {
var _a;
const linkedNames = (await getFederatedIdentities()).map((x) => x.identityProvider);
return (_a = (await getAvailableIdPs())) === null || _a === void 0 ? void 0 : _a.filter((item) => !linkedNames.includes(item.alias));
};
const [toggleUnlinkDialog, UnlinkConfirm] = useConfirmDialog({
titleKey: t("unlinkAccountTitle", {
provider: capitalize(federatedId),
}),
messageKey: t("unlinkAccountConfirm", {
provider: capitalize(federatedId),
}),
continueButtonLabel: "unlink",
continueButtonVariant: ButtonVariant.primary,
onConfirm: async () => {
try {
await adminClient.users.delFromFederatedIdentity({
id: userId,
federatedIdentityId: federatedId,
});
addAlert(t("idpUnlinkSuccess"), AlertVariant.success);
refresh();
}
catch (error) {
addError("mappingDeletedError", error);
}
},
});
const idpLinkRenderer = (idp) => {
if (!canQueryIDPDetails)
return _jsx("span", { children: capitalize(idp.identityProvider) });
return (_jsx(Link, { to: toIdentityProvider({
realm,
providerId: idp.providerId,
alias: idp.identityProvider,
tab: "settings",
}), children: capitalize(idp.identityProvider) }));
};
const badgeRenderer1 = (idp) => {
var _a;
const groupName = (_a = identityProviders === null || identityProviders === void 0 ? void 0 : identityProviders.find((provider) => provider["id"] === idp.identityProvider)) === null || _a === void 0 ? void 0 : _a.groupName;
return (_jsx(Label, { color: groupName === "Social" ? "blue" : "orange", children: groupName === "Social" ? t("idpType.social") : t("idpType.custom") }));
};
const badgeRenderer2 = (idp) => {
var _a;
const groupName = (_a = identityProviders === null || identityProviders === void 0 ? void 0 : identityProviders.find((provider) => provider["id"] === idp.providerId)) === null || _a === void 0 ? void 0 : _a.groupName;
return (_jsx(Label, { color: groupName === "User-defined" ? "orange" : "blue", children: groupName === "User-defined"
? "Custom"
: groupName === "Social"
? t("idpType.social")
: groupName }));
};
const unlinkRenderer = (fedIdentity) => {
if (!hasAccess("manage-users"))
return _jsx("span", {});
return (_jsx(Button, { variant: "link", onClick: () => {
setFederatedId(fedIdentity.identityProvider);
toggleUnlinkDialog();
}, children: t("unlinkAccount") }));
};
const linkRenderer = (idp) => {
return (_jsx(Button, { variant: "link", onClick: () => {
setFederatedId(idp.alias);
setIsLinkIdPModalOpen(true);
}, children: t("linkAccount") }));
};
const linkedIdpColumns = () => {
const columns = [
{
name: "identityProvider",
displayKey: "name",
cellRenderer: idpLinkRenderer,
transforms: [cellWidth(20)],
},
{
name: "userId",
displayKey: "userID",
cellFormatters: [emptyFormatter()],
transforms: [cellWidth(30)],
},
{
name: "userName",
displayKey: "username",
cellFormatters: [emptyFormatter()],
transforms: [cellWidth(20)],
},
{
name: "",
cellRenderer: unlinkRenderer,
transforms: [cellWidth(20)],
},
];
if (canQueryIDPDetails)
columns.splice(1, 0, {
name: "type",
displayKey: "type",
cellRenderer: badgeRenderer1,
transforms: [cellWidth(10)],
});
return columns;
};
return (_jsxs(_Fragment, { children: [isLinkIdPModalOpen && (_jsx(UserIdpModal, { userId: userId, federatedId: federatedId, onClose: () => setIsLinkIdPModalOpen(false), onRefresh: refresh })), _jsx(UnlinkConfirm, {}), _jsxs(PageSection, { variant: "light", className: "pf-v5-u-p-0", children: [_jsxs(FormPanel, { title: t("linkedIdPs"), className: "kc-linked-idps", children: [_jsx(TextContent, { children: _jsx(Text, { className: "kc-available-idps-text", children: t("linkedIdPsText") }) }), _jsx(KeycloakDataTable, { loader: linkedIdPsLoader, isPaginated: false, ariaLabelKey: "LinkedIdPs", className: "kc-linked-IdPs-table", columns: linkedIdpColumns(), emptyState: _jsx(TextContent, { className: "kc-no-providers-text", children: _jsx(Text, { children: t("noProvidersLinked") }) }) }, key)] }), hasAccess("manage-users") && canQueryIDPDetails && (_jsxs(FormPanel, { className: "kc-available-idps", title: t("availableIdPs"), children: [_jsx(TextContent, { children: _jsx(Text, { className: "kc-available-idps-text", children: t("availableIdPsText") }) }), _jsx(KeycloakDataTable, { loader: availableIdPsLoader, isPaginated: false, ariaLabelKey: "LinkedIdPs", className: "kc-linked-IdPs-table", columns: [
{
name: "alias",
displayKey: "name",
cellFormatters: [emptyFormatter(), upperCaseFormatter()],
transforms: [cellWidth(20)],
},
{
name: "type",
displayKey: "type",
cellRenderer: badgeRenderer2,
transforms: [cellWidth(60)],
},
{
name: "",
cellRenderer: linkRenderer,
},
], emptyState: _jsx(TextContent, { className: "kc-no-providers-text", children: _jsx(Text, { children: t("noAvailableIdentityProviders") }) }) }, key)] }))] })] }));
};
//# sourceMappingURL=UserIdentityProviderLinks.js.map