Admin Portal UI issues when adding a Key Manager

[ashera96]

Description

The following UI issues were noticed when trying to add Azure AD as a Key Manager [1].

1. When following along our documentation [1], point 3 under step 1 mentions to add the well-known URL and click on Import. However, when doing so some of the previously filled fields like Grant Types, Microsoft Graph API Endpoint, Client ID, Client Secret and Key Manager Permission resets. Check the feasibility of retaining those previously filled values in the form as opposed to clearing out those fields by force.

2. When importing the Well-known URL, some fields get filled automatically. Noticed that the UserInfo Endpoint is not getting picked properly in this scenario. However, this is a required field as per the UI. By checking the well-known url's response, it was noticed that there is a userinfo endpoint available there. Please check if this is a required field or not, if required check why its not getting retrieved.

3. Under the Connector Configurations section there is a checkbox for Microsoft Graph API Endpoint Version which is not marked as required. However, when checking the codebase, noticed how this is a required field. If this is not checked, there can be validation issues. We need to fix the UI by marking the Microsoft Graph API Endpoint Version as required. Take note that this can be done programmatically by checking the required nature of this field under [2]. This information is already available at this location: keymanagerConnectorConfiguration.required.

4. Also, UI error message for required fields not being filled properly should be improved. Alert message that appears should ideally show what's missing as opposed to this general error message.

Apart from the above-mentioned UI issues, we need to improve the documentation [1] to overcome the 403 issue that is encountered upon key generation. The fix for that issue is as follows:

After completing [3], need to ensure that all permissions have been granted. One can grant those permissions by clicking on the Grant admin consent for Default Directory button right next to Add a permission button.

[1] https://apim.docs.wso2.com/en/latest/administer/key-managers/configure-azure-ad-key-manager/
[2] https://github.com/wso2-support/apim-apps/blob/support-9.1.74.x-full/portals/admin/src/main/webapp/source/src/app/components/KeyManagers/KeyManagerConfiguration.jsx#L113-L119
[3] https://apim.docs.wso2.com/en/latest/administer/key-managers/configure-azure-ad-key-manager/#step-3-configured-permissions

Steps to Reproduce

Mentioned above

Affected Component

APIM

Version

4.4.0

Environment Details (with versions)

No response

Relevant Log Output

No response

Related Issues

No response

Suggested Labels

No response