Refactoring Checkboxes not unchecking

[lindseyindev]

Do we want to refactor the checkboxes so they do not remain checked for 24hours?

• One approach is to make the checkboxes a form that is cleared on submit

Current input <input type="checkbox" checked={within24hours(item.purchasedDate)} onChange={(e) => handleCheckboxChange(e)} name={item.id} aria-label={item.itemName} />

[lindseyindev]

I feel like I don't fully understand why the item is checked for 24 hours from the purchased date -- I feel like that solved an earlier problem but I don't remember what that problem was if anyone has details to add

[rudidev08]

Issue 8 has a requirement "Item should be shown as checked for 24 hours after the purchase is made (i.e. we assume the user does not need to buy the item again for at least 1 day)"

Since it's not explicitly stated that user should be able to uncheck the item, my recommendation would be to style checkbox as not interactive when checked. I'm basing this on previous projects where I could delete checked item but not uncheck.

Nice optional UI touch would be to tell user somewhere that checked off items will be available again in a day

[lindseyindev]

Ahh okay yes thank you for that Rudi! I keep wanting to click the boxes and I think a UI indicator or styling checked boxes as disabled for that 24 hr time frame is the way to go

[lindseyindev]

Refactor ideas from meeting: submit button so a user can undo a check if they checked it accidentally Use disable property to make checkbox greyed out if within 24 hours

[alenamedved]

AC: -user should be able to uncheck item if it was checked by mistake. -checking item enable a submit button by clicking which data is being send to database -checked item disabled and persist checked for 24 hours so user is not tempted to try to uncheck it

[rudidev08]

I like how you're prioritizing user experience here - original requirements don't have an a way to undo accidental click, which to me sounds like accessibility consideration as well.

This implementation requires user to do two actions per item, which can get tedious, for example if there are too many items to check off during grocery shopping. Is there a way to make this feature do only one click, and yet still be able to recover from accidental check? (be aware of feature creep - for example, I couldn't think of quick way to do undo feature, and I'd focus on delivering something stable over missing deadline, in which case your solution could still be the best)

[alenamedved]

I like how you're prioritizing user experience here - original requirements don't have an a way to undo accidental click, which to me sounds like accessibility consideration as well. @rudidev08 User has an option to check as many items as needed and then click once and mark all checked items as purchased, before that he can check or uncheck as many times safely. No need to click one item and then click submit and repeat, that would be tedious.