Web: Client: SSO: refactoring
This commit is contained in:
parent
e09089b71c
commit
18173e397e
@ -13,7 +13,7 @@ import CertificatesTable from "./sub-components/CertificatesTable";
|
||||
import CheckboxSet from "./sub-components/CheckboxSet";
|
||||
import HideButton from "./sub-components/HideButton";
|
||||
import PropTypes from "prop-types";
|
||||
import SimpleComboBox from "./sub-components/SimpleComboBox";
|
||||
import SsoComboBox from "./sub-components/SsoComboBox";
|
||||
import {
|
||||
decryptAlgorithmsOptions,
|
||||
verifyAlgorithmsOptions,
|
||||
@ -121,7 +121,7 @@ const Certificates = (props) => {
|
||||
|
||||
{provider === "IdentityProvider" && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
<SsoComboBox
|
||||
labelText={t("idpSigningAlgorithm")}
|
||||
name="idpVerifyAlgorithm"
|
||||
options={verifyAlgorithmsOptions}
|
||||
@ -133,7 +133,7 @@ const Certificates = (props) => {
|
||||
|
||||
{provider === "ServiceProvider" && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
<SsoComboBox
|
||||
labelText={t("spSigningAlgorithm")}
|
||||
name="spSigningAlgorithm"
|
||||
options={verifyAlgorithmsOptions}
|
||||
@ -141,7 +141,7 @@ const Certificates = (props) => {
|
||||
value={spEncryptAlgorithm}
|
||||
/>
|
||||
|
||||
<SimpleComboBox
|
||||
<SsoComboBox
|
||||
labelText={t("StandardDecryptionAlgorithm")}
|
||||
name={"spEncryptAlgorithm"}
|
||||
options={decryptAlgorithmsOptions}
|
||||
|
@ -7,8 +7,8 @@ import FieldContainer from "@appserver/components/field-container";
|
||||
import HelpButton from "@appserver/components/help-button";
|
||||
import Text from "@appserver/components/text";
|
||||
|
||||
import SimpleCheckbox from "./sub-components/SimpleCheckbox";
|
||||
import SimpleFormField from "./sub-components/SimpleFormField";
|
||||
import Checkbox from "@appserver/components/checkbox";
|
||||
import SsoFormField from "./sub-components/SsoFormField";
|
||||
|
||||
const FieldMapping = (props) => {
|
||||
const { t } = useTranslation(["SingleSignOn", "Common"]);
|
||||
@ -26,6 +26,9 @@ const FieldMapping = (props) => {
|
||||
locationErrorMessage,
|
||||
titleErrorMessage,
|
||||
phoneErrorMessage,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
} = props;
|
||||
|
||||
return (
|
||||
@ -47,7 +50,7 @@ const FieldMapping = (props) => {
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("FirstName")}
|
||||
name="firstName"
|
||||
placeholder="givenName"
|
||||
@ -56,7 +59,7 @@ const FieldMapping = (props) => {
|
||||
errorMessage={firstNameErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("LastName")}
|
||||
name="lastName"
|
||||
placeholder="sn"
|
||||
@ -65,7 +68,7 @@ const FieldMapping = (props) => {
|
||||
errorMessage={lastNameErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("Common:Email")}
|
||||
name="email"
|
||||
placeholder="sn"
|
||||
@ -74,7 +77,7 @@ const FieldMapping = (props) => {
|
||||
errorMessage={emailErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("Location")}
|
||||
name="location"
|
||||
placeholder="sn"
|
||||
@ -83,7 +86,7 @@ const FieldMapping = (props) => {
|
||||
errorMessage={locationErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("Title")}
|
||||
name="title"
|
||||
placeholder="sn"
|
||||
@ -92,7 +95,7 @@ const FieldMapping = (props) => {
|
||||
errorMessage={titleErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("Common:Phone")}
|
||||
name="phone"
|
||||
placeholder="sn"
|
||||
@ -108,11 +111,14 @@ const FieldMapping = (props) => {
|
||||
place="top"
|
||||
tooltipContent={t("AdvancedSettingsTooltip")}
|
||||
>
|
||||
<SimpleCheckbox
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
label={t("HideAuthPage")}
|
||||
name="hideAuthPage"
|
||||
tabIndex={22}
|
||||
isChecked={hideAuthPage}
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
onChange={setCheckbox}
|
||||
/>
|
||||
</FieldContainer>
|
||||
</Box>
|
||||
@ -134,6 +140,9 @@ export default inject(({ ssoStore }) => {
|
||||
locationErrorMessage,
|
||||
titleErrorMessage,
|
||||
phoneErrorMessage,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
} = ssoStore;
|
||||
|
||||
return {
|
||||
@ -150,5 +159,8 @@ export default inject(({ ssoStore }) => {
|
||||
locationErrorMessage,
|
||||
titleErrorMessage,
|
||||
phoneErrorMessage,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
};
|
||||
})(observer(FieldMapping));
|
||||
|
@ -6,8 +6,8 @@ import Box from "@appserver/components/box";
|
||||
import RadioButtonGroup from "@appserver/components/radio-button-group";
|
||||
import Text from "@appserver/components/text";
|
||||
|
||||
import SimpleComboBox from "./sub-components/SimpleComboBox";
|
||||
import SimpleFormField from "./sub-components/SimpleFormField";
|
||||
import SsoComboBox from "./sub-components/SsoComboBox";
|
||||
import SsoFormField from "./sub-components/SsoFormField";
|
||||
import UploadXML from "./sub-components/UploadXML";
|
||||
import { bindingOptions, nameIdOptions } from "./sub-components/constants";
|
||||
|
||||
@ -37,7 +37,7 @@ const IdpSettings = (props) => {
|
||||
<Box>
|
||||
<UploadXML />
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("CustomEntryButton")}
|
||||
name="spLoginLabel"
|
||||
placeholder="Single Sign-on"
|
||||
@ -47,7 +47,7 @@ const IdpSettings = (props) => {
|
||||
errorMessage={spLoginLabelErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("ProviderURL")}
|
||||
name="entityId"
|
||||
placeholder="https://www.test.com"
|
||||
@ -57,7 +57,7 @@ const IdpSettings = (props) => {
|
||||
errorMessage={entityIdErrorMessage}
|
||||
/>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("SignOnEndpointUrl")}
|
||||
name={ssoBinding.includes("POST") ? "ssoUrlPost" : "ssoUrlRedirect"}
|
||||
placeholder="https://www.test.com/saml/login"
|
||||
@ -84,9 +84,9 @@ const IdpSettings = (props) => {
|
||||
tabIndex={6}
|
||||
/>
|
||||
</Box>
|
||||
</SimpleFormField>
|
||||
</SsoFormField>
|
||||
|
||||
<SimpleFormField
|
||||
<SsoFormField
|
||||
labelText={t("LogoutEndpointUrl")}
|
||||
name={sloBinding.includes("POST") ? "sloUrlPost" : "sloUrlRedirect"}
|
||||
placeholder="https://www.test.com/saml/logout"
|
||||
@ -113,9 +113,9 @@ const IdpSettings = (props) => {
|
||||
tabIndex={8}
|
||||
/>
|
||||
</Box>
|
||||
</SimpleFormField>
|
||||
</SsoFormField>
|
||||
|
||||
<SimpleComboBox
|
||||
<SsoComboBox
|
||||
labelText={t("NameIDFormat")}
|
||||
value={nameIdFormat}
|
||||
name="nameIdFormat"
|
||||
|
@ -3,7 +3,7 @@ import { inject, observer } from "mobx-react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
import Box from "@appserver/components/box";
|
||||
import SimpleCheckbox from "./SimpleCheckbox";
|
||||
import Checkbox from "@appserver/components/checkbox";
|
||||
|
||||
const checkboxesNames = {
|
||||
idp: [
|
||||
@ -30,11 +30,17 @@ const CheckboxSet = (props) => {
|
||||
spSignLogoutRequests,
|
||||
spSignLogoutResponses,
|
||||
spEncryptAssertions,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<Box marginProp="12px 0">
|
||||
<SimpleCheckbox
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
onChange={setCheckbox}
|
||||
label={prefix === "idp" ? t("idpAuthRequest") : t("spAuthRequest")}
|
||||
name={checkboxesNames[prefix][0]}
|
||||
tabIndex={10}
|
||||
@ -42,7 +48,10 @@ const CheckboxSet = (props) => {
|
||||
prefix === "idp" ? idpVerifyAuthResponsesSign : spSignAuthRequests
|
||||
}
|
||||
/>
|
||||
<SimpleCheckbox
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
onChange={setCheckbox}
|
||||
label={
|
||||
prefix === "idp" ? t("idpSignExitRequest") : t("spSignExitRequest")
|
||||
}
|
||||
@ -52,7 +61,10 @@ const CheckboxSet = (props) => {
|
||||
prefix === "idp" ? idpVerifyLogoutRequestsSign : spSignLogoutRequests
|
||||
}
|
||||
/>
|
||||
<SimpleCheckbox
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
onChange={setCheckbox}
|
||||
label={
|
||||
prefix === "idp"
|
||||
? t("idpSignResponseRequest")
|
||||
@ -68,7 +80,10 @@ const CheckboxSet = (props) => {
|
||||
/>
|
||||
|
||||
{prefix === "sp" && (
|
||||
<SimpleCheckbox
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
onChange={setCheckbox}
|
||||
label={t("spDecryptStatements")}
|
||||
name={checkboxesNames[prefix][3]}
|
||||
tabIndex={13}
|
||||
@ -88,6 +103,9 @@ export default inject(({ ssoStore }) => {
|
||||
spSignLogoutRequests,
|
||||
spSignLogoutResponses,
|
||||
spEncryptAssertions,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
} = ssoStore;
|
||||
|
||||
return {
|
||||
@ -98,5 +116,8 @@ export default inject(({ ssoStore }) => {
|
||||
spSignLogoutRequests,
|
||||
spSignLogoutResponses,
|
||||
spEncryptAssertions,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
};
|
||||
})(observer(CheckboxSet));
|
||||
|
@ -3,7 +3,7 @@ import { observer } from "mobx-react";
|
||||
|
||||
import FieldContainer from "@appserver/components/field-container";
|
||||
|
||||
import SimpleTextInput from "./SimpleTextInput";
|
||||
import SsoTextInput from "./SsoTextInput";
|
||||
|
||||
const MetadataUrlField = ({ labelText, name, placeholder, tooltipContent }) => {
|
||||
return (
|
||||
@ -14,7 +14,7 @@ const MetadataUrlField = ({ labelText, name, placeholder, tooltipContent }) => {
|
||||
place="top"
|
||||
tooltipContent={tooltipContent}
|
||||
>
|
||||
<SimpleTextInput isDisabled name={name} placeholder={placeholder} />
|
||||
<SsoTextInput isDisabled name={name} placeholder={placeholder} />
|
||||
</FieldContainer>
|
||||
);
|
||||
};
|
||||
|
@ -1,38 +0,0 @@
|
||||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
|
||||
import Checkbox from "@appserver/components/checkbox";
|
||||
|
||||
const SimpleCheckbox = (props) => {
|
||||
const {
|
||||
label,
|
||||
name,
|
||||
tabIndex,
|
||||
isChecked,
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<Checkbox
|
||||
className="checkbox-input"
|
||||
isDisabled={!enableSso || isLoadingXml}
|
||||
isChecked={isChecked}
|
||||
label={label}
|
||||
name={name}
|
||||
onChange={setCheckbox}
|
||||
tabIndex={tabIndex}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default inject(({ ssoStore }) => {
|
||||
const { enableSso, setCheckbox, isLoadingXml } = ssoStore;
|
||||
|
||||
return {
|
||||
enableSso,
|
||||
setCheckbox,
|
||||
isLoadingXml,
|
||||
};
|
||||
})(observer(SimpleCheckbox));
|
@ -6,7 +6,7 @@ import FieldContainer from "@appserver/components/field-container";
|
||||
|
||||
import StyledInputWrapper from "../styled-containers/StyledInputWrapper";
|
||||
|
||||
const SimpleComboBox = (props) => {
|
||||
const SsoComboBox = (props) => {
|
||||
const {
|
||||
labelText,
|
||||
name,
|
||||
@ -51,4 +51,4 @@ export default inject(({ ssoStore }) => {
|
||||
enableSso,
|
||||
isLoadingXml,
|
||||
};
|
||||
})(observer(SimpleComboBox));
|
||||
})(observer(SsoComboBox));
|
@ -4,9 +4,9 @@ import { useTranslation } from "react-i18next";
|
||||
|
||||
import FieldContainer from "@appserver/components/field-container";
|
||||
|
||||
import SimpleTextInput from "./SimpleTextInput";
|
||||
import SsoTextInput from "./SsoTextInput";
|
||||
|
||||
const SimpleFormField = ({
|
||||
const SsoFormField = ({
|
||||
children,
|
||||
labelText,
|
||||
name,
|
||||
@ -29,7 +29,7 @@ const SimpleFormField = ({
|
||||
tooltipContent={tooltipContent}
|
||||
>
|
||||
{children}
|
||||
<SimpleTextInput
|
||||
<SsoTextInput
|
||||
hasError={errorMessage !== null}
|
||||
name={name}
|
||||
placeholder={placeholder}
|
||||
@ -40,4 +40,4 @@ const SimpleFormField = ({
|
||||
);
|
||||
};
|
||||
|
||||
export default observer(SimpleFormField);
|
||||
export default observer(SsoFormField);
|
@ -5,7 +5,7 @@ import TextInput from "@appserver/components/text-input";
|
||||
|
||||
import StyledInputWrapper from "../styled-containers/StyledInputWrapper";
|
||||
|
||||
const SimpleTextInput = (props) => {
|
||||
const SsoTextInput = (props) => {
|
||||
const {
|
||||
hasError,
|
||||
isDisabled,
|
||||
@ -61,4 +61,4 @@ export default inject(({ ssoStore }) => {
|
||||
setError,
|
||||
hideError,
|
||||
};
|
||||
})(observer(SimpleTextInput));
|
||||
})(observer(SsoTextInput));
|
@ -8,7 +8,7 @@ import Button from "@appserver/components/button";
|
||||
import FieldContainer from "@appserver/components/field-container";
|
||||
import Text from "@appserver/components/text";
|
||||
|
||||
import SimpleTextInput from "./SimpleTextInput";
|
||||
import SsoTextInput from "./SsoTextInput";
|
||||
import FileInput from "@appserver/components/file-input";
|
||||
import UploadIcon from "../../../../../../../../public/images/actions.upload.react.svg";
|
||||
import { Base } from "@appserver/components/themes";
|
||||
@ -42,7 +42,7 @@ const UploadXML = (props) => {
|
||||
labelText={t("UploadXML")}
|
||||
>
|
||||
<Box alignItems="center" displayProp="flex" flexDirection="row">
|
||||
<SimpleTextInput
|
||||
<SsoTextInput
|
||||
maxWidth="300px"
|
||||
name="uploadXmlUrl"
|
||||
placeholder={t("UploadXMLPlaceholder")}
|
||||
|
Loading…
Reference in New Issue
Block a user