feat: request snippets plugin (#6910)

docs/usage/configuration.md

@@ -65,6 +65,8 @@ Parameter name | Docker variable | Description
 <a name="syntaxHighlight.activate"></a>`syntaxHighlight.activate` | _Unavailable_ | `Boolean=true`. Whether syntax highlighting should be activated or not.
 <a name="syntaxHighlight.theme"></a>`syntaxHighlight.theme` | _Unavailable_ | `String=["agate"*, "arta", "monokai", "nord", "obsidian", "tomorrow-night"]`. [Highlight.js](https://highlightjs.org/static/demo/) syntax coloring theme to use. (Only these 6 styles are available.)
 <a name="tryItOutEnabled"></a>`tryItOutEnabled` | `TRY_IT_OUT_ENABLED` | `Boolean=false`. Controls whether the "Try it out" section should be enabled by default.
+<a name="requestSnippets"></a>`requestSnippets` | _Unavailable_ | `Object`. This is the default configuration section for the the requestSnippets plugin.<br>requestSnippets: {<br>&nbsp;&nbsp;generators: {<br>&nbsp;&nbsp;&nbsp;&nbsp;"curl_bash": {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;title: "cURL (bash)",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;syntax: "bash"<br>&nbsp;&nbsp;&nbsp;&nbsp;},<br>&nbsp;&nbsp;&nbsp;&nbsp;"curl_powershell": {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;title: "cURL (PowerShell)",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;syntax: "powershell"<br>&nbsp;&nbsp;&nbsp;&nbsp;},<br>&nbsp;&nbsp;&nbsp;&nbsp;"curl_cmd": {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;title: "cURL (CMD)",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;syntax: "bash"<br>&nbsp;&nbsp;&nbsp;&nbsp;},<br>&nbsp;&nbsp;&nbsp;&nbsp;"node_native": {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;title: "Node.js (Native)",<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;syntax: "javascript"<br>&nbsp;&nbsp;&nbsp;&nbsp;},<br>&nbsp;&nbsp;},<br>&nbsp;&nbsp;defaultExpanded: true,<br>&nbsp;&nbsp;languagesMask: null, // e.g. only show curl bash = \["curl_bash"\]<br>},
+
 
 ##### Network
 
@@ -168,4 +170,4 @@ SPEC="{ \"openapi\": \"3.0.0\" }"
 ```sh
 SUPPORTED_SUBMIT_METHODS=['get', 'post']
 URLS=[ { url: 'http://petstore.swagger.io/v2/swagger.json', name: 'Petstore' } ]
-```
+```

src/core/components/curl.jsx

@@ -1,9 +1,9 @@
 import React from "react"
 import PropTypes from "prop-types"
-import curlify from "core/curlify"
 import { CopyToClipboard } from "react-copy-to-clipboard"
 import {SyntaxHighlighter, getStyle} from "core/syntax-highlighting"
 import get from "lodash/get"
+import { requestSnippetGenerator_curl_bash } from "../plugins/request-snippets/fn"
 
 export default class Curl extends React.Component {
   static propTypes = {
@@ -13,7 +13,7 @@ export default class Curl extends React.Component {
 
   render() {
     let { request, getConfigs } = this.props
-    let curl = curlify(request)
+    let curl = requestSnippetGenerator_curl_bash(request)
 
     const config = getConfigs()
 

src/core/components/live-response.jsx

@@ -49,7 +49,7 @@ export default class LiveResponse extends React.Component {
 
   render() {
     const { response, getComponent, getConfigs, displayRequestDuration, specSelectors, path, method } = this.props
-    const { showMutatedRequest } = getConfigs()
+    const { showMutatedRequest, requestSnippetsEnabled } = getConfigs()
 
     const curlRequest = showMutatedRequest ? specSelectors.mutatedRequestFor(path, method) : specSelectors.requestFor(path, method)
     const status = response.get("status")
@@ -62,18 +62,21 @@ export default class LiveResponse extends React.Component {
     const headersKeys = Object.keys(headers)
     const contentType = headers["content-type"] || headers["Content-Type"]
 
-    const Curl = getComponent("curl")
     const ResponseBody = getComponent("responseBody")
     const returnObject = headersKeys.map(key => {
       var joinedHeaders = Array.isArray(headers[key]) ? headers[key].join() : headers[key]
       return <span className="headerline" key={key}> {key}: {joinedHeaders} </span>
     })
     const hasHeaders = returnObject.length !== 0
     const Markdown = getComponent("Markdown", true)
+    const RequestSnippets = getComponent("RequestSnippets", true)
+    const Curl = getComponent("curl")
 
     return (
       <div>
-        { curlRequest && <Curl request={ curlRequest } getConfigs={ getConfigs } /> }
+        { curlRequest && (requestSnippetsEnabled === true || requestSnippetsEnabled === "true"
+          ? <RequestSnippets request={ curlRequest }/>
+          : <Curl request={ curlRequest } getConfigs={ getConfigs } />) }
         { url && <div>
             <h4>Request URL</h4>
             <div className="request-url">

src/core/index.js

@@ -53,6 +53,29 @@ export default function SwaggerUI(opts) {
     showExtensions: false,
     showCommonExtensions: false,
     withCredentials: undefined,
+    requestSnippetsEnabled: false,
+    requestSnippets: {
+      generators: {
+        "curl_bash": {
+          title: "cURL (bash)",
+          syntax: "bash"
+        },
+        "curl_powershell": {
+          title: "cURL (PowerShell)",
+          syntax: "powershell"
+        },
+        "curl_cmd": {
+          title: "cURL (CMD)",
+          syntax: "bash"
+        },
+        "node_native": {
+          title: "Node.js (Native)",
+          syntax: "javascript"
+        },
+      },
+      defaultExpanded: true,
+      languagesMask: null, // e.g. only show curl bash = ["curl_bash"]
+    },
     supportedSubmitMethods: [
       "get",
       "put",
@@ -107,7 +130,8 @@ export default function SwaggerUI(opts) {
       spec: {
         spec: "",
         url: constructorConfig.url
-      }
+      },
+      requestSnippets: constructorConfig.requestSnippets
     }, constructorConfig.initialState)
   }