Account console confusing with WebAuthn

[hmlnarik]

Before reporting an issue

• I have read and understood the above terms for submitting issues, and I understand that my issue may be closed without action if I do not follow them.

Area

account/ui

Describe the bug

Account console v3 is confusing at least when WebAuthn is enabled. See the picture below:

This was rendered using the following JSON:

[
    {
        "type": "password",
        "category": "basic-authentication",
        "displayName": "password-display-name",
        "helptext": "password-help-text",
        "iconCssClass": "kcAuthenticatorPasswordClass",
        "updateAction": "UPDATE_PASSWORD",
        "removeable": false,
        "userCredentialMetadatas": [
            {
                "credential": {
                    "id": "d86e83d4-9893-4fcf-8c97-bc01aa67d228",
                    "type": "password",
                    "createdDate": 1710251125241,
                    "credentialData": "{\"hashIterations\":210000,\"algorithm\":\"pbkdf2-sha512\",\"additionalParameters\":{}}"
                }
            }
        ]
    },
    {
        "type": "otp",
        "category": "two-factor",
        "displayName": "otp-display-name",
        "helptext": "otp-help-text",
        "iconCssClass": "kcAuthenticatorOTPClass",
        "createAction": "CONFIGURE_TOTP",
        "removeable": true,
        "userCredentialMetadatas": []
    },
    {
        "type": "webauthn",
        "category": "two-factor",
        "displayName": "webauthn-display-name",
        "helptext": "webauthn-help-text",
        "iconCssClass": "kcAuthenticatorWebAuthnClass",
        "createAction": "webauthn-register",
        "removeable": true,
        "userCredentialMetadatas": [
            {
                "credential": {
                    "id": "df335ecd-996f-4f77-8b54-465d19db110f",
                    "type": "webauthn",
                    "userLabel": "WebAuthn Authenticator (Default Label)",
                    "createdDate": 1710251197722,
                    "credentialData": "{\"aaguid\":\"00000000-0000-0000-0000-000000000000\",\"credentialId\":\"n9zgOzGPbL3b2Ki8GuJ8nr87hOT+2se+56Vg/lhyPU0=\",\"counter\":1,\"credentialPublicKey\":\"pQECAyYgASFYILmgt9ZBModiJ-yQxp7GsyjiYRUVRcmElkaoV7x2ySeKIlggJAox0K3-poP8nEcQKKCzs199uFcJTWzX9rEUihVjrwk\",\"attestationStatementFormat\":\"none\",\"transports\":[\"usb\"]}"
                }
            }
        ]
    },
    {
        "type": "webauthn-passwordless",
        "category": "passwordless",
        "displayName": "webauthn-passwordless-display-name",
        "helptext": "webauthn-passwordless-help-text",
        "iconCssClass": "kcAuthenticatorWebAuthnPasswordlessClass",
        "createAction": "webauthn-register-passwordless",
        "removeable": true,
        "userCredentialMetadatas": []
    }
]

Version

main

Regression

• The issue is a regression

Expected behavior

It is clear which section is Password, OTP, WebAuthn Passwordless, and WebAuthn

Actual behavior

It is unclear which section is OTP, which WebAuthn.

How to Reproduce?

Enable passwordless and go to account console.

Anything else?

No response

[hmlnarik]

This is actually a regression from v2 console, updating since v3 is now the default