refactor to remove new phoneme object constructor from Features function body

src/components/Features.js

@@ -12,24 +12,27 @@ const parseFeaturesFromPhonemeObject = phonemeObject => {
   return Object.keys(featureMap).map(feature => <li key={`feature__${feature}`}>{`[+ ${feature}] = `}{featureMap[feature].join('|')}</li>);
 }
 
+const getPhonemesFromFeatureSubmission = (props, newPhonemes, feature) => {
+  let newPhonemeObject = newPhonemes.split('/').reduce((phonemeObject, newPhoneme) => {
+    newPhoneme = newPhoneme.trim();
+    phonemeObject = phonemeObject[newPhoneme]
+      ? {...phonemeObject, [newPhoneme]: [...phonemeObject[newPhoneme], feature]}
+      : {...phonemeObject, [newPhoneme]: [feature]}
+    return phonemeObject;
+  }, {...props.phonemes})
+  return newPhonemeObject;
+}
+
 const Features = (props) => {
   const [feature, setFeature] = useState('nasal')
   const [newPhonemes, setNewPhonemes] = useState('n / m / ŋ')
-
+  
   const newFeaturesSubmit = e => {
     e.preventDefault();
     
-    let newPhonemeObject = newPhonemes.split('/').reduce((phonemeObject, newPhoneme) => {
+    let newPhonemeObject = getPhonemesFromFeatureSubmission(props, newPhonemes, feature);
-      // console.log([...phonemeObject[newPhoneme], feature])
-      newPhoneme = newPhoneme.trim();
-      phonemeObject = phonemeObject[newPhoneme]
-        ? {...phonemeObject, [newPhoneme]: [...phonemeObject[newPhoneme], feature]}
-        : {...phonemeObject, [newPhoneme]: [feature]}
-      return phonemeObject;
-    }, {...props.phonemes})
-    
     props.setPhonemes(newPhonemeObject);
-
+    
     setFeature('');
     setNewPhonemes('');
   }