Use enum for color pickers instead of strings

This commit is contained in:
Jared Palmer 2020-01-05 12:23:43 -08:00
parent 8d9ffb2f8a
commit 88e6948db0

View file

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