1. Define the Action in UI Design

• Log in to the Kuika platform.
• Select the project you want to work on from the Apps screen.
• Go to the UI Design module.
• Open the Properties panel on the right side.

• Select the element you want to add the action to (e.g., a button).
• From the ADD ACTION menu, select Local Storage → Delete From Local Storage according to the trigger event you want (Initial Actions, OnClick, OnBlur, etc.).

2. Configure Action Parameters

• Key (String, required): The key representing the data to be deleted from the local storage. For example, “userToken,” “tempFormData,” etc.

The parameter can be defined with the following data sources:

• Fixed → Can be entered manually as a fixed value.
• Symbol Picker → Can be selected dynamically from sources such as Component, Current, Action Result.

When a user logs out of the application, the access data stored under the “userToken” key in the local storage area should be deleted from the system.

Application Flow

• Go to the UI Design module.
• Drag and drop the following elements from the Elements panel:
  
  • Button: “Log Out” button
  • (Optional) Navigate: Redirect to the login screen after logging out

Action Flow and Configuration

• Select the button.
• +ADD ACTION → OnClick → Local Storage → Delete From Local Storage
• Key: “userToken”
• Then add a Navigate action:
  
  • To Screen: LoginScreen
  • Open As: Current Page

With this configuration, when the user logs out, both the token information is deleted and the user is redirected to the login screen.

• Multiple Deletion Scenarios: If multiple pieces of data are to be deleted at the same time, each Delete From Local Storage action can be added separately.
• Dynamic Key Usage: The key name can be made dynamic with variables such as component data, session ID, or username.
• Conditional Deletion: The deletion process can be triggered based on specific conditions using Condition actions.
• Form Reset Process: Temporarily stored form data can be automatically deleted after the form is submitted or canceled.

Technical Risks and Controls

• Empty Key: If the key field is empty or incorrectly defined, the deletion process will fail.
• Incorrect Deletion: If the wrong key is entered, the necessary data may be lost. Key validation must be performed.
• Platform Incompatibility: The action only works on supported platforms (web & mobile). It should be checked in environments such as desktop-native.
• Scope Issue: If a key with the same name is used for a different purpose on another page, data integrity may be compromised.

Delete From Local Storage simplifies application cleanup and data management by deleting user data in a controlled manner. It is an ideal action for managing temporary data, session termination, and form reset. It can be used effectively to improve both the security and performance of your application.