Render request bodies correctly (minus Example Value + editable functionality)

src/core/plugins/oas3/components/request-body.jsx

@@ -2,28 +2,25 @@ import React from "react"
 import { OrderedMap } from "immutable"
 
 
-export default ({ requestBody, getComponent, specSelectors }) => {
+export default ({ requestBody, getComponent, specSelectors, contentType }) => {
   const Markdown = getComponent("Markdown")
-  const Model = getComponent("model")
+  const ModelExample = getComponent("modelExample")
 
   const requestBodyDescription = (requestBody && requestBody.get("description")) || null
   const requestBodyContent = (requestBody && requestBody.get("content")) || new OrderedMap()
+  contentType = contentType || requestBodyContent.keySeq().first()
+
+  const mediaTypeValue = requestBodyContent.get(contentType)
 
   return <div>
     { requestBodyDescription &&
-      <p>{requestBodyDescription}</p>
+      <Markdown source={requestBodyDescription} />
     }
-    { !requestBodyContent.count() ? <p>No content</p> :
-      requestBodyContent.map((mediaTypeValue, key) => (
-        <div>
-          <h4>{key}</h4>
-          <Model
+    <ModelExample
       getComponent={ getComponent }
       specSelectors={ specSelectors }
       expandDepth={1}
-            schema={mediaTypeValue.get("schema")} />
-        </div>
-      )).toArray()
-    }
+      schema={mediaTypeValue.get("schema")}
+      example={<i>Not yet implemented</i>}/>
   </div>
 }

src/core/plugins/oas3/wrap-components/parameters.jsx

@@ -16,7 +16,8 @@ class Parameters extends Component {
    super(props)
    this.state = {
      callbackVisible: false,
-     parametersVisible: true
+     parametersVisible: true,
+     requestBodyContentType: ""
    }
  }
 
@@ -94,10 +95,12 @@ class Parameters extends Component {
 
     const ParameterRow = getComponent("parameterRow")
     const TryItOutButton = getComponent("TryItOutButton")
+    const ContentType = getComponent("contentType")
     const Callbacks = getComponent("Callbacks", true)
     const RequestBody = getComponent("RequestBody", true)
 
     const isExecute = tryItOutEnabled && allowTryItOut
+    const { isOAS3 } = specSelectors
 
     const requestBody = operation.get("requestBody")
     return (
@@ -153,13 +156,20 @@ class Parameters extends Component {
           <Callbacks callbacks={Map(operation.get("callbacks"))} />
         </div> : "" }
         {
-          requestBody && this.state.parametersVisible &&
+          isOAS3() && requestBody && this.state.parametersVisible &&
           <div className="opblock-section">
             <div className="opblock-section-header">
               <h4 className="opblock-title">Request body</h4>
+              <ContentType
+                value={this.state.requestBodyContentType}
+                contentTypes={ requestBody.get("content").keySeq() }
+                onChange={(val) => this.setState({ requestBodyContentType: val })}
+                className="body-param-content-type" />
             </div>
             <div className="opblock-description-wrapper">
-              <RequestBody requestBody={requestBody} />
+              <RequestBody
+                requestBody={requestBody}
+                contentType={this.state.requestBodyContentType}/>
             </div>
           </div>
         }