hide menu on click

client/src/box.js

@@ -13,7 +13,14 @@ const Box = ({ boxData, boxHandler, itemHandler }) => {
         if (menu.current.contains(event.target)) return;
         setShowMenu(false);
     }
-
+    const handleClickRemove = () => {
+        boxHandler.handleRemove(boxData._id);
+        setShowMenu(false);
+    }
+    const handleClickEdit = () => {
+        boxHandler.handleEdit(boxData._id);
+        setShowMenu(false);
+    }
     const [showMenu, setShowMenu] = useState(false);
     const handleBoxMenuClick = () => {
         setShowMenu(true);
@@ -21,11 +28,11 @@ const Box = ({ boxData, boxHandler, itemHandler }) => {
     const moreMenu = () => {
         return (
             <ul className='menu-more-list box'>
-                <li className='menu-action' onClick={() => boxHandler.handleEdit(boxData._id)}>
+                <li className='menu-action' onClick={handleClickEdit}>
                     <span className='material-icons icon'>edit</span>
                     <span className='label'>edit</span>
                 </li>
-                <li className='menu-action' onClick={() => boxHandler.handleRemove(boxData._id)}>
+                <li className='menu-action' onClick={handleClickRemove}>
                     <span className='material-icons icon'>delete</span>
                     <span className='label'>remove</span>
                 </li>