Introduction

This detailed overview encapsulates a comprehensive workshop on building and managing Mini Apps (Version 2) within the UChat platform.

Led by experts Hammad and Mark, the session delves into the fundamentals, setup procedures, advanced features, and practical use cases of Mini Apps, emphasizing their advantages over traditional bots and earlier versions.

The workshop aims to equip users—ranging from beginners to advanced developers—with the knowledge to create efficient, native-like integrations that enhance user experience and streamline automation workflows.

Deep Dive into Mini Apps (Version 2)

Overview and Significance

Mini Apps are lightweight, modular components designed to extend the capabilities of the UChat platform. Version 2 introduces a visual, drag-and-drop interface, making it more accessible and manageable compared to the earlier JSON-heavy version 1. This evolution simplifies the development process, reduces errors, and offers more flexibility for complex integrations.

Step-by-Step Creation Process

1. Accessing the Mini Apps Dashboard

• Navigate to My Contents in your workspace.

• Select My Mini Apps.

• Click Create New App and choose Mini App Version 2.

• Assign a name (e.g., "Sample") and proceed to Edit.

2. Building the Main Flow

• Inside the editor, you'll land in the Main Flow.

• All subflows are managed here, similar to a bot's structure.

• To add a subflow:

  • Click New Subflow.

  • Choose Workflow (e.g., "Action 1").

  • Save and Publish the flow.

3. Managing App Fields

• Access App Fields to define variables and user data.

• Types include:

  • Text (string)

  • Number (integer)

  • Boolean (true/false)

  • Date/DateTime

  • JSON

• Example: Create a variable First Name of type Text.

• Default values can be set or left empty.

4. Configuring Global Variables and API Keys

• Use the A tab to set Global Variables.

• For example, create an API Key variable:

  • Name: API_Key

  • Type: String

  • Mark as Required.

• Map this variable to the App Fields for use in API requests.

• This setup allows secure and dynamic API integrations.

5. Setting Up Actions

• The Actions tab is pivotal, acting as the bridge between the Mini App and external services.

• Actions include:

  • External Requests (GET, POST, etc.)

  • JavaScript Functions

  • Set/Clear Variables

  • AI integrations (e.g., OpenAI)

  • Fire Triggers

• Example: Create an External Request to fetch tags:

  • Method: GET

  • URL: Your API endpoint

  • Authorization: Bearer token (mapped from API Key variable)

  • Parameters: e.g., limit=10

  • Map response JSON to variables.

6. Handling Triggers and Webhooks

• Triggers respond to specific conditions or events.

• Example: Set a trigger Error Occurred.

• When an API request fails, fire this trigger.

• Use Fire Trigger action within flows to notify admins or perform follow-up actions.

• Webhooks or One-Time URLs can be used for inbound data collection, with dedicated videos explaining their setup.

7. Managing Sources

• Sources provide options for dropdowns or selection fields.

• Can be Static (predefined list) or Dynamic (fetched from APIs).

• Example: Service options like Car Wash or Oil Change.

• Add items with labels and values, then map user selections to variables.

8. Configuring Settings and Documentation

• Customize app appearance:

  • Name, Logo, Cover Image, Description.

• Add documentation links or tutorials.

• Define API Scopes if needed.

Practical Implementation: Creating and Using Actions

Example: Fetching Tags via External API

• Create a Subflow called Get Tags.

• Add an External Request:

  • Method: GET

  • URL: Your API endpoint

  • Authorization: Bearer token

  • Parameters: e.g., limit=10

• Map the JSON response to a variable, e.g., GetTagsJson.

• Create a Live Action:

  • Name: Get All Tags

  • Link to the Get Tags subflow.

  • Define inputs (if any) and outputs.

  • Set Type as Read.

• Save and activate the action.

Error Handling Strategy

• Simulate errors by providing invalid API keys.

• Map error responses (e.g., 401 Unauthorized) to error variables.

• Use Response Code prefixes (e.g., 4xx) to catch client errors.

• Implement Error Actions:

  • Map errors to Error Logs.

  • Use Set Action Fail to display user-friendly messages.

• Example: When an error occurs, trigger an Error Trigger to notify admins.

Triggering and Notifications

• Set up Triggers for errors:

  • Name: Error Occurred

  • When fired, can notify via email, Slack, or other channels.

• Use Fire Trigger actions within flows to activate these notifications.

• Example: When an API request fails, fire the Error Trigger with details.

Advanced Features and Use Cases

Data Processing with JavaScript

• Use JavaScript Actions to manipulate JSON data.

• Example: Filter tags, format responses, or extract specific values.

• Map JavaScript outputs to subsequent flow steps.

AI Integration

• Use OpenAI actions for chat completions or text generation.

• Requires Workspace Integration with OpenAI API keys.

• Can be used for:

  • Automated responses

  • Data analysis

  • Content generation

Conditional Routing

• Use Condition Nodes to route flows based on data:

  • Example: If a tag contains "urgent", escalate.

  • Else, proceed normally.

Timeout and Error Rules

• Mini Apps follow timeout rules:

  • User induction timeout: 30 seconds.

  • External request timeout: 15-20 seconds.

• Errors are captured and can be handled gracefully, ensuring robust automation.

Summary

Final Thoughts and Future Directions

The evolution to Mini App Version 2 significantly enhances the platform's flexibility, usability, and integration capabilities. Its visual interface lowers the barrier for developers and non-technical users alike, enabling rapid development of complex, native-like integrations without deep coding knowledge.

The ability to incorporate external APIs, AI services, and conditional logic makes Mini Apps a powerful tool for creating tailored automation solutions.

Key advantages include:

• Native-like integrations that appear seamlessly within the platform.

• Simplified development through drag-and-drop and visual flow builders.

• Enhanced error handling and trigger mechanisms for robust workflows.

• Support for advanced features like JavaScript processing, dynamic sources, and AI.

Recommendations for Users

• Start with basic API integrations to build confidence.

• Gradually incorporate advanced features like JavaScript and AI.

• Use triggers proactively for error notifications and automation.

• Leverage documentation and tutorials for complex scenarios.

Final Note

Building Mini Apps requires basic API knowledge and an understanding of external request workflows. As users become more familiar, they can craft sophisticated automations that significantly improve operational efficiency and user experience. The platform's continuous updates and feature enhancements promise even more capabilities in future iterations.

Summary Table

Summary

This workshop underscores the transformative potential of Mini Apps (Version 2) in streamlining automation and enhancing user engagement within the UChat platform.

By mastering these tools, users can develop powerful, scalable, and user-friendly integrations that elevate their operational capabilities.

For further learning, explore advanced topics like One-Time URLs and OAuth authentication in upcoming sessions, and always stay updated with platform enhancements.