Authorization server name displays `name` instead of `display name`

[hoivikaj]

Bug description

When creating an OAuth Authorization server, you are given the ability to set its id (name) and display name.

On the "Try this operation" form for APIs configured to use an authorization server, the label shown in the UI is the id property which is not as user friendly as the display name. I don't think this would be the desired intent for this form. As id cannot be changed, it varies from our display name greatly.

Reproduction steps

1. Go to 'APIs', Select an API, click 'Try this operation', a form appears from the right of the window.
2. Note within the 'Authorization' card a field for 'authorization server' is available. The value shown for this is the id property.

Expected behavior

I would expect the display name property to be shown, as its for a user selectable field.

Is self-hosted portal?

Yes

Warning

"Managed developer portal issues" will be closed automatically. See above for more details.

Release tag or commit SHA (if using self-hosted version)

2.3.3

Add any other context about the problem here, including screenshots.

Property id displayed in AZ portal translates to name property on the /authorizationServers API.

api-management-developer-portal/src/components/operations/operation-details/react/runtime/operation-console/ConsoleAuthorization.tsx

Line 70 in c7a2917

? <Body1>{selectedAuthorizationServer.name}</Body1>

Requesting the authorizationServer.properties.displayName be rendered instead of authorizationServer.name