handleDelete

Alex Fukui individual

*********** Link to Replit
https://repl.it/@afukui/jquery-shopping-list-walkthrough-v2-14

*********** NOTES
 - The provided solution implemented the more graceful code:
 
   const itemIndex = STORE.findIndex(item => item.id === itemId);
   
   I pushed in an unnecessary variable in order to get to the same result.

*********** PLAIN TEXT
handleDeleteItemClicked()
- Listen for click on delete button (event delegation)
- grab the ID of the item clicked (getItemIDFromElement)
- look up the item by id (getItemIDFromElement)
- remove the item from the STORE (removeItemFromShoppingList)
- update dom (renderShoppingList)

*********** CODE

function handleDeleteItemClicked() {
  // this function will be responsible for when users want to delete a shopping list
  $('.js-shopping-list').on('click', '.js-item-delete', event => {
    console.log('`handleDeleteItemClicked` ran');
    const id = getItemIdFromElement(event.currentTarget);
    removeItemFromShoppingList(id);
    renderShoppingList();
  });
}

function removeItemFromShoppingList(itemId) {
  console.log('`removeItemFromShoppingList` ran');
  const item = STORE.find(item => item.id === itemId);
  const itemIndex = STORE.indexOf(item);
  STORE.splice(itemIndex, 1);
}