1. Open your project on the Kuika Platform

• Log in to Kuika.
• Select the project to which you want to add the file upload feature from the Apps screen.

2. Add the Big File Upload Element in the UI Design Module

• Drag the Big File Upload element from the left panel and drop it onto the screen.
• This component provides the user with a file selection and upload interface.

3. Define the Upload File Action

• Select the element and add the Device > Upload File action from the + ADD ACTION menu according to the desired trigger event (Initial Actions, OnClick, OnBlur, etc.).

4. Configure the Parameters

• File Type (Optional): Enter file extensions (e.g. .pdf, .jpg, .png) separated by commas. This parameter allows the user to select only files of the permitted type.
  
  • Maximum File Size: (If applicable) The maximum file size that can be uploaded can be limited.
  • Storage Path or Format: Sets where and how the file will be stored in accordance with the backend.

In an application form process, users may be asked to upload files such as identity documents or diplomas. Since these files are usually standard sizes, the user is given the option to select and upload files via a button or icon.

Steps:

1. In UI Design, a button or icon is added to initiate the file selection and upload process.
2. When the user clicks the button or icon, a file selection window opens and the user selects the file.
3. The selected file is transferred to the server using the Upload File action.
4. Once the upload is complete, the user is shown the message ‘File uploaded successfully’.
5. On the backend, the uploaded file is saved to the specified folder (e.g. /uploads/documents/).
6. The file path information is matched with the reference record in the database.

For large files, the Big File Upload element can also be used.

• File Type and Size Control: File extensions and size limits can be clearly defined.
• Automatic Approval and Next Actions: An automatic approval message can be displayed after the file is uploaded, or different actions can be triggered.
• Dynamic Folder Structure: Files can be stored in different folders based on the user ID or other parameters.
• Storage Formats: Files can be stored as references to the database, in the physical file system, or in Base64 format.

Technical Risks

• Server Permissions: Write permissions for the folders where files will be stored must be enabled.
• File Security: File extension and content checks must be performed to ensure that uploaded files do not contain malicious content.
• Mobile Permissions: User permission must be obtained for gallery or file access on mobile devices.

The Big File Upload element is a UI element designed specifically for uploading large files and offers more advanced upload processes (split uploads, speed optimisation, etc.). However:

• The Upload File action can be used independently with both standard file upload elements and the Big File Upload element.
• In other words, the Upload File action does not have to be used with the Big File Upload element.
• The use of the Big File Upload and Upload File actions together for large file upload scenarios can be detailed in a separate content.

• The Upload File action is the general action used for all file uploads.
• File types and sizes are controlled by parameters; extensions must be clearly defined.
• The Big File Upload element is a separate component optimised for large file uploads, but it does not restrict the use of the Upload File action.
• Server permissions, security controls, and mobile permissions must be taken into account.