Sm ar items in order issue 13

[arandel1]

Description

• User's lists are now sorted based on how soon it's recommended they purchase an item (how soon each item's dateNextPurchased value is).
• Lists are sorted based on Soon(!!!), Kind of Soon(!!), Not Soon(!), Overdue(!!!!), and Inactive statuses. Different exclamation points illustrate urgency and are placeholder icons until we collaborate on more specific design choices.
• From there, lists are sorted alphabetically.

Related Issue

closes 13

Acceptance Criteria

• Items in the list are shown with an indicator that tells the user they should buy the item “soon”, “kind of soon”, or “not soon”; or that the item is “inactive”
• This urgency indicator does not rely on only color
• api/firestore.js exports a new comparePurchaseUrgency function with the following behaviors
  • sorts inactive items last, then
  • sorts items in ascending order of days until purchase, and
  • sorts items with the same days until purchase alphabetically

A stretch goal
If you complete all of the previous acceptance criteria, consider what happens when an item’s dateNextPurchased has passed, but it isn’t yet inactive. Let’s call that item “overdue”.

• Extend the functionality of comparePurchaseUrgency to sort “overdue” items to the top of the list
• Indicate in your UI when an item is overdue

Type of Changes

enhancement feature

Updates

Before

• User's list is one single list sorted alphabetically.

After

• User's list is sorted by how soon they can expect to purchase an item.
• List is then sorted alphabetically.
• When a user checks an item, the list updates automatically.

Testing Steps / QA Criteria

1. Pull from branch: sm-ar-items-in-order-issue-13
2. Select a list
3. Add 2-3 items per frequency (ex. apples, "soon"; bananas, "soon"; carrots, "soon"; chips, "kind of soon"; ice cream, "kind of soon", etc.) to ensure items are varied in urgency
4. View list and see how items are filtered by urgency
5. Check an item off to watch it move (items will move to "Soon", because assuming you create an item, "purchase" that item the same day, and "purchased" the item once, calculateEstimate thinks you will buy that item every single day)
6. If you want to check Overdue, you can manipulate dateLastPurchased and dateNextPurchased inputs in Firebase to reflect items being purchased over 60 days ago. (Set an item's dateLastPurchased to January 1, dateNextPurchased to January 10, and totalPurchases to 4.)
7. If you want to check Inactive, you can manipulate dateLastPurchased and dateNextPurchased inputs in Firebase to reflect items being purchased over 60 days ago. (Set an item's dateLastPurchased to January 1, dateNextPurchased to December 10, and totalPurchases to 4.)

[github-actions]

Visit the preview URL for this PR (updated for commit 0d550c9):

https://tcl-76-smart-shopping-list--pr30-sm-ar-items-in-order-y2d5p2a0.web.app

_{(expires Thu, 26 Sep 2024 18:34:29 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 512b1a88be8ae05fd3e727b99332819df760271d}

[mentalcaries]

**nitpick: ** x is not very descriptive in terms of a variable name. Suggestions: item, listItem or something along those lines

[mentalcaries]

I like how getDaysBetwenDates gets used again here!