Display operationId

src/core/components/operation.jsx

@@ -17,6 +17,8 @@ export default class Operation extends React.Component {
 
     allowTryItOut: PropTypes.bool,
 
+    displayOperationId: PropTypes.bool,
+
     response: PropTypes.object,
     request: PropTypes.object,
 
@@ -35,6 +37,7 @@ export default class Operation extends React.Component {
     showSummary: true,
     response: null,
     allowTryItOut: true,
+    displayOperationId: false,
   }
 
   constructor(props, context) {
@@ -108,6 +111,7 @@ export default class Operation extends React.Component {
       response,
       request,
       allowTryItOut,
+      displayOperationId,
 
       fn,
       getComponent,
@@ -126,6 +130,7 @@ export default class Operation extends React.Component {
     let produces = operation.get("produces")
     let schemes = operation.get("schemes")
     let parameters = getList(operation, ["parameters"])
+    let operationId = operation.get("__originalOperationId")
 
     const Responses = getComponent("responses")
     const Parameters = getComponent( "parameters" )
@@ -162,6 +167,8 @@ export default class Operation extends React.Component {
                 </div>
             }
 
+            { displayOperationId && operationId ? <span className="opblock-summary-path">{operationId}</span> : null }
+
             {
               (!security || !security.count()) ? null :
                 <AuthorizeOperationBtn authActions={ authActions }

src/core/components/operations.jsx

@@ -10,11 +10,12 @@ export default class Operations extends React.Component {
     layoutActions: PropTypes.object.isRequired,
     authActions: PropTypes.object.isRequired,
     authSelectors: PropTypes.object.isRequired,
+    displayOperationId: PropTypes.bool,
     getConfigs: PropTypes.func.isRequired
   };
 
   static defaultProps = {
-
+    displayOperationId: false
   };
 
   render() {
@@ -26,6 +27,7 @@ export default class Operations extends React.Component {
       layoutActions,
       authActions,
       authSelectors,
+      displayOperationId,
       getConfigs,
       fn
     } = this.props
@@ -37,6 +39,7 @@ export default class Operations extends React.Component {
 
     let showSummary = layoutSelectors.showSummary()
     let { docExpansion } = getConfigs()
+    displayOperationId = getConfigs().displayOperationId
 
     return (
         <div>
@@ -90,6 +93,8 @@ export default class Operations extends React.Component {
                           request={ request }
                           allowTryItOut={allowTryItOut}
 
+                          displayOperationId={displayOperationId}
+
                           specActions={ specActions }
                           specSelectors={ specSelectors }
 

src/core/index.js

@@ -8,7 +8,7 @@ import { parseSeach, filterConfigs } from "core/utils"
 
 const CONFIGS = [ "url", "spec", "validatorUrl", "onComplete", "onFailure", "authorizations", "docExpansion",
     "apisSorter", "operationsSorter", "supportedSubmitMethods", "dom_id", "defaultModelRendering", "oauth2RedirectUrl",
-    "showRequestHeaders", "custom", "modelPropertyMacro", "parameterMacro" ]
+    "showRequestHeaders", "custom", "modelPropertyMacro", "parameterMacro", "displayOperationId" ]
 
 // eslint-disable-next-line no-undef
 const { GIT_DIRTY, GIT_COMMIT, PACKAGE_VERSION } = buildInfo
@@ -28,6 +28,7 @@ module.exports = function SwaggerUI(opts) {
     validatorUrl: "https://online.swagger.io/validator",
     configs: {},
     custom: {},
+    displayOperationId: false,
 
     // Initial set of plugins ( TODO rename this, or refactor - we don't need presets _and_ plugins. Its just there for performance.
     // Instead, we can compile the first plugin ( it can be a collection of plugins ), then batch the rest.