Merge branch 'ft/3584-operation-container-component' into ft/3598-responses-shouldComponentUpdate

src/core/components/operations.jsx

@@ -29,14 +29,11 @@ export default class Operations extends React.Component {
 
     let taggedOps = specSelectors.taggedOperations()
 
-    const Operation = getComponent("OperationContainer", true)
+    const OperationContainer = getComponent("OperationContainer", true)
     const Collapse = getComponent("Collapse")
 
-    let showSummary = layoutSelectors.showSummary()
     let {
       docExpansion,
-      displayOperationId,
-      displayRequestDuration,
       maxDisplayedTags,
       deepLinking
     } = getConfigs()
@@ -114,13 +111,15 @@ export default class Operations extends React.Component {
                   <Collapse isOpened={showTag}>
                     {
                       operations.map( op => {
-                        return <Operation
+                        const path = op.get("path")
-                          key={`${op.get("path")}-${op.get("method")}`}
+                        const method = op.get("method")
+
+                        return <OperationContainer
+                          key={`${path}-${method}`}
                           op={op}
+                          path={path}
+                          method={method}
                           tag={tag}
-                          showSummary={showSummary}
-                          displayOperationId={displayOperationId}
-                          displayRequestDuration={displayRequestDuration}
 
                           specActions={ specActions }
                           specSelectors={ specSelectors }

src/core/containers/OperationContainer.jsx

@@ -5,7 +5,7 @@ import { Iterable, fromJS } from "immutable"
 
 const { opId } = helpers
 
-export default class Operation extends PureComponent {
+export default class OperationContainer extends PureComponent {
   constructor(props, context) {
     super(props, context)
     this.state = {
@@ -50,27 +50,26 @@ export default class Operation extends PureComponent {
     displayRequestDuration: false
   }
 
-  static mapStateToProps(nextState, props) {
+  mapStateToProps(nextState, props) {
-    const { layoutSelectors, getConfigs } = props
+    const { op, layoutSelectors, getConfigs } = props
-    const { docExpansion, deepLinking } = getConfigs()
+    const { docExpansion, deepLinking, displayOperationId, displayRequestDuration } = getConfigs()
-    const op = props.op
+    const showSummary = layoutSelectors.showSummary()
-    const path = op.get("path", "")
+    const operationId = op.getIn(["operation", "operationId"]) || op.getIn(["operation", "__originalOperationId"]) || opId(op.get("operation"), props.path, props.method) || op.get("id")
-    const method = op.get("method", "")
-    const operationId = op.getIn(["operation", "operationId"]) || op.getIn(["operation", "__originalOperationId"]) || opId(op.get("operation"), path, method) || op.get("id")
     const isShownKey = fromJS(["operations", props.tag, operationId])
     const isDeepLinkingEnabled = deepLinking && deepLinking !== "false"
 
     return {
-      path,
-      method,
       operationId,
       isDeepLinkingEnabled,
+      isShownKey,
+      showSummary,
+      displayOperationId,
+      displayRequestDuration,
       isShown: layoutSelectors.isShown(isShownKey, docExpansion === "full" ),
-      jumpToKey: `paths.${path}.${method}`,
+      jumpToKey: `paths.${props.path}.${props.method}`,
-      isShownKey: isShownKey,
+      allowTryItOut: props.specSelectors.allowTryItOutFor(props.path, props.method),
-      allowTryItOut: props.specSelectors.allowTryItOutFor(op.get("path"), op.get("method")),
+      response: props.specSelectors.responseFor(props.path, props.method),
-      response: props.specSelectors.responseFor(op.get("path"), op.get("method")),
+      request: props.specSelectors.requestFor(props.path, props.method)
-      request: props.specSelectors.requestFor(op.get("path"), op.get("method"))
     }
   }
 

src/core/plugins/view/root-injects.js

@@ -20,7 +20,7 @@ const RootWrapper = (reduxStore, ComponentToWrap) => class extends Component {
 }
 
 const makeContainer = (getSystem, component, reduxStore) => {
-  const mapStateToProps = component.prototype.constructor.mapStateToProps || function(state) {
+  const mapStateToProps = component.prototype.mapStateToProps || function(state) {
     return {state}
   }
   let wrappedWithSystem = SystemWrapper(getSystem, component, reduxStore)

src/core/system.js

@@ -289,8 +289,7 @@ export default class Store {
 
   getMapStateToProps() {
     return () => {
-      let obj = Object.assign({}, this.getSystem())
+      return Object.assign({}, this.getSystem())
-      return obj
     }
   }