From 4661f4e5c2cd95b463833d8e66ba477e8d001088 Mon Sep 17 00:00:00 2001 From: GurukiranP Date: Thu, 9 Nov 2023 10:52:12 +0530 Subject: [PATCH] [ES-412] Implemented signup banner to all the login screens Signed-off-by: GurukiranP --- .../resources/application-local.properties | 5 +++- oidc-ui/public/locales/ar.json | 4 ++- oidc-ui/public/locales/en.json | 4 ++- oidc-ui/src/components/Background.js | 26 ++++++++++++++++++- oidc-ui/src/constants/clientConstants.js | 5 +++- oidc-ui/src/pages/Login.js | 1 + 6 files changed, 40 insertions(+), 5 deletions(-) diff --git a/esignet-service/src/main/resources/application-local.properties b/esignet-service/src/main/resources/application-local.properties index 9f67f471b..337159c72 100644 --- a/esignet-service/src/main/resources/application-local.properties +++ b/esignet-service/src/main/resources/application-local.properties @@ -252,6 +252,8 @@ crypto.PrependThumbprint.enable=true mosip.esignet.ui.wallet.config={{'wallet.name': 'Inji', 'wallet.logo-url': 'inji_logo.png', 'wallet.download-uri': '#', \ 'wallet.deep-link-uri': 'inji://landing-page-name?linkCode=LINK_CODE&linkExpireDateTime=LINK_EXPIRE_DT' }} +mosip.esignet.ui.signup.config={'signup.banner': true, 'signup.url': 'http://localhost:3000/signup'} + mosip.esignet.ui.config.key-values={'sbi.env': 'Developer', 'sbi.timeout.DISC': 30, \ 'sbi.timeout.DINFO': 30, 'sbi.timeout.CAPTURE': 30, 'sbi.capture.count.face': 1, 'sbi.capture.count.finger': 2, \ 'sbi.capture.count.iris': 1, 'sbi.capture.score.face': 70, 'sbi.capture.score.finger':70, 'sbi.capture.score.iris':70, \ @@ -259,7 +261,8 @@ mosip.esignet.ui.config.key-values={'sbi.env': 'Developer', 'sbi.timeout.DISC': 'consent.screen.timeout-buffer-in-secs': 5, 'sbi.port.range': 4501-4600, 'sbi.bio.subtypes.iris': 'UNKNOWN', 'sbi.bio.subtypes.finger': 'UNKNOWN', \ 'resend.otp.delay.secs': 120, 'captcha.enable': '', 'captcha.sitekey': '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI', \ 'linked-transaction-expire-in-secs': 120, 'wallet.qr-code-buffer-in-secs': 10, 'auth.txnid.length': 10, \ - 'otp.length': 6, 'password.regex': '', 'wallet.qr-code.auto-refresh-limit': 3, 'wallet.config': ${mosip.esignet.ui.wallet.config}} + 'otp.length': 6, 'password.regex': '', 'wallet.qr-code.auto-refresh-limit': 3, 'wallet.config': ${mosip.esignet.ui.wallet.config}, \ + 'signup.config': ${mosip.esignet.ui.signup.config}} ## ---------------------------------------------- VCI ------------------------------------------------------------------ diff --git a/oidc-ui/public/locales/ar.json b/oidc-ui/public/locales/ar.json index 61dd27af3..821c5e841 100644 --- a/oidc-ui/public/locales/ar.json +++ b/oidc-ui/public/locales/ar.json @@ -132,7 +132,9 @@ "download_now": "التحميل الان", "logo_alt": "e-Signet", "backgroud_image_alt": "قم بتسجيل الدخول باستخدام e-Signet", - "language": "لغة" + "language": "لغة", + "noAccount": "ليس لديك حساب؟", + "signup_with_one_login": "قم بالتسجيل باستخدام نظام تسجيل الدخول الواحد" }, "footer": { "powered_by": "مشغل بواسطة", diff --git a/oidc-ui/public/locales/en.json b/oidc-ui/public/locales/en.json index 6facb6c16..bde617a2f 100644 --- a/oidc-ui/public/locales/en.json +++ b/oidc-ui/public/locales/en.json @@ -132,7 +132,9 @@ "download_now": "Download Now", "logo_alt": "e-Signet", "backgroud_image_alt": "Sign in with e-Signet", - "language": "Language" + "language": "Language", + "noAccount": "Don't have an account?", + "signup_with_one_login": "Sign Up with One-Login System" }, "footer": { "powered_by": "Powered by", diff --git a/oidc-ui/src/components/Background.js b/oidc-ui/src/components/Background.js index 3d59e3d46..6d00f7bb6 100644 --- a/oidc-ui/src/components/Background.js +++ b/oidc-ui/src/components/Background.js @@ -1,5 +1,7 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; import { useTranslation } from "react-i18next"; +import { configurationKeys } from "../constants/clientConstants"; +import { useLocation } from "react-router-dom"; export default function Background({ heading, @@ -7,9 +9,25 @@ export default function Background({ clientName, component, i18nKeyPrefix = "header", + oidcService }) { const { t } = useTranslation("translation", { keyPrefix: i18nKeyPrefix }); + const location = useLocation(); + const [signupBanner, setSignupBanner] = useState(false); + const [signupURL, setSignupURL] = useState(""); + + let signupConfig = oidcService.getEsignetConfiguration( + configurationKeys.signupConfig + ); + + useEffect(() => { + if(signupConfig?.[configurationKeys.signupBanner]) { + setSignupBanner(true); + setSignupURL(signupConfig[configurationKeys.signupURL] + location.search + location.hash) + } + }, []); + const backgroundLogo = process.env.REACT_APP_BACKGROUND_LOGO === "true"; const sectionClass = process.env.REACT_APP_FOOTER === "true" ? "flexible-header-footer" : "flexible-header-only"; @@ -52,6 +70,12 @@ export default function Background({ > {component} + {/* Enable the signup banner when it is true in the signup.config of oauth-details */} + {signupBanner && +
+

{t("noAccount")}

+ {t("signup_with_one_login")} +
} diff --git a/oidc-ui/src/constants/clientConstants.js b/oidc-ui/src/constants/clientConstants.js index 2d46b274a..ee97018a6 100644 --- a/oidc-ui/src/constants/clientConstants.js +++ b/oidc-ui/src/constants/clientConstants.js @@ -76,7 +76,10 @@ const configurationKeys = { consentScreenExpireInSec: "consent.screen.timeout-in-secs", consentScreenTimeOutBufferInSec: "consent.screen.timeout-buffer-in-secs", walletQrCodeAutoRefreshLimit: "wallet.qr-code.auto-refresh-limit", - walletConfig: "wallet.config" + walletConfig: "wallet.config", + signupConfig: "signup.config", + signupBanner: "signup.banner", + signupURL: "signup.url" }; export { diff --git a/oidc-ui/src/pages/Login.js b/oidc-ui/src/pages/Login.js index 9d6f33cf7..addd589e3 100644 --- a/oidc-ui/src/pages/Login.js +++ b/oidc-ui/src/pages/Login.js @@ -191,6 +191,7 @@ export default function LoginPage({ i18nKeyPrefix = "header" }) { clientLogoPath={clientLogoURL} clientName={clientName} component={compToShow} + oidcService={oidcService} /> );