Kelsey and Sandy - Avoid Duplicate Items

[sandaiiyahh]

For an example of how to fill this template out, see this Pull Request.

Description

AddItems Component

• Used regex to format the item name so that it ignores punctuation and .toLowerCase() to ignore capitalization
• Fetch all items for specific token in firestore
• Compare standardized version of items in firestore with inputted formatted item name
• If firestore item and inputted item match, alert the user there's a duplicate item. Item is not added to firestore

• Thoughts:

  • We didn't check for spaces and plural items
  • Do we want our firestore to formatted according to the user's input or have a standardized format throughout?

  ItemsList Component

• Fetched specific items to specific token

Related Issue

closes #6

Acceptance Criteria

• [x] Show an error message if the user tries to submit a new item that has the exact same name as an existing item
• [x] Show an error message if the user tries to submit a new item that has the same name as an existing item, where capitalization has been normalized and punctuation has been removed
• [x] The user’s original input should be what gets saved in the database

Type of Changes

	Type
	:bug: Bug fix
✓	:sparkles: New feature
✓	:hammer: Refactoring
	:100: Add tests
	:link: Update dependencies
	:scroll: Docs

Updates

Before

After

Testing Steps / QA Criteria

• Pull down branch
• Checkout to our branch kd-sd-avoid-duplicates
• npm start
• Add some items to list
• Try to add same item again. You should receive an error alert

[github-actions[bot]]

Visit the preview URL for this PR (updated for commit 1c7bb54):

https://tcl-28-shopping-list--pr24-ks-sd-avoid-duplicat-e1vgc9k2.web.app

_{(expires Thu, 05 Aug 2021 23:28:54 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

[isaabutaa]

Nice job Kelsey and Sandy! I pulled down the branch and tried it, and it works as you explained it would. I tried a number of different variations of chicken (chicken, Chicken, chicken!, ch!.-icken'), and it checks out. 🐔

In answer to your question, I wonder if it would be helpful to have a standardized format throughout? Like maybe we could ensure that all items saved in the database are lowercase. When we add an item using the variable itemTemplate, I wonder if we could have name: formattedItem, instead of name: item so that it saves the formatted version. But regardless, I think the code here works great as is. 🙂 Nice job!

[sandaiiyahh]

Nice work Kelsey and Sandy! Code is easy to read. The Firestore side of the code is similar to ours, and the usage of Regex to format the input is very nice! I tried creating a list and tried to add duplicate items. It showed me the alert message. 🥳

Just a suggestion, I think it would be better if we didn't throw an error in the console.

Oh true on the console log, I am not sure what is best practice! What do you think about that Kelsey?

[sandaiiyahh]

Nice job Kelsey and Sandy! I pulled down the branch and tried it, and it works as you explained it would. I tried a number of different variations of chicken (chicken, Chicken, chicken!, ch!.-icken'), and it checks out. 🐔

In answer to your question, I wonder if it would be helpful to have a standardized format throughout? Like maybe we could ensure that all items saved in the database are lowercase. When we add an item using the variable itemTemplate, I wonder if we could have name: formattedItem, instead of name: item so that it saves the formatted version. But regardless, I think the code here works great as is. 🙂 Nice job!

Yay, glad they all worked out with the regex! 🐔Yeah, the standardization would be ideal, being that it could eliminate having to check for lowercase each time 🤔

[ksiman14]

Nice work Kelsey and Sandy! Code is easy to read. The Firestore side of the code is similar to ours, and the usage of Regex to format the input is very nice! I tried creating a list and tried to add duplicate items. It showed me the alert message. 🥳 Just a suggestion, I think it would be better if we didn't throw an error in the console.

Oh true on the console log, I am not sure what is best practice! What do you think about that Kelsey?

Hmm, it would seem strange to have a catch statement without any console log, maybe we just log our message (i.e. "Error adding item to list" and not the full error?

[sandaiiyahh]

Nice work Kelsey and Sandy! Code is easy to read. The Firestore side of the code is similar to ours, and the usage of Regex to format the input is very nice! I tried creating a list and tried to add duplicate items. It showed me the alert message. 🥳 Just a suggestion, I think it would be better if we didn't throw an error in the console.

Oh true on the console log, I am not sure what is best practice! What do you think about that Kelsey?

Hmm, it would seem strange to have a catch statement without any console log, maybe we just log our message (i.e. "Error adding item to list" and not the full error?

Oh the catch error is fine. The throw error is the one logging to the console: const err = new Error('You have already added this item!'); throw err; Maybe we don't need this since there is already that catch error to fall back on?