From 7cb59947edd0ea08308054312e92f6ec3175500f Mon Sep 17 00:00:00 2001
From: Vikas Agarwal <vikas.agarwal@topcoder.com>
Date: Mon, 7 Nov 2016 15:40:09 +0530
Subject: [PATCH] Github issue #317 [Specification] - no option to remove the
 color added -- Found the root cause and fixed the issue. It was happening
 whenever user adds the same color twice from the picker.

---
 src/components/ColorSelector/ColorSelector.jsx | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/components/ColorSelector/ColorSelector.jsx b/src/components/ColorSelector/ColorSelector.jsx
index f006993b0..0eb801c8e 100644
--- a/src/components/ColorSelector/ColorSelector.jsx
+++ b/src/components/ColorSelector/ColorSelector.jsx
@@ -21,6 +21,11 @@ class ColorSelector extends React.Component {
     const value = getValue() || defaultColors
     const {isPickerVisible, newColor} = this.state
 
+    const updateNewColorPalette = (palette) => {
+      setValue(palette)
+      onChange(name, palette)
+    }
+
     const onColorToggle = (color) => {
       const index = value.indexOf(color)
       let newValue
@@ -32,8 +37,7 @@ class ColorSelector extends React.Component {
         newValue = tmp
       }
 
-      setValue(newValue)
-      onChange(name, newValue)
+      updateNewColorPalette(newValue)
     }
     
     return (
@@ -51,7 +55,7 @@ class ColorSelector extends React.Component {
             </span>
           </a>
         )}
-        
+
         {value.length < PROJECT_MAX_COLORS && 
           <a
             href="javascript:"
@@ -70,9 +74,11 @@ class ColorSelector extends React.Component {
                 <button type="button" className="tc-btn tc-btn-primary tc-btn-md"
                   onClick={() => {
                     this.setState({isPickerVisible: false})
-                    const newValue = [...value, newColor]
-                    setValue(newValue)
-                    onChange(name, newValue)
+                    const index = value.indexOf(this.state.newColor)
+                    if (index === -1) {
+                      const newValue = [ ...value, newColor ]
+                      updateNewColorPalette(newValue)
+                    }
                   }}
                 >Add</button>
                 <button