@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
84 lines • 7.98 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { ActionGroup, ActionListItem, Alert, AlertActionLink, AlertVariant, Button, Checkbox, FormGroup, PageSection, } from "@patternfly/react-core";
import { Controller, FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
import { FormPanel, PasswordControl, SwitchControl, TextControl, } from "../ui-shared";
import { useAdminClient } from "../admin-client";
import { useAlerts } from "../ui-shared";
import { FormAccess } from "../components/form/FormAccess";
import { toUser } from "../user/routes/User";
import { emailRegexPattern } from "../util";
import { useCurrentUser } from "../utils/useCurrentUser";
import useToggle from "../utils/useToggle";
import "./realm-settings-section.css";
export const RealmSettingsEmailTab = ({ realm, save, }) => {
const { adminClient } = useAdminClient();
const { t } = useTranslation();
const { addAlert, addError } = useAlerts();
const currentUser = useCurrentUser();
const form = useForm({ defaultValues: realm });
const { control, handleSubmit, watch, reset: resetForm, getValues } = form;
const reset = () => resetForm(realm);
const watchFromValue = watch("smtpServer.from", "");
const watchHostValue = watch("smtpServer.host", "");
const [isTesting, toggleTest] = useToggle();
const authenticationEnabled = useWatch({
control,
name: "smtpServer.auth",
defaultValue: "",
});
const testConnection = async () => {
const toNumber = (value) => Number(value);
const toBoolean = (value) => value === true.toString();
const valueMapper = new Map([
["port", toNumber],
["ssl", toBoolean],
["starttls", toBoolean],
["auth", toBoolean],
]);
const serverSettings = { ...getValues()["smtpServer"] };
for (const [key, mapperFn] of valueMapper.entries()) {
serverSettings[key] = mapperFn(serverSettings[key]);
}
// For default value, back end is expecting null instead of 0
if (serverSettings.port === 0)
serverSettings.port = null;
try {
toggleTest();
await adminClient.realms.testSMTPConnection({ realm: realm.realm }, serverSettings);
addAlert(t("testConnectionSuccess"), AlertVariant.success);
}
catch (error) {
addError("testConnectionError", error);
}
toggleTest();
};
return (_jsx(PageSection, { variant: "light", children: _jsxs(FormProvider, { ...form, children: [_jsx(FormPanel, { title: t("template"), className: "kc-email-template", children: _jsxs(FormAccess, { isHorizontal: true, role: "manage-realm", className: "pf-v5-u-mt-lg", onSubmit: handleSubmit(save), children: [_jsx(TextControl, { name: "smtpServer.from", label: t("from"), type: "email", placeholder: t("smtpFromPlaceholder"), rules: {
pattern: {
value: emailRegexPattern,
message: t("emailInvalid"),
},
required: t("required"),
} }), _jsx(TextControl, { name: "smtpServer.fromDisplayName", label: t("fromDisplayName"), labelIcon: t("fromDisplayNameHelp"), placeholder: t("smtpFromDisplayPlaceholder") }), _jsx(TextControl, { name: "smtpServer.replyTo", label: t("replyTo"), type: "email", placeholder: t("replyToEmailPlaceholder"), rules: {
pattern: {
value: emailRegexPattern,
message: t("emailInvalid"),
},
} }), _jsx(TextControl, { name: "smtpServer.replyToDisplayName", label: t("replyToDisplayName"), labelIcon: t("replyToDisplayNameHelp"), placeholder: t("replyToDisplayPlaceholder") }), _jsx(TextControl, { name: "smtpServer.envelopeFrom", label: t("envelopeFrom"), labelIcon: t("envelopeFromHelp"), placeholder: t("senderEnvelopePlaceholder") })] }) }), _jsx(FormPanel, { className: "kc-email-connection", title: t("connectionAndAuthentication"), children: _jsxs(FormAccess, { isHorizontal: true, role: "manage-realm", className: "pf-v5-u-mt-lg", onSubmit: handleSubmit(save), children: [_jsx(TextControl, { name: "smtpServer.host", label: t("host"), rules: {
required: t("required"),
} }), _jsx(TextControl, { name: "smtpServer.port", label: t("port"), placeholder: t("smtpPortPlaceholder") }), _jsxs(FormGroup, { label: t("encryption"), fieldId: "kc-html-display-name", children: [_jsx(Controller, { name: "smtpServer.ssl", control: control, defaultValue: "false", render: ({ field }) => (_jsx(Checkbox, { id: "kc-enable-ssl", "data-testid": "enable-ssl", label: t("enableSSL"), isChecked: field.value === "true", onChange: (_event, value) => field.onChange("" + value) })) }), _jsx(Controller, { name: "smtpServer.starttls", control: control, defaultValue: "false", render: ({ field }) => (_jsx(Checkbox, { id: "kc-enable-start-tls", "data-testid": "enable-start-tls", label: t("enableStartTLS"), isChecked: field.value === "true", onChange: (_event, value) => field.onChange("" + value) })) })] }), _jsx(SwitchControl, { name: "smtpServer.auth", label: t("authentication"), defaultValue: "", labelOn: t("enabled"), labelOff: t("disabled"), stringify: true }), authenticationEnabled === "true" && (_jsxs(_Fragment, { children: [_jsx(TextControl, { name: "smtpServer.user", label: t("username"), placeholder: t("loginUsernamePlaceholder"), rules: {
required: t("required"),
} }), _jsx(PasswordControl, { name: "smtpServer.password", label: t("password"), labelIcon: t("passwordHelp"), rules: {
required: t("required"),
} })] })), currentUser && (_jsx(FormGroup, { id: "descriptionTestConnection", children: currentUser.email ? (_jsx(Alert, { variant: "info", component: "h2", isInline: true, title: t("testConnectionHint.withEmail", {
email: currentUser.email,
}) })) : (_jsx(Alert, { variant: "warning", component: "h2", isInline: true, title: t("testConnectionHint.withoutEmail", {
userName: currentUser.username,
}), actionLinks: _jsx(AlertActionLink, { component: (props) => (_jsx(Link, { ...props, to: toUser({
realm: currentUser.realm,
id: currentUser.id,
tab: "settings",
}) })), children: t("testConnectionHint.withoutEmailAction") }) })) })), _jsxs(ActionGroup, { children: [_jsx(ActionListItem, { children: _jsx(Button, { variant: "primary", type: "submit", "data-testid": "email-tab-save", children: t("save") }) }), _jsx(ActionListItem, { children: _jsx(Button, { variant: "secondary", onClick: () => testConnection(), "data-testid": "test-connection-button", isDisabled: !(emailRegexPattern.test(watchFromValue) && watchHostValue) || !(currentUser === null || currentUser === void 0 ? void 0 : currentUser.email), "aria-describedby": "descriptionTestConnection", isLoading: isTesting, spinnerAriaValueText: t("testingConnection"), children: t("testConnection") }) }), _jsx(ActionListItem, { children: _jsx(Button, { variant: "link", onClick: reset, "data-testid": "email-tab-revert", children: t("revert") }) })] })] }) })] }) }));
};
//# sourceMappingURL=EmailTab.js.map