feat: support for showExtensions on Response objects (#6535)

src/core/components/response-extension.jsx

@@ -0,0 +1,12 @@
+import React from "react"
+import PropTypes from "prop-types"
+
+export const ResponseExtension = ({ xKey, xVal }) => {
+    return <div className="response__extension">{ xKey }: { String(xVal) }</div>
+}
+ResponseExtension.propTypes = {
+  xKey: PropTypes.string,
+  xVal: PropTypes.any
+}
+
+export default ResponseExtension

src/core/components/response.jsx

@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
 import ImPropTypes from "react-immutable-proptypes"
 import cx from "classnames"
 import { fromJS, Seq, Iterable, List, Map } from "immutable"
-import { getSampleSchema, fromJSOrdered, stringify } from "core/utils"
+import { getExtensions, getSampleSchema, fromJSOrdered, stringify } from "core/utils"
 import { isFunc } from "../utils"
 
 const getExampleComponent = ( sampleResponse, HighlightCode, getConfigs ) => {
@@ -88,9 +88,12 @@ export default class Response extends React.Component {
 
     let { inferSchema } = fn
     let isOAS3 = specSelectors.isOAS3()
+    const { showExtensions } = getConfigs()
 
+    let extensions = showExtensions ? getExtensions(response) : null
     let headers = response.get("headers")
     let links = response.get("links")
+    const ResponseExtension = getComponent("ResponseExtension")
     const Headers = getComponent("headers")
     const HighlightCode = getComponent("highlightCode")
     const ModelExample = getComponent("modelExample")
@@ -188,6 +191,8 @@ export default class Response extends React.Component {
             <Markdown source={ response.get( "description" ) } />
           </div>
 
+          { !showExtensions || !extensions.size ? null : extensions.map((v, key) => <ResponseExtension key={`${key}-${v}`} xKey={key} xVal={v} /> )}
+
           {isOAS3 && response.get("content") ? (
             <section className="response-controls">
               <div

src/core/presets/base.js

@@ -43,6 +43,7 @@ import OperationExtRow from "core/components/operation-extension-row"
 import HighlightCode from "core/components/highlight-code"
 import Responses from "core/components/responses"
 import Response from "core/components/response"
+import ResponseExtension from "core/components/response-extension"
 import ResponseBody from "core/components/response-body"
 import { Parameters } from "core/components/parameters"
 import ParameterExt from "core/components/parameter-extension"
@@ -119,6 +120,7 @@ export default function() {
       highlightCode: HighlightCode,
       responses: Responses,
       response: Response,
+      ResponseExtension: ResponseExtension,
       responseBody: ResponseBody,
       parameters: Parameters,
       parameterRow: ParameterRow,

src/style/_table.scss

@@ -184,3 +184,11 @@ table
 .response-col_links {
     min-width: 6em;
 }
+
+.response__extension
+{
+    font-size: 12px;
+    font-style: italic;
+
+    @include text_code($table-parameter-in-font-color);
+}