From 57a332851af5aff270b97314bacbab2b4de17cc5 Mon Sep 17 00:00:00 2001
From: Aruna Herath <arunabherath@gmail.com>
Date: Wed, 27 Jul 2016 11:57:11 +0530
Subject: [PATCH] Avoid mutating state

When knobs change instead of mutating the fields property in state
this assignes a new object as fields using setState.
---
 src/components/PropEditor.js | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/PropEditor.js b/src/components/PropEditor.js
index ee2e24fec411..5b692f97bbd3 100644
--- a/src/components/PropEditor.js
+++ b/src/components/PropEditor.js
@@ -58,17 +58,20 @@ export default class PropEditor extends React.Component {
     const { name, value } = change;
     const fields = this.state.fields;
     const { type } = fields[name];
-    fields[name].valid = true;
+    let valid = true;
     if (type === 'object') {
       try {
         eval(`(${value})`); // eslint-disable-line no-eval
       } catch (e) {
-        fields[name].valid = false;
+        valid = false;
       }
     }
 
-    fields[name].value = value;
-    this.setState({ fields });
+    const changedField = {};
+    changedField[name] = { ...fields[name], ...{ value, valid } };
+    const newFields = { ...fields, ...changedField };
+
+    this.setState({ fields: newFields });
   }
 
   createKnob(name) {