Web: Studio: SSO: Redesign
This commit is contained in:
parent
8a29efc401
commit
75071501cd
@ -27,6 +27,7 @@ const Certificates = ({ FormStore, t, provider }) => {
|
||||
break;
|
||||
case "ServiceProvider":
|
||||
prefix = "sp";
|
||||
break;
|
||||
}
|
||||
|
||||
return (
|
||||
@ -78,43 +79,52 @@ const Certificates = ({ FormStore, t, provider }) => {
|
||||
|
||||
<HideButton
|
||||
FormStore={FormStore}
|
||||
label="ShowAdditionalParameters"
|
||||
label={`${prefix}_showAdditionalParameters`}
|
||||
isAdditionalParameters
|
||||
t={t}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<CheckboxSet FormStore={FormStore} id={prefix} prefix={prefix} t={t} />
|
||||
|
||||
{provider === "IdentityProvider" && (
|
||||
{FormStore[`${prefix}_showAdditionalParameters`] && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
<CheckboxSet
|
||||
FormStore={FormStore}
|
||||
labelText={t(`${prefix}SigningAlgorithm`)}
|
||||
name={"idp_verifyAlgorithm"}
|
||||
options={verifyAlgorithmsOptions}
|
||||
tabIndex={14}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
||||
{provider === "ServiceProvider" && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
FormStore={FormStore}
|
||||
labelText={t(`${prefix}SigningAlgorithm`)}
|
||||
name={"sp_signingAlgorithm"}
|
||||
options={verifyAlgorithmsOptions}
|
||||
tabIndex={14}
|
||||
id={prefix}
|
||||
prefix={prefix}
|
||||
t={t}
|
||||
/>
|
||||
|
||||
<SimpleComboBox
|
||||
FormStore={FormStore}
|
||||
labelText={t("StandardDecryptionAlgorithm")}
|
||||
name={"sp_encryptAlgorithm"}
|
||||
options={decryptAlgorithmsOptions}
|
||||
tabIndex={15}
|
||||
/>
|
||||
{provider === "IdentityProvider" && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
FormStore={FormStore}
|
||||
labelText={t(`${prefix}SigningAlgorithm`)}
|
||||
name={"idp_verifyAlgorithm"}
|
||||
options={verifyAlgorithmsOptions}
|
||||
tabIndex={14}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
||||
{provider === "ServiceProvider" && (
|
||||
<>
|
||||
<SimpleComboBox
|
||||
FormStore={FormStore}
|
||||
labelText={t(`${prefix}SigningAlgorithm`)}
|
||||
name={"sp_signingAlgorithm"}
|
||||
options={verifyAlgorithmsOptions}
|
||||
tabIndex={14}
|
||||
/>
|
||||
|
||||
<SimpleComboBox
|
||||
FormStore={FormStore}
|
||||
labelText={t("StandardDecryptionAlgorithm")}
|
||||
name={"sp_encryptAlgorithm"}
|
||||
options={decryptAlgorithmsOptions}
|
||||
tabIndex={15}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
|
@ -12,8 +12,14 @@ import SimpleFormField from "./sub-components/SimpleFormField";
|
||||
const FieldMapping = ({ FormStore, t }) => {
|
||||
return (
|
||||
<Box>
|
||||
<Box alignItems="center" displayProp="flex" flexDirection="row">
|
||||
<Text as="h2" fontWeight={600}>
|
||||
<Box
|
||||
alignItems="center"
|
||||
displayProp="flex"
|
||||
flexDirection="row"
|
||||
fontSize="14px"
|
||||
marginProp="22px 0 14px 0"
|
||||
>
|
||||
<Text as="h2" fontSize="14px" fontWeight={600}>
|
||||
{t("AttributeMatching")}
|
||||
</Text>
|
||||
|
||||
|
@ -4,7 +4,6 @@ import { observer } from "mobx-react";
|
||||
import Box from "@appserver/components/box";
|
||||
import RadioButtonGroup from "@appserver/components/radio-button-group";
|
||||
|
||||
import HideButton from "./sub-components/HideButton";
|
||||
import SimpleComboBox from "./sub-components/SimpleComboBox";
|
||||
import SimpleFormField from "./sub-components/SimpleFormField";
|
||||
import Text from "@appserver/components/text";
|
||||
@ -14,8 +13,6 @@ import { bindingOptions, nameIdOptions } from "./sub-components/constants";
|
||||
const IdpSettings = ({ FormStore, t }) => {
|
||||
return (
|
||||
<Box>
|
||||
<HideButton FormStore={FormStore} label="ServiceProviderSettings" t={t} />
|
||||
|
||||
<UploadXML FormStore={FormStore} t={t} />
|
||||
|
||||
<SimpleFormField
|
||||
|
@ -4,14 +4,11 @@ import { observer } from "mobx-react";
|
||||
import Box from "@appserver/components/box";
|
||||
import Button from "@appserver/components/button";
|
||||
|
||||
import HideButton from "./sub-components/HideButton";
|
||||
import SimpleFormField from "./sub-components/SimpleFormField";
|
||||
|
||||
const ProviderMetadata = ({ FormStore, t }) => {
|
||||
return (
|
||||
<Box>
|
||||
<HideButton FormStore={FormStore} label="SPMetadata" t={t} />
|
||||
|
||||
<>
|
||||
<SimpleFormField
|
||||
FormStore={FormStore}
|
||||
labelText={t("SPEntityId")}
|
||||
@ -51,7 +48,7 @@ const ProviderMetadata = ({ FormStore, t }) => {
|
||||
tabIndex={28}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -6,8 +6,9 @@ import Box from "@appserver/components/box";
|
||||
import Button from "@appserver/components/button";
|
||||
import FormStore from "@appserver/studio/src/store/SsoFormStore";
|
||||
|
||||
import FieldMapping from "./FieldMapping";
|
||||
import Certificates from "./Certificates";
|
||||
import FieldMapping from "./FieldMapping";
|
||||
import HideButton from "./sub-components/HideButton";
|
||||
import IdpSettings from "./IdpSettings";
|
||||
import ProviderMetadata from "./ProviderMetadata";
|
||||
import StyledSsoPage from "./styled-containers/StyledSsoPageContainer";
|
||||
@ -17,35 +18,48 @@ const SingleSignOn = () => {
|
||||
const { t } = useTranslation(["SingleSignOn", "Common"]);
|
||||
|
||||
return (
|
||||
<StyledSsoPage>
|
||||
<StyledSsoPage
|
||||
hideSettings={FormStore.ServiceProviderSettings}
|
||||
hideMetadata={FormStore.SPMetadata}
|
||||
>
|
||||
<ToggleSSO FormStore={FormStore} t={t} />
|
||||
|
||||
<IdpSettings FormStore={FormStore} t={t} />
|
||||
<HideButton FormStore={FormStore} label="ServiceProviderSettings" t={t} />
|
||||
|
||||
<Certificates FormStore={FormStore} t={t} provider="IdentityProvider" />
|
||||
<Box className="service-provider-settings">
|
||||
<IdpSettings FormStore={FormStore} t={t} />
|
||||
|
||||
<Certificates FormStore={FormStore} t={t} provider="ServiceProvider" />
|
||||
<Certificates FormStore={FormStore} t={t} provider="IdentityProvider" />
|
||||
|
||||
<FieldMapping FormStore={FormStore} t={t} />
|
||||
<Certificates FormStore={FormStore} t={t} provider="ServiceProvider" />
|
||||
|
||||
<Box alignItems="center" displayProp="flex" flexDirection="row">
|
||||
<Button
|
||||
className="save-button"
|
||||
label={t("Common:SaveButton")}
|
||||
onClick={FormStore.onSubmit}
|
||||
primary
|
||||
size="medium"
|
||||
tabIndex={23}
|
||||
/>
|
||||
<Button
|
||||
label={t("ResetSettings")}
|
||||
onClick={FormStore.resetForm}
|
||||
size="medium"
|
||||
tabIndex={24}
|
||||
/>
|
||||
<FieldMapping FormStore={FormStore} t={t} />
|
||||
|
||||
<Box alignItems="center" displayProp="flex" flexDirection="row">
|
||||
<Button
|
||||
className="save-button"
|
||||
label={t("Common:SaveButton")}
|
||||
onClick={FormStore.onSubmit}
|
||||
primary
|
||||
size="medium"
|
||||
tabIndex={23}
|
||||
/>
|
||||
<Button
|
||||
label={t("ResetSettings")}
|
||||
onClick={FormStore.resetForm}
|
||||
size="medium"
|
||||
tabIndex={24}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<ProviderMetadata FormStore={FormStore} t={t} />
|
||||
<hr className="separator" />
|
||||
|
||||
<HideButton FormStore={FormStore} label="SPMetadata" t={t} />
|
||||
|
||||
<Box className="sp-metadata">
|
||||
<ProviderMetadata FormStore={FormStore} t={t} />
|
||||
</Box>
|
||||
</StyledSsoPage>
|
||||
);
|
||||
};
|
||||
|
@ -95,6 +95,21 @@ const StyledSsoPage = styled.div`
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.separator {
|
||||
margin: 24px 0;
|
||||
height: 1px;
|
||||
border: none;
|
||||
background-color: #eceef1;
|
||||
}
|
||||
|
||||
.service-provider-settings {
|
||||
display: ${(props) => (!props.hideSettings ? "none" : "block")};
|
||||
}
|
||||
|
||||
.sp-metadata {
|
||||
display: ${(props) => (!props.hideMetadata ? "none" : "block")};
|
||||
}
|
||||
`;
|
||||
|
||||
export default StyledSsoPage;
|
||||
|
@ -21,7 +21,7 @@ const regExps = {
|
||||
class SsoFormStore {
|
||||
uploadXmlUrl = "";
|
||||
|
||||
enableSso = true;
|
||||
enableSso = false;
|
||||
|
||||
spLoginLabel = "";
|
||||
|
||||
@ -79,10 +79,10 @@ class SsoFormStore {
|
||||
sp_singleLogoutUrl = "";
|
||||
|
||||
// hide parts of form
|
||||
ServiceProviderSettings = true;
|
||||
ShowAdditionalParametersIdp = true;
|
||||
ShowAdditionalParametersSp = true;
|
||||
SPMetadata = true;
|
||||
ServiceProviderSettings = false;
|
||||
idp_showAdditionalParameters = true;
|
||||
sp_showAdditionalParameters = true;
|
||||
SPMetadata = false;
|
||||
idp_isModalVisible = false;
|
||||
sp_isModalVisible = false;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user