refactor(oas31): change License component to be smart (#8476)

Refs #8474

src/core/plugins/oas3/spec-extensions/selectors.js

@@ -6,6 +6,8 @@ import { isSwagger2 as isSwagger2Helper, isOAS30 as isOAS30Helper } from "../hel
  * Helpers
  */
 
+const map = Map()
+
 export const isSwagger2 = () => (system) => {
   const spec = system.getSystem().specSelectors.specJson()
   return isSwagger2Helper(spec)
@@ -34,6 +36,5 @@ function onlyOAS3(selector) {
 
 export const servers = onlyOAS3(() => (system) => {
   const spec = system.specSelectors.specJson()
-  return spec.get("servers", servers.mapConst)
+  return spec.get("servers", map)
 })
-servers.mapConst = Map()

src/core/plugins/oas3/spec-extensions/wrap-selectors.js

@@ -8,6 +8,9 @@ import { Map } from "immutable"
 /**
  * Helpers
  */
+
+const map = Map()
+
 function onlyOAS3(selector) {
   return (ori, system) =>
     (...args) => {
@@ -31,9 +34,8 @@ const OAS3NullSelector = onlyOAS3(nullSelector)
 export const definitions = onlyOAS3(() => (system) => {
   const spec = system.getSystem().specSelectors.specJson()
   const schemas = spec.getIn(["components", "schemas"])
-  return Map.isMap(schemas) ? schemas : definitions.mapConst
+  return Map.isMap(schemas) ? schemas : map
 })
-definitions.mapConst = Map()
 
 export const hasHost = onlyOAS3(() => (system) => {
   const spec = system.getSystem().specSelectors.specJson()

src/core/plugins/oas31/components/license.jsx

@@ -3,50 +3,35 @@
  */
 import React from "react"
 import PropTypes from "prop-types"
-import { safeBuildUrl } from "core/utils/url"
+
 import { sanitizeUrl } from "core/utils"
 
-class License extends React.Component {
+const License = ({ getComponent, oas31Selectors }) => {
-  static propTypes = {
+  const name = oas31Selectors.selectLicenseNameField()
-    license: PropTypes.object,
+  const url = oas31Selectors.selectLicenseUrl()
-    getComponent: PropTypes.func.isRequired,
+  const Link = getComponent("Link")
-    selectedServer: PropTypes.string,
-    url: PropTypes.string.isRequired,
-  }
 
-  render() {
+  return (
-    const { license, getComponent, selectedServer, url: specUrl } = this.props
+    <div className="info__license">
-    const name = license.get("name", "License")
+      {url ? (
-    const url = sanitizeUrl(
+        <div className="info__license__url">
-      safeBuildUrl(license.get("url"), specUrl, { selectedServer })
+          <Link target="_blank" href={sanitizeUrl(url)}>
-    )
+            {name}
-    const identifier = license.get("identifier", "")
+          </Link>
-    const spdxURL = sanitizeUrl(`https://spdx.org/licenses/${identifier}.html`)
+        </div>
+      ) : (
+        <span>{name}</span>
+      )}
+    </div>
+  )
+}
 
-    const Link = getComponent("Link")
+License.propTypes = {
-
+  getComponent: PropTypes.func.isRequired,
-    return (
+  oas31Selectors: PropTypes.shape({
-      <div className="info__license">
+    selectLicenseNameField: PropTypes.func.isRequired,
-        {identifier && (
+    selectLicenseUrl: PropTypes.func.isRequired,
-          <div className="info__license__url">
+  }).isRequired,
-            <Link target="_blank" href={spdxURL}>
-              {name}
-            </Link>
-          </div>
-        )}
-
-        {url && !identifier && (
-          <div className="info__license__url">
-            <Link target="_blank" href={url}>
-              {name}
-            </Link>
-          </div>
-        )}
-
-        {!url && !identifier && <span>{name}</span>}
-      </div>
-    )
-  }
 }
 
 export default License

src/core/plugins/oas31/index.js

@@ -6,11 +6,22 @@ import License from "./components/license"
 import Info from "./components/info"
 import LicenseWrapper from "./wrap-components/license"
 import InfoWrapper from "./wrap-components/info"
-import { isOAS31, webhooks } from "./spec-extensions/selectors"
+import { isOAS31, license, webhooks } from "./spec-extensions/selectors"
 import { isOAS3 } from "./spec-extensions/wrap-selectors"
+import {
+  makeSelectLicenseUrl,
+  selectLicenseIdentifierField,
+  selectLicenseNameField,
+  selectLicenseUrlField,
+} from "./selectors"
 
 const OAS31Plugin = () => {
   return {
+    afterLoad(system) {
+      const oas31Selectors = this.statePlugins.oas31.selectors
+
+      oas31Selectors.selectLicenseUrl = makeSelectLicenseUrl(system)
+    },
     components: {
       Webhooks,
       OAS31Info: Info,
@@ -24,12 +35,20 @@ const OAS31Plugin = () => {
       spec: {
         selectors: {
           isOAS31,
+          license,
           webhooks,
         },
         wrapSelectors: {
           isOAS3,
         },
       },
+      oas31: {
+        selectors: {
+          selectLicenseNameField,
+          selectLicenseUrlField,
+          selectLicenseIdentifierField,
+        },
+      },
     },
   }
 }

src/core/plugins/oas31/selectors.js

@@ -0,0 +1,37 @@
+/**
+ * @prettier
+ */
+import { createSelector } from "reselect"
+
+import { safeBuildUrl } from "core/utils/url"
+
+export const selectLicenseNameField = () => (system) => {
+  return system.specSelectors.license().get("name", "License")
+}
+
+export const selectLicenseUrlField = () => (system) => {
+  return system.specSelectors.license().get("url")
+}
+
+export const selectLicenseIdentifierField = () => (system) => {
+  return system.specSelectors.license().get("identifier")
+}
+
+export const makeSelectLicenseUrl = (system) =>
+  createSelector(
+    () => system.specSelectors.url(),
+    () => system.oas3Selectors.selectedServer(),
+    () => system.oas31Selectors.selectLicenseUrlField(),
+    () => system.oas31Selectors.selectLicenseIdentifierField(),
+    (specUrl, selectedServer, url, identifier) => {
+      if (url) {
+        return safeBuildUrl(url, specUrl, { selectedServer })
+      }
+
+      if (identifier) {
+        return `https://spdx.org/licenses/${identifier}.html`
+      }
+
+      return undefined
+    }
+  )

src/core/plugins/oas31/spec-extensions/selectors.js

@@ -5,6 +5,8 @@ import { Map } from "immutable"
 
 import { isOAS31 as isOAS31Helper } from "../helpers"
 
+const map = Map()
+
 export const isOAS31 = () => (system) => {
   const spec = system.specSelectors.specJson()
   return isOAS31Helper(spec)
@@ -23,7 +25,9 @@ const onlyOAS31 =
   }
 
 export const webhooks = onlyOAS31(() => (system) => {
-  const spec = system.specSelectors.specJson()
+  return system.specSelectors.specJson().get("webhooks", map)
-  return spec.get("webhooks", webhooks.mapConst)
 })
-webhooks.mapConst = Map()
+
+export const license = () => (system) => {
+  return system.specSelectors.info().get("license", map)
+}

src/core/plugins/oas31/wrap-components/license.jsx

@@ -5,9 +5,9 @@ import React from "react"
 
 const LicenseWrapper = (Original, system) => (props) => {
   if (system.specSelectors.isOAS31()) {
-    const OAS31License = system.getComponent("OAS31License")
+    const OAS31License = system.getComponent("OAS31License", true)
 
-    return <OAS31License {...props} />
+    return <OAS31License />
   }
 
   return <Original {...props} />