Enhancing UI Consistency with displayName Property

[movinsilva]

Is your suggestion related to an experience ? Please describe.

Introduce the displayName property to facilitate consistent UI population of authentication methods. This improvement ensures uniformity in presenting multiple authentication options , enhancing user experience and clarity.

Describe the improvement

Implement a new property named displayName to provide consistent and descriptive identifiers for all authenticators, addressing the inconsistency in displaying authenticator names across different login methods. This will improve clarity and usability in the UI, as outlined in the additional context.

Additional context

The current implementation faces challenges in displaying authenticator names consistently.

While social logins can utilize the idp as the display name, local authenticators are identified by a generic "Local" label, causing confusion. Moreover, these different kind of authenticators lack a common value to be used to display the information in UI.
ex:
{ "authenticatorId": "R2l0aHViQXV0aGVudGljYXRvcjpHaXRIdWIy",
"authenticator": "Github",
"idp": "GitHub2" }

{"authenticatorId": "ZW1haWwtb3RwLWF1dGhlbnRpY2F0b3I6TE9DQUw",
"authenticator": "Email OTP",
"idp": "LOCAL" }

• The first example can use the idp to display the name.
• But the second one will have to use authenticator.

To resolve this, the proposal suggests introducing a new "display name" property, ensuring clear and uniform authentication method identification for users across all login methods.

Additionally, incorporating an i18nKey for internationalization support would further enhance usability.