First release

src/components/AddItemForm.js

@@ -2,7 +2,7 @@ import React, {useRef} from 'react';
 
 
 
-const AddItemForm = ({addItem, items}) => {
+const AddItemForm = ({handleAddItem, items}) => {
 
     const itemInput = useRef();
 
@@ -19,7 +19,7 @@ const AddItemForm = ({addItem, items}) => {
         });
 
         if (!dupe && input) {
-            addItem(itemInput.current.value.replace(/(^|\s)[a-z]/g, f => f.toUpperCase()));
+            handleAddItem(itemInput.current.value.replace(/(^|\s)[a-z]/g, f => f.toUpperCase()));
             e.currentTarget.reset();
         }
 

src/components/Item.js

@@ -1,10 +1,10 @@
 import React from 'react';
 
 
-const Item = ({item, id, removeItem}) => {
+const Item = ({item, id, handleRemoveItem}) => {
     return (
         <span className='list-item'>
-            <button className='remove-item' onClick={() => removeItem(id)}>✖</button>
+            <button className='remove-item' onClick={() => handleRemoveItem(id)}>✖</button>
             {item}
         </span>
 

src/components/ItemsList.js

@@ -2,20 +2,20 @@ import React from 'react';
 import Item from './Item';
 import AddItemForm from './AddItemForm';
 
-const ItemsList = ({items, addItem, gameState, removeItem}) => {
+const ItemsList = ({items, handleAddItem, gameState, handleRemoveItem}) => {
 
   if (gameState === 'start') {
     return (
         <div className="items-list">
 
         <AddItemForm 
-        addItem={addItem}
+        handleAddItem={handleAddItem}
         items={items}
         />
                   {items.map(item =>
         <Item
           item={item.item}
-          removeItem={removeItem}
+          handleRemoveItem={handleRemoveItem}
           score={item.score}
           id={item.id}
           key={item.id.toString()}