The TypeScript data source is one of the integration methods available on the Kuika platform that allows you to develop custom functions and business logic. Using TypeScript, you can define custom operations within your application, create methods that accept parameters, and use these methods in application workflows.

With the TypeScript data source, you can write custom code for needs beyond pre-built actions, customize data processing workflows, and create reusable functions.

Add a Data Source Connection to Your Application with TypeScript

• Log in to the Kuika platform and open the project you’ll be working on from the Apps screen.

• Open the Data Sources module.
• Here, you can view existing data sources and add a new one.
• Click the + icon next to the Sources heading.
• Select the TypeScript option.
• Enter a name for your data source.
• Click the CREATE button to complete the process.

Anatomy of the TypeScript Modal

A. Top Menu

• Title (Name): You can name your TypeScript data source.
• CREATE Button: Used to save the TypeScript data source you’ve created.
• Close Button (X): Used to close the screen and exit the process.

B. Top Settings Area

• External Libraries: This area is reserved for adding external libraries. Since the SOON label appears on the screen, it is understood that this feature will be active soon.
• Generate with AI: This option is used to automatically generate TypeScript code with AI support. When enabled, code suggestions can be obtained from the system.

C. TypeScript Editor

• This is the code editing area.
• All custom functions are defined here.

Default example structure:

class Manual {static NewFunctionName(parameter1: string): string {return parameter1;}}

This structure demonstrates the following:

• Code is defined within a class.
• Functions are created as static.
• They can accept parameters.
• Parameter types can be specified.
• Return types can be defined.

D. TIDY UP Button

• Located in the top-right corner of the code editor.
• Used to format, align, and make the written code readable.

E. Test Console

• The area used to test the methods you’ve written.

In this section:

• The method list is displayed.
• Parameter input fields are created.
• Server/Client selection can be made.
• The output result can be viewed.

Configuring TypeScript Data Source Settings

Manual Code Writing

• If “Generate with AI” is disabled, all code is written manually directly through the editor.

Example:

class Manual {static ToUpperCase(text: string): string {return text.toUpperCase();}}

Code Generation with AI

• If you enable the “Generate with AI” feature, you can create code automatically by writing a description.

Example command:

Create a method that converts the entered text to uppercase.

Parameter Definition

• You can add parameters to your functions.

Example:

static Sum(value1: number, value2: number): number

• This method takes two numbers and returns a number.

Specifying Return Type

• The data type to be returned at the end of the function must be defined.

Example types:

• string
• number
• boolean
• object
• any

Testing Methods with the Test Console

After writing your code, you can use the Test Console section below.

1. Select the method you want to test.
2. Enter sample data into the parameter fields.
3. Select the Server or Client option.
4. Run the method.
5. Check the returned result.

Example:

static Hello(name: string): string {return “Hello ” + name;}

Parameter: Kuika

Expected output: Hello Kuika

Saving the Data Source with CREATE

• After completing and testing your code, you can save the TypeScript data source by clicking the CREATE button.
• The saved data source becomes available for use within the application.

Expected Output / Result

Once these steps are completed:

• The TypeScript data source is added to the Sources list.
• The defined methods become available for use in the system.
• Custom business rules can be managed via code.
• A reusable function structure is created.