/* eslint-disable */ // @ts-nocheck import type { AuthenticationProviderRepresentation } from "@keycloak/keycloak-admin-client/lib/defs/authenticatorConfigRepresentation"; import type ClientRepresentation from "@keycloak/keycloak-admin-client/lib/defs/clientRepresentation"; import type CredentialRepresentation from "@keycloak/keycloak-admin-client/lib/defs/credentialRepresentation"; import { HelpItem, SelectControl, useAlerts, useFetch, } from "../../../shared/keycloak-ui-shared"; import { ActionGroup, Alert, AlertVariant, Button, Card, CardBody, ClipboardCopy, Form, FormGroup, PageSection, Split, SplitItem, } from "../../../shared/@patternfly/react-core"; import { useMemo, useState } from "react"; import { useFormContext, useWatch } from "react-hook-form"; import { useTranslation } from "react-i18next"; import { useAdminClient } from "../../admin-client"; import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog"; import { DynamicComponents } from "../../components/dynamic/DynamicComponents"; import { FormAccess } from "../../components/form/FormAccess"; import { useServerInfo } from "../../context/server-info/ServerInfoProvider"; import { FormFields } from "../ClientDetails"; import { ClientSecret } from "./ClientSecret"; import { SignedJWT } from "./SignedJWT"; import { X509 } from "./X509"; import { convertAttributeNameToForm } from "../../util"; type AccessToken = { registrationAccessToken: string; }; export type CredentialsProps = { client: ClientRepresentation; save: () => void; refresh: () => void; }; export const Credentials = ({ client, save, refresh }: CredentialsProps) => { const { adminClient } = useAdminClient(); const { t } = useTranslation(); const { addAlert, addError } = useAlerts(); const clientId = client.id!; const [providers, setProviders] = useState< AuthenticationProviderRepresentation[] >([]); const { control, formState: { isDirty }, handleSubmit, reset, } = useFormContext(); const clientAuthenticatorType = useWatch({ control: control, name: "clientAuthenticatorType", defaultValue: "", }); const [secret, setSecret] = useState(""); const [accessToken, setAccessToken] = useState(""); const selectedProvider = providers.find( (provider) => provider.id === clientAuthenticatorType, ); const { componentTypes } = useServerInfo(); const providerProperties = useMemo( () => componentTypes?.["org.keycloak.authentication.ClientAuthenticator"]?.find( (p) => p.id === clientAuthenticatorType, )?.clientProperties, [clientAuthenticatorType, componentTypes], ); useFetch( () => Promise.all([ adminClient.authenticationManagement.getClientAuthenticatorProviders(), adminClient.clients.getClientSecret({ id: clientId, }), ]), ([providers, secret]) => { setProviders(providers); setSecret(secret.value!); }, [], ); async function regenerate( call: (clientId: string) => Promise, message: string, ): Promise { try { const data = await call(clientId); addAlert(t(`${message}Success`), AlertVariant.success); return data; } catch (error) { addError(`${message}Error`, error); } } const regenerateClientSecret = async () => { const secret = await regenerate( (clientId) => adminClient.clients.generateNewClientSecret({ id: clientId }), "clientSecret", ); setSecret(secret?.value || ""); refresh(); }; const [toggleClientSecretConfirm, ClientSecretConfirm] = useConfirmDialog({ titleKey: "confirmClientSecretTitle", messageKey: "confirmClientSecretBody", continueButtonLabel: "yes", cancelButtonLabel: "no", onConfirm: regenerateClientSecret, }); const regenerateAccessToken = async () => { const accessToken = await regenerate( (clientId) => adminClient.clients.generateRegistrationAccessToken({ id: clientId }), "accessToken", ); setAccessToken(accessToken?.registrationAccessToken || ""); }; const [toggleAccessTokenConfirm, AccessTokenConfirm] = useConfirmDialog({ titleKey: "confirmAccessTokenTitle", messageKey: "confirmAccessTokenBody", continueButtonLabel: "yes", cancelButtonLabel: "no", onConfirm: regenerateAccessToken, }); return ( ({ key: id!, value: displayName || id!, }))} /> {clientAuthenticatorType === "client-secret" && ( ( "attributes.client.secret.authentication.allowed.method", )} label={t("clientSecretAuthenticationAllowedMethod")} labelIcon={t("clientSecretAuthenticationAllowedMethodHelp")} controller={{ defaultValue: "", }} isScrollable maxMenuHeight="200px" options={[ { key: "", value: t("any") }, { key: "client_secret_basic", value: "client_secret_basic" }, { key: "client_secret_post", value: "client_secret_post" }, ]} /> )} {(clientAuthenticatorType === "client-jwt" || clientAuthenticatorType === "client-secret-jwt") && ( )} {clientAuthenticatorType === "client-jwt" && ( )} {clientAuthenticatorType === "client-x509" && } {providerProperties && (
convertAttributeNameToForm(`attributes.${name}`) } /> )} {selectedProvider?.supportsSecret && ( )}
} > {accessToken}
); };