Skip to main content
Version: 8.3

Handle system-level data using Creatio.ai in the Freedom UI page schema

Level: advanced
note

The example is relevant to Case Management app.

To implement the example:

  1. Create a case. Read more >>>
  2. Develop AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). Read more >>>
  3. Set up the page UI. Read more >>>
  4. Set up how to handle case resolution. Read more >>>
Example

Simplify the resolution text of the custom "Creatio instance crashes while uploading files" case using Creatio.ai. Support different tones of simplified text. Out of the box, use formal text tone. Limit the simplified text to 200 characters.

1. Create a case​

  1. Open the Case Management app in the Application Designer.

  2. Open the Advanced settings tab in the Application Designer. To do this, click btn_system_designer_8_shell.png in the top right → Application management → Application Hub → Case Management app → Advanced settings.

  3. Create a user-made package to develop AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). To do this, click btn_create_a_package.png → Create new package → fill out the package properties → Save.

    For this example, create the sdkCreatioAIInFreedomUI user-made package.

  4. Change the current package. Instructions: Change the current package.

    For this example, change the current package to sdkCreatioAIInFreedomUI user-made package.

  5. Open the Cases section.

  6. Add a new case. To do this, click New.

  7. Fill out the case properties.

    Property

    Property value

    Contact*

    John Best

    Account

    Our company

    General info tab

    Subject*

    Creatio instance crashes while uploading files

    Description

    The Creatio instance constantly crashes when trying to upload a file larger than 10 MB to the server. The issue seems to be with the file handling method not releasing resources after the upload is complete. In some cases, uploading a file also leads to a system timeout, with the connection closing before the process ends. It makes it difficult to determine the exact cause.

    Closure and feedback tab

    Resolution

    Upon further analysis, it was identified that the file upload function is not properly disposing of memory stream objects after the file is uploaded. The memory stream was held in memory, resulting in excessive memory consumption and eventually leading to out-of-memory exceptions. Furthermore, due to improper exception handling in a multithreading implementation, multiple threads attempting to access shared resources during concurrent uploads caused deadlocks, which in turn triggered timeouts as connections waited indefinitely for resource locks to be released.
    We solved this issue by implementing a more efficient memory management strategy, ensuring that all threads are explicitly disposed of after use. We implemented more efficient "try-finally" blocks to ensure that the cleanup logic is executed even in the event of an unexpected failure. We also introduced a semaphore to limit the number of concurrent downloads, preventing the server from overloading due to insufficient resources. Finally, we added more detailed logging to capture thread state and memory usage during the upload process for future troubleshooting.

  8. Select the "In progress" status on the progress bar. This saves the case.

As a result, Creatio will add the "Creatio instance crashes while uploading files" case to the Cases section.

2. Develop AI Sub-agent​

  1. Open the Creatio.ai sub-agents (Creatio.ai skills in Creatio 8.3.3 and earlier) section. To do this, click btn_system_designer_8_shell.png in the top right → System setup → Creatio.ai sub-agents (Creatio.ai skills in Creatio 8.3.3 and earlier).

  2. Add an AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). To do this, click New.

  3. Fill out the properties of the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).

    The Code property is populated automatically.

    Property

    Property value

    Title*

    Simplify the case resolution

    Code*

    UsrSkillSimplifyTheCaseResolution

    Description*

    AI Sub-agent that simplifies the case resolution

    Status*

    Active

    Where to use* (Usage mode in Creatio 8.3.2 and earlier)

    "Workflows" ("API" in Creatio 8.3.2 and earlier)

  4. Specify the user's goal when using the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).

    Property

    Property value

    Prompt

    Your task is to simplify the following case resolution: inputText. Use the textTone text tone and limit the simplified text to 200 characters.

  5. Save the changes.

As a result, Creatio will add the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier) to the Creatio.ai sub-agents (Creatio.ai skills in Creatio 8.3.3 and earlier) section.

3. Set up the page UI​

  1. Open the Case Management app in the Application Designer.

  2. Open the Cases form page.

  3. Open the Closure and feedback tab.

  4. Add a field.

    For this example, add the field that contains the text tone to simplify the case resolution. To do this:

    1. Add a field of needed type to the canvas.

    2. Click icn_settings_in_freedom_ui_designer.png and fill out the field properties.

      Element

      Element type

      Property

      Property value

      Field that contains the text tone to simplify the case resolution

      Text

      Title on page

      Resolution tone

  5. Add a button.

    For this example, add the button that calls the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).

    To do this:

    1. Add a Button type component to the toolbar of the Freedom UI Designer.

    2. Click icn_settings_in_freedom_ui_designer.png and fill out the button properties.

      Element

      Property

      Property value

      Button that calls the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier)

      Title

      Simplify the resolution

      Style

      Outline

  6. Save the changes.

4. Set up how to handle case resolution​

Configure the business logic in the Client Module Designer. For this example, set up how to handle case resolution.

  1. Click btn_actions_in_freedom_ui_designer.png → Source code to open the page source code of the Freedom UI page.

  2. Add the dependencies. To do this, add @creatio-devkit/common library as a dependency.

    AMD module dependencies
    /* Declare the AMD module. */
    define("Cases_FormPage", /**SCHEMA_DEPS*/["@creatio-devkit/common"] /**SCHEMA_DEPS*/,
        function/**SCHEMA_ARGS*/(sdk)/**SCHEMA_ARGS*/ {
            return {
                ...
            }
        }
    );

  3. Add an attribute.

    1. Go to the viewModelConfigDiff schema section → values configuration object.
    2. Add a IsCreatioAIElementsVisible attribute that stores visibility data of the Resolution tone field and Simplify the resolution button. Out-of-the-box, the field and button are not visible.
    3. Add a ResolutionTone attribute that stores data of the text tone to simplify the case resolution. Out-of-the-box, the text tone to simplify the case resolution is formal.
    viewModelConfigDiff schema section
    viewModelConfigDiff: /**SCHEMA_VIEW_MODEL_CONFIG_DIFF*/[
        {
            "operation": "merge",
            "path": [
                "attributes"
            ],
            "values": {
                ...,
                /* The attribute that stores visibility data of the "Resolution tone"
                field and "Simplify the resolution" button. */
                "IsCreatioAIElementsVisible": {
                    "value": false
                },
                /* The attribute that stores data of the text tone to simplify
                the case resolution. */
                "ResolutionTone": {
                    "value": 'Formal'
                },
            }
        },
        ...
    ]/**SCHEMA_VIEW_MODEL_CONFIG_DIFF*/,

  4. Set up how to handle the action executed on button click.

    1. Go to the viewConfigDiff schema section → UsrSimplifyResolutionButton element.
    2. Bind the sending of the custom usr.SimplifyText request to the clicked button event.
    viewConfigDiff schema section
    viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
        /* Button that calls the "Simplify the case resolution" AI Sub-agent
        (AI Skill in Creatio 8.3.3 and earlier). */
        {
            "operation": "insert",
            "name": "UsrSimplifyResolutionButton",
            "values": {
                ...,
                "clicked": {
                    /* Bind the sending of the custom request to the "clicked"
                    button event. */
                    "request": "usr.SimplifyText"
                }
            },
            ...
        }
    ]/**SCHEMA_VIEW_CONFIG_DIFF*/,

  5. Bind an attribute to the page elements.

    1. Go to the viewConfigDiff schema section → UsrResolutionToneField element.
    2. Bind the $IsCreatioAIElementsVisible attribute to the visible property.
    3. Bind the $ResolutionTone attribute to the control property.
    4. Go to the UsrSimplifyResolutionButton element.
    5. Bind the $IsCreatioAIElementsVisible attribute to the visible property.
    viewConfigDiff schema section
    viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[
        ...,
        /* Field that contains the text tone to simplify the case resolution. */
        {
            "operation": "insert",
            "name": "UsrResolutionToneField",
            "values": {
                ...,
                "control": "$ResolutionTone",
                /* The property that flags the field as visible. Bound to the
                "IsCreatioAIElementsVisible" attribute. */
                "visible": "$IsCreatioAIElementsVisible",
            },
            ...
        },
        /* Button that calls the "Simplify the case resolution" AI Sub-agent
        (AI Skill in Creatio 8.3.3 and earlier). */
        {
            "operation": "insert",
            "name": "UsrSimplifyResolutionButton",
            "values": {
                ...,
                /* The property that flags the button as visible. Bound to the
                "IsCreatioAIElementsVisible" attribute. */
                "visible": "$IsCreatioAIElementsVisible",
            },
            ...
        },
        ...,
    ]/**SCHEMA_VIEW_CONFIG_DIFF*/,

  6. Implement the request handlers.

    1. Go to the handlers schema section.

    2. Add a custom implementation of the crt.HandleViewModelInitRequest base request handler.

      1. Wait for the rest of the initialization handlers to finish.
      2. Specify code of the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).
      3. Retrieve the instance of the HTTP client from @creatio-devkit/common.
      4. Send the crt.CopilotGetAvailableIntentsRequest base request that checks the accessibility of the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).
      5. If the list of AI Sub-agents (AI Skills in Creatio 8.3.3 and earlier) includes the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier) whose code is UsrSkillSimplifyTheCaseResolution, set the IsCreatioAIElementsVisible attribute to the index of the corresponding AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).

    3. Implement the usr.EditEventRequest custom request handler.

      1. Retrieve the instance of the HTTP client from @creatio-devkit/common.
      2. Send the crt.CopilotExecuteIntentRequest base request that runs the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).
      3. Specify code of the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier).
      4. Specify parameters of the "Simplify the case resolution" AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). The StringAttribute_qmmwoms attribute stores data of the Resolution field.
      5. If Creatio can run the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier), AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier) simplifies the case resolution. Otherwise, handle the status of the Creatio.ai execution, display the error and warning messages if error or warning occur during the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier) execution.
      6. Call the next handler if it exists and return its result.
    handlers schema section
    handlers: /**SCHEMA_HANDLERS*/[
        {
            request: "crt.HandleViewModelInitRequest",
            /* Custom implementation of a base request handler. */
            handler: async (request, next) => {

                /* Wait for the rest of the initialization handlers to finish. */
                await next?.handle(request);

                /* Code of the AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). */
                const skillName = 'UsrSkillSimplifyTheCaseResolution';
                
                /* Retrieve the instance of the HTTP client from "@creatio-devkit/common." */
                const handlerChain = sdk.HandlerChainService.instance;
                
                /* Send the base request that checks the accessibility of the AI
                Sub-agent (AI Skill in Creatio 8.3.3 and earlier). */
                var result = await handlerChain.process({
                    type: 'crt.CopilotGetAvailableIntentsRequest',
                    intentNames: [skillName],
                    $context: request.$context,
                    scopes: [...request.scopes]
                });
                
                /* If the list of AI Sub-agents (AI Skills in Creatio 8.3.3 and
                earlier) includes the AI Sub-agent (AI Skill in Creatio 8.3.3 and
                earlier) whose code is "UsrSkillSimplifyTheCaseResolution," set
                the "IsCreatioAIElementsVisible" attribute to the index of the
                corresponding AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier). */
                request.$context.IsCreatioAIElementsVisible = result.availableIntentNames.indexOf(skillName) > -1;
            }
        },
        {
            request: "usr.SimplifyText",
            /* Implement the custom request handler. */
            handler: async (request, next) => {
                const context = request.$context;
                
                /* Retrieve the instance of the HTTP client from "@creatio-devkit/common." */
                const handlerChain = sdk.HandlerChainService.instance;
                
                /* Send the base request that runs the AI Sub-agent (AI Skill in
                Creatio 8.3.3 and earlier). */
                const copilotCallResult = await handlerChain.process({
                    type: 'crt.CopilotExecuteIntentRequest',
                    
                    /* Code of the AI Sub-agent (AI Skill in Creatio 8.3.3 and
                    earlier) to run. */
                    intentName: 'UsrSkillSimplifyTheCaseResolution',
                    
                    /* Parameters of the AI Sub-agent (AI Skill in Creatio 8.3.3
                    and earlier). */
                    parameters: {
                        inputText: await context.StringAttribute_qmmwoms,
                        textTone: await context.ResolutionTone
                    },
                    $context: request.$context,
                    scopes: [...request.scopes]
                });
                
                /* If Creatio can run the AI Sub-agent (AI Skill in Creatio 8.3.3
                and earlier), AI Sub-agent (AI Skill in Creatio 8.3.3 and earlier)
                simplifies the case resolution. */
                if (copilotCallResult.isSuccess) {
                    request.$context.StringAttribute_qmmwoms = copilotCallResult.content;
                } else {
                
                    /* If the status of the AI Sub-agent (AI Skill in Creatio 8.3.3
                    and earlier) execution is "FailedToExecute," the browser console
                    displays the "Error occurs during the AI Sub-agent (AI Skill
                    in Creatio 8.3.3 and earlier) execution" error message.
                    Otherwise, implement a business logic that uses a predefined
                    "errorMessage" value depending on your business goals. */
                    if(copilotCallResult.status == 'FailedToExecute'){
                        console.error(copilotCallResult.errorMessage);
                        alert("Error occurs during the AI Skill execution");
                    } else {
                        alert(copilotCallResult.errorMessage);
                    };
                }
                
                /* If warning occurs during the AI Sub-agent (AI Skill in Creatio
                8.3.3 and earlier) execution, the browser console displays the list
                of warnings. Many messages are separated by comma. */
                if(copilotCallResult.warnings.length > 0){
                    console.warn(copilotCallResult.warnings.join(', '));
                }

                /* Call the next handler if it exists and return its result. */
                return next?.handle(request);
            }
        }
    ]/**SCHEMA_HANDLERS*/,

  7. Save the changes.

View the result​

To view the result of the example that uses an out-of-the-box text tone to simplify the case resolution:

  1. Open the Cases section.
  2. Open the "Creatio instance crashes while uploading files" case.
  3. Click Simplify the resolution.

As a result, Creatio.ai will simplify the case resolution using out-of-the-box text tone and add simplified text to the Resolution field. The simplified text is limited to 200 characters.

If you need, edit the Resolution field value provided by Creatio.ai.

To view the result of the example that uses custom text tone to simplify the case resolution:

  1. Open the Cases section.
  2. Open the "Creatio instance crashes while uploading files" case.
  3. Change the text tone to simplify the case resolution. For example, "Friendly."
  4. Click Simplify the resolution.

As a result, Creatio.ai will simplify the case resolution using custom text tone and add simplified text to the Resolution field. The simplified text is limited to 200 characters.

Resources​

Package with example implementation