<div><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Title:</strong><span>&nbsp;</span>Manage Wishlist Items </p><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">As a</strong><span>&nbsp;</span>logged-in user,<br style="box-sizing:border-box;"><strong style="box-sizing:border-box;">I want</strong><span>&nbsp;</span>to view, add to cart, or remove items from my Wishlist,<br style="box-sizing:border-box;"><strong style="box-sizing:border-box;">So that</strong><span>&nbsp;</span>I can easily manage products I’m interested in purchasing later. </p><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Acceptance Criteria</strong> </p><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC1: Access Wishlist</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Given</strong><span>&nbsp;</span>the user is logged in and opens the side menu, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">When</strong><span>&nbsp;</span>they tap on<span>&nbsp;</span><strong style="box-sizing:border-box;">&quot;My Wishlist&quot;</strong>, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Then</strong><span>&nbsp;</span>they should be navigated to the<span>&nbsp;</span><strong style="box-sizing:border-box;">My Wishlist</strong><span>&nbsp;</span>screen. </p> </li> </ul><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC2: Wishlist Item Display</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Given</strong><span>&nbsp;</span>the user is on the Wishlist screen, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Then</strong><span>&nbsp;</span>each Wishlist item should display: </p><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">Product image </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">Product title </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">Price </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">&quot;Add to Cart&quot; button </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">Delete (trash icon) button </p> </li> </ul> </li> </ul><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC3: Add to Cart</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">When</strong><span>&nbsp;</span>the user taps the<span>&nbsp;</span><strong style="box-sizing:border-box;">“Add to Cart”</strong><span>&nbsp;</span>button on a Wishlist item, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Then</strong><span>&nbsp;</span>the item should be added to the cart, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">And</strong><span>&nbsp;</span>optionally removed from the Wishlist (depending on business rule). </p> </li> </ul><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC4: Remove from Wishlist</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">When</strong><span>&nbsp;</span>the user taps the<span>&nbsp;</span><strong style="box-sizing:border-box;">delete icon</strong><span>&nbsp;</span>(&#128465;️) on a Wishlist item, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Then</strong><span>&nbsp;</span>the item should be removed from the Wishlist immediately, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">And</strong><span>&nbsp;</span>a toast/snack bar confirmation like “Item removed from Wishlist” should appear. </p> </li> </ul><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC5: Empty Wishlist State</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Given</strong><span>&nbsp;</span>there are no items in the Wishlist, </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;"><strong style="box-sizing:border-box;">Then</strong><span>&nbsp;</span>a friendly message should appear (e.g., “Your Wishlist is empty. Start adding products you love!”).(if necessary)-suggestion </p> </li> </ul><h4 style="box-sizing:border-box;font-weight:600;"><strong style="box-sizing:border-box;">AC6: Navigation and Consistency</strong> </h4><ul style="box-sizing:border-box;padding:0px 0px 0px 40px;"><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">The<span>&nbsp;</span><strong style="box-sizing:border-box;">back button</strong><span>&nbsp;</span>should return the user to the previous screen. </p> </li><li style="box-sizing:border-box;"><p style="box-sizing:border-box;">The bottom navigation (Home, Categories, Cart, Profile) should remain visible and functional across the Wishlist screen. </p> </li> </ul><br> </div>