theme.keycloak.v2.admin.resources.assets.ClientDetails-17c6a8ba.js.map Maven / Gradle / Ivy
{"version":3,"file":"ClientDetails-17c6a8ba.js","sources":["../../../../node_modules/.pnpm/@[email protected]/node_modules/@patternfly/react-styles/css/components/CodeBlock/code-block.mjs","../../../../node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@patternfly/react-core/dist/esm/components/CodeBlock/CodeBlock.js","../../../../node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@patternfly/react-core/dist/esm/components/CodeBlock/CodeBlockAction.js","../../../../node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@patternfly/react-core/dist/esm/components/Panel/PanelHeader.js","../../../../node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@patternfly/react-core/dist/esm/components/Text/TextList.js","../../../../node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@patternfly/react-core/dist/esm/components/Text/TextListItem.js","../../src/components/download-dialog/DownloadDialog.tsx","../../src/clients/advanced/TokenLifespan.tsx","../../src/clients/advanced/AdvancedSettings.tsx","../../src/clients/advanced/AuthenticationOverrides.tsx","../../src/components/time-selector/TimeSelectorForm.tsx","../../src/clients/advanced/AddHostDialog.tsx","../../src/clients/advanced/ClusteringPanel.tsx","../../src/clients/advanced/ApplicationUrls.tsx","../../src/clients/advanced/FineGrainOpenIdConnect.tsx","../../src/clients/advanced/FineGrainSamlEndpointConfig.tsx","../../src/clients/advanced/OpenIdConnectCompatibilityModes.tsx","../../src/clients/advanced/RevocationPanel.tsx","../../src/clients/AdvancedTab.tsx","../../src/clients/ClientSessions.tsx","../../src/clients/add/SamlConfig.tsx","../../src/clients/add/SamlSignature.tsx","../../src/clients/add/AccessSettings.tsx","../../src/clients/add/LoginSettingsPanel.tsx","../../src/clients/add/LogoutPanel.tsx","../../src/clients/ClientSettings.tsx","../../src/clients/authorization/KeyBasedAttributeInput.tsx","../../src/clients/authorization/AuthorizationDataModal.tsx","../../src/clients/authorization/AuthorizationEvaluateResourcePolicies.tsx","../../src/clients/authorization/AuthorizationEvaluateResource.tsx","../../src/clients/authorization/evaluate/Results.tsx","../../src/clients/authorization/AuthorizationEvaluate.tsx","../../src/clients/authorization/AuthorizationExport.tsx","../../src/clients/authorization/DetailDescription.tsx","../../src/clients/authorization/EmptyPermissionsState.tsx","../../src/clients/authorization/MoreLabel.tsx","../../src/clients/authorization/SearchDropdown.tsx","../../src/clients/authorization/Permissions.tsx","../../src/clients/authorization/NewPolicyDialog.tsx","../../src/clients/authorization/Policies.tsx","../../src/clients/authorization/DetailCell.tsx","../../src/clients/authorization/Resources.tsx","../../src/clients/authorization/Scopes.tsx","../../src/clients/authorization/ImportDialog.tsx","../../src/clients/authorization/Settings.tsx","../../src/clients/scopes/CopyToClipboardButton.tsx","../../src/clients/credentials/ClientSecret.tsx","../../src/clients/credentials/SignedJWT.tsx","../../src/clients/credentials/X509.tsx","../../src/clients/credentials/Credentials.tsx","../../src/clients/keys/Certificate.tsx","../../src/clients/keys/StoreSettings.tsx","../../src/clients/keys/GenerateKeyDialog.tsx","../../src/clients/keys/ImportKeyDialog.tsx","../../src/clients/keys/Keys.tsx","../../src/clients/keys/ExportSamlKeyDialog.tsx","../../src/clients/keys/SamlKeysDialog.tsx","../../src/clients/keys/SamlImportKeyDialog.tsx","../../src/clients/keys/SamlKeys.tsx","../../src/clients/scopes/ClientScopes.tsx","../../src/clients/scopes/GeneratedCodeTab.tsx","../../src/clients/scopes/EvaluateScopes.tsx","../../src/clients/service-account/ServiceAccount.tsx","../../src/clients/ClientDetails.tsx"],"sourcesContent":["import './code-block.css';\nexport default {\n \"codeBlock\": \"pf-c-code-block\",\n \"codeBlockActions\": \"pf-c-code-block__actions\",\n \"codeBlockCode\": \"pf-c-code-block__code\",\n \"codeBlockContent\": \"pf-c-code-block__content\",\n \"codeBlockHeader\": \"pf-c-code-block__header\",\n \"codeBlockPre\": \"pf-c-code-block__pre\"\n};","import { __rest } from \"tslib\";\nimport * as React from 'react';\nimport styles from '@patternfly/react-styles/css/components/CodeBlock/code-block';\nimport { css } from '@patternfly/react-styles';\nexport const CodeBlock = (_a) => {\n var { children = null, className, actions = null } = _a, props = __rest(_a, [\"children\", \"className\", \"actions\"]);\n return (React.createElement(\"div\", Object.assign({ className: css(styles.codeBlock, className) }, props),\n React.createElement(\"div\", { className: css(styles.codeBlockHeader) },\n React.createElement(\"div\", { className: css(styles.codeBlockActions) }, actions && actions)),\n React.createElement(\"div\", { className: css(styles.codeBlockContent) }, children)));\n};\nCodeBlock.displayName = 'CodeBlock';\n//# sourceMappingURL=CodeBlock.js.map","import { __rest } from \"tslib\";\nimport * as React from 'react';\nimport { css } from '@patternfly/react-styles';\nexport const CodeBlockAction = (_a) => {\n var { children = null, className } = _a, props = __rest(_a, [\"children\", \"className\"]);\n return (React.createElement(\"div\", Object.assign({ className: css('pf-c-code-block__actions-item', className) }, props), children));\n};\nCodeBlockAction.displayName = 'CodeBlockAction';\n//# sourceMappingURL=CodeBlockAction.js.map","import { __rest } from \"tslib\";\nimport * as React from 'react';\nimport styles from '@patternfly/react-styles/css/components/Panel/panel';\nimport { css } from '@patternfly/react-styles';\nexport const PanelHeader = (_a) => {\n var { className, children } = _a, props = __rest(_a, [\"className\", \"children\"]);\n return (React.createElement(\"div\", Object.assign({ className: css(styles.panelHeader, className) }, props), children));\n};\nPanelHeader.displayName = 'PanelHeader';\n//# sourceMappingURL=PanelHeader.js.map","import { __rest } from \"tslib\";\nimport * as React from 'react';\nimport styles from '@patternfly/react-styles/css/components/Content/content';\nimport { css } from '@patternfly/react-styles';\nexport var TextListVariants;\n(function (TextListVariants) {\n TextListVariants[\"ul\"] = \"ul\";\n TextListVariants[\"ol\"] = \"ol\";\n TextListVariants[\"dl\"] = \"dl\";\n})(TextListVariants || (TextListVariants = {}));\nexport const TextList = (_a) => {\n var { children = null, className = '', component = TextListVariants.ul, isPlain = false } = _a, props = __rest(_a, [\"children\", \"className\", \"component\", \"isPlain\"]);\n const Component = component;\n return (React.createElement(Component, Object.assign({}, props, { className: css(isPlain && styles.modifiers.plain, className) }), children));\n};\nTextList.displayName = 'TextList';\n//# sourceMappingURL=TextList.js.map","import { __rest } from \"tslib\";\nimport * as React from 'react';\nimport { css } from '@patternfly/react-styles';\nexport var TextListItemVariants;\n(function (TextListItemVariants) {\n TextListItemVariants[\"li\"] = \"li\";\n TextListItemVariants[\"dt\"] = \"dt\";\n TextListItemVariants[\"dd\"] = \"dd\";\n})(TextListItemVariants || (TextListItemVariants = {}));\nexport const TextListItem = (_a) => {\n var { children = null, className = '', component = TextListItemVariants.li } = _a, props = __rest(_a, [\"children\", \"className\", \"component\"]);\n const Component = component;\n return (React.createElement(Component, Object.assign({}, props, { className: css(className) }), children));\n};\nTextListItem.displayName = 'TextListItem';\n//# sourceMappingURL=TextListItem.js.map","import {\n Form,\n FormGroup,\n ModalVariant,\n Select,\n SelectOption,\n SelectVariant,\n Stack,\n StackItem,\n} from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { HelpItem, useHelp } from \"ui-shared\";\nimport { adminClient } from \"../../admin-client\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useServerInfo } from \"../../context/server-info/ServerInfoProvider\";\nimport { addTrailingSlash, prettyPrintJSON } from \"../../util\";\nimport { getAuthorizationHeaders } from \"../../utils/getAuthorizationHeaders\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { ConfirmDialogModal } from \"../confirm-dialog/ConfirmDialog\";\nimport { KeycloakTextArea } from \"../keycloak-text-area/KeycloakTextArea\";\n\ntype DownloadDialogProps = {\n id: string;\n protocol?: string;\n open: boolean;\n toggleDialog: () => void;\n};\n\nexport const DownloadDialog = ({\n id,\n open,\n toggleDialog,\n protocol = \"openid-connect\",\n}: DownloadDialogProps) => {\n const { realm } = useRealm();\n const { t } = useTranslation(\"common\");\n const { enabled } = useHelp();\n const serverInfo = useServerInfo();\n\n const configFormats = serverInfo.clientInstallations![protocol];\n const [selected, setSelected] = useState(\n configFormats[configFormats.length - 1].id,\n );\n const [snippet, setSnippet] = useState();\n const [openType, setOpenType] = useState(false);\n\n const selectedConfig = useMemo(\n () => configFormats.find((config) => config.id === selected) ?? null,\n [selected],\n );\n\n const sanitizeSnippet = (snippet: string) =>\n snippet.replace(\n /.*<\\/PrivateKeyPem>/gs,\n `${t(\"clients:privateKeyMask\")} `,\n );\n\n useFetch(\n async () => {\n if (selectedConfig?.mediaType === \"application/zip\") {\n const response = await fetch(\n `${addTrailingSlash(\n adminClient.baseUrl,\n )}admin/realms/${realm}/clients/${id}/installation/providers/${selected}`,\n {\n method: \"GET\",\n headers: getAuthorizationHeaders(\n await adminClient.getAccessToken(),\n ),\n },\n );\n\n return response.arrayBuffer();\n } else {\n const snippet = await adminClient.clients.getInstallationProviders({\n id,\n providerId: selected,\n });\n if (typeof snippet === \"string\") {\n return sanitizeSnippet(snippet);\n } else {\n return prettyPrintJSON(snippet);\n }\n }\n },\n (snippet) => setSnippet(snippet),\n [id, selected],\n );\n\n // Clear snippet when selected config changes, this prevents old snippets from being displayed during fetch.\n useEffect(() => setSnippet(\"\"), [id, selected]);\n\n return (\n {\n saveAs(\n new Blob([snippet!], { type: selectedConfig?.mediaType }),\n selectedConfig?.filename,\n );\n }}\n open={open}\n toggleDialog={toggleDialog}\n variant={ModalVariant.medium}\n >\n \n \n );\n};\n","import {\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n Split,\n SplitItem,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { HelpItem } from \"ui-shared\";\nimport {\n TimeSelector,\n Unit,\n} from \"../../components/time-selector/TimeSelector\";\n\ntype TokenLifespanProps = {\n id: string;\n name: string;\n defaultValue?: number;\n units?: Unit[];\n};\n\nconst inherited = \"tokenLifespan.inherited\";\nconst expires = \"tokenLifespan.expires\";\n\nexport const TokenLifespan = ({\n id,\n name,\n defaultValue,\n units,\n}: TokenLifespanProps) => {\n const { t } = useTranslation(\"clients\");\n const [open, setOpen] = useState(false);\n\n const [focused, setFocused] = useState(false);\n const onFocus = () => setFocused(true);\n const onBlur = () => setFocused(false);\n\n const { control } = useFormContext();\n const isExpireSet = (value: string | number) =>\n typeof value === \"number\" ||\n (typeof value === \"string\" && value !== \"\") ||\n focused;\n\n return (\n (\n \n \n {\n field.onChange(value);\n setOpen(false);\n }}\n selections={[\n isExpireSet(field.value) ? t(expires) : t(inherited),\n ]}\n >\n {t(inherited)} \n {t(expires)} \n \n \n \n \n \n )}\n />\n \n );\n};\n","import RealmRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/realmRepresentation\";\nimport {\n ActionGroup,\n Button,\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n Switch,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { KeyValueInput } from \"../../components/key-value-form/KeyValueInput\";\nimport { MultiLineInput } from \"../../components/multi-line-input/MultiLineInput\";\nimport { TimeSelector } from \"../../components/time-selector/TimeSelector\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { FormFields } from \"../ClientDetails\";\nimport { TokenLifespan } from \"./TokenLifespan\";\n\ntype AdvancedSettingsProps = {\n save: () => void;\n reset: () => void;\n protocol?: string;\n hasConfigureAccess?: boolean;\n};\n\nexport const AdvancedSettings = ({\n save,\n reset,\n protocol,\n hasConfigureAccess,\n}: AdvancedSettingsProps) => {\n const { t } = useTranslation(\"clients\");\n const [open, setOpen] = useState(false);\n\n const [realm, setRealm] = useState();\n const { realm: realmName } = useRealm();\n\n useFetch(\n () => adminClient.realms.findOne({ realm: realmName }),\n setRealm,\n [],\n );\n\n const { control } = useFormContext();\n return (\n \n {protocol !== \"openid-connect\" && (\n (\n \"attributes.saml.assertion.lifespan\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n (\n \"attributes.tls.client.certificate.bound.access.tokens\",\n )}\n defaultValue={false}\n control={control}\n render={({ field }) => (\n field.onChange(\"\" + value)}\n aria-label={t(\"oAuthMutual\")}\n />\n )}\n />\n \n (\n \"attributes.pkce.code.challenge.method\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setOpen(false);\n }}\n selections={[field.value || t(\"common:choose\")]}\n >\n {[\"\", \"S256\", \"plain\"].map((v) => (\n \n {v || t(\"common:choose\")}\n \n ))}\n \n )}\n />\n \n (\n \"attributes.require.pushed.authorization.requests\",\n )}\n defaultValue=\"false\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"pushedAuthorizationRequestRequired\")}\n />\n )}\n />\n \n \n \n {t(\"common:save\")}\n \n \n \n \n );\n};\n","import {\n ActionGroup,\n Button,\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n} from \"@patternfly/react-core\";\nimport { sortBy } from \"lodash-es\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useFetch } from \"../../utils/useFetch\";\n\ntype AuthenticationOverridesProps = {\n save: () => void;\n reset: () => void;\n protocol?: string;\n hasConfigureAccess?: boolean;\n};\n\nexport const AuthenticationOverrides = ({\n protocol,\n save,\n reset,\n hasConfigureAccess,\n}: AuthenticationOverridesProps) => {\n const { t } = useTranslation(\"clients\");\n const [flows, setFlows] = useState([]);\n const [browserFlowOpen, setBrowserFlowOpen] = useState(false);\n const [directGrantOpen, setDirectGrantOpen] = useState(false);\n\n const { control } = useFormContext();\n\n useFetch(\n () => adminClient.authenticationManagement.getFlows(),\n (flows) => {\n let filteredFlows = [\n ...flows.filter((flow) => flow.providerId !== \"client-flow\"),\n ];\n filteredFlows = sortBy(filteredFlows, [(f) => f.alias]);\n setFlows([\n \n {t(\"common:choose\")}\n ,\n ...filteredFlows.map((flow) => (\n \n {flow.alias}\n \n )),\n ]);\n },\n [],\n );\n\n return (\n \n (\n {\n field.onChange(value);\n setBrowserFlowOpen(false);\n }}\n selections={[field.value]}\n >\n {flows}\n \n )}\n />\n \n {protocol === \"openid-connect\" && (\n (\n {\n field.onChange(value);\n setDirectGrantOpen(false);\n }}\n selections={[field.value]}\n >\n {flows}\n \n )}\n />\n \n )}\n \n \n {t(\"common:save\")}\n \n \n {t(\"common:revert\")}\n \n \n \n );\n};\n","import { useController } from \"react-hook-form\";\nimport { TimeSelector, TimeSelectorProps } from \"./TimeSelector\";\n\ntype TimeSelectorFormProps = TimeSelectorProps & {\n name: string;\n};\n\nexport const TimeSelectorForm = (props: TimeSelectorFormProps) => {\n const { field } = useController(props);\n\n return ();\n const { addAlert, addError } = useAlerts();\n\n async function onSubmit({ node }: FormFields) {\n try {\n await adminClient.clients.addClusterNode({\n id,\n node,\n });\n onAdded(node);\n addAlert(t(\"addedNodeSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:addedNodeFail\", error);\n }\n\n onClose();\n }\n\n return (\n \n {t(\"common:save\")}\n ,\n \n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n \n );\n};\n","import {\n AlertVariant,\n Button,\n ButtonVariant,\n ExpandableSection,\n FormGroup,\n Split,\n SplitItem,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport {\n Action,\n KeycloakDataTable,\n} from \"../../components/table-toolbar/KeycloakDataTable\";\nimport { TimeSelectorForm } from \"../../components/time-selector/TimeSelectorForm\";\nimport useFormatDate, { FORMAT_DATE_AND_TIME } from \"../../utils/useFormatDate\";\nimport { AddHostDialog } from \".././advanced/AddHostDialog\";\nimport { AdvancedProps, parseResult } from \"../AdvancedTab\";\n\ntype Node = {\n host: string;\n registration: string;\n};\n\nexport const ClusteringPanel = ({\n save,\n client: { id, registeredNodes, access },\n}: AdvancedProps) => {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n const formatDate = useFormatDate();\n\n const [nodes, setNodes] = useState(registeredNodes || {});\n const [expanded, setExpanded] = useState(false);\n const [selectedNode, setSelectedNode] = useState(\"\");\n const [addNodeOpen, setAddNodeOpen] = useState(false);\n const [key, setKey] = useState(0);\n const refresh = () => setKey(new Date().getTime());\n\n const testCluster = async () => {\n const result = await adminClient.clients.testNodesAvailable({ id: id! });\n parseResult(result, \"testCluster\", addAlert, t);\n };\n\n const [toggleDeleteNodeConfirm, DeleteNodeConfirm] = useConfirmDialog({\n titleKey: \"clients:deleteNode\",\n messageKey: t(\"deleteNodeBody\", {\n node: selectedNode,\n }),\n continueButtonLabel: \"common:delete\",\n continueButtonVariant: ButtonVariant.danger,\n onConfirm: async () => {\n try {\n await adminClient.clients.deleteClusterNode({\n id: id!,\n node: selectedNode,\n });\n setNodes({\n ...Object.keys(nodes).reduce((object: any, key) => {\n if (key !== selectedNode) {\n object[key] = nodes[key];\n }\n return object;\n }, {}),\n });\n refresh();\n addAlert(t(\"deleteNodeSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:deleteNodeFail\", error);\n }\n },\n });\n\n return (\n <>\n \n \n \n \n \n \n \n \n \n \n <>\n {\n nodes[node] = Date.now() / 1000;\n refresh();\n }}\n onClose={() => setAddNodeOpen(false)}\n />\n \n \n Promise.resolve(\n Object.entries(nodes || {}).map((entry) => {\n return { host: entry[0], registration: entry[1] };\n }),\n )\n }\n toolbarItem={\n <>\n \n \n {t(\"testClusterAvailability\")}\n \n \n \n setAddNodeOpen(true)}\n variant={ButtonVariant.tertiary}\n >\n {t(\"registerNodeManually\")}\n \n \n \n }\n actions={[\n {\n title: t(\"common:delete\"),\n onRowClick: (node) => {\n setSelectedNode(node.host);\n toggleDeleteNodeConfirm();\n },\n } as Action,\n ]}\n columns={[\n {\n name: \"host\",\n displayKey: \"clients:nodeHost\",\n },\n {\n name: \"registration\",\n displayKey: \"clients:lastRegistration\",\n cellFormatters: [\n (value) =>\n value\n ? formatDate(\n new Date(parseInt(value.toString()) * 1000),\n FORMAT_DATE_AND_TIME,\n )\n : \"\",\n ],\n },\n ]}\n emptyState={\n setAddNodeOpen(true)}\n />\n }\n />\n \n \n \n );\n};\n","import { useTranslation } from \"react-i18next\";\nimport { TextControl } from \"ui-shared\";\n\ntype ApplicationUrlsProps = {\n isDisabled?: boolean;\n};\n\nexport const ApplicationUrls = (props: ApplicationUrlsProps) => {\n const { t } = useTranslation(\"clients\");\n\n return (\n <>\n \n {t(\"common:choose\")}\n ,\n ...sortProviders(clientSignatureProviders!).map((p) => (\n \n {t(\"common:choose\")}\n ,\n ...sortProviders(cekManagementProviders!).map((p) => (\n \n {t(\"unsigned\")}\n ,\n ...sortProviders(signatureProviders!).map((p) => (\n \n {t(\"common:choose\")}\n ,\n ...sortProviders(contentEncryptionProviders!).map((p) => (\n \n {t(\"common:any\")}\n ,\n \n {t(\"common:none\")}\n ,\n ...sortProviders(clientSignatureProviders!).map((p) => (\n \n {t(\"common:any\")}\n ,\n ...sortProviders(cekManagementProviders!).map((p) => (\n \n {t(\"common:any\")}\n ,\n ...sortProviders(contentEncryptionProviders!).map((p) => (\n \n {t(\"common:choose\")}\n ,\n ...sortProviders(signatureProviders!).map((p) => (\n \n {t(`requestObject.${p}`)}\n \n ));\n\n return (\n \n (\n \"attributes.access.token.signed.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setAccessTokenOpen(false);\n }}\n selections={field.value}\n >\n {keyOptions}\n \n )}\n />\n \n (\n \"attributes.id.token.signed.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setIdTokenOpen(false);\n }}\n selections={field.value}\n >\n {keyOptions}\n \n )}\n />\n \n (\n \"attributes.id.token.encrypted.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setIdTokenKeyManagementOpen(false);\n }}\n selections={field.value}\n >\n {cekManagementOptions}\n \n )}\n />\n \n (\n \"attributes.id.token.encrypted.response.enc\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setIdTokenContentOpen(false);\n }}\n selections={field.value}\n >\n {contentOptions}\n \n )}\n />\n \n (\n \"attributes.user.info.response.signature.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setUserInfoSignedResponseOpen(false);\n }}\n selections={field.value}\n >\n {signatureOptions}\n \n )}\n />\n \n (\n \"attributes.user.info.encrypted.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setUserInfoResponseEncryptionKeyManagementOpen(false);\n }}\n selections={field.value}\n >\n {cekManagementOptions}\n \n )}\n />\n \n (\n \"attributes.user.info.encrypted.response.enc\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setUserInfoResponseEncryptionContentEncryptionOpen(false);\n }}\n selections={field.value}\n >\n {contentOptions}\n \n )}\n />\n \n (\n \"attributes.request.object.signature.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setRequestObjectSignatureOpen(false);\n }}\n selections={field.value}\n >\n {requestObjectOptions}\n \n )}\n />\n \n (\n \"attributes.request.object.encryption.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setRequestObjectEncryptionOpen(false);\n }}\n selections={field.value}\n >\n {requestObjectEncryptionOptions}\n \n )}\n />\n \n (\n \"attributes.request.object.encryption.enc\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setRequestObjectEncodingOpen(false);\n }}\n selections={field.value}\n >\n {requestObjectEncodingOptions}\n \n )}\n />\n \n (\n \"attributes.request.object.required\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setRequestObjectRequiredOpen(false);\n }}\n selections={field.value}\n >\n {requestObjectRequiredOptions}\n \n )}\n />\n \n (\n \"attributes.authorization.signed.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setAuthorizationSignedOpen(false);\n }}\n selections={field.value}\n >\n {authorizationSignedResponseOptions}\n \n )}\n />\n \n (\n \"attributes.authorization.encrypted.response.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setAuthorizationEncryptedOpen(false);\n }}\n selections={field.value}\n >\n {cekManagementOptions}\n \n )}\n />\n \n (\n \"attributes.authorization.encrypted.response.enc\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value);\n setAuthorizationEncryptedResponseOpen(false);\n }}\n selections={field.value}\n >\n {contentOptions}\n \n )}\n />\n \n \n \n \n \n \n );\n};\n","import { ActionGroup, Button } from \"@patternfly/react-core\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { TextControl } from \"ui-shared\";\nimport { ApplicationUrls } from \"./ApplicationUrls\";\n\ntype FineGrainSamlEndpointConfigProps = {\n save: () => void;\n reset: () => void;\n};\n\nexport const FineGrainSamlEndpointConfig = ({\n save,\n reset,\n}: FineGrainSamlEndpointConfigProps) => {\n const { t } = useTranslation(\"clients\");\n return (\n \n \n \n \n \n \n );\n};\n","import { ActionGroup, Button, FormGroup, Switch } from \"@patternfly/react-core\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { HelpItem } from \"ui-shared\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { FormFields } from \"../ClientDetails\";\n\ntype OpenIdConnectCompatibilityModesProps = {\n save: () => void;\n reset: () => void;\n hasConfigureAccess?: boolean;\n};\n\nexport const OpenIdConnectCompatibilityModes = ({\n save,\n reset,\n hasConfigureAccess,\n}: OpenIdConnectCompatibilityModesProps) => {\n const { t } = useTranslation(\"clients\");\n const { control } = useFormContext();\n return (\n \n (\n \"attributes.exclude.session.state.from.auth.response\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"excludeSessionStateFromAuthenticationResponse\")}\n />\n )}\n />\n \n (\n \"attributes.use.refresh.tokens\",\n )}\n defaultValue=\"true\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"useRefreshTokens\")}\n />\n )}\n />\n \n (\n \"attributes.client_credentials.use_refresh_token\",\n )}\n defaultValue=\"false\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"useRefreshTokenForClientCredentialsGrant\")}\n />\n )}\n />\n \n (\n \"attributes.token.response.type.bearer.lower-case\",\n )}\n defaultValue=\"false\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"useLowerCaseBearerType\")}\n />\n )}\n />\n \n \n \n {t(\"common:save\")}\n \n \n {t(\"common:revert\")}\n \n \n \n );\n};\n","import {\n ActionGroup,\n Button,\n FormGroup,\n InputGroup,\n Text,\n Tooltip,\n} from \"@patternfly/react-core\";\nimport { useEffect, useRef } from \"react\";\nimport { useFormContext } from \"react-hook-form\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Link } from \"react-router-dom\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport useFormatDate, { FORMAT_DATE_AND_TIME } from \"../../utils/useFormatDate\";\nimport { AdvancedProps, parseResult } from \"../AdvancedTab\";\nimport { toClient } from \"../routes/Client\";\n\nexport const RevocationPanel = ({\n save,\n client: { id, adminUrl, access },\n}: AdvancedProps) => {\n const revocationFieldName = \"notBefore\";\n const pushRevocationButtonRef = useRef();\n\n const { t } = useTranslation(\"clients\");\n const { realm } = useRealm();\n const { addAlert } = useAlerts();\n const formatDate = useFormatDate();\n\n const { getValues, setValue, register } = useFormContext();\n\n const setNotBefore = (time: number, messageKey: string) => {\n setValue(revocationFieldName, time);\n save({ messageKey });\n };\n\n useEffect(() => {\n register(revocationFieldName);\n }, [register]);\n\n const getNotBeforeValue = () => {\n const date = getValues(revocationFieldName);\n if (date > 0) {\n return formatDate(new Date(date * 1000), FORMAT_DATE_AND_TIME);\n } else {\n return t(\"common:none\");\n }\n };\n\n const push = async () => {\n const result = await adminClient.clients.pushRevocation({\n id: id!,\n });\n parseResult(result, \"notBeforePush\", addAlert, t);\n };\n\n return (\n <>\n \n \n In order to successfully push setup url on\n \n {t(\"settings\")}\n \n tab\n \n \n \n \n {\n setNotBefore(Date.now() / 1000, \"notBeforeSetToNow\");\n }}\n >\n {t(\"setToNow\")}\n \n {\n setNotBefore(0, \"notBeforeNowClear\");\n }}\n >\n {t(\"clear\")}\n \n \n \n \n {!adminUrl && (\n \n {t(\"push\")}\n \n \n \n \n );\n};\n","import { AlertVariant, PageSection, Text } from \"@patternfly/react-core\";\nimport type { TFunction } from \"i18next\";\nimport { useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type ClientRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientRepresentation\";\nimport type GlobalRequestResult from \"@keycloak/keycloak-admin-client/lib/defs/globalRequestResult\";\n\nimport type { AddAlertFunction } from \"../components/alert/Alerts\";\nimport { ScrollForm } from \"../components/scroll-form/ScrollForm\";\nimport { convertAttributeNameToForm, toUpperCase } from \"../util\";\nimport { AdvancedSettings } from \"./advanced/AdvancedSettings\";\nimport { AuthenticationOverrides } from \"./advanced/AuthenticationOverrides\";\nimport { ClusteringPanel } from \"./advanced/ClusteringPanel\";\nimport { FineGrainOpenIdConnect } from \"./advanced/FineGrainOpenIdConnect\";\nimport { FineGrainSamlEndpointConfig } from \"./advanced/FineGrainSamlEndpointConfig\";\nimport { OpenIdConnectCompatibilityModes } from \"./advanced/OpenIdConnectCompatibilityModes\";\nimport { RevocationPanel } from \"./advanced/RevocationPanel\";\nimport type { FormFields, SaveOptions } from \"./ClientDetails\";\n\nexport const parseResult = (\n result: GlobalRequestResult,\n prefixKey: string,\n addAlert: AddAlertFunction,\n t: TFunction,\n) => {\n const successCount = result.successRequests?.length || 0;\n const failedCount = result.failedRequests?.length || 0;\n\n if (successCount === 0 && failedCount === 0) {\n addAlert(t(\"noAdminUrlSet\"), AlertVariant.warning);\n } else if (failedCount > 0) {\n addAlert(\n t(prefixKey + \"Success\", { successNodes: result.successRequests }),\n AlertVariant.success,\n );\n addAlert(\n t(prefixKey + \"Fail\", { failedNodes: result.failedRequests }),\n AlertVariant.danger,\n );\n } else {\n addAlert(\n t(prefixKey + \"Success\", { successNodes: result.successRequests }),\n AlertVariant.success,\n );\n }\n};\n\nexport type AdvancedProps = {\n save: (options?: SaveOptions) => void;\n client: ClientRepresentation;\n};\n\nexport const AdvancedTab = ({ save, client }: AdvancedProps) => {\n const { t } = useTranslation(\"clients\");\n const openIdConnect = \"openid-connect\";\n\n const { setValue } = useFormContext();\n const {\n publicClient,\n attributes,\n protocol,\n authenticationFlowBindingOverrides,\n } = client;\n\n const resetFields = (names: string[]) => {\n for (const name of names) {\n setValue(\n convertAttributeNameToForm(`attributes.${name}`),\n attributes?.[name] || \"\",\n );\n }\n };\n\n return (\n \n \n {t(\"clients-help:fineGrainOpenIdConnectConfiguration\")}\n \n {\n resetFields([\n \"logoUri\",\n \"policyUri\",\n \"tosUri\",\n \"access.token.signed.response.alg\",\n \"id.token.signed.response.alg\",\n \"id.token.encrypted.response.alg\",\n \"id.token.encrypted.response.enc\",\n \"user.info.response.signature.alg\",\n \"user.info.encrypted.response.alg\",\n \"user.info.encrypted.response.enc\",\n \"request.object.signature.alg\",\n \"request.object.encryption.alg\",\n \"request.object.encryption.enc\",\n \"request.object.required\",\n \"request.uris\",\n \"authorization.signed.response.alg\",\n \"authorization.encrypted.response.alg\",\n \"authorization.encrypted.response.enc\",\n ]);\n }}\n />\n \n ),\n },\n {\n title: t(\"openIdConnectCompatibilityModes\"),\n isHidden: protocol !== openIdConnect,\n panel: (\n <>\n \n {t(\"clients-help:openIdConnectCompatibilityModes\")}\n \n save()}\n reset={() =>\n resetFields([\n \"exclude.session.state.from.auth.response\",\n \"use.refresh.tokens\",\n \"client_credentials.use_refresh_token\",\n \"token.response.type.bearer.lower-case\",\n ])\n }\n />\n \n ),\n },\n {\n title: t(\"fineGrainSamlEndpointConfig\"),\n isHidden: protocol === openIdConnect,\n panel: (\n <>\n \n {t(\"clients-help:fineGrainSamlEndpointConfig\")}\n \n save()}\n reset={() =>\n resetFields([\n \"logoUri\",\n \"policyUri\",\n \"tosUri\",\n \"saml_assertion_consumer_url_post\",\n \"saml_assertion_consumer_url_redirect\",\n \"saml_single_logout_service_url_post\",\n \"saml_single_logout_service_url_redirect\",\n \"saml_single_logout_service_url_artifact\",\n \"saml_artifact_binding_url\",\n \"saml_artifact_resolution_service_url\",\n ])\n }\n />\n \n ),\n },\n {\n title: t(\"advancedSettings\"),\n panel: (\n <>\n \n {t(\n \"clients-help:advancedSettings\" +\n toUpperCase(protocol || \"\"),\n )}\n \n save()}\n reset={() => {\n resetFields([\n \"saml.assertion.lifespan\",\n \"access.token.lifespan\",\n \"tls.client.certificate.bound.access.tokens\",\n \"pkce.code.challenge.method\",\n ]);\n }}\n />\n \n ),\n },\n {\n title: t(\"authenticationOverrides\"),\n panel: (\n <>\n \n {t(\"clients-help:authenticationOverrides\")}\n \n save()}\n reset={() => {\n setValue(\n \"authenticationFlowBindingOverrides.browser\",\n authenticationFlowBindingOverrides?.browser,\n );\n setValue(\n \"authenticationFlowBindingOverrides.direct_grant\",\n authenticationFlowBindingOverrides?.direct_grant,\n );\n }}\n />\n \n ),\n },\n ]}\n borders\n />\n \n );\n};\n","import type ClientRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientRepresentation\";\nimport type UserSessionRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/userSessionRepresentation\";\nimport { PageSection } from \"@patternfly/react-core\";\nimport { useTranslation } from \"react-i18next\";\nimport { adminClient } from \"../admin-client\";\nimport type { LoaderFunction } from \"../components/table-toolbar/KeycloakDataTable\";\nimport SessionsTable from \"../sessions/SessionsTable\";\n\ntype ClientSessionsProps = {\n client: ClientRepresentation;\n};\n\nexport const ClientSessions = ({ client }: ClientSessionsProps) => {\n const { t } = useTranslation(\"sessions\");\n\n const loader: LoaderFunction = async (\n first,\n max,\n ) => {\n const mapSessionsToType =\n (type: string) => (sessions: UserSessionRepresentation[]) =>\n sessions.map((session) => ({\n type,\n ...session,\n }));\n\n const allSessions = await Promise.all([\n adminClient.clients\n .listSessions({ id: client.id!, first, max })\n .then(mapSessionsToType(t(\"sessions:sessionsType.regularSSO\"))),\n adminClient.clients\n .listOfflineSessions({\n id: client.id!,\n first,\n max,\n })\n .then(mapSessionsToType(t(\"sessions:sessionsType.offline\"))),\n ]);\n\n return allSessions.flat();\n };\n\n return (\n \n \n );\n};\n","import {\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n Switch,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { Controller, Path, PathValue, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { HelpItem } from \"ui-shared\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { FormFields } from \"../ClientDetails\";\n\ntype ToggleProps = {\n name: PathValue>;\n label: string;\n};\nexport const Toggle = ({ name, label }: ToggleProps) => {\n const { t } = useTranslation(\"clients\");\n const { control } = useFormContext();\n\n return (\n (\n field.onChange(value.toString())}\n aria-label={t(label)}\n />\n )}\n />\n \n );\n};\n\nexport const SamlConfig = () => {\n const { t } = useTranslation(\"clients\");\n const { control } = useFormContext();\n\n const [nameFormatOpen, setNameFormatOpen] = useState(false);\n return (\n \n (\n {\n field.onChange(value.toString());\n setNameFormatOpen(false);\n }}\n selections={field.value}\n variant={SelectVariant.single}\n aria-label={t(\"nameIdFormat\")}\n isOpen={nameFormatOpen}\n >\n {[\"username\", \"email\", \"transient\", \"persistent\"].map((name) => (\n ();\n\n const signDocs = watch(\n convertAttributeNameToForm(\"attributes.saml.server.signature\"),\n );\n const signAssertion = watch(\n convertAttributeNameToForm(\n \"attributes.saml.assertion.signature\",\n ),\n );\n\n return (\n \n (\n \"attributes.saml.signature.algorithm\",\n )}\n defaultValue={SIGNATURE_ALGORITHMS[0]}\n control={control}\n render={({ field }) => (\n {\n field.onChange(value.toString());\n setAlgOpen(false);\n }}\n selections={field.value}\n variant={SelectVariant.single}\n aria-label={t(\"signatureAlgorithm\")}\n isOpen={algOpen}\n >\n {SIGNATURE_ALGORITHMS.map((algorithm) => (\n (\n \"attributes.saml.server.signature.keyinfo.xmlSigKeyInfoKeyNameTransformer\",\n )}\n defaultValue={KEYNAME_TRANSFORMER[0]}\n control={control}\n render={({ field }) => (\n {\n field.onChange(value.toString());\n setKeyOpen(false);\n }}\n selections={field.value}\n variant={SelectVariant.single}\n aria-label={t(\"signatureKeyName\")}\n isOpen={keyOpen}\n >\n {KEYNAME_TRANSFORMER.map((key) => (\n (\n {\n field.onChange(value.toString());\n setCanOpen(false);\n }}\n selections={\n CANONICALIZATION.find((can) => can.value === field.value)\n ?.name\n }\n variant={SelectVariant.single}\n aria-label={t(\"canonicalization\")}\n isOpen={canOpen}\n >\n {CANONICALIZATION.map((can) => (\n \n {can.name}\n \n ))}\n \n )}\n />\n \n \n )}\n \n );\n};\n","import { FormGroup } from \"@patternfly/react-core\";\nimport { useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { HelpItem } from \"ui-shared\";\nimport { FixedButtonsGroup } from \"../../components/form/FixedButtonGroup\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport { useAccess } from \"../../context/access/Access\";\nimport { FormFields } from \"../ClientDetails\";\nimport type { ClientSettingsProps } from \"../ClientSettings\";\nimport { LoginSettings } from \"./LoginSettings\";\n\nexport const AccessSettings = ({\n client,\n save,\n reset,\n}: ClientSettingsProps) => {\n const { t } = useTranslation(\"clients\");\n const { register, watch } = useFormContext();\n\n const { hasAccess } = useAccess();\n const isManager = hasAccess(\"manage-clients\") || client.access?.configure;\n\n const protocol = watch(\"protocol\");\n\n return (\n \n {!client.bearerOnly && ();\n\n const [loginThemeOpen, setLoginThemeOpen] = useState(false);\n const loginThemes = useServerInfo().themes![\"login\"];\n const consentRequired = watch(\"consentRequired\");\n const displayOnConsentScreen: string = watch(\n convertAttributeNameToForm(\n \"attributes.display.on.consent.screen\",\n ),\n );\n\n return (\n \n (\n {\n field.onChange(value.toString());\n setLoginThemeOpen(false);\n }}\n selections={field.value || t(\"common:choose\")}\n variant={SelectVariant.single}\n aria-label={t(\"loginTheme\")}\n isOpen={loginThemeOpen}\n >\n {[\n \n {t(\"common:choose\")}\n ,\n ...loginThemes.map((theme) => (\n (\n (\n \"attributes.display.on.consent.screen\",\n )}\n defaultValue={false}\n control={control}\n render={({ field }) => (\n field.onChange(\"\" + value)}\n isDisabled={!consentRequired}\n aria-label={t(\"displayOnClient\")}\n />\n )}\n />\n \n (\n \"attributes.consent.screen.text\",\n ),\n )}\n isDisabled={!(consentRequired && displayOnConsentScreen === \"true\")}\n />\n \n \n );\n};\n","import { FormGroup, Switch, ValidatedOptions } from \"@patternfly/react-core\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { FixedButtonsGroup } from \"../../components/form/FixedButtonGroup\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport { useAccess } from \"../../context/access/Access\";\nimport { beerify, convertAttributeNameToForm } from \"../../util\";\nimport { FormFields } from \"../ClientDetails\";\nimport type { ClientSettingsProps } from \"../ClientSettings\";\n\nconst validateUrl = (uri: string | undefined, error: string) =>\n ((uri?.startsWith(\"https://\") || uri?.startsWith(\"http://\")) &&\n !uri.includes(\"*\")) ||\n uri === \"\" ||\n error;\n\nexport const LogoutPanel = ({\n save,\n reset,\n client: { access },\n}: ClientSettingsProps) => {\n const { t } = useTranslation(\"clients\");\n const {\n register,\n control,\n watch,\n formState: { errors },\n } = useFormContext();\n\n const { hasAccess } = useAccess();\n const isManager = hasAccess(\"manage-clients\") || access?.configure;\n\n const protocol = watch(\"protocol\");\n const frontchannelLogout = watch(\"frontchannelLogout\");\n\n return (\n \n (\n (\n \"attributes.frontchannel.logout.url\",\n ),\n {\n validate: (uri) =>\n validateUrl(uri, t(\"frontchannelUrlInvalid\").toString()),\n },\n )}\n validated={\n errors.attributes?.[beerify(\"frontchannel.logout.url\")]?.message\n ? ValidatedOptions.error\n : ValidatedOptions.default\n }\n />\n \n )}\n {protocol === \"openid-connect\" && (\n <>\n (\n \"attributes.backchannel.logout.url\",\n ),\n {\n validate: (uri) =>\n validateUrl(uri, t(\"backchannelUrlInvalid\").toString()),\n },\n )}\n validated={\n errors.attributes?.[beerify(\"backchannel.logout.url\")]?.message\n ? ValidatedOptions.error\n : ValidatedOptions.default\n }\n />\n \n (\n \"attributes.backchannel.logout.session.required\",\n )}\n defaultValue=\"true\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"backchannelLogoutSessionRequired\")}\n />\n )}\n />\n \n (\n \"attributes.backchannel.logout.revoke.offline.tokens\",\n )}\n defaultValue=\"false\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"backchannelLogoutRevokeOfflineSessions\")}\n />\n )}\n />\n \n \n )}\n ();\n const protocol = watch(\"protocol\");\n\n const { client } = props;\n\n return (\n \n \n {attr.name}\n \n ));\n } else if (scopeValues?.length) {\n return scopeValues.map((scope) => (\n \n {scope.name}\n \n ));\n }\n };\n\n const getMessageBundleKey = (attributeName: string) =>\n camelCase(attributeName).replace(/\\W/g, \"\");\n\n return (\n \n {resources || attributeValues?.length ? (\n (\n toggleValueSelect(rowIndex, open)}\n isOpen={isValueOpenArray[rowIndex]}\n variant={SelectVariant.typeahead}\n typeAheadAriaLabel={t(\"clients:selectOrTypeAKey\")}\n placeholderText={t(\"clients:selectOrTypeAKey\")}\n selections={field.value}\n onSelect={(_, v) => {\n field.onChange(v);\n\n toggleValueSelect(rowIndex, false);\n }}\n >\n {renderSelectOptionType()}\n \n )}\n />\n ) : (\n \n );\n};\n\nexport const KeyBasedAttributeInput = ({\n name,\n selectableValues,\n resources,\n}: AttributeInputProps) => {\n const { t } = useTranslation(\"common\");\n const { control, watch } = useFormContext();\n const { fields, append, remove } = useFieldArray({\n control: control,\n name,\n });\n\n const [isKeyOpenArray, setIsKeyOpenArray] = useState([false]);\n const toggleKeySelect = (rowIndex: number, open: boolean) => {\n const arr = [...isKeyOpenArray];\n arr[rowIndex] = open;\n setIsKeyOpenArray(arr);\n };\n\n useEffect(() => {\n if (!fields.length) {\n append({ key: \"\", value: \"\" }, { shouldFocus: false });\n }\n }, [fields]);\n\n const watchLastValue = watch(`${name}.${fields.length - 1}.value`, \"\");\n\n return (\n \n \n \n {t(\"key\")} \n {t(\"value\")} \n \n \n \n {fields.map((attribute, rowIndex) => (\n \n \n (\n toggleKeySelect(rowIndex, open)}\n isOpen={isKeyOpenArray[rowIndex]}\n variant={SelectVariant.typeahead}\n typeAheadAriaLabel={t(\"clients:selectOrTypeAKey\")}\n placeholderText={t(\"clients:selectOrTypeAKey\")}\n selections={field.value}\n onSelect={(_, v) => {\n field.onChange(v.toString());\n\n toggleKeySelect(rowIndex, false);\n }}\n >\n {selectableValues?.map((attribute) => (\n \n {attribute.name}\n \n ))}\n \n )}\n />\n \n \n remove(rowIndex)}\n aria-label={t(\"common:remove\")}\n >\n \n \n ))}\n \n \n {\n append({ key: \"\", value: \"\" });\n setIsKeyOpenArray([...isKeyOpenArray, false]);\n }}\n icon={ \n \n \n \n );\n};\n","import { useTranslation } from \"react-i18next\";\nimport {\n Button,\n Modal,\n ModalVariant,\n TextContent,\n Text,\n TextVariants,\n} from \"@patternfly/react-core\";\n\nimport type AccessTokenRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/accessTokenRepresentation\";\nimport { KeycloakTextArea } from \"../../components/keycloak-text-area/KeycloakTextArea\";\nimport useToggle from \"../../utils/useToggle\";\nimport { prettyPrintJSON } from \"../../util\";\n\ntype AuthorizationDataModalProps = {\n data: AccessTokenRepresentation;\n};\n\nexport const AuthorizationDataModal = ({\n data,\n}: AuthorizationDataModalProps) => {\n const { t } = useTranslation(\"clients\");\n const [show, toggle] = useToggle();\n\n return (\n <>\n \n {t(\"showAuthData\")}\n \n \n {t(\"authData\")} \n {t(\"authDataDescription\")} \n \n }\n onClose={toggle}\n actions={[\n \n {t(\"common:cancel\")}\n ,\n ]}\n >\n (false);\n const { t } = useTranslation(\"clients\");\n const { realm } = useRealm();\n const { clientId } = useParams();\n\n return (\n \n \n setExpanded((prev) => !prev),\n }}\n />\n \n \n {outerPolicy.policy?.name}\n \n \n \n {t(outerPolicy.status?.toLowerCase() as string)}\n \n {t(`${outerPolicy.policy?.decisionStrategy?.toLowerCase()}`)} \n \n {outerPolicy.status === DecisionEffect.Permit\n ? resource.policies?.[rowIndex]?.scopes?.join(\", \")\n : \"-\"}\n \n \n {outerPolicy.status === DecisionEffect.Deny &&\n resource.policies?.[rowIndex]?.scopes?.length\n ? resource.policies[rowIndex].scopes?.join(\", \")\n : \"-\"}\n \n \n \n \n {expanded && (\n \n \n \n \n {outerPolicy.associatedPolicies?.map((item) => (\n \n \n {item.policy?.name}\n \n\n {t(\"votedToStatus\", {\n status: capitalize(item.status as string),\n })}\n \n ))}\n \n \n \n \n )}\n \n \n \n );\n};\n","import { useState } from \"react\";\nimport {\n ExpandableRowContent,\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\nimport { DescriptionList } from \"@patternfly/react-core/dist/esm/components\";\nimport { useTranslation } from \"react-i18next\";\nimport { AuthorizationEvaluateResourcePolicies } from \"./AuthorizationEvaluateResourcePolicies\";\nimport type EvaluationResultRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/evaluationResultRepresentation\";\nimport type PolicyResultRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyResultRepresentation\";\n\ntype Props = {\n rowIndex: number;\n resource: EvaluationResultRepresentation;\n evaluateResults: any;\n};\n\nexport const AuthorizationEvaluateResource = ({\n rowIndex,\n resource,\n evaluateResults,\n}: Props) => {\n const [expanded, setExpanded] = useState(false);\n const { t } = useTranslation(\"clients\");\n\n return (\n \n \n setExpanded((prev) => !prev),\n }}\n />\n \n {resource.resource?.name}\n \n \n {t(`${resource.status?.toLowerCase()}`)}\n \n \n {resource.allowedScopes?.length\n ? resource.allowedScopes.map((item) => item.name)\n : \"-\"}\n \n \n \n \n \n {expanded && (\n \n \n \n \n {t(\"permission\")} \n {t(\"results\")} \n {t(\"decisionStrategy\")} \n {t(\"grantedScopes\")} \n {t(\"deniedScopes\")} \n \n \n {Object.values(evaluateResults[rowIndex].policies).map(\n (outerPolicy, idx) => (\n \n \n )}\n \n \n \n \n );\n};\n","import {\n Button,\n ButtonVariant,\n Divider,\n Form,\n InputGroup,\n PageSection,\n Select,\n SelectOption,\n SelectVariant,\n TextInput,\n Toolbar,\n ToolbarGroup,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport { SearchIcon } from \"@patternfly/react-icons\";\nimport { TableComposable, Th, Thead, Tr } from \"@patternfly/react-table\";\nimport { KeyboardEvent, useMemo, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type EvaluationResultRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/evaluationResultRepresentation\";\nimport type PolicyEvaluationResponse from \"@keycloak/keycloak-admin-client/lib/defs/policyEvaluationResponse\";\nimport { FixedButtonsGroup } from \"../../../components/form/FixedButtonGroup\";\nimport { ListEmptyState } from \"../../../components/list-empty-state/ListEmptyState\";\nimport useToggle from \"../../../utils/useToggle\";\nimport { AuthorizationDataModal } from \"../AuthorizationDataModal\";\nimport { AuthorizationEvaluateResource } from \"../AuthorizationEvaluateResource\";\n\ntype ResultProps = {\n evaluateResult: PolicyEvaluationResponse;\n refresh: () => void;\n back: () => void;\n};\n\nenum ResultsFilter {\n All = \"ALL\",\n StatusDenied = \"STATUS_DENIED\",\n StatusPermitted = \"STATUS_PERMITTED\",\n}\n\nfunction filterResults(\n results: EvaluationResultRepresentation[],\n filter: ResultsFilter,\n) {\n switch (filter) {\n case ResultsFilter.StatusPermitted:\n return results.filter(({ status }) => status === \"PERMIT\");\n case ResultsFilter.StatusDenied:\n return results.filter(({ status }) => status === \"DENY\");\n default:\n return results;\n }\n}\n\nexport const Results = ({ evaluateResult, refresh, back }: ResultProps) => {\n const { t } = useTranslation(\"clients\");\n\n const [filterDropdownOpen, toggleFilterDropdown] = useToggle();\n\n const [filter, setFilter] = useState(ResultsFilter.All);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [searchInput, setSearchInput] = useState(\"\");\n\n const confirmSearchQuery = () => {\n setSearchQuery(searchInput);\n };\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === \"Enter\") {\n confirmSearchQuery();\n }\n };\n\n const filteredResources = useMemo(\n () =>\n filterResults(evaluateResult.results!, filter).filter(\n ({ resource }) => resource?.name?.includes(searchQuery) ?? false,\n ),\n [evaluateResult.results, filter, searchQuery],\n );\n\n const noEvaluatedData = evaluateResult.results!.length === 0;\n const noFilteredData = filteredResources.length === 0;\n\n return (\n \n \n \n \n \n confirmSearchQuery()}\n >\n \n \n \n {\n setFilter(value as ResultsFilter);\n toggleFilterDropdown();\n refresh();\n }}\n selections={filter}\n >\n \n {t(\"allResults\")}\n \n \n {t(\"resultPermit\")}\n \n \n {t(\"resultDeny\")}\n \n \n \n \n \n {!noFilteredData && (\n \n \n \n {t(\"resource\")} \n {t(\"overallResults\")} \n {t(\"scopes\")} \n \n \n {filteredResources.map((resource, rowIndex) => (\n \n )}\n {(noFilteredData || noEvaluatedData) && (\n <>\n \n );\n};\n","import type ClientRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientRepresentation\";\nimport type EvaluationResultRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/evaluationResultRepresentation\";\nimport type PolicyEvaluationResponse from \"@keycloak/keycloak-admin-client/lib/defs/policyEvaluationResponse\";\nimport type ResourceEvaluation from \"@keycloak/keycloak-admin-client/lib/defs/resourceEvaluation\";\nimport type ResourceRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceRepresentation\";\nimport type RoleRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/roleRepresentation\";\nimport type ScopeRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/scopeRepresentation\";\nimport {\n ActionGroup,\n Button,\n ExpandableSection,\n FormGroup,\n PageSection,\n Panel,\n PanelHeader,\n PanelMainBody,\n Select,\n SelectOption,\n SelectVariant,\n Switch,\n Title,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { Controller, FormProvider, useForm, useWatch } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { ForbiddenSection } from \"../../ForbiddenSection\";\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { ClientSelect } from \"../../components/client/ClientSelect\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport {\n KeyValueType,\n keyValueToArray,\n} from \"../../components/key-value-form/key-value-convert\";\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport { UserSelect } from \"../../components/users/UserSelect\";\nimport { useAccess } from \"../../context/access/Access\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { FormFields } from \"../ClientDetails\";\nimport { defaultContextAttributes } from \"../utils\";\nimport { KeyBasedAttributeInput } from \"./KeyBasedAttributeInput\";\nimport { Results } from \"./evaluate/Results\";\n\ninterface EvaluateFormInputs\n extends Omit {\n alias: string;\n authScopes: string[];\n context: {\n attributes: Record[];\n };\n resources?: Record[];\n client: FormFields;\n user: string[];\n}\n\nexport type AttributeType = {\n key: string;\n name: string;\n custom?: boolean;\n values?: {\n [key: string]: string;\n }[];\n};\n\ntype ClientSettingsProps = {\n client: ClientRepresentation;\n save: () => void;\n};\n\nexport type AttributeForm = Omit<\n EvaluateFormInputs,\n \"context\" | \"resources\"\n> & {\n context: {\n attributes?: KeyValueType[];\n };\n resources?: KeyValueType[];\n};\n\ntype Props = ClientSettingsProps & EvaluationResultRepresentation;\n\nexport const AuthorizationEvaluate = (props: Props) => {\n const { hasAccess } = useAccess();\n\n if (!hasAccess(\"view-users\")) {\n return ({ mode: \"onChange\" });\n const {\n control,\n register,\n reset,\n trigger,\n formState: { isValid, errors },\n } = form;\n const { t } = useTranslation(\"clients\");\n const { addError } = useAlerts();\n const realm = useRealm();\n\n const [scopesDropdownOpen, setScopesDropdownOpen] = useState(false);\n\n const [roleDropdownOpen, setRoleDropdownOpen] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [applyToResourceType, setApplyToResourceType] = useState(false);\n const [resources, setResources] = useState([]);\n const [scopes, setScopes] = useState([]);\n const [evaluateResult, setEvaluateResult] =\n useState();\n\n const [clientRoles, setClientRoles] = useState([]);\n\n useFetch(\n () => adminClient.roles.find(),\n (roles) => {\n setClientRoles(roles);\n },\n [],\n );\n\n useFetch(\n () =>\n Promise.all([\n adminClient.clients.listResources({\n id: client.id!,\n }),\n adminClient.clients.listAllScopes({\n id: client.id!,\n }),\n ]),\n ([resources, scopes]) => {\n setResources(resources);\n setScopes(scopes);\n },\n [],\n );\n\n const evaluate = async () => {\n if (!(await trigger())) {\n return;\n }\n const formValues = form.getValues();\n const keys = keyValueToArray(formValues.resources as KeyValueType[]);\n const resEval: ResourceEvaluation = {\n roleIds: formValues.roleIds ?? [],\n clientId: formValues.client.id!,\n userId: formValues.user![0],\n resources: resources\n .filter((resource) => Object.keys(keys).includes(resource.name!))\n .map((r) => ({\n ...r,\n scopes: r.scopes?.filter((s) =>\n Object.values(keys)\n .flatMap((v) => v)\n .includes(s.name!),\n ),\n })),\n entitlements: false,\n context: {\n attributes: Object.fromEntries(\n formValues.context.attributes\n .filter((item) => item.key || item.value !== \"\")\n .map(({ key, value }) => [key, value]),\n ),\n },\n };\n\n try {\n const evaluation = await adminClient.clients.evaluateResource(\n { id: client.id!, realm: realm.realm },\n resEval,\n );\n\n setEvaluateResult(evaluation);\n } catch (error) {\n addError(\"clients:evaluateError\", error);\n }\n };\n\n const user = useWatch({ control, name: \"user\", defaultValue: [] });\n const roles = useWatch({ control, name: \"roleIds\", defaultValue: [] });\n\n if (evaluateResult) {\n return (\n setEvaluateResult(undefined)}\n />\n );\n }\n\n return (\n \n \n \n \n {t(\"clients:identityInformation\")} \n \n \n \n \n (value || \"\").length > 0 || user.length > 0,\n }}\n render={({ field }) => (\n {\n const option = v.toString();\n if (field.value?.includes(option)) {\n field.onChange(\n field.value.filter(\n (item: string) => item !== option,\n ),\n );\n } else {\n field.onChange([...(field.value || []), option]);\n }\n setRoleDropdownOpen(false);\n }}\n onClear={(event) => {\n event.stopPropagation();\n field.onChange([]);\n }}\n aria-label={t(\"realmRole\")}\n isOpen={roleDropdownOpen}\n >\n {clientRoles.map((role) => (\n \n \n \n \n \n {t(\"clients:identityInformation\")} \n \n \n \n ((item) => ({\n name: item.name!,\n key: item._id!,\n }))}\n resources={resources}\n name=\"resources\"\n />\n \n ) : (\n <>\n (\n {\n const option = v.toString();\n if (field.value.includes(option)) {\n field.onChange(\n field.value.filter(\n (item: string) => item !== option,\n ),\n );\n } else {\n field.onChange([...field.value, option]);\n }\n setScopesDropdownOpen(false);\n }}\n selections={field.value}\n variant={SelectVariant.typeaheadMulti}\n typeAheadAriaLabel={t(\"authScopes\")}\n isOpen={scopesDropdownOpen}\n >\n {scopes.map((scope) => (\n setIsExpanded(!isExpanded)}\n isExpanded={isExpanded}\n >\n \n \n \n \n evaluate()}\n >\n {t(\"evaluate\")}\n \n reset()}\n >\n {t(\"common:revert\")}\n \n \n \n \n );\n};\n","import type ResourceServerRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceServerRepresentation\";\nimport {\n ActionGroup,\n AlertVariant,\n Button,\n FormGroup,\n PageSection,\n} from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { KeycloakTextArea } from \"../../components/keycloak-text-area/KeycloakTextArea\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { prettyPrintJSON } from \"../../util\";\nimport { useParams } from \"../../utils/useParams\";\nimport type { ClientParams } from \"../routes/Client\";\n\nexport const AuthorizationExport = () => {\n const { t } = useTranslation(\"clients\");\n const { clientId } = useParams();\n const { addAlert, addError } = useAlerts();\n\n const [code, setCode] = useState();\n const [authorizationDetails, setAuthorizationDetails] =\n useState();\n\n useFetch(\n () =>\n adminClient.clients.exportResource({\n id: clientId,\n }),\n\n (authDetails) => {\n setCode(JSON.stringify(authDetails, null, 2));\n setAuthorizationDetails(authDetails);\n },\n [],\n );\n\n const exportAuthDetails = () => {\n try {\n saveAs(\n new Blob([prettyPrintJSON(authorizationDetails)], {\n type: \"application/json\",\n }),\n \"test-authz-config.json\",\n );\n addAlert(t(\"exportAuthDetailsSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"exportAuthDetailsError\", error);\n }\n };\n\n if (!code) {\n return \n \n \n exportAuthDetails()}\n >\n {t(\"common:download\")}\n \n {\n try {\n await navigator.clipboard.writeText(code!);\n addAlert(t(\"copied\"), AlertVariant.success);\n } catch (error) {\n addError(t(\"copyError\"), error);\n }\n }}\n >\n {t(\"copy\")}\n \n \n \n \n );\n};\n","import {\n DescriptionListDescription,\n DescriptionListGroup,\n DescriptionListTerm,\n} from \"@patternfly/react-core\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link, Path } from \"react-router-dom\";\n\ntype DetailDescriptionProps = {\n name: string;\n array?: string[] | T[];\n convert?: (obj: T) => string;\n};\n\nexport function DetailDescription(props: DetailDescriptionProps) {\n return = DetailDescriptionProps & {\n link?: (element: T) => Partial;\n};\n\nexport function DetailDescriptionLink({\n name,\n array,\n convert,\n link,\n}: DetailDescriptionLinkProps) {\n const { t } = useTranslation(\"clients\");\n return (\n \n {t(name)} \n \n {array?.map((element) => {\n const value =\n typeof element === \"string\" ? element : convert!(element);\n return link ? (\n \n {value}\n \n ) : (\n \n {value}\n \n );\n })}\n {array?.length === 0 && {t(\"common:none\")}}\n \n \n );\n}\n","import { useNavigate } from \"react-router-dom\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n EmptyState,\n EmptyStateIcon,\n Title,\n EmptyStateBody,\n Button,\n Tooltip,\n} from \"@patternfly/react-core\";\nimport { PlusCircleIcon } from \"@patternfly/react-icons\";\n\nimport { PermissionType, toNewPermission } from \"../routes/NewPermission\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { toUpperCase } from \"../../util\";\n\ntype EmptyButtonProps = {\n permissionType: PermissionType;\n disabled?: boolean;\n clientId: string;\n};\n\nconst EmptyButton = ({\n permissionType,\n disabled = false,\n clientId,\n}: EmptyButtonProps) => {\n const { t } = useTranslation(\"clients\");\n const { realm } = useRealm();\n const navigate = useNavigate();\n return (\n \n !disabled &&\n navigate(toNewPermission({ realm, id: clientId, permissionType }))\n }\n >\n {t(`create${toUpperCase(permissionType)}BasedPermission`)}\n \n );\n};\n\nconst TooltipEmptyButton = ({\n permissionType,\n disabled,\n ...props\n}: EmptyButtonProps) => {\n const { t } = useTranslation(\"clients\");\n return disabled ? (\n \n \n ) : (\n \n \n {t(\"emptyPermissions\")}\n \n {t(\"emptyPermissionInstructions\")} \n
\n \n );\n};\n","import { useTranslation } from \"react-i18next\";\nimport { Label } from \"@patternfly/react-core\";\n\ntype MoreLabelProps = {\n array: unknown[] | undefined;\n};\n\nexport const MoreLabel = ({ array }: MoreLabelProps) => {\n const { t } = useTranslation(\"clients\");\n\n if (!array || array.length <= 1) {\n return null;\n }\n return (\n \n );\n};\n","import type PolicyProviderRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyProviderRepresentation\";\nimport {\n ActionGroup,\n Button,\n Dropdown,\n DropdownToggle,\n Form,\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n} from \"@patternfly/react-core\";\nimport { useEffect } from \"react\";\nimport { Controller, useForm } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport useToggle from \"../../utils/useToggle\";\n\nimport \"./search-dropdown.css\";\n\nexport type SearchForm = {\n name?: string;\n resource?: string;\n scope?: string;\n type?: string;\n uri?: string;\n owner?: string;\n};\n\ntype SearchDropdownProps = {\n types?: PolicyProviderRepresentation[] | PolicyProviderRepresentation[];\n search: SearchForm;\n onSearch: (form: SearchForm) => void;\n isResource?: boolean;\n};\n\nexport const SearchDropdown = ({\n types,\n search,\n onSearch,\n isResource = false,\n}: SearchDropdownProps) => {\n const { t } = useTranslation(\"clients\");\n const {\n register,\n control,\n reset,\n formState: { isDirty },\n handleSubmit,\n } = useForm({ mode: \"onChange\" });\n\n const [open, toggle] = useToggle();\n const [typeOpen, toggleType] = useToggle();\n\n const submit = (form: SearchForm) => {\n toggle();\n onSearch(form);\n };\n\n useEffect(() => reset(search), [search]);\n\n const typeOptions = (value?: string) => [\n \n {t(\"allTypes\")}\n ,\n ...(types || []).map((type) => (\n \n {type.name}\n \n )),\n ];\n\n return (\n \n {t(\"searchForPermission\")}\n \n }\n isOpen={open}\n >\n \n \n \n {isResource && (\n <>\n \n \n \n \n \n \n \n )}\n {!isResource && (\n \n \n )}\n \n \n {!isResource && (\n \n (\n {\n event.stopPropagation();\n field.onChange(value);\n toggleType();\n }}\n selections={field.value || t(\"allTypes\")}\n variant={SelectVariant.single}\n aria-label={t(\"common:type\")}\n isOpen={typeOpen}\n >\n {typeOptions(field.value)}\n \n )}\n />\n \n )}\n \n \n {t(\"common:search\")}\n \n onSearch({})}\n >\n {t(\"common:clear\")}\n \n \n \n \n );\n};\n","import type PolicyProviderRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyProviderRepresentation\";\nimport type PolicyRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyRepresentation\";\nimport {\n Alert,\n AlertVariant,\n ButtonVariant,\n DescriptionList,\n Dropdown,\n DropdownItem,\n DropdownSeparator,\n DropdownToggle,\n PageSection,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport {\n ExpandableRowContent,\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link, useNavigate } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport { PaginatingTableToolbar } from \"../../components/table-toolbar/PaginatingTableToolbar\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport useToggle from \"../../utils/useToggle\";\nimport { toNewPermission } from \"../routes/NewPermission\";\nimport { toPermissionDetails } from \"../routes/PermissionDetails\";\nimport { toPolicyDetails } from \"../routes/PolicyDetails\";\nimport { DetailDescriptionLink } from \"./DetailDescription\";\nimport { EmptyPermissionsState } from \"./EmptyPermissionsState\";\nimport { MoreLabel } from \"./MoreLabel\";\nimport { SearchDropdown, SearchForm } from \"./SearchDropdown\";\n\nimport \"./permissions.css\";\n\ntype PermissionsProps = {\n clientId: string;\n};\n\ntype ExpandablePolicyRepresentation = PolicyRepresentation & {\n associatedPolicies?: PolicyRepresentation[];\n isExpanded: boolean;\n};\n\nconst AssociatedPoliciesRenderer = ({\n row,\n}: {\n row: ExpandablePolicyRepresentation;\n}) => {\n return (\n <>\n {row.associatedPolicies?.[0]?.name}{\" \"}\n ();\n const [selectedPermission, setSelectedPermission] =\n useState();\n const [policyProviders, setPolicyProviders] =\n useState();\n const [disabledCreate, setDisabledCreate] = useState<{\n resources: boolean;\n scopes: boolean;\n }>();\n const [createOpen, toggleCreate] = useToggle();\n const [search, setSearch] = useState({});\n\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n\n const [max, setMax] = useState(10);\n const [first, setFirst] = useState(0);\n\n useFetch(\n async () => {\n const permissions = await adminClient.clients.findPermissions({\n first,\n max: max + 1,\n id: clientId,\n ...search,\n });\n\n return await Promise.all(\n permissions.map(async (permission) => {\n const associatedPolicies =\n await adminClient.clients.getAssociatedPolicies({\n id: clientId,\n permissionId: permission.id!,\n });\n\n return {\n ...permission,\n associatedPolicies,\n isExpanded: false,\n };\n }),\n );\n },\n setPermissions,\n [key, search, first, max],\n );\n\n useFetch(\n async () => {\n const params = {\n first: 0,\n max: 1,\n };\n const [policies, resources, scopes] = await Promise.all([\n adminClient.clients.listPolicyProviders({\n id: clientId,\n }),\n adminClient.clients.listResources({ ...params, id: clientId }),\n adminClient.clients.listAllScopes({ ...params, id: clientId }),\n ]);\n return {\n policies: policies.filter(\n (p) => p.type === \"resource\" || p.type === \"scope\",\n ),\n resources: resources.length !== 1,\n scopes: scopes.length !== 1,\n };\n },\n ({ policies, resources, scopes }) => {\n setPolicyProviders(policies);\n setDisabledCreate({ resources, scopes });\n },\n [],\n );\n\n const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({\n titleKey: \"clients:deletePermission\",\n messageKey: t(\"deletePermissionConfirm\", {\n permission: selectedPermission?.name,\n }),\n continueButtonVariant: ButtonVariant.danger,\n continueButtonLabel: \"clients:confirm\",\n onConfirm: async () => {\n try {\n await adminClient.clients.delPermission({\n id: clientId,\n type: selectedPermission?.type!,\n permissionId: selectedPermission?.id!,\n });\n addAlert(t(\"permissionDeletedSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:permissionDeletedError\", error);\n }\n },\n });\n\n if (!permissions) {\n return \n {\n setFirst(first);\n setMax(max);\n }}\n toolbarItem={\n <>\n \n \n \n \n {t(\"createPermission\")}\n \n }\n isOpen={createOpen}\n dropdownItems={[\n \n navigate(\n toNewPermission({\n realm,\n id: clientId,\n permissionType: \"resource\",\n }),\n )\n }\n >\n {t(\"createResourceBasedPermission\")}\n ,\n \n navigate(\n toNewPermission({\n realm,\n id: clientId,\n permissionType: \"scope\",\n }),\n )\n }\n >\n {t(\"createScopeBasedPermission\")}\n {disabledCreate?.scopes && (\n \n \n }\n >\n {!noData && (\n \n \n \n {t(\"common:name\")} \n {t(\"common:type\")} \n {t(\"associatedPolicy\")} \n {t(\"common:description\")} \n \n \n {permissions.map((permission, rowIndex) => (\n \n \n {\n const rows = permissions.map((p, index) =>\n index === rowIndex\n ? { ...p, isExpanded: !p.isExpanded }\n : p,\n );\n setPermissions(rows);\n },\n }}\n />\n \n \n {permission.name}\n \n \n \n {\n policyProviders?.find((p) => p.type === permission.type)\n ?.name\n }\n \n \n \n {permission.description} \n {\n setSelectedPermission(permission);\n toggleDeleteDialog();\n },\n },\n ],\n }}\n >\n \n \n \n \n {permission.isExpanded && (\n \n p.name!}\n link={(p) =>\n toPolicyDetails({\n id: clientId,\n realm,\n policyId: p.id!,\n policyType: p.type!,\n })\n }\n />\n \n )}\n \n \n \n \n ))}\n \n )}\n \n )}\n {noData && !searching && (\n \n );\n};\n","import { useTranslation } from \"react-i18next\";\nimport {\n Modal,\n ModalVariant,\n TextContent,\n Text,\n TextVariants,\n} from \"@patternfly/react-core\";\nimport {\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\n\nimport type PolicyProviderRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyProviderRepresentation\";\nimport { isValidComponentType } from \"./policy/PolicyDetails\";\nimport { useMemo } from \"react\";\nimport useLocaleSort, { mapByKey } from \"../../utils/useLocaleSort\";\n\ntype NewPolicyDialogProps = {\n policyProviders?: PolicyProviderRepresentation[];\n toggleDialog: () => void;\n onSelect: (provider: PolicyProviderRepresentation) => void;\n};\n\nexport const NewPolicyDialog = ({\n policyProviders,\n onSelect,\n toggleDialog,\n}: NewPolicyDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const localeSort = useLocaleSort();\n\n const sortedPolicies = useMemo(\n () =>\n policyProviders ? localeSort(policyProviders, mapByKey(\"name\")) : [],\n [policyProviders],\n );\n\n return (\n \n {t(\"chooseAPolicyType\")} \n {t(\"chooseAPolicyTypeInstructions\")} \n \n }\n isOpen\n onClose={toggleDialog}\n >\n \n \n \n {t(\"common:name\")} \n {t(\"common:description\")} \n \n \n \n {sortedPolicies.map((provider) => (\n onSelect(provider)}\n isHoverable\n >\n {provider.name} \n \n {isValidComponentType(provider.type!) &&\n t(`policyProvider.${provider.type}`)}\n \n \n ))}\n \n \n \n );\n};\n","import type PolicyProviderRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyProviderRepresentation\";\nimport type PolicyRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyRepresentation\";\nimport {\n Alert,\n AlertVariant,\n Button,\n DescriptionList,\n PageSection,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport {\n ExpandableRowContent,\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link, useNavigate } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport { PaginatingTableToolbar } from \"../../components/table-toolbar/PaginatingTableToolbar\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { toUpperCase } from \"../../util\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport useToggle from \"../../utils/useToggle\";\nimport { toCreatePolicy } from \"../routes/NewPolicy\";\nimport { toPermissionDetails } from \"../routes/PermissionDetails\";\nimport { toPolicyDetails } from \"../routes/PolicyDetails\";\nimport { DetailDescriptionLink } from \"./DetailDescription\";\nimport { MoreLabel } from \"./MoreLabel\";\nimport { NewPolicyDialog } from \"./NewPolicyDialog\";\nimport { SearchDropdown, SearchForm } from \"./SearchDropdown\";\n\ntype PoliciesProps = {\n clientId: string;\n};\n\ntype ExpandablePolicyRepresentation = PolicyRepresentation & {\n dependentPolicies?: PolicyRepresentation[];\n isExpanded: boolean;\n};\n\nconst DependentPoliciesRenderer = ({\n row,\n}: {\n row: ExpandablePolicyRepresentation;\n}) => {\n return (\n <>\n {row.dependentPolicies?.[0]?.name}{\" \"}\n ();\n const [selectedPolicy, setSelectedPolicy] =\n useState();\n const [policyProviders, setPolicyProviders] =\n useState();\n\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n\n const [max, setMax] = useState(10);\n const [first, setFirst] = useState(0);\n const [search, setSearch] = useState({});\n const [newDialog, toggleDialog] = useToggle();\n\n useFetch(\n async () => {\n const policies = await adminClient.clients.listPolicies({\n first,\n max: max + 1,\n id: clientId,\n permission: \"false\",\n ...search,\n });\n\n return await Promise.all([\n adminClient.clients.listPolicyProviders({ id: clientId }),\n ...(policies || []).map(async (policy) => {\n const dependentPolicies =\n await adminClient.clients.listDependentPolicies({\n id: clientId,\n policyId: policy.id!,\n });\n\n return {\n ...policy,\n dependentPolicies,\n isExpanded: false,\n };\n }),\n ]);\n },\n ([providers, ...policies]) => {\n setPolicyProviders(\n providers.filter((p) => p.type !== \"resource\" && p.type !== \"scope\"),\n );\n setPolicies(policies);\n },\n [key, search, first, max],\n );\n\n const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({\n titleKey: \"clients:deletePolicy\",\n children: (\n <>\n {t(\"deletePolicyConfirm\")}\n {selectedPolicy?.dependentPolicies &&\n selectedPolicy.dependentPolicies.length > 0 && (\n \n \n {selectedPolicy.dependentPolicies.map((policy) => (\n \n {policy.name}\n \n ))}\n
\n \n )}\n \n ),\n continueButtonLabel: \"clients:confirm\",\n onConfirm: async () => {\n try {\n await adminClient.clients.delPolicy({\n id: clientId,\n policyId: selectedPolicy?.id!,\n });\n addAlert(t(\"policyDeletedSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:policyDeletedError\", error);\n }\n },\n });\n\n if (!policies) {\n return \n \n navigate(\n toCreatePolicy({ id: clientId, realm, policyType: p.type! }),\n )\n }\n toggleDialog={toggleDialog}\n />\n )}\n\n {\n setFirst(first);\n setMax(max);\n }}\n toolbarItem={\n <>\n \n \n \n \n \n \n }\n >\n {!noData && (\n \n \n \n {t(\"common:name\")} \n {t(\"common:type\")} \n {t(\"dependentPermission\")} \n {t(\"common:description\")} \n \n \n {policies.map((policy, rowIndex) => (\n \n \n {\n const rows = policies.map((policy, index) =>\n index === rowIndex\n ? { ...policy, isExpanded: !policy.isExpanded }\n : policy,\n );\n setPolicies(rows);\n },\n }}\n />\n \n \n {policy.name}\n \n \n {toUpperCase(policy.type!)} \n \n \n {policy.description} \n {\n setSelectedPolicy(policy);\n toggleDeleteDialog();\n },\n },\n ],\n }}\n />\n \n \n \n \n {policy.isExpanded && (\n \n p.name!}\n link={(permission) =>\n toPermissionDetails({\n realm,\n id: clientId,\n permissionId: permission.id!,\n permissionType: permission.type!,\n })\n }\n />\n \n )}\n \n \n \n \n ))}\n \n )}\n \n \n )}\n {noData && searching && (\n p.type !== \"aggregate\",\n )}\n onSelect={(p) =>\n navigate(\n toCreatePolicy({ id: clientId, realm, policyType: p.type! }),\n )\n }\n toggleDialog={toggleDialog}\n />\n )}\n \n );\n};\n","import type ResourceServerRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceServerRepresentation\";\nimport { DescriptionList } from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { adminClient } from \"../../admin-client\";\n\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { toPermissionDetails } from \"../routes/PermissionDetails\";\nimport { toScopeDetails } from \"../routes/Scope\";\nimport { DetailDescription, DetailDescriptionLink } from \"./DetailDescription\";\n\nimport \"./detail-cell.css\";\n\ntype Scope = { id: string; name: string }[];\n\ntype DetailCellProps = {\n id: string;\n clientId: string;\n uris?: string[];\n};\n\nexport const DetailCell = ({ id, clientId, uris }: DetailCellProps) => {\n const { realm } = useRealm();\n const [scope, setScope] = useState();\n const [permissions, setPermissions] =\n useState();\n\n useFetch(\n () =>\n Promise.all([\n adminClient.clients.listScopesByResource({\n id: clientId,\n resourceName: id,\n }),\n adminClient.clients.listPermissionsByResource({\n id: clientId,\n resourceId: id,\n }),\n ]),\n ([scopes, permissions]) => {\n setScope(scopes);\n setPermissions(permissions);\n },\n [],\n );\n\n if (!permissions || !scope) {\n return \n s.name}\n link={(scope) =>\n toScopeDetails({ id: clientId, realm, scopeId: scope.id! })\n }\n />\n p.name!}\n link={(permission) =>\n toPermissionDetails({\n id: clientId,\n realm,\n permissionId: permission.id!,\n permissionType: \"resource\",\n })\n }\n />\n \n );\n};\n","import type ResourceRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceRepresentation\";\nimport type ResourceServerRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceServerRepresentation\";\nimport {\n Alert,\n AlertVariant,\n Button,\n PageSection,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport {\n ExpandableRowContent,\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link, useNavigate } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport { PaginatingTableToolbar } from \"../../components/table-toolbar/PaginatingTableToolbar\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { toNewPermission } from \"../routes/NewPermission\";\nimport { toCreateResource } from \"../routes/NewResource\";\nimport { toResourceDetails } from \"../routes/Resource\";\nimport { DetailCell } from \"./DetailCell\";\nimport { MoreLabel } from \"./MoreLabel\";\nimport { SearchDropdown, SearchForm } from \"./SearchDropdown\";\n\ntype ResourcesProps = {\n clientId: string;\n};\n\ntype ExpandableResourceRepresentation = ResourceRepresentation & {\n isExpanded: boolean;\n};\n\nconst UriRenderer = ({ row }: { row: ResourceRepresentation }) => (\n <>\n {row.uris?.[0]} ();\n const [selectedResource, setSelectedResource] =\n useState();\n const [permissions, setPermission] =\n useState();\n\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n\n const [max, setMax] = useState(10);\n const [first, setFirst] = useState(0);\n const [search, setSearch] = useState({});\n\n useFetch(\n () => {\n const params = {\n first,\n max: max + 1,\n deep: false,\n ...search,\n };\n return adminClient.clients.listResources({\n ...params,\n id: clientId,\n });\n },\n (resources) =>\n setResources(\n resources.map((resource) => ({ ...resource, isExpanded: false })),\n ),\n [key, search, first, max],\n );\n\n const fetchPermissions = async (id: string) => {\n return adminClient.clients.listPermissionsByResource({\n id: clientId,\n resourceId: id,\n });\n };\n\n const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({\n titleKey: \"clients:deleteResource\",\n children: (\n <>\n {t(\"deleteResourceConfirm\")}\n {permissions?.length && (\n \n \n {permissions.map((permission) => (\n \n {permission.name}\n \n ))}\n
\n \n )}\n \n ),\n continueButtonLabel: \"clients:confirm\",\n onConfirm: async () => {\n try {\n await adminClient.clients.delResource({\n id: clientId,\n resourceId: selectedResource?._id!,\n });\n addAlert(t(\"resourceDeletedSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:resourceDeletedError\", error);\n }\n },\n });\n\n if (!resources) {\n return \n {\n setFirst(first);\n setMax(max);\n }}\n toolbarItem={\n <>\n \n \n\n \n (\n \n \n }\n >\n {!noData && (\n \n \n \n {t(\"common:name\")} \n {t(\"displayName\")} \n {t(\"common:type\")} \n {t(\"owner\")} \n {t(\"uris\")} \n \n \n {resources.map((resource, rowIndex) => (\n \n \n {\n const rows = resources.map((resource, index) =>\n index === rowIndex\n ? {\n ...resource,\n isExpanded: !resource.isExpanded,\n }\n : resource,\n );\n setResources(rows);\n },\n }}\n />\n \n \n {resource.name}\n \n \n {resource.displayName} \n {resource.type} \n {resource.owner?.name} \n \n \n \n (\n \n {\n setSelectedResource(resource);\n setPermission(\n await fetchPermissions(resource._id!),\n );\n toggleDeleteDialog();\n },\n },\n ],\n }}\n />\n \n \n \n \n {resource.isExpanded && (\n \n \n \n \n ))}\n \n )}\n \n )}\n {noData && searching && (\n \n navigate(toCreateResource({ realm, id: clientId }))\n }\n />\n )}\n \n );\n};\n","import type PolicyRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/policyRepresentation\";\nimport type ScopeRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/scopeRepresentation\";\nimport {\n Button,\n DescriptionList,\n PageSection,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport {\n ExpandableRowContent,\n TableComposable,\n Tbody,\n Td,\n Th,\n Thead,\n Tr,\n} from \"@patternfly/react-table\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link, useNavigate } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport { PaginatingTableToolbar } from \"../../components/table-toolbar/PaginatingTableToolbar\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport useToggle from \"../../utils/useToggle\";\nimport { toNewPermission } from \"../routes/NewPermission\";\nimport { toNewScope } from \"../routes/NewScope\";\nimport { toPermissionDetails } from \"../routes/PermissionDetails\";\nimport { toResourceDetails } from \"../routes/Resource\";\nimport { toScopeDetails } from \"../routes/Scope\";\nimport { DeleteScopeDialog } from \"./DeleteScopeDialog\";\nimport { DetailDescriptionLink } from \"./DetailDescription\";\n\ntype ScopesProps = {\n clientId: string;\n};\n\nexport type PermissionScopeRepresentation = ScopeRepresentation & {\n permissions?: PolicyRepresentation[];\n isLoaded: boolean;\n};\n\ntype ExpandableRow = {\n id: string;\n isExpanded: boolean;\n};\n\nexport const AuthorizationScopes = ({ clientId }: ScopesProps) => {\n const { t } = useTranslation(\"clients\");\n const navigate = useNavigate();\n const { realm } = useRealm();\n\n const [deleteDialog, toggleDeleteDialog] = useToggle();\n const [scopes, setScopes] = useState();\n const [selectedScope, setSelectedScope] =\n useState();\n const [collapsed, setCollapsed] = useState([]);\n\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n\n const [max, setMax] = useState(10);\n const [first, setFirst] = useState(0);\n const [search, setSearch] = useState(\"\");\n\n useFetch(\n () => {\n const params = {\n first,\n max: max + 1,\n deep: false,\n name: search,\n };\n return adminClient.clients.listAllScopes({\n ...params,\n id: clientId,\n });\n },\n (scopes) => {\n setScopes(scopes.map((s) => ({ ...s, isLoaded: false })));\n setCollapsed(scopes.map((s) => ({ id: s.id!, isExpanded: false })));\n },\n [key, search, first, max],\n );\n\n const getScope = (id: string) => scopes?.find((scope) => scope.id === id)!;\n const isExpanded = (id: string | undefined) =>\n collapsed.find((c) => c.id === id)?.isExpanded || false;\n\n useFetch(\n () => {\n const newlyOpened = collapsed\n .filter((row) => row.isExpanded)\n .map(({ id }) => getScope(id))\n .filter((s) => !s.isLoaded);\n\n return Promise.all(\n newlyOpened.map(async (scope) => {\n const [resources, permissions] = await Promise.all([\n adminClient.clients.listAllResourcesByScope({\n id: clientId,\n scopeId: scope.id!,\n }),\n adminClient.clients.listAllPermissionsByScope({\n id: clientId,\n scopeId: scope.id!,\n }),\n ]);\n\n return {\n ...scope,\n resources,\n permissions,\n isLoaded: true,\n };\n }),\n );\n },\n (resourcesScopes) => {\n let result = [...(scopes || [])];\n resourcesScopes.forEach((resourceScope) => {\n const index = scopes?.findIndex(\n (scope) => resourceScope.id === scope.id,\n )!;\n result = [\n ...result.slice(0, index),\n resourceScope,\n ...result.slice(index + 1),\n ];\n });\n\n setScopes(result);\n },\n [collapsed],\n );\n\n if (!scopes) {\n return \n {\n setFirst(first);\n setMax(max);\n }}\n inputGroupName=\"search\"\n inputGroupPlaceholder={t(\"searchByName\")}\n inputGroupOnEnter={setSearch}\n toolbarItem={\n \n (\n \n )}\n >\n {t(\"createAuthorizationScope\")}\n \n \n }\n >\n {!noData && (\n \n \n \n {t(\"common:name\")} \n {t(\"displayName\")} \n \n \n {scopes.map((scope, rowIndex) => (\n \n \n {\n setCollapsed([\n ...collapsed.slice(0, index),\n { id: scope.id!, isExpanded },\n ...collapsed.slice(index + 1),\n ]);\n },\n }}\n />\n \n \n {scope.name}\n \n \n {scope.displayName} \n \n (\n \n {\n setSelectedScope(scope);\n toggleDeleteDialog();\n },\n },\n ],\n }}\n />\n \n \n \n \n {isExpanded(scope.id) && scope.isLoaded ? (\n \n r.name!}\n link={(r) =>\n toResourceDetails({\n id: clientId,\n realm,\n resourceId: r._id!,\n })\n }\n />\n p.name!}\n link={(p) =>\n toPermissionDetails({\n id: clientId,\n realm,\n permissionId: p.id!,\n permissionType: p.type!,\n })\n }\n />\n \n ) : (\n \n \n \n \n ))}\n \n )}\n \n )}\n {noData && !searching && (\n navigate(toNewScope({ id: clientId, realm }))}\n primaryActionText={t(\"createAuthorizationScope\")}\n />\n )}\n {noData && searching && (\n \n );\n};\n","import { Fragment, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n Alert,\n Button,\n ButtonVariant,\n Divider,\n Form,\n FormGroup,\n Modal,\n Radio,\n Switch,\n} from \"@patternfly/react-core\";\n\nimport type ResourceServerRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/resourceServerRepresentation\";\nimport { JsonFileUpload } from \"../../components/json-file-upload/JsonFileUpload\";\nimport { HelpItem } from \"ui-shared\";\n\ntype ImportDialogProps = {\n onConfirm: (value: ResourceServerRepresentation) => void;\n closeDialog: () => void;\n};\n\nexport const ImportDialog = ({ onConfirm, closeDialog }: ImportDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const [imported, setImported] = useState({});\n return (\n {\n onConfirm(imported);\n closeDialog();\n }}\n data-testid=\"confirm\"\n >\n {t(\"confirm\")}\n ,\n {\n closeDialog();\n }}\n >\n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n {Object.keys(imported).length !== 0 && (\n <>\n {t(\"importResources\")}
\n \n \n {Object.entries(imported)\n .filter(([, value]) => Array.isArray(value))\n .map(([key, value]) => (\n \n \n \n {value.length} {t(key)}\n \n
\n \n ))}\n \n ();\n const [importDialog, toggleImportDialog] = useToggle();\n\n const form = useForm({});\n const { control, reset, handleSubmit } = form;\n\n const { addAlert, addError } = useAlerts();\n\n useFetch(\n () => adminClient.clients.getResourceServer({ id: clientId }),\n (resource) => {\n setResource(resource);\n reset(resource);\n },\n [],\n );\n\n const importResource = async (value: ResourceServerRepresentation) => {\n try {\n await adminClient.clients.importResource({ id: clientId }, value);\n addAlert(t(\"importResourceSuccess\"), AlertVariant.success);\n reset({ ...value });\n } catch (error) {\n addError(\"clients:importResourceError\", error);\n }\n };\n\n const onSubmit = async (resource: ResourceServerRepresentation) => {\n try {\n await adminClient.clients.updateResourceServer(\n { id: clientId },\n resource,\n );\n addAlert(t(\"updateResourceSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:resourceSaveError\", error);\n }\n };\n\n if (!resource) {\n return \n {importDialog && (\n \n (\n <>\n {POLICY_ENFORCEMENT_MODES.map((mode) => (\n field.onChange(mode)}\n label={t(`policyEnforcementModes.${mode}`)}\n className=\"pf-u-mb-md\"\n />\n ))}\n \n )}\n />\n \n \n \n (\n reset(resource)}\n isActive\n isSubmit\n />\n \n \n );\n};\n","import { useEffect, useMemo, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n ClipboardCopyButton,\n ClipboardCopyButtonProps,\n} from \"@patternfly/react-core\";\n\nimport useSetTimeout from \"../../utils/useSetTimeout\";\n\nenum CopyState {\n Ready,\n Copied,\n Error,\n}\n\ntype CopyToClipboardButtonProps = Pick & {\n id: string;\n label: string;\n text: string;\n};\n\nexport const CopyToClipboardButton = ({\n id,\n label,\n text,\n variant = \"plain\",\n}: CopyToClipboardButtonProps) => {\n const { t } = useTranslation(\"clients\");\n const setTimeout = useSetTimeout();\n\n const [copy, setCopy] = useState(CopyState.Ready);\n\n const copyMessage = useMemo(() => {\n switch (copy) {\n case CopyState.Ready:\n return t(\"copyToClipboard\");\n case CopyState.Copied:\n return t(\"copySuccess\");\n case CopyState.Error:\n return t(\"clipboardCopyError\");\n }\n }, [copy]);\n\n useEffect(() => {\n if (copy !== CopyState.Ready) {\n return setTimeout(() => setCopy(CopyState.Ready), 1000);\n }\n }, [copy]);\n\n const copyToClipboard = async (text: string) => {\n try {\n await navigator.clipboard.writeText(text);\n setCopy(CopyState.Copied);\n } catch (error) {\n setCopy(CopyState.Error);\n }\n };\n\n return (\n copyToClipboard(text)}\n exitDelay={600}\n variant={variant}\n >\n {copyMessage}\n \n );\n};\n","import type ClientRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientRepresentation\";\nimport {\n Alert,\n Button,\n FormGroup,\n InputGroup,\n Split,\n SplitItem,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { PasswordInput } from \"../../components/password-input/PasswordInput\";\nimport { useAccess } from \"../../context/access/Access\";\nimport useFormatDate from \"../../utils/useFormatDate\";\nimport { CopyToClipboardButton } from \"../scopes/CopyToClipboardButton\";\n\nexport type ClientSecretProps = {\n client: ClientRepresentation;\n secret: string;\n toggle: () => void;\n};\n\ntype SecretInputProps = ClientSecretProps & {\n id: string;\n buttonLabel: string;\n};\n\nconst SecretInput = ({\n id,\n buttonLabel,\n client,\n secret,\n toggle,\n}: SecretInputProps) => {\n const { t } = useTranslation(\"clients\");\n const form = useFormContext();\n const { hasAccess } = useAccess();\n const isManager = hasAccess(\"manage-clients\") || client.access?.configure;\n\n return (\n \n \n \n \n \n \n \n {t(buttonLabel)}\n \n \n \n );\n};\n\nconst ExpireDateFormatter = ({ time }: { time: number }) => {\n const { t } = useTranslation(\"clients\");\n const formatDate = useFormatDate();\n const unixTimeToString = (time: number) =>\n time\n ? t(\"secretExpiresOn\", {\n time: formatDate(new Date(time * 1000), {\n dateStyle: \"full\",\n timeStyle: \"long\",\n }),\n })\n : undefined;\n\n return {unixTimeToString(time)};\n};\n\nexport const ClientSecret = ({ client, secret, toggle }: ClientSecretProps) => {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n\n const [secretRotated, setSecretRotated] = useState(\n client.attributes?.[\"client.secret.rotated\"],\n );\n const secretExpirationTime: number =\n client.attributes?.[\"client.secret.expiration.time\"];\n const secretRotatedExpirationTime: number =\n client.attributes?.[\"client.secret.rotated.expiration.time\"];\n\n const expired = (time: number) => new Date().getTime() >= time * 1000;\n\n const [toggleInvalidateConfirm, InvalidateConfirm] = useConfirmDialog({\n titleKey: \"clients:invalidateRotatedSecret\",\n messageKey: \"clients:invalidateRotatedSecretExplain\",\n continueButtonLabel: \"common:confirm\",\n onConfirm: async () => {\n try {\n await adminClient.clients.invalidateSecret({\n id: client.id!,\n });\n setSecretRotated(undefined);\n addAlert(t(\"invalidateRotatedSuccess\"));\n } catch (error) {\n addError(\"clients:invalidateRotatedError\", error);\n }\n },\n });\n\n return (\n <>\n \n \n \n )}\n \n );\n};\n","import { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport {\n FormGroup,\n Select,\n SelectOption,\n SelectVariant,\n} from \"@patternfly/react-core\";\n\nimport { useServerInfo } from \"../../context/server-info/ServerInfoProvider\";\nimport { HelpItem } from \"ui-shared\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { FormFields } from \"../ClientDetails\";\n\ntype SignedJWTProps = {\n clientAuthenticatorType: string;\n};\n\nexport const SignedJWT = ({ clientAuthenticatorType }: SignedJWTProps) => {\n const { control } = useFormContext();\n const { cryptoInfo } = useServerInfo();\n const providers =\n clientAuthenticatorType === \"client-jwt\"\n ? cryptoInfo?.clientSignatureAsymmetricAlgorithms ?? []\n : cryptoInfo?.clientSignatureSymmetricAlgorithms ?? [];\n\n const { t } = useTranslation(\"clients\");\n\n const [open, isOpen] = useState(false);\n return (\n (\n \"attributes.token.endpoint.auth.signing.alg\",\n )}\n defaultValue=\"\"\n control={control}\n render={({ field }) => (\n {\n field.onChange(value.toString());\n isOpen(false);\n }}\n selections={field.value || t(\"anyAlgorithm\")}\n variant={SelectVariant.single}\n aria-label={t(\"signatureAlgorithm\")}\n isOpen={open}\n >\n \n {t(\"anyAlgorithm\")}\n \n <>\n {providers.map((option) => (\n ();\n return (\n <>\n (\n \"attributes.x509.allow.regex.pattern.comparison\",\n )}\n defaultValue=\"false\"\n control={control}\n render={({ field }) => (\n field.onChange(value.toString())}\n aria-label={t(\"allowRegexComparison\")}\n />\n )}\n />\n \n ();\n\n const clientAuthenticatorType = useWatch({\n control: control,\n name: \"clientAuthenticatorType\",\n defaultValue: \"\",\n });\n\n const [secret, setSecret] = useState(\"\");\n const [accessToken, setAccessToken] = useState(\"\");\n const [open, isOpen] = useState(false);\n\n useFetch(\n () =>\n Promise.all([\n adminClient.authenticationManagement.getClientAuthenticatorProviders(),\n adminClient.clients.getClientSecret({\n id: clientId,\n }),\n ]),\n ([providers, secret]) => {\n setProviders(providers);\n setSecret(secret.value!);\n },\n [],\n );\n\n async function regenerate(\n call: (clientId: string) => Promise,\n message: string,\n ): Promise {\n try {\n const data = await call(clientId);\n addAlert(t(`${message}Success`), AlertVariant.success);\n return data;\n } catch (error) {\n addError(`clients:${message}Error`, error);\n }\n }\n\n const regenerateClientSecret = async () => {\n const secret = await regenerate(\n (clientId) =>\n adminClient.clients.generateNewClientSecret({ id: clientId }),\n \"clientSecret\",\n );\n setSecret(secret?.value || \"\");\n refresh();\n };\n\n const [toggleClientSecretConfirm, ClientSecretConfirm] = useConfirmDialog({\n titleKey: \"clients:confirmClientSecretTitle\",\n messageKey: \"clients:confirmClientSecretBody\",\n continueButtonLabel: \"common:yes\",\n cancelButtonLabel: \"common:no\",\n onConfirm: regenerateClientSecret,\n });\n\n const regenerateAccessToken = async () => {\n const accessToken = await regenerate(\n (clientId) =>\n adminClient.clients.generateRegistrationAccessToken({ id: clientId }),\n \"accessToken\",\n );\n setAccessToken(accessToken?.registrationAccessToken || \"\");\n };\n\n const [toggleAccessTokenConfirm, AccessTokenConfirm] = useConfirmDialog({\n titleKey: \"clients:confirmAccessTokenTitle\",\n messageKey: \"clients:confirmAccessTokenBody\",\n continueButtonLabel: \"common:yes\",\n cancelButtonLabel: \"common:no\",\n onConfirm: regenerateAccessToken,\n });\n\n return (\n \n \n \n \n (\n {\n field.onChange(value as string);\n isOpen(false);\n }}\n selections={field.value}\n variant={SelectVariant.single}\n aria-label={t(\"clientAuthenticator\")}\n isOpen={open}\n >\n {providers.map((option) => (\n \n {option.displayName}\n \n ))}\n \n )}\n />\n \n {(clientAuthenticatorType === \"client-jwt\" ||\n clientAuthenticatorType === \"client-secret-jwt\") && (\n \n \n )}\n {clientAuthenticatorType === \"client-x509\" && \n \n \n \n {(clientAuthenticatorType === \"client-secret\" ||\n clientAuthenticatorType === \"client-secret-jwt\") && \n \n )}\n \n \n \n \n \n \n {accessToken}\n \n \n \n \n {t(\"regenerate\")}\n \n \n \n \n \n \n \n \n );\n};\n","import type CertificateRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/certificateRepresentation\";\nimport { FormGroup } from \"@patternfly/react-core\";\nimport { useId } from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { HelpItem } from \"ui-shared\";\nimport { KeycloakTextArea } from \"../../components/keycloak-text-area/KeycloakTextArea\";\n\ntype CertificateProps = Omit & {\n plain?: boolean;\n};\n\ntype CertificateDisplayProps = {\n id: string;\n keyInfo?: CertificateRepresentation;\n};\n\nconst CertificateDisplay = ({ id, keyInfo }: CertificateDisplayProps) => {\n const { t } = useTranslation(\"clients\");\n return (\n ();\n\n return (\n <>\n ();\n const [openArchiveFormat, setOpenArchiveFormat] = useState(false);\n\n const { control, watch } = useFormContext();\n const format = watch(\"format\");\n\n const { cryptoInfo } = useServerInfo();\n const supportedKeystoreTypes = [\n ...(cryptoInfo?.supportedKeystoreTypes ?? []),\n ...(hasPem ? [CERT_PEM] : []),\n ];\n\n return (\n \n );\n};\n\nexport const GenerateKeyDialog = ({\n clientId,\n save,\n toggleDialog,\n}: GenerateKeyDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const form = useForm({\n defaultValues: { keyAlias: clientId },\n mode: \"onChange\",\n });\n\n const {\n handleSubmit,\n formState: { isValid },\n } = form;\n\n return (\n {\n handleSubmit((config) => {\n save(config);\n toggleDialog();\n })();\n }}\n >\n {t(\"generate\")}\n ,\n {\n toggleDialog();\n }}\n >\n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n {t(\"clients-help:generateKeysDescription\")} \n \n \n \n \n );\n};\n","import { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Controller, FormProvider, useForm, useWatch } from \"react-hook-form\";\nimport {\n Button,\n ButtonVariant,\n Form,\n FormGroup,\n Modal,\n ModalVariant,\n Select,\n SelectOption,\n SelectVariant,\n Text,\n TextContent,\n} from \"@patternfly/react-core\";\nimport { HelpItem } from \"ui-shared\";\nimport { StoreSettings } from \"./StoreSettings\";\nimport { FileUpload } from \"../../components/json-file-upload/patternfly/FileUpload\";\nimport { useServerInfo } from \"../../context/server-info/ServerInfoProvider\";\n\ntype ImportKeyDialogProps = {\n toggleDialog: () => void;\n save: (importFile: ImportFile) => void;\n};\n\nexport type ImportFile = {\n keystoreFormat: string;\n keyAlias: string;\n storePassword: string;\n file: { value?: string; filename: string };\n};\n\nexport const ImportKeyDialog = ({\n save,\n toggleDialog,\n}: ImportKeyDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const form = useForm();\n const { control, handleSubmit } = form;\n\n const [openArchiveFormat, setOpenArchiveFormat] = useState(false);\n\n const baseFormats = useServerInfo().cryptoInfo?.supportedKeystoreTypes ?? [];\n\n const formats = baseFormats.concat([\n \"Certificate PEM\",\n \"Public Key PEM\",\n \"JSON Web Key Set\",\n ]);\n\n const format = useWatch({\n control,\n name: \"keystoreFormat\",\n defaultValue: formats[0],\n });\n\n return (\n {\n handleSubmit((importFile) => {\n save(importFile);\n toggleDialog();\n })();\n }}\n >\n {t(\"import\")}\n ,\n {\n toggleDialog();\n }}\n >\n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n {t(\"clients-help:generateKeysDescription\")} \n \n \n \n );\n};\n","import type CertificateRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/certificateRepresentation\";\nimport type KeyStoreConfig from \"@keycloak/keycloak-admin-client/lib/defs/keystoreConfig\";\nimport {\n ActionGroup,\n AlertVariant,\n Button,\n Card,\n CardBody,\n CardHeader,\n CardTitle,\n FormGroup,\n PageSection,\n Switch,\n Text,\n TextContent,\n} from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext, useWatch } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { KeycloakTextInput } from \"../../components/keycloak-text-input/KeycloakTextInput\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport useToggle from \"../../utils/useToggle\";\nimport { FormFields } from \"../ClientDetails\";\nimport { Certificate } from \"./Certificate\";\nimport { GenerateKeyDialog, getFileExtension } from \"./GenerateKeyDialog\";\nimport { ImportFile, ImportKeyDialog } from \"./ImportKeyDialog\";\n\ntype KeysProps = {\n save: () => void;\n clientId: string;\n hasConfigureAccess?: boolean;\n};\n\nconst attr = \"jwt.credential\";\n\nexport const Keys = ({ clientId, save, hasConfigureAccess }: KeysProps) => {\n const { t } = useTranslation(\"clients\");\n const {\n control,\n register,\n getValues,\n formState: { isDirty },\n } = useFormContext();\n const { addAlert, addError } = useAlerts();\n\n const [keyInfo, setKeyInfo] = useState();\n const [openGenerateKeys, toggleOpenGenerateKeys, setOpenGenerateKeys] =\n useToggle();\n const [openImportKeys, toggleOpenImportKeys, setOpenImportKeys] = useToggle();\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n\n const useJwksUrl = useWatch({\n control,\n name: convertAttributeNameToForm(\"attributes.use.jwks.url\"),\n defaultValue: \"false\",\n });\n\n useFetch(\n () => adminClient.clients.getKeyInfo({ id: clientId, attr }),\n (info) => setKeyInfo(info),\n [key],\n );\n\n const generate = async (config: KeyStoreConfig) => {\n try {\n const keyStore = await adminClient.clients.generateAndDownloadKey(\n {\n id: clientId,\n attr,\n },\n config,\n );\n saveAs(\n new Blob([keyStore], { type: \"application/octet-stream\" }),\n `keystore.${getFileExtension(config.format ?? \"\")}`,\n );\n addAlert(t(\"generateSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:generateError\", error);\n }\n };\n\n const importKey = async (importFile: ImportFile) => {\n try {\n const formData = new FormData();\n const { file, ...rest } = importFile;\n\n for (const [key, value] of Object.entries(rest)) {\n formData.append(key, value);\n }\n\n formData.append(\"file\", file.value!);\n\n await adminClient.clients.uploadCertificate(\n { id: clientId, attr },\n formData,\n );\n addAlert(t(\"importSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:importError\", error);\n }\n };\n\n return (\n \n {openGenerateKeys && (\n \n \n {t(\"jwksUrlConfig\")} \n \n \n \n {t(\"keysIntro\")} \n \n \n \n \n (\n field.onChange(`${value}`)}\n aria-label={t(\"useJwksUrl\")}\n />\n )}\n />\n \n {useJwksUrl !== \"true\" &&\n (keyInfo ? (\n \n \n {t(\"common:save\")}\n \n setOpenGenerateKeys(true)}\n >\n {t(\"generateNewKeys\")}\n \n setOpenImportKeys(true)}\n isDisabled={useJwksUrl === \"true\"}\n >\n {t(\"import\")}\n \n \n \n \n \n \n );\n};\n","import KeyStoreConfig from \"@keycloak/keycloak-admin-client/lib/defs/keystoreConfig\";\nimport { Button, Form, Modal } from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { FormProvider, useForm } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { KeyForm, getFileExtension } from \"./GenerateKeyDialog\";\n\ntype ExportSamlKeyDialogProps = {\n clientId: string;\n close: () => void;\n};\n\nexport const ExportSamlKeyDialog = ({\n clientId,\n close,\n}: ExportSamlKeyDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const { realm } = useRealm();\n\n const { addAlert, addError } = useAlerts();\n\n const form = useForm({\n defaultValues: { realmAlias: realm },\n });\n\n const download = async (config: KeyStoreConfig) => {\n try {\n const keyStore = await adminClient.clients.downloadKey(\n {\n id: clientId,\n attr: \"saml.signing\",\n },\n config,\n );\n saveAs(\n new Blob([keyStore], { type: \"application/octet-stream\" }),\n `keystore.${getFileExtension(config.format ?? \"\")}`,\n );\n addAlert(t(\"samlKeysExportSuccess\"));\n close();\n } catch (error) {\n addError(\"clients:samlKeysExportError\", error);\n }\n };\n\n return (\n \n {t(\"common:export\")}\n ,\n {\n close();\n }}\n >\n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n \n \n \n \n );\n};\n","import type CertificateRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/certificateRepresentation\";\nimport type KeyStoreConfig from \"@keycloak/keycloak-admin-client/lib/defs/keystoreConfig\";\nimport {\n AlertVariant,\n Button,\n ButtonVariant,\n Flex,\n FlexItem,\n Form,\n FormGroup,\n Modal,\n ModalVariant,\n Radio,\n Split,\n SplitItem,\n Text,\n TextContent,\n Title,\n} from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { useState } from \"react\";\nimport { FormProvider, useForm } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { Certificate } from \"./Certificate\";\nimport { KeyForm } from \"./GenerateKeyDialog\";\nimport type { KeyTypes } from \"./SamlKeys\";\n\ntype SamlKeysDialogProps = {\n id: string;\n attr: KeyTypes;\n onClose: () => void;\n onCancel: () => void;\n};\n\nexport type SamlKeysDialogForm = KeyStoreConfig & {\n file: File;\n};\n\nexport const submitForm = async (\n form: SamlKeysDialogForm,\n id: string,\n attr: KeyTypes,\n callback: (error?: unknown) => void,\n) => {\n try {\n const formData = new FormData();\n const { file, ...rest } = form;\n Object.entries(rest).map(([key, value]) =>\n formData.append(\n key === \"format\" ? \"keystoreFormat\" : key,\n value.toString(),\n ),\n );\n formData.append(\"file\", file);\n\n await adminClient.clients.uploadKey({ id, attr }, formData);\n callback();\n } catch (error) {\n callback(error);\n }\n};\n\nexport const SamlKeysDialog = ({\n id,\n attr,\n onClose,\n onCancel,\n}: SamlKeysDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const [type, setType] = useState(false);\n const [keys, setKeys] = useState();\n const form = useForm({ mode: \"onChange\" });\n const {\n handleSubmit,\n formState: { isValid },\n } = form;\n\n const { addAlert, addError } = useAlerts();\n\n const submit = (form: SamlKeysDialogForm) => {\n submitForm(form, id, attr, (error) => {\n if (error) {\n addError(\"clients:importError\", error);\n } else {\n addAlert(t(\"importSuccess\"), AlertVariant.success);\n }\n });\n };\n\n const generate = async () => {\n try {\n const key = await adminClient.clients.generateKey({\n id,\n attr,\n });\n setKeys(key);\n saveAs(\n new Blob([key.privateKey!], {\n type: \"application/octet-stream\",\n }),\n \"private.key\",\n );\n\n addAlert(t(\"generateSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:generateError\", error);\n }\n };\n\n return (\n \n {t(\"enableClientSignatureRequired\")} \n {t(\"enableClientSignatureRequiredExplain\")} \n \n }\n isOpen={true}\n onClose={onClose}\n actions={[\n {\n if (type) {\n handleSubmit(submit)();\n }\n onClose();\n }}\n >\n {t(\"confirm\")}\n ,\n \n {t(\"common:cancel\")}\n ,\n ]}\n >\n \n \n {type && \n \n );\n};\n","import { AlertVariant } from \"@patternfly/react-core\";\nimport { FormProvider, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { ConfirmDialogModal } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { KeyForm } from \"./GenerateKeyDialog\";\nimport type { KeyTypes } from \"./SamlKeys\";\nimport { SamlKeysDialogForm, submitForm } from \"./SamlKeysDialog\";\n\ntype SamlImportKeyDialogProps = {\n id: string;\n attr: KeyTypes;\n onClose: () => void;\n};\n\nexport const SamlImportKeyDialog = ({\n id,\n attr,\n onClose,\n}: SamlImportKeyDialogProps) => {\n const { t } = useTranslation(\"clients\");\n const form = useFormContext();\n const { handleSubmit } = form;\n\n const { addAlert, addError } = useAlerts();\n\n const submit = (form: SamlKeysDialogForm) => {\n submitForm(form, id, attr, (error) => {\n if (error) {\n addError(\"clients:importError\", error);\n } else {\n addAlert(t(\"importSuccess\"), AlertVariant.success);\n }\n });\n };\n\n return (\n {\n handleSubmit(submit)();\n onClose();\n }}\n >\n \n \n \n );\n};\n","import type CertificateRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/certificateRepresentation\";\nimport {\n ActionGroup,\n AlertVariant,\n Button,\n Card,\n CardBody,\n Form,\n FormGroup,\n PageSection,\n Switch,\n Text,\n TextContent,\n} from \"@patternfly/react-core\";\nimport { saveAs } from \"file-saver\";\nimport { Fragment, useState } from \"react\";\nimport { Controller, useFormContext } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { FormAccess } from \"../../components/form/FormAccess\";\nimport { FormPanel } from \"../../components/scroll-form/FormPanel\";\nimport { convertAttributeNameToForm } from \"../../util\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport useToggle from \"../../utils/useToggle\";\nimport { FormFields } from \"../ClientDetails\";\nimport { Certificate } from \"./Certificate\";\nimport { ExportSamlKeyDialog } from \"./ExportSamlKeyDialog\";\nimport { SamlImportKeyDialog } from \"./SamlImportKeyDialog\";\nimport { SamlKeysDialog } from \"./SamlKeysDialog\";\n\ntype SamlKeysProps = {\n clientId: string;\n save: () => void;\n};\n\nconst KEYS = [\"saml.signing\", \"saml.encryption\"] as const;\nexport type KeyTypes = (typeof KEYS)[number];\n\nconst KEYS_MAPPING: { [key in KeyTypes]: { [index: string]: string } } = {\n \"saml.signing\": {\n name: convertAttributeNameToForm(\"attributes.saml.client.signature\"),\n title: \"signingKeysConfig\",\n key: \"clientSignature\",\n },\n \"saml.encryption\": {\n name: convertAttributeNameToForm(\"attributes.saml.encrypt\"),\n title: \"encryptionKeysConfig\",\n key: \"encryptAssertions\",\n },\n};\n\ntype KeySectionProps = {\n clientId: string;\n keyInfo?: CertificateRepresentation;\n attr: KeyTypes;\n onChanged: (key: KeyTypes) => void;\n onGenerate: (key: KeyTypes, regenerate: boolean) => void;\n onImport: (key: KeyTypes) => void;\n};\n\nconst KeySection = ({\n clientId,\n keyInfo,\n attr,\n onChanged,\n onGenerate,\n onImport,\n}: KeySectionProps) => {\n const { t } = useTranslation(\"clients\");\n const { control, watch } = useFormContext();\n const title = KEYS_MAPPING[attr].title;\n const key = KEYS_MAPPING[attr].key;\n const name = KEYS_MAPPING[attr].name;\n\n const [showImportDialog, toggleImportDialog] = useToggle();\n\n const section = watch(name as keyof FormFields);\n return (\n <>\n {showImportDialog && (\n \n \n {t(`${title}Explain`)} \n \n \n (\n {\n const v = value.toString();\n if (v === \"true\") {\n onChanged(attr);\n field.onChange(v);\n } else {\n onGenerate(attr, false);\n }\n }}\n aria-label={t(key)}\n />\n )}\n />\n \n \n \n {keyInfo?.certificate && section === \"true\" && (\n \n \n \n \n \n )}\n \n );\n};\n\nexport const SamlKeys = ({ clientId, save }: SamlKeysProps) => {\n const { t } = useTranslation(\"clients\");\n const [isChanged, setIsChanged] = useState();\n const [keyInfo, setKeyInfo] = useState();\n const [selectedType, setSelectedType] = useState();\n const [openImport, setImportOpen] = useState();\n const [refresh, setRefresh] = useState(0);\n\n const { setValue } = useFormContext();\n const { addAlert, addError } = useAlerts();\n\n useFetch(\n () =>\n Promise.all(\n KEYS.map((attr) =>\n adminClient.clients.getKeyInfo({ id: clientId, attr }),\n ),\n ),\n (info) => setKeyInfo(info),\n [refresh],\n );\n\n const generate = async (attr: KeyTypes) => {\n const index = KEYS.indexOf(attr);\n try {\n const info = [...(keyInfo || [])];\n info[index] = await adminClient.clients.generateKey({\n id: clientId,\n attr,\n });\n\n setKeyInfo(info);\n saveAs(\n new Blob([info[index].privateKey!], {\n type: \"application/octet-stream\",\n }),\n \"private.key\",\n );\n\n addAlert(t(\"generateSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:generateError\", error);\n }\n };\n\n const key = selectedType ? KEYS_MAPPING[selectedType].key : \"\";\n const [toggleDisableDialog, DisableConfirm] = useConfirmDialog({\n titleKey: t(\"disableSigning\", {\n key: t(key),\n }),\n messageKey: t(\"disableSigningExplain\", {\n key: t(key),\n }),\n continueButtonLabel: \"common:yes\",\n cancelButtonLabel: \"common:no\",\n onConfirm: () => {\n setValue(KEYS_MAPPING[selectedType!].name, \"false\");\n save();\n },\n });\n\n const [toggleReGenerateDialog, ReGenerateConfirm] = useConfirmDialog({\n titleKey: \"clients:reGenerateSigning\",\n messageKey: \"clients:reGenerateSigningExplain\",\n continueButtonLabel: \"common:yes\",\n cancelButtonLabel: \"common:no\",\n onConfirm: () => {\n generate(selectedType!);\n },\n });\n\n return (\n \n {isChanged && (\n {\n setIsChanged(undefined);\n save();\n setRefresh(refresh + 1);\n }}\n onCancel={() => {\n setValue(KEYS_MAPPING[selectedType!].name, \"false\");\n setIsChanged(undefined);\n }}\n />\n )}\n \n {openImport === attr && (\n setImportOpen(undefined)}\n />\n )}\n {\n setSelectedType(type);\n if (!isNew) {\n toggleDisableDialog();\n } else {\n toggleReGenerateDialog();\n }\n }}\n onImport={() => setImportOpen(attr)}\n />\n \n ))}\n \n );\n};\n","import type ClientScopeRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientScopeRepresentation\";\nimport {\n AlertVariant,\n Button,\n ButtonVariant,\n Dropdown,\n DropdownItem,\n KebabToggle,\n ToolbarItem,\n} from \"@patternfly/react-core\";\nimport { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Link } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { ChangeTypeDropdown } from \"../../client-scopes/ChangeTypeDropdown\";\nimport {\n SearchDropdown,\n SearchToolbar,\n SearchType,\n nameFilter,\n typeFilter,\n} from \"../../client-scopes/details/SearchFilter\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport {\n AllClientScopeType,\n AllClientScopes,\n CellDropdown,\n ClientScope,\n addClientScope,\n changeClientScope,\n removeClientScope,\n} from \"../../components/client-scope/ClientScopeTypes\";\nimport { useConfirmDialog } from \"../../components/confirm-dialog/ConfirmDialog\";\nimport { ListEmptyState } from \"../../components/list-empty-state/ListEmptyState\";\nimport {\n Action,\n KeycloakDataTable,\n} from \"../../components/table-toolbar/KeycloakDataTable\";\nimport { useAccess } from \"../../context/access/Access\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport useLocaleSort, { mapByKey } from \"../../utils/useLocaleSort\";\nimport { toDedicatedScope } from \"../routes/DedicatedScopeDetails\";\nimport { AddScopeDialog } from \"./AddScopeDialog\";\n\nimport \"./client-scopes.css\";\n\nexport type ClientScopesProps = {\n clientId: string;\n protocol: string;\n clientName: string;\n fineGrainedAccess?: boolean;\n};\n\nexport type Row = ClientScopeRepresentation & {\n type: AllClientScopeType;\n description?: string;\n};\n\nconst DEDICATED_ROW = \"dedicated\";\n\ntype TypeSelectorProps = Row & {\n clientId: string;\n fineGrainedAccess?: boolean;\n refresh: () => void;\n};\n\nconst TypeSelector = ({\n clientId,\n refresh,\n fineGrainedAccess,\n ...scope\n}: TypeSelectorProps) => {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n\n const { hasAccess } = useAccess();\n\n const isDedicatedRow = (value: Row) => value.id === DEDICATED_ROW;\n const isManager = hasAccess(\"manage-clients\") || fineGrainedAccess;\n\n return (\n {\n try {\n await changeClientScope(\n clientId,\n scope,\n scope.type,\n value as ClientScope,\n );\n addAlert(t(\"clientScopeSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:clientScopeError\", error);\n }\n }}\n />\n );\n};\n\nexport const ClientScopes = ({\n clientId,\n protocol,\n clientName,\n fineGrainedAccess,\n}: ClientScopesProps) => {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n const { realm } = useRealm();\n const localeSort = useLocaleSort();\n\n const [searchType, setSearchType] = useState(\"name\");\n\n const [searchTypeType, setSearchTypeType] = useState(\n AllClientScopes.none,\n );\n\n const [addDialogOpen, setAddDialogOpen] = useState(false);\n\n const [rest, setRest] = useState();\n const [selectedRows, setSelectedRowState] = useState([]);\n const setSelectedRows = (rows: Row[]) =>\n setSelectedRowState(rows.filter(({ id }) => id !== DEDICATED_ROW));\n const [kebabOpen, setKebabOpen] = useState(false);\n\n const [key, setKey] = useState(0);\n const refresh = () => setKey(key + 1);\n const isDedicatedRow = (value: Row) => value.id === DEDICATED_ROW;\n\n const { hasAccess } = useAccess();\n const isManager = hasAccess(\"manage-clients\") || fineGrainedAccess;\n const isViewer = hasAccess(\"view-clients\") || fineGrainedAccess;\n\n const loader = async (first?: number, max?: number, search?: string) => {\n const defaultClientScopes =\n await adminClient.clients.listDefaultClientScopes({ id: clientId });\n const optionalClientScopes =\n await adminClient.clients.listOptionalClientScopes({ id: clientId });\n const clientScopes = await adminClient.clientScopes.find();\n\n const find = (id: string) =>\n clientScopes.find((clientScope) => id === clientScope.id);\n\n const optional = optionalClientScopes.map((c) => {\n const scope = find(c.id!);\n const row: Row = {\n ...c,\n type: ClientScope.optional,\n description: scope?.description,\n };\n return row;\n });\n\n const defaultScopes = defaultClientScopes.map((c) => {\n const scope = find(c.id!);\n const row: Row = {\n ...c,\n type: ClientScope.default,\n description: scope?.description,\n };\n return row;\n });\n\n const rows = [...optional, ...defaultScopes];\n const names = rows.map((row) => row.name);\n setRest(\n clientScopes\n .filter((scope) => !names.includes(scope.name))\n .filter((scope) => scope.protocol === protocol),\n );\n\n const filter =\n searchType === \"name\" ? nameFilter(search) : typeFilter(searchTypeType);\n const firstNum = Number(first);\n const page = localeSort(rows.filter(filter), mapByKey(\"name\"));\n\n if (isViewer) {\n page.unshift({\n id: DEDICATED_ROW,\n name: t(\"dedicatedScopeName\", { clientName }),\n type: AllClientScopes.none,\n description: t(\"dedicatedScopeDescription\"),\n });\n }\n\n return page.slice(firstNum, firstNum + Number(max));\n };\n\n const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({\n titleKey: t(\"client-scopes:deleteClientScope\", {\n count: selectedRows.length,\n name: selectedRows[0]?.name,\n }),\n messageKey: \"client-scopes:deleteConfirm\",\n continueButtonLabel: \"common:delete\",\n continueButtonVariant: ButtonVariant.danger,\n onConfirm: async () => {\n try {\n await removeClientScope(\n clientId,\n selectedRows[0],\n selectedRows[0].type as ClientScope,\n );\n addAlert(t(\"clientScopeRemoveSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:clientScopeRemoveError\", error);\n }\n },\n });\n\n return (\n <>\n {rest && (\n setAddDialogOpen(!addDialogOpen)}\n onAdd={async (scopes) => {\n try {\n await Promise.all(\n scopes.map(\n async (scope) =>\n await addClientScope(clientId, scope.scope, scope.type!),\n ),\n );\n addAlert(t(\"clientScopeSuccess\"), AlertVariant.success);\n refresh();\n } catch (error) {\n addError(\"clients:clientScopeError\", error);\n }\n }}\n />\n )}\n\n setSelectedRows([...rows])}\n searchTypeComponent={\n setSearchType(searchType)}\n />\n }\n toolbarItem={\n <>\n setSearchType(searchType)}\n onType={(value) => {\n setSearchTypeType(value);\n refresh();\n }}\n />\n {isManager && (\n <>\n \n \n \n \n \n \n setKebabOpen(!kebabOpen)} />\n }\n isOpen={kebabOpen}\n isPlain\n dropdownItems={[\n {\n try {\n await Promise.all(\n selectedRows.map((row) =>\n removeClientScope(\n clientId,\n { ...row },\n row.type as ClientScope,\n ),\n ),\n );\n\n setKebabOpen(false);\n setSelectedRows([]);\n addAlert(t(\"clients:clientScopeRemoveSuccess\"));\n refresh();\n } catch (error) {\n addError(\"clients:clientScopeRemoveError\", error);\n }\n }}\n >\n {t(\"common:remove\")}\n ,\n ]}\n />\n \n \n )}\n \n }\n columns={[\n {\n name: \"name\",\n displayKey: \"clients:assignedClientScope\",\n cellRenderer: (row) => {\n if (isDedicatedRow(row)) {\n return (\n \n {row.name}\n \n );\n }\n return row.name!;\n },\n },\n {\n name: \"type\",\n displayKey: \"clients:assignedType\",\n cellRenderer: (row) => (\n ,\n ]\n : []\n }\n emptyState={\n setAddDialogOpen(true)}\n />\n }\n />\n \n );\n};\n","import { useTranslation } from \"react-i18next\";\nimport {\n CodeBlock,\n CodeBlockAction,\n EmptyState,\n EmptyStateBody,\n Title,\n} from \"@patternfly/react-core\";\n\nimport type UserRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/userRepresentation\";\nimport { CopyToClipboardButton } from \"./CopyToClipboardButton\";\nimport { KeycloakTextArea } from \"../../components/keycloak-text-area/KeycloakTextArea\";\n\ntype GeneratedCodeTabProps = {\n user?: UserRepresentation;\n text: string;\n label: string;\n};\n\nexport const GeneratedCodeTab = ({\n text,\n user,\n label,\n}: GeneratedCodeTabProps) => {\n const { t } = useTranslation(\"clients\");\n\n return user ? (\n \n \n \n {t(`${label}No`)}\n \n {t(`${label}IsDisabled`)} \n \n );\n};\n","import type ClientScopeRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientScopeRepresentation\";\nimport type ProtocolMapperRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/protocolMapperRepresentation\";\nimport type RoleRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/roleRepresentation\";\nimport type { ProtocolMapperTypeRepresentation } from \"@keycloak/keycloak-admin-client/lib/defs/serverInfoRepesentation\";\nimport {\n ClipboardCopy,\n Form,\n FormGroup,\n Grid,\n GridItem,\n PageSection,\n Select,\n SelectOption,\n SelectVariant,\n Split,\n SplitItem,\n Tab,\n TabContent,\n Tabs,\n TabTitleText,\n Text,\n TextContent,\n} from \"@patternfly/react-core\";\nimport { QuestionCircleIcon } from \"@patternfly/react-icons\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { FormProvider, useForm } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\nimport { HelpItem, useHelp } from \"ui-shared\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { KeycloakDataTable } from \"../../components/table-toolbar/KeycloakDataTable\";\nimport { UserSelect } from \"../../components/users/UserSelect\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { useServerInfo } from \"../../context/server-info/ServerInfoProvider\";\nimport { prettyPrintJSON } from \"../../util\";\nimport { useFetch } from \"../../utils/useFetch\";\nimport { GeneratedCodeTab } from \"./GeneratedCodeTab\";\nimport { useAccess } from \"../../context/access/Access\";\n\nimport \"./evaluate.css\";\n\nexport type EvaluateScopesProps = {\n clientId: string;\n protocol: string;\n};\n\nconst ProtocolMappers = ({\n protocolMappers,\n}: {\n protocolMappers: ProtocolMapperRepresentation[];\n}) => {\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey(key + 1);\n }, [protocolMappers]);\n return (\n Promise.resolve(protocolMappers)}\n ariaLabelKey=\"clients:effectiveProtocolMappers\"\n searchPlaceholderKey=\"clients:searchForProtocol\"\n columns={[\n {\n name: \"mapperName\",\n displayKey: \"common:name\",\n },\n {\n name: \"containerName\",\n displayKey: \"clients:parentClientScope\",\n },\n {\n name: \"type.category\",\n displayKey: \"common:category\",\n },\n {\n name: \"type.priority\",\n displayKey: \"common:priority\",\n },\n ]}\n />\n );\n};\n\nconst EffectiveRoles = ({\n effectiveRoles,\n}: {\n effectiveRoles: RoleRepresentation[];\n}) => {\n const [key, setKey] = useState(0);\n useEffect(() => {\n setKey(key + 1);\n }, [effectiveRoles]);\n\n return (\n Promise.resolve(effectiveRoles)}\n ariaLabelKey=\"client:effectiveRoleScopeMappings\"\n searchPlaceholderKey=\"clients:searchForRole\"\n columns={[\n {\n name: \"name\",\n displayKey: \"clients:role\",\n },\n {\n name: \"containerId\",\n displayKey: \"clients:origin\",\n },\n ]}\n />\n );\n};\n\nexport const EvaluateScopes = ({ clientId, protocol }: EvaluateScopesProps) => {\n const prefix = \"openid\";\n const { t } = useTranslation(\"clients\");\n const { enabled } = useHelp();\n const { realm } = useRealm();\n const mapperTypes = useServerInfo().protocolMapperTypes![protocol];\n\n const [selectableScopes, setSelectableScopes] = useState<\n ClientScopeRepresentation[]\n >([]);\n const [isScopeOpen, setIsScopeOpen] = useState(false);\n const [selected, setSelected] = useState([prefix]);\n const [activeTab, setActiveTab] = useState(0);\n\n const [key, setKey] = useState(\"\");\n const refresh = () => setKey(`${new Date().getTime()}`);\n const [effectiveRoles, setEffectiveRoles] = useState(\n [],\n );\n const [protocolMappers, setProtocolMappers] = useState<\n ProtocolMapperRepresentation[]\n >([]);\n const [accessToken, setAccessToken] = useState(\"\");\n const [userInfo, setUserInfo] = useState(\"\");\n const [idToken, setIdToken] = useState(\"\");\n\n const tabContent1 = useRef(null);\n const tabContent2 = useRef(null);\n const tabContent3 = useRef(null);\n const tabContent4 = useRef(null);\n const tabContent5 = useRef(null);\n\n const form = useForm();\n\n const { hasAccess } = useAccess();\n const hasViewUsers = hasAccess(\"view-users\");\n\n useFetch(\n () => adminClient.clients.listOptionalClientScopes({ id: clientId }),\n (optionalClientScopes) => setSelectableScopes(optionalClientScopes),\n [],\n );\n\n useFetch(\n async () => {\n const scope = selected.join(\" \");\n const effectiveRoles = await adminClient.clients.evaluatePermission({\n id: clientId,\n roleContainer: realm,\n scope,\n type: \"granted\",\n });\n\n const mapperList = (await adminClient.clients.evaluateListProtocolMapper({\n id: clientId,\n scope,\n })) as ({\n type: ProtocolMapperTypeRepresentation;\n } & ProtocolMapperRepresentation)[];\n\n return {\n mapperList,\n effectiveRoles,\n };\n },\n ({ mapperList, effectiveRoles }) => {\n setEffectiveRoles(effectiveRoles);\n mapperList.map((mapper) => {\n mapper.type = mapperTypes.filter(\n (type) => type.id === mapper.protocolMapper,\n )[0];\n });\n\n setProtocolMappers(mapperList);\n refresh();\n },\n [selected],\n );\n\n useFetch(\n async () => {\n const scope = selected.join(\" \");\n const user = form.getValues(\"user\");\n if (!user) return [];\n\n return await Promise.all([\n adminClient.clients.evaluateGenerateAccessToken({\n id: clientId,\n userId: user[0],\n scope,\n }),\n adminClient.clients.evaluateGenerateUserInfo({\n id: clientId,\n userId: user[0],\n scope,\n }),\n adminClient.clients.evaluateGenerateIdToken({\n id: clientId,\n userId: user[0],\n scope,\n }),\n ]);\n },\n ([accessToken, userInfo, idToken]) => {\n setAccessToken(prettyPrintJSON(accessToken));\n setUserInfo(prettyPrintJSON(userInfo));\n setIdToken(prettyPrintJSON(idToken));\n },\n [form.getValues(\"user\"), selected],\n );\n\n return (\n <>\n \n {enabled && (\n \n \n \n \n )}\n \n \n\n \n \n \n \n \n \n \n \n \n setActiveTab(key as number)}\n >\n \n {t(\"effectiveProtocolMappers\")}{\" \"}\n \n {t(\"effectiveRoleScopeMappings\")}{\" \"}\n \n {t(\"generatedAccessToken\")}{\" \"}\n \n {t(\"generatedIdToken\")}{\" \"}\n \n {t(\"generatedUserInfo\")}{\" \"}\n \n \n \n );\n};\n","import type ClientRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/clientRepresentation\";\nimport type { RoleMappingPayload } from \"@keycloak/keycloak-admin-client/lib/defs/roleRepresentation\";\nimport type UserRepresentation from \"@keycloak/keycloak-admin-client/lib/defs/userRepresentation\";\nimport { AlertVariant, PageSection } from \"@patternfly/react-core\";\nimport { InfoCircleIcon } from \"@patternfly/react-icons\";\nimport { useState } from \"react\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Link } from \"react-router-dom\";\n\nimport { adminClient } from \"../../admin-client\";\nimport { useAlerts } from \"../../components/alert/Alerts\";\nimport { KeycloakSpinner } from \"../../components/keycloak-spinner/KeycloakSpinner\";\nimport { RoleMapping, Row } from \"../../components/role-mapping/RoleMapping\";\nimport { useAccess } from \"../../context/access/Access\";\nimport { useRealm } from \"../../context/realm-context/RealmContext\";\nimport { toUser } from \"../../user/routes/User\";\nimport { useFetch } from \"../../utils/useFetch\";\n\nimport \"./service-account.css\";\n\ntype ServiceAccountProps = {\n client: ClientRepresentation;\n};\n\nexport const ServiceAccount = ({ client }: ServiceAccountProps) => {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n const { realm } = useRealm();\n\n const [serviceAccount, setServiceAccount] = useState();\n\n const { hasAccess } = useAccess();\n const hasManageClients = hasAccess(\"manage-clients\");\n\n useFetch(\n () =>\n adminClient.clients.getServiceAccountUser({\n id: client.id!,\n }),\n (serviceAccount) => setServiceAccount(serviceAccount),\n [],\n );\n\n const assignRoles = async (rows: Row[]) => {\n try {\n const realmRoles = rows\n .filter((row) => row.client === undefined)\n .map((row) => row.role as RoleMappingPayload)\n .flat();\n await adminClient.users.addRealmRoleMappings({\n id: serviceAccount?.id!,\n roles: realmRoles,\n });\n await Promise.all(\n rows\n .filter((row) => row.client !== undefined)\n .map((row) =>\n adminClient.users.addClientRoleMappings({\n id: serviceAccount?.id!,\n clientUniqueId: row.client!.id!,\n roles: [row.role as RoleMappingPayload],\n }),\n ),\n );\n addAlert(t(\"roleMappingUpdatedSuccess\"), AlertVariant.success);\n } catch (error) {\n addError(\"clients:roleMappingUpdatedError\", error);\n }\n };\n return serviceAccount ? (\n <>\n \n \n {\"\"}\n \n {{ link: serviceAccount.username }}\n \n \n \n \n (() => {\n const protocolName = getProtocolName(\n t,\n client.protocol ?? \"openid-connect\",\n );\n\n const text = client.bearerOnly ? (\n \n \n {t(\"downloadAdapterConfig\")}\n ,\n exportClient(client)}>\n {t(\"common:export\")}\n ,\n ...(!isRealmClient(client) && isManager\n ? [\n \n {t(\"common:delete\")}\n ,\n ]\n : []),\n ];\n\n return (\n <>\n {\n if (!value) {\n toggleDisableDialog();\n } else {\n onChange(value);\n save();\n }\n }}\n />\n \n );\n};\n\nexport type SaveOptions = {\n confirmed?: boolean;\n messageKey?: string;\n};\n\nexport type FormFields = Omit<\n ClientRepresentation,\n \"authorizationSettings\" | \"resources\"\n>;\n\nexport default function ClientDetails() {\n const { t } = useTranslation(\"clients\");\n const { addAlert, addError } = useAlerts();\n const { realm } = useRealm();\n const { hasAccess } = useAccess();\n const isFeatureEnabled = useIsFeatureEnabled();\n\n const hasManageAuthorization = hasAccess(\"manage-authorization\");\n const hasManageClients = hasAccess(\"manage-clients\");\n const hasViewClients = hasAccess(\"view-clients\");\n const hasViewUsers = hasAccess(\"view-users\");\n const permissionsEnabled =\n isFeatureEnabled(Feature.AdminFineGrainedAuthz) && hasManageAuthorization;\n\n const navigate = useNavigate();\n\n const [downloadDialogOpen, toggleDownloadDialogOpen] = useToggle();\n const [changeAuthenticatorOpen, toggleChangeAuthenticatorOpen] = useToggle();\n\n const form = useForm();\n const { clientId } = useParams();\n const [key, setKey] = useState(0);\n\n const clientAuthenticatorType = useWatch({\n control: form.control,\n name: \"clientAuthenticatorType\",\n defaultValue: \"client-secret\",\n });\n\n const [client, setClient] = useState();\n\n const loader = async () => {\n const roles = await adminClient.clients.listRoles({ id: clientId });\n return sortBy(roles, (role) => role.name?.toUpperCase());\n };\n\n const useTab = (tab: ClientTab) =>\n useRoutableTab(\n toClient({\n realm,\n clientId,\n tab,\n }),\n );\n\n const settingsTab = useTab(\"settings\");\n const keysTab = useTab(\"keys\");\n const credentialsTab = useTab(\"credentials\");\n const rolesTab = useTab(\"roles\");\n const clientScopesTab = useTab(\"clientScopes\");\n const authorizationTab = useTab(\"authorization\");\n const serviceAccountTab = useTab(\"serviceAccount\");\n const sessionsTab = useTab(\"sessions\");\n const permissionsTab = useTab(\"permissions\");\n const advancedTab = useTab(\"advanced\");\n\n const useClientScopesTab = (tab: ClientScopesTab) =>\n useRoutableTab(\n toClientScopesTab({\n realm,\n clientId,\n tab,\n }),\n );\n\n const clientScopesSetupTab = useClientScopesTab(\"setup\");\n const clientScopesEvaluateTab = useClientScopesTab(\"evaluate\");\n\n const useAuthorizationTab = (tab: AuthorizationTab) =>\n useRoutableTab(\n toAuthorizationTab({\n realm,\n clientId,\n tab,\n }),\n );\n\n const authorizationSettingsTab = useAuthorizationTab(\"settings\");\n const authorizationResourcesTab = useAuthorizationTab(\"resources\");\n const authorizationScopesTab = useAuthorizationTab(\"scopes\");\n const authorizationPoliciesTab = useAuthorizationTab(\"policies\");\n const authorizationPermissionsTab = useAuthorizationTab(\"permissions\");\n const authorizationEvaluateTab = useAuthorizationTab(\"evaluate\");\n const authorizationExportTab = useAuthorizationTab(\"export\");\n\n const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({\n titleKey: \"clients:clientDeleteConfirmTitle\",\n messageKey: \"clients:clientDeleteConfirm\",\n continueButtonLabel: \"common:delete\",\n continueButtonVariant: ButtonVariant.danger,\n onConfirm: async () => {\n try {\n await adminClient.clients.del({ id: clientId });\n addAlert(t(\"clientDeletedSuccess\"), AlertVariant.success);\n navigate(toClients({ realm }));\n } catch (error) {\n addError(\"clients:clientDeleteError\", error);\n }\n },\n });\n\n const setupForm = (client: ClientRepresentation) => {\n form.reset({ ...client });\n convertToFormValues(client, form.setValue);\n if (client.attributes?.[\"acr.loa.map\"]) {\n form.setValue(\n convertAttributeNameToForm(\"attributes.acr.loa.map\"),\n // @ts-ignore\n Object.entries(JSON.parse(client.attributes[\"acr.loa.map\"])).flatMap(\n ([key, value]) => ({ key, value }),\n ),\n );\n }\n };\n\n useFetch(\n () => adminClient.clients.findOne({ id: clientId }),\n (fetchedClient) => {\n if (!fetchedClient) {\n throw new Error(t(\"common:notFound\"));\n }\n setClient(cloneDeep(fetchedClient));\n setupForm(fetchedClient);\n },\n [clientId, key],\n );\n\n const save = async (\n { confirmed = false, messageKey = \"clientSaveSuccess\" }: SaveOptions = {\n confirmed: false,\n messageKey: \"clientSaveSuccess\",\n },\n ) => {\n if (!(await form.trigger())) {\n return;\n }\n\n if (\n !client?.publicClient &&\n client?.clientAuthenticatorType !== clientAuthenticatorType &&\n !confirmed\n ) {\n toggleChangeAuthenticatorOpen();\n return;\n }\n\n const values = convertFormValuesToObject(form.getValues());\n\n const submittedClient =\n convertFormValuesToObject(values);\n\n if (submittedClient.attributes?.[\"acr.loa.map\"]) {\n submittedClient.attributes[\"acr.loa.map\"] = JSON.stringify(\n Object.fromEntries(\n (submittedClient.attributes[\"acr.loa.map\"] as KeyValueType[])\n .filter(({ key }) => key !== \"\")\n .map(({ key, value }) => [key, value]),\n ),\n );\n }\n\n try {\n const newClient: ClientRepresentation = {\n ...client,\n ...submittedClient,\n };\n\n newClient.clientId = newClient.clientId?.trim();\n\n await adminClient.clients.update({ id: clientId }, newClient);\n setupForm(newClient);\n setClient(newClient);\n addAlert(t(messageKey), AlertVariant.success);\n } catch (error) {\n addError(\"clients:clientSaveError\", error);\n }\n };\n\n if (!client) {\n return save({ confirmed: true })}\n >\n <>\n {t(\"changeAuthenticatorConfirm\", {\n clientAuthenticatorType: clientAuthenticatorType,\n })}\n \n \n (\n \n \n \n {t(\"common:settings\")}}\n {...settingsTab}\n >\n save()}\n reset={() => setupForm(client)}\n />\n \n {((!client.publicClient && !isRealmClient(client)) ||\n client.protocol === \"saml\") && (\n {t(\"keys\")}}\n {...keysTab}\n >\n {client.protocol === \"openid-connect\" && (\n {t(\"credentials\")}}\n {...credentialsTab}\n >\n setKey(key + 1)}\n />\n \n )}\n {t(\"roles\")}}\n {...rolesTab}\n >\n \n toClientRole({\n realm,\n clientId: client.id!,\n id: roleId,\n tab: \"details\",\n })\n }\n isReadOnly={!(hasManageClients || client.access?.configure)}\n />\n \n {!isRealmClient(client) && !client.bearerOnly && (\n {t(\"clientScopes\")}}\n {...clientScopesTab}\n >\n \n {t(\"setup\")}}\n {...clientScopesSetupTab}\n >\n {t(\"evaluate\")}}\n {...clientScopesEvaluateTab}\n >\n {t(\"authorization\")}}\n {...authorizationTab}\n >\n