Display the OAuth2 Redirect URL in the authorization dialogue along side the existing URLs

src/core/components/auth/oauth2.jsx

@@ -109,7 +109,7 @@ export default class Oauth2 extends React.Component {
 
   render() {
     let {
-      schema, getComponent, authSelectors, errSelectors, name, specSelectors
+      schema, getComponent, authSelectors, errSelectors, name, specSelectors, getConfigs
     } = this.props
     const Input = getComponent("Input")
     const Row = getComponent("Row")
@@ -143,6 +143,7 @@ export default class Oauth2 extends React.Component {
     let errors = errSelectors.allErrors().filter( err => err.get("authId") === name)
     let isValid = !errors.filter( err => err.get("source") === "validation").size
     let description = schema.get("description")
+    let redirectUrl = getConfigs().oauth2RedirectUrl
 
     return (
       <div>
@@ -155,6 +156,7 @@ export default class Oauth2 extends React.Component {
         { oidcUrl && <p>OpenID Connect URL: <code>{ oidcUrl }</code></p> }
         { ( flow === AUTH_FLOW_IMPLICIT || flow === AUTH_FLOW_ACCESS_CODE ) && <p>Authorization URL: <code>{ schema.get("authorizationUrl") }</code></p> }
         { ( flow === AUTH_FLOW_PASSWORD || flow === AUTH_FLOW_ACCESS_CODE || flow === AUTH_FLOW_APPLICATION ) && <p>Token URL:<code> { schema.get("tokenUrl") }</code></p> }
+        { ( flow === AUTH_FLOW_IMPLICIT || flow === AUTH_FLOW_ACCESS_CODE ) && redirectUrl && <p>OAuth2 Redirect URL: <code>{ redirectUrl }</code></p> }
         <p className="flow">Flow: <code>{ flowToDisplay }</code></p>
 
         {

test/unit/components/oauth2.jsx

@@ -0,0 +1,108 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import { mount } from "enzyme"
+import Im from "immutable"
+import Oauth2 from "core/components/auth/oauth2"
+
+describe("<Oauth2/>", function () {
+  const dummyComponent = () => null
+  const components = {
+    Input: dummyComponent,
+    Row: dummyComponent,
+    Col: dummyComponent,
+    Button: dummyComponent,
+    authError: dummyComponent,
+    JumpToPath: dummyComponent,
+    Markdown: dummyComponent,
+    InitializedInput: dummyComponent,
+  }
+
+  const makeProps = ({ flow, oauth2RedirectUrl, isOAS3 = false }) => ({
+    name: "petstore_auth",
+    authorized: Im.Map(),
+    getComponent: (c) => components[c],
+    schema: Im.Map({
+      flow,
+      authorizationUrl: "https://example.com/authorize",
+      tokenUrl: "https://example.com/token",
+    }),
+    authSelectors: {
+      getConfigs: () => ({}),
+      selectAuthPath: () => "",
+      authorized: () => Im.Map(),
+    },
+    authActions: {},
+    errSelectors: {
+      allErrors: () => Im.List(),
+    },
+    oas3Selectors: {},
+    specSelectors: {
+      isOAS3: () => isOAS3,
+    },
+    errActions: {},
+    getConfigs: () => ({ oauth2RedirectUrl }),
+  })
+
+  it("displays the OAuth2 Redirect URL for the implicit flow when configured", function () {
+    const wrapper = mount(
+      <Oauth2
+        {...makeProps({
+          flow: "implicit",
+          oauth2RedirectUrl: "https://example.com/oauth2-redirect.html",
+        })}
+      />
+    )
+
+    expect(wrapper.text()).toContain(
+      "OAuth2 Redirect URL: https://example.com/oauth2-redirect.html"
+    )
+
+    wrapper.unmount()
+  })
+
+  it("displays the OAuth2 Redirect URL for the accessCode flow when configured", function () {
+    const wrapper = mount(
+      <Oauth2
+        {...makeProps({
+          flow: "accessCode",
+          oauth2RedirectUrl: "https://example.com/oauth2-redirect.html",
+        })}
+      />
+    )
+
+    expect(wrapper.text()).toContain(
+      "OAuth2 Redirect URL: https://example.com/oauth2-redirect.html"
+    )
+
+    wrapper.unmount()
+  })
+
+  it("does not display the OAuth2 Redirect URL when it is not configured", function () {
+    const wrapper = mount(
+      <Oauth2
+        {...makeProps({ flow: "implicit", oauth2RedirectUrl: undefined })}
+      />
+    )
+
+    expect(wrapper.text()).not.toContain("OAuth2 Redirect URL")
+
+    wrapper.unmount()
+  })
+
+  it("does not display the OAuth2 Redirect URL for flows that don't use a redirect", function () {
+    const wrapper = mount(
+      <Oauth2
+        {...makeProps({
+          flow: "application",
+          oauth2RedirectUrl: "https://example.com/oauth2-redirect.html",
+        })}
+      />
+    )
+
+    expect(wrapper.text()).not.toContain("OAuth2 Redirect URL")
+
+    wrapper.unmount()
+  })
+})