Remove From Bag

Defining the Action in UI Design

1. Log in to the Kuika platform.
2. Select your project from the Apps screen.
3. Go to the UI Design module.
4. Open the product listing or basket details screen.
5. Add a ‘Remove’ or ‘Remove from Basket’ button to each product card or basket row.

6. Select this button and add the + ADD ACTION →appropriate trigger (Initial Actions, OnClick, etc.)→ Bag → Remove From Bag action from the Properties panel.

Configuring Action Parameters

• Bag Key (Required – Symbol Picker): The ID of the bag from which the item will be removed. For example: ‘default’, currentUser.id + ‘_bag’ and other dynamic or fixed values can be used.

‍

In an e-commerce application, when the user clicks the ‘Remove’ button next to each product on the bag screen, the corresponding product should be deleted from the bag.

Configuration Steps:

• Products are listed on the bag screen.
• A ‘Remove’ button is added to each product row.
• The following action is assigned to this button:
  
  • ADD ACTION → OnClick → Bag → Remove From Bag
• The parameters are linked as follows:
  
  • Bag Key: ‘default’ or currentUser.id + ‘_bag’

• When the user clicks the button, the relevant product is removed from the list in the shopping cart and the updated shopping cart is displayed.

• Multiple Product Removal: Multiple products can be selected and removed collectively. For this, multiple Remove From Bag actions can be used sequentially or cyclically.
• Confirmation Window: To enhance the user experience, a confirmation modal can be displayed before the product is removed, asking, ‘Are you sure you want to remove this product from the cart?’
• Notification Messages: When the operation is successful, the Notify action can be used to display the message ‘Product removed from cart’ to the user.
• Cart Update and Refresh: After the product is removed, the cart screen can be automatically refreshed to display the correct content.
• Conditional Removal: For example, if the product is out of stock or the user has a specific role, the product removal operation can be blocked or a different message can be displayed.

Technical Risks and Precautions

• Bag Key Missing or Incorrect: If the Bag Key parameter is not provided correctly or is left blank, the action will not work and the item cannot be removed from the cart. A correct and valid Bag Key must always be used.
• The product to be deleted is not in the cart: If the user does not have the product they want to remove in their cart, the action may fail or produce unexpected results. In this case, appropriate feedback should be provided to the user.
• Concurrency conflicts: If multiple processes access the cart at the same time and add or remove products, data inconsistencies may occur. Therefore, data synchronisation and locking mechanisms must be implemented.

The ‘Remove From Bag’ action enables users to effectively manage their cart contents and enhances the cart management experience on the Kuika platform. It can be easily integrated with other actions to create flexible and user-friendly shopping experiences.