Doit deletion button
What we gotta do to delete an entry? We can't just not display it, we have to alter state enough to remove the entry from the array entirely.
function DeleteButton({ idx, entryArray, setEntryArray }) {
//Delete an entry from the array state
function delEntry() {
entryArray.splice(idx, 1);
entryArray.sort(function (a, b) {
return a.priority - b.priority;
});
setEntryArray(entryArray.slice());
//Update entryArray in localstorage
let str = JSON.stringify(entryArray);
localStorage.setItem("entryArray", str);
}
return (
<img
src="/delete.png"
alt="Delete Button"
className="delButton"
onClick={delEntry}
/>
);
}
delEntry splices the entryArray and removes the entry at the given index, idx. The entries are re-sorted by priority, and then stringified and placed into local storage. It's really quite simple, but big news: this deletes EVERYTHING From our entry, and deletes it from our entryArray. This is accomplished by the
entryArray.splice(idx, 1);
line. Everything else is gravy. We call .splice on the entryArray, taking the entry at idx, and deleting it (and only it, based on the 1 we pass in) and boom. We donezo.
ezpz. Now the garbage-can icon that loads with every entry will serve to delete it from the entryArray entirely and resort. Donezo! Next up is crossing out entries. Do you need to see it? Let me know in the comments!