From 26d85eec4c417b7fb794c16be755f00b27c03036 Mon Sep 17 00:00:00 2001
From: Sorrel Bri <sorrel.bri.june@gmail.com>
Date: Fri, 20 Dec 2019 13:33:43 -0800
Subject: [PATCH] hook SoundChangeSuite onChange events to dispatch SET_EPOCH

---
 src/components/Epochs.js           |  9 ++++++---
 src/components/SoundChangeSuite.js | 10 ++++++++--
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/Epochs.js b/src/components/Epochs.js
index 8a37255..90eddf5 100644
--- a/src/components/Epochs.js
+++ b/src/components/Epochs.js
@@ -25,11 +25,14 @@ const Epochs = props => {
   }
 
   const updateEpoch = (epoch, epochIndex) => {
-    let updatedEpochs = [...props.epochs]
-    updatedEpochs[epochIndex] = epoch
+    const dispatchValue = {
+      name: epoch.name,
+      index: epochIndex,
+      changes: epoch.changes
+    }
     props.dispatch({
       type: "SET_EPOCH",
-      value: epoch
+      value: dispatchValue
     })
   }
 
diff --git a/src/components/SoundChangeSuite.js b/src/components/SoundChangeSuite.js
index 59abeef..eb0b6e5 100644
--- a/src/components/SoundChangeSuite.js
+++ b/src/components/SoundChangeSuite.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import './SoundChangeSuite.scss';
 
 const SoundChangeSuite = props => {
@@ -8,6 +8,10 @@ const SoundChangeSuite = props => {
     cb(e);
     props.updateEpoch(epoch, props.epochIndex);
   }
+  
+  useEffect(() => {
+    props.updateEpoch(epoch, props.epochIndex);
+  }, [epoch])
 
   return (
     <div className="SoundChangeSuite" data-testid={`${epoch.name}_SoundChangeSuite`}>
@@ -19,7 +23,9 @@ const SoundChangeSuite = props => {
           id="" cols="30" rows="1" 
           value={epoch.name} 
           onChange={e=>changeHandler(
-            e, () => setEpoch({...epoch, name:e.target.value})
+            e, () => {
+              setEpoch({...epoch, name:e.target.value})
+            }
           )} 
         ></textarea>