From a88b50e83fad269d09e1d620bdb294210e7b940a Mon Sep 17 00:00:00 2001
From: Russell Weiss <russell.weiss@mastercard.com>
Date: Thu, 1 Feb 2018 15:03:31 -0500
Subject: [PATCH] Add a button to reset example when user modifys request body

---
 .../oas3/components/request-body-editor.jsx   | 30 +++++++++++++------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/src/core/plugins/oas3/components/request-body-editor.jsx b/src/core/plugins/oas3/components/request-body-editor.jsx
index ff4c4dae..8c0f5d18 100644
--- a/src/core/plugins/oas3/components/request-body-editor.jsx
+++ b/src/core/plugins/oas3/components/request-body-editor.jsx
@@ -27,6 +27,7 @@ export default class RequestBodyEditor extends PureComponent {
 
     this.state = {
       isEditBox: false,
+      userDidModify: false,
       value: ""
     }
   }
@@ -59,6 +60,11 @@ export default class RequestBodyEditor extends PureComponent {
     this.onChange(this.sample(explicitMediaType))
   }
 
+  resetValueToSample = (explicitMediaType) = {
+    this.setState({ userDidModify: false })
+    this.setValueToSample(explicitMediaType)
+  }
+
   sample = (explicitMediaType) => {
     let { requestBody, mediaType } = this.props
     let schema = requestBody.getIn(["content", explicitMediaType || mediaType, "schema"]).toJS()
@@ -78,6 +84,7 @@ export default class RequestBodyEditor extends PureComponent {
     const isJson = /json/i.test(mediaType)
     const inputValue = isJson ? e.target.value.trim() : e.target.value
 
+    this.setState({ userDidModify: true });
     this.onChange(inputValue)
   }
 
@@ -87,13 +94,14 @@ export default class RequestBodyEditor extends PureComponent {
     let {
       isExecute,
       getComponent,
+      mediaType,
     } = this.props
 
     const Button = getComponent("Button")
     const TextArea = getComponent("TextArea")
     const HighlightCode = getComponent("highlightCode")
 
-    let { value, isEditBox } = this.state
+    let { value, isEditBox, userDidModify } = this.state
 
     return (
       <div className="body-param">
@@ -104,14 +112,18 @@ export default class RequestBodyEditor extends PureComponent {
                                value={ value }/>)
         }
         <div className="body-param-options">
-          {
-            !isExecute ? null
-                       : <div className="body-param-edit">
-                        <Button className={isEditBox ? "btn cancel body-param__example-edit" : "btn edit body-param__example-edit"}
-                                 onClick={this.toggleIsEditBox}>{ isEditBox ? "Cancel" : "Edit"}
-                         </Button>
-                         </div>
-          }
+          <div className="body-param-edit">
+            {
+              !isExecute ? null
+                         : <Button className={isEditBox ? "btn cancel body-param__example-edit" : "btn edit body-param__example-edit"}
+                                   onClick={this.toggleIsEditBox}>{ isEditBox ? "Cancel" : "Edit"}
+                           </Button>
+
+            }
+            { userDidModify &&
+              <Button className="btn" onClick={() => { this.resetValueToSample(mediaType); }}>Reset</Button>
+            }
+          </div>
         </div>
 
       </div>