'Set character minimum on Okta Sign in Widget (with React)

I am using the Okta Sign in Widget with okta/okta-react and okta/okta-signin-widget.

Our database is saving users and requires at least 2 characters for their first name, last name, and organization. I would like to set a minimum character limit when a user enters a single character. Currently, if a user enters a single character for any of those fields, Okta will register the account and not display any errors. I would like to create a custom error to display under the textfield, ex: This field must be at least 2 characters long.

I have looked into Okta's i18n properties and do not see any direct reference to the aforementioned fields.

My Widget snippet:

const widget = new OktaSignIn({
            baseUrl: issuer.split("/oauth2")[0],
            clientId,
            redirectUri,
            logo: `${process.env.PUBLIC_URL}/tempLogo.png`,
            i18n: { 
                en: {
                    "primaryauth.title": "Sign in to OceanTracking",
                // This is where I would like to enter the character limits
                },
            },
            authParams: {
                issuer,
                scopes,
            },
            useInteractionCodeFlow: useInteractionCode, 
            features: {
                registration: true,
            },
            onSuccess: onSuccess,
            onError: onError,
        })

Example of the type of error I'd like to display ("This field cannot be left blank"):

enter image description here

Thank you so much.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source