From 88e6948db0468013a6530a0b5ff3e3a96d259621 Mon Sep 17 00:00:00 2001
From: Jared Palmer <jared@palmer.net>
Date: Sun, 5 Jan 2020 12:23:43 -0800
Subject: [PATCH] Use enum for color pickers instead of strings

---
 src/index.tsx | 26 ++++++++++++++++----------
 1 file changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/index.tsx b/src/index.tsx
index fb78f4782..10f25f5a9 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -814,10 +814,16 @@ function restore(
   }
 }
 
+enum ColorPicker {
+  CANVAS_BACKGROUND,
+  SHAPE_STROKE,
+  SHAPE_BACKGROUND
+}
+
 type AppState = {
   draggingElement: ExcalidrawElement | null;
   resizingElement: ExcalidrawElement | null;
-  currentColorPicker: "Background" | "ShapeStroke" | "ShapeBackground" | null;
+  currentColorPicker: ColorPicker | null;
   elementType: string;
   exportBackground: boolean;
   currentItemStrokeColor: string;
@@ -1165,13 +1171,13 @@ class App extends React.Component<{}, AppState> {
                 onClick={() =>
                   this.setState(s => ({
                     currentColorPicker:
-                      s.currentColorPicker === "Background"
+                      s.currentColorPicker === ColorPicker.CANVAS_BACKGROUND
                         ? null
-                        : "Background"
+                        : ColorPicker.CANVAS_BACKGROUND
                   }))
                 }
               ></button>
-              {this.state.currentColorPicker === "Background" ? (
+              {this.state.currentColorPicker === ColorPicker.CANVAS_BACKGROUND ? (
                 <div className="popover">
                   <div
                     className="cover"
@@ -1204,13 +1210,13 @@ class App extends React.Component<{}, AppState> {
                 onClick={() =>
                   this.setState(s => ({
                     currentColorPicker:
-                      s.currentColorPicker === "ShapeStroke"
+                      s.currentColorPicker === ColorPicker.SHAPE_STROKE
                         ? null
-                        : "ShapeStroke"
+                        : ColorPicker.SHAPE_STROKE
                   }))
                 }
               ></button>
-              {this.state.currentColorPicker === "ShapeStroke" ? (
+              {this.state.currentColorPicker === ColorPicker.SHAPE_STROKE ? (
                 <div className="popover">
                   <div
                     className="cover"
@@ -1243,13 +1249,13 @@ class App extends React.Component<{}, AppState> {
                 onClick={() =>
                   this.setState(s => ({
                     currentColorPicker:
-                      s.currentColorPicker === "ShapeBackground"
+                      s.currentColorPicker === ColorPicker.SHAPE_BACKGROUND
                         ? null
-                        : "ShapeBackground"
+                        : ColorPicker.SHAPE_BACKGROUND
                   }))
                 }
               ></button>
-              {this.state.currentColorPicker === "ShapeBackground" ? (
+              {this.state.currentColorPicker === ColorPicker.SHAPE_BACKGROUND ? (
                 <div className="popover">
                   <div
                     className="cover"