set up redux

package.json

@@ -7,7 +7,9 @@
     "node-sass": "^4.10.0",
     "react": "^16.6.3",
     "react-dom": "^16.6.3",
-    "react-scripts": "2.1.1"
+    "react-redux": "^6.0.0",
+    "react-scripts": "2.1.1",
+    "redux": "^4.0.1"
   },
   "scripts": {
     "sass": "node ./scripts/sass-reduce.js && node-sass --watch src/styles/scss -o src/styles/css",

src/actions/actionCreators.js

@@ -0,0 +1,76 @@
+/* BOARD ACTIONS */
+
+// Randomize board
+export const randomizeBoard = (height, width) => {
+  return {
+    type: "RANDOMIZE_BOARD",
+    height,
+    width
+  };
+};
+
+// Increment the board by one step
+export const incrementBoard = boardData => {
+  return {
+    type: "INCREMENT_BOARD",
+    boardData
+  };
+};
+
+// Clear the board
+export const clearBoard = () => {
+  return {
+    type: "CLEAR_BOARD"
+  };
+};
+
+// Load a preset board
+export const loadPreset = preset => {
+  return {
+    type: "LOAD_PRESET",
+    preset
+  };
+};
+
+/* GAME ACTIONS */
+
+// Play the game
+export const playGame = speed => {
+  return {
+    type: "PLAY_GAME",
+    speed
+  };
+};
+
+// Pause the game
+export const pauseGame = () => {
+  return {
+    type: "PAUSE_GAME"
+  };
+};
+
+/* CONFIG ACTIONS */
+
+export const setSpeed = speed => {
+  return {
+    type: "SET_SPEED",
+    speed
+  };
+};
+
+// Resize the board
+export const setSize = (height, width) => {
+  return {
+    type: "SET_SIZE",
+    height,
+    width
+  };
+};
+
+// Change the theme of the board
+export const setTheme = theme => {
+  return {
+    type: "SET_THEME",
+    theme
+  };
+};

src/Page.js → src/components/Page.js

@@ -190,7 +190,7 @@ class Page extends React.Component {
                 title={
                   <React.Fragment>
                     <Icon type="build" />
-                    <span>Patterns</span>
+                    <span>Presets</span>
                   </React.Fragment>
                 }
               >