Merge pull request #7509 from pavinduLakshan/branding_push_auth

.changeset/slow-moons-sing.md

@@ -0,0 +1,8 @@
+---
+"@wso2is/common.branding.v1": minor
+"@wso2is/admin.branding.v1": minor
+"@wso2is/identity-apps-core": patch
+"@wso2is/i18n": patch
+---
+
+Introduce branding support for push authentication screen

features/admin.branding.v1/components/preview/branding-preference-preview.tsx

@@ -272,6 +272,7 @@ export const BrandingPreferencePreview: FunctionComponent<BrandingPreferencePrev
         PreviewScreenType.PASSWORD_RECOVERY,
         PreviewScreenType.PASSWORD_RESET,
         PreviewScreenType.PASSWORD_RESET_SUCCESS,
+        PreviewScreenType.PUSH_AUTH,
         PreviewScreenType.USERNAME_RECOVERY_CLAIM,
         PreviewScreenType.USERNAME_RECOVERY_CHANNEL_SELECTION,
         PreviewScreenType.USERNAME_RECOVERY_SUCCESS

features/admin.branding.v1/components/preview/sign-in-box/fragments/push-auth-fragment.tsx

@@ -0,0 +1,75 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { IdentifiableComponentInterface } from "@wso2is/core/models";
+import React, { FunctionComponent, ReactElement } from "react";
+import { CustomTextPreferenceConstants } from "../../../../constants/custom-text-preference-constants";
+import useBrandingPreference from "../../../../hooks/use-branding-preference";
+
+/**
+ * Proptypes for the push authentication fragment of login screen skeleton.
+ */
+export type PushAuthFragmentInterface = IdentifiableComponentInterface;
+
+/**
+ * PushAuthFragment fragment component for the branding preview of Sign In box.
+ *
+ * @param props - Props injected to the component.
+ * @returns PushAuthFragment fragment component.
+ */
+const PushAuthFragment: FunctionComponent<PushAuthFragmentInterface> = ({
+    ["data-componentid"]: componentId = "branding-preview-push-auth-fragment"
+} : PushAuthFragmentInterface): ReactElement => {
+    const { i18n } = useBrandingPreference();
+
+    return (
+        <div data-componentid={ componentId }>
+            <h3 className="ui header text-center">
+                { i18n(CustomTextPreferenceConstants.TEXT_BUNDLE_KEYS.PUSH_AUTH.HEADING, "Verify Your Identity") }
+            </h3>
+
+            <div className="segment-form">
+                <form method="post" id="pushAuthForm" className="ui large form">
+                    <p className="text-center" id="instruction">
+                        {
+                            i18n(CustomTextPreferenceConstants.TEXT_BUNDLE_KEYS.PUSH_AUTH.BODY,
+                                "A push notification has been sent to your device. " +
+                                "Please respond to the request to continue."
+                            )
+                        }
+                    </p>
+
+                    <div className="ui divider hidden"></div>
+                    <div className="ui divider hidden"></div>
+                    <div>
+                        <input
+                            type="submit"
+                            id="subButton"
+                            value="00:57"
+                            className="ui primary fluid large button disabled"
+                        />
+                    </div>
+                    <div className="text-center mt-1"></div>
+                </form>
+            </div>
+        </div>
+    );
+};
+
+
+export default PushAuthFragment;

features/admin.branding.v1/components/preview/sign-in-box/sign-in-box.tsx

@@ -35,6 +35,7 @@ import PasswordRecoveryMultiOptionFragment from "./fragments/password-recovery/p
 import PasswordRecoverySMSFragment from "./fragments/password-recovery/password-recovery-sms-otp-fragment";
 import PasswordResetFragment from "./fragments/password-reset-fragment";
 import PasswordResetSuccessFragment from "./fragments/password-reset-success-fragment";
+import PushAuthFragment from "./fragments/push-auth-fragment";
 import SignUpFragment from "./fragments/sign-up-fragment";
 import SMSOTPFragment from "./fragments/sms-otp-fragment";
 import TOTPFragment from "./fragments/totp-fragment";
@@ -83,6 +84,8 @@ const SignInBox: FunctionComponent<SignInBoxInterface> = (
             return <SignUpFragment />;
         } else if (selectedScreen === PreviewScreenType.EMAIL_OTP) {
             return <EmailOTPFragment />;
+        } else if (selectedScreen === PreviewScreenType.PUSH_AUTH) {
+            return <PushAuthFragment />;
         } else if (selectedScreen === PreviewScreenType.SMS_OTP) {
             return <SMSOTPFragment />;
         } else if (selectedScreen === PreviewScreenType.TOTP) {

features/admin.branding.v1/constants/custom-text-preference-constants.ts

@@ -48,43 +48,43 @@ export class CustomTextPreferenceConstants {
         CUSTOM_TEXT_PREFERENCE_UPDATE_ERROR: IdentityAppsError;
         CUSTOM_TEXT_PREFERENCE_UPDATE_INVALID_STATUS_CODE_ERROR: IdentityAppsError;
 } = {
-    CUSTOM_TEXT_PREFERENCE_DELETE_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_DELETE_ERROR_CODE,
-        "An error occurred while deleting the Text Customizations for the requested resource.",
-        "Error while deleting Text Customizations",
-        null
-    ),
-    CUSTOM_TEXT_PREFERENCE_DELETE_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_DELETE_INVALID_STATUS_CODE_ERROR_CODE,
-        "Received an invalid status code while deleting the Text Customizations for the requested resource.",
-        "Invalid Error Code while deleting Text Customizations",
-        null
-    ),
-    CUSTOM_TEXT_PREFERENCE_FETCH_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_FETCH_ERROR_CODE,
-        "An error occurred while fetching the Text Customizations for the requested resource.",
-        "Error while fetching Text Customizations",
-        null
-    ),
-    CUSTOM_TEXT_PREFERENCE_FETCH_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_FETCH_INVALID_STATUS_CODE_ERROR_CODE,
-        "Received an invalid status code while fetching the Text Customizations for the requested resource.",
-        "Invalid Error Code while fetching Text Customizations",
-        null
-    ),
-    CUSTOM_TEXT_PREFERENCE_UPDATE_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_UPDATE_ERROR_CODE,
-        "An error occurred while updating the Text Customizations for the requested resource.",
-        "Error while updating Text Customizations",
-        null
-    ),
-    CUSTOM_TEXT_PREFERENCE_UPDATE_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
-        CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_UPDATE_INVALID_STATUS_CODE_ERROR_CODE,
-        "Received an invalid status code while updating the Text Customizations for the requested resource.",
-        "Invalid Error Code while updating Text Customizations",
-        null
-    )
-};
+            CUSTOM_TEXT_PREFERENCE_DELETE_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_DELETE_ERROR_CODE,
+                "An error occurred while deleting the Text Customizations for the requested resource.",
+                "Error while deleting Text Customizations",
+                null
+            ),
+            CUSTOM_TEXT_PREFERENCE_DELETE_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_DELETE_INVALID_STATUS_CODE_ERROR_CODE,
+                "Received an invalid status code while deleting the Text Customizations for the requested resource.",
+                "Invalid Error Code while deleting Text Customizations",
+                null
+            ),
+            CUSTOM_TEXT_PREFERENCE_FETCH_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_FETCH_ERROR_CODE,
+                "An error occurred while fetching the Text Customizations for the requested resource.",
+                "Error while fetching Text Customizations",
+                null
+            ),
+            CUSTOM_TEXT_PREFERENCE_FETCH_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_FETCH_INVALID_STATUS_CODE_ERROR_CODE,
+                "Received an invalid status code while fetching the Text Customizations for the requested resource.",
+                "Invalid Error Code while fetching Text Customizations",
+                null
+            ),
+            CUSTOM_TEXT_PREFERENCE_UPDATE_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_UPDATE_ERROR_CODE,
+                "An error occurred while updating the Text Customizations for the requested resource.",
+                "Error while updating Text Customizations",
+                null
+            ),
+            CUSTOM_TEXT_PREFERENCE_UPDATE_INVALID_STATUS_CODE_ERROR: new IdentityAppsError(
+                CustomTextPreferenceConstants.CUSTOM_TEXT_PREFERENCE_UPDATE_INVALID_STATUS_CODE_ERROR_CODE,
+                "Received an invalid status code while updating the Text Customizations for the requested resource.",
+                "Invalid Error Code while updating Text Customizations",
+                null
+            )
+        };
 
     /**
      * Text customization form element constraints.
@@ -181,6 +181,10 @@ export class CustomTextPreferenceConstants {
             BODY: string;
         },
         PRIVACY_POLICY: string;
+        PUSH_AUTH: {
+            HEADING: string;
+            BODY: string;
+        },
         REGISTER_TEXT: {
             MESSAGE: string;
             REGISTER: string;
@@ -197,101 +201,105 @@ export class CustomTextPreferenceConstants {
             HEADING: string;
         }
     } = {
-        COPYRIGHT: "copyright",
-        EMAIL_LINK_EXPIRY: {
-            MESSAGE: "email.link.expiry.message"
-        },
-        EMAIL_OTP: {
-            HEADING: "email.otp.heading"
-        },
-        LOGIN: {
-            BUTTON: "login.button",
-            HEADING: "login.heading",
-            IDENTIFIER: {
-                INPUT: {
-                    LABEL: "login.identifier.input.label"
+            COPYRIGHT: "copyright",
+            EMAIL_LINK_EXPIRY: {
+                MESSAGE: "email.link.expiry.message"
+            },
+            EMAIL_OTP: {
+                HEADING: "email.otp.heading"
+            },
+            LOGIN: {
+                BUTTON: "login.button",
+                HEADING: "login.heading",
+                IDENTIFIER: {
+                    INPUT: {
+                        LABEL: "login.identifier.input.label"
+                    }
                 }
-            }
-        },
-        PASSWORD_RECOVERY: {
-            BODY: "password.recovery.body",
-            BUTTON: {
-                EMAIL_LINK: "password.recovery.button.email.link",
-                MULTI: "password.recovery.button.multi",
-                SMS_OTP: "password.recovery.button.smsotp"
             },
-            HEADING: "password.recovery.heading",
-            IDENTIFIER: {
-                INPUT: {
-                    LABEL: "Username",
-                    PLACEHOLDER: "password.recovery.identifier.input.placeholder"
+            PASSWORD_RECOVERY: {
+                BODY: "password.recovery.body",
+                BUTTON: {
+                    EMAIL_LINK: "password.recovery.button.email.link",
+                    MULTI: "password.recovery.button.multi",
+                    SMS_OTP: "password.recovery.button.smsotp"
+                },
+                HEADING: "password.recovery.heading",
+                IDENTIFIER: {
+                    INPUT: {
+                        LABEL: "Username",
+                        PLACEHOLDER: "password.recovery.identifier.input.placeholder"
+                    }
+                },
+                RADIO_BUTTON: {
+                    EMAIL_LINK: "send.email.link",
+                    SMS_OTP: "send.code.via.sms"
                 }
             },
-            RADIO_BUTTON: {
-                EMAIL_LINK: "send.email.link",
-                SMS_OTP: "send.code.via.sms"
-            }
-        },
-        PASSWORD_RESET: {
-            BUTTON: "password.reset.button",
-            HEADING: "password.reset.heading"
-        },
-        PASSWORD_RESET_SUCCESS: {
-            ACTION: "password.reset.success.action",
-            BODY: "password.reset.success.body",
-            HEADING: "password.reset.success.heading"
-        },
-        PRIVACY_POLICY: "privacy.policy",
-        REGISTER_TEXT: {
-            MESSAGE: "dont.have.an.account",
-            REGISTER: "register"
-        },
-        SIGN_UP: {
-            BUTTON: "sign.up.button",
-            HEADING: "sign.up.heading"
-        },
-        SMS_OTP: {
-            HEADING: "sms.otp.heading"
-        },
-        TERMS_OF_SERVICE: "terms.of.service",
-        TOTP: {
-            HEADING: "totp.heading"
-        },
-        USERNAME_RECOVERY_CHANNEL_SELECTION: {
-            BODY: "username.recovery.channel.selection.body",
-            BUTTON: {
-                CANCEL: "username.recovery.channel.selection.cancel.button",
-                NEXT: "username.recovery.channel.selection.next.button"
+            PASSWORD_RESET: {
+                BUTTON: "password.reset.button",
+                HEADING: "password.reset.heading"
             },
-            HEADING: "username.recovery.channel.selection.heading",
-            RADIO_BUTTON: {
-                EMAIL: "send.username.via.email",
-                SMS: "send.username.via.sms"
-            }
-        },
-        USERNAME_RECOVERY_CLAIM: {
-            BODY: "username.recovery.body",
-            BUTTON: {
-                CANCEL: "username.recovery.cancel.button",
-                NEXT: "username.recovery.next.button"
+            PASSWORD_RESET_SUCCESS: {
+                ACTION: "password.reset.success.action",
+                BODY: "password.reset.success.body",
+                HEADING: "password.reset.success.heading"
             },
-            HEADING: "username.recovery.heading",
-            IDENTIFIER: {
-                INPUT: {
-                    LABEL: "contact",
-                    PLACEHOLDER: "contact"
+            PRIVACY_POLICY: "privacy.policy",
+            PUSH_AUTH: {
+                BODY: "push.notification.sent.msg",
+                HEADING: "push.auth.heading"
+            },
+            REGISTER_TEXT: {
+                MESSAGE: "dont.have.an.account",
+                REGISTER: "register"
+            },
+            SIGN_UP: {
+                BUTTON: "sign.up.button",
+                HEADING: "sign.up.heading"
+            },
+            SMS_OTP: {
+                HEADING: "sms.otp.heading"
+            },
+            TERMS_OF_SERVICE: "terms.of.service",
+            TOTP: {
+                HEADING: "totp.heading"
+            },
+            USERNAME_RECOVERY_CHANNEL_SELECTION: {
+                BODY: "username.recovery.channel.selection.body",
+                BUTTON: {
+                    CANCEL: "username.recovery.channel.selection.cancel.button",
+                    NEXT: "username.recovery.channel.selection.next.button"
+                },
+                HEADING: "username.recovery.channel.selection.heading",
+                RADIO_BUTTON: {
+                    EMAIL: "send.username.via.email",
+                    SMS: "send.username.via.sms"
+                }
+            },
+            USERNAME_RECOVERY_CLAIM: {
+                BODY: "username.recovery.body",
+                BUTTON: {
+                    CANCEL: "username.recovery.cancel.button",
+                    NEXT: "username.recovery.next.button"
+                },
+                HEADING: "username.recovery.heading",
+                IDENTIFIER: {
+                    INPUT: {
+                        LABEL: "contact",
+                        PLACEHOLDER: "contact"
+                    }
                 }
+            },
+            USERNAME_RECOVERY_SUCCESS_EMAIL: {
+                BODY: "username.recovery.email.success.body",
+                BUTTON: "username.recovery.success.action",
+                HEADING: "username.recovery.email.success.heading"
+            },
+            USERNAME_RECOVERY_SUCCESS_SMS: {
+                BODY: "username.recovery.sms.success.body",
+                BUTTON: "username.recovery.success.action",
+                HEADING: "username.recovery.sms.success.heading"
             }
-        },
-        USERNAME_RECOVERY_SUCCESS_EMAIL: {
-            BODY: "username.recovery.email.success.body",
-            BUTTON: "username.recovery.success.action",
-            HEADING: "username.recovery.email.success.heading"
-        },
-        USERNAME_RECOVERY_SUCCESS_SMS: {
-            BODY: "username.recovery.sms.success.body",
-            BUTTON: "username.recovery.success.action",
-            HEADING: "username.recovery.sms.success.heading"
-        }
-    };
+        };
 }