DEV Community

Cover image for Control Your Mule Infra Via Bot
Vikash-Invenio
Vikash-Invenio

Posted on

Control Your Mule Infra Via Bot

Component Diagram :

componentDiagram

Sequence Diagram:

SequenceDiagram

We used:

  1. Java jdk 1.8
  2. Spring boot suite 4.8.1
  3. Angular 10+ node.js
  4. Visual Studio code IDE. Vs 1.51

IGenie – Chatty Bot:

Chatbots, or conversational interfaces present a new way for individuals to interact with computer systems. A chatbot allows a user to simply ask questions in the same manner that they would address a human.

The Use case of IGenie-chatty bot:

We have developed a personal assistant which will make the life easier for the user just by listening to the command. Since it is a personal chatbot it can hold the credential and it also maintain the session. The user can ask for any information*(Ex: Server, API, application status, deployment status)* if authenticated otherwise need to authenticate first by providing their credentials. Apart from this some of the automation work can also be implemented in future such as scaling of the server(explained in the future extension section).
A RAML crawler is used for generation of patterns and it is built on top of Mule-RAML API. The generated pattern is used to generate a base AIML template.
Currently, this chatbot is build on top of the Program AB(AIML based chatbot) which is internally calling cloud hub API. The JSON data which is coming from the cloud hub API is parsed into the map in such a way that the hierarchy is break down i.e. all the keys are brought to the root level which will optimizes the search. The whole functionality is wrapped up in the response handler API.

This hash map is used to fill Mother AIML file template and later it is loaded to the Bot at run time and the bot will give the best response from the available option. Which will be later shown to the end user at the chatbot UI.

The below figure represents the front-end project explorer of IGenie-ChattyBot

picture3

Steps for front end set up:

Step 1:
Download the Zip file and extract.

Step 2:
Go to the extracted file location and open cmd terminal.
picture4

Step 3:
Run the command npm install in that terminal. This installs all the packages used in the project.
picture5

Step 4:

  • Once all the packages are installed through npm install.
  • Run the command ng serve, which builds and runs the app. Here, the app runs on port 4200 by default .
  • If you want to use a different port (eg : 4202)
  • Run the command ng serve--port 4202 instead of ng serve.

picture6

Step 5:
Open Visual Studio Code.
To open an existing app folder

Go to File --> Open Folder --> open the extracted app folder

picture7

picture8

You can also customize your chatbot UI by creating additional component.

The default Bot UI contains:

  1. Chatbox component
  2. App component
  3. Chatbox Service module

To create a new Component :

use command :

ng generate component componentname
or
ng g c componentname

picture9

To add new packages

use command:

npm install packagename@version

Check for the version compatibility in order not to cause version mismatch.
Untitled10

To create new service module

use command:

ng g service servicename

Untitled11

app.module.ts :

It contains all the components, modules and services created and used in the UI app

Untitled12

All the packages are already created and installed

using npm install command

Untitled13

Untitled14

Steps for Backend Setup:

Step 1:
Download the project Zip file. click here

Picture15

Step 2:
Extract the zip file to the spring boot suite(STS) workspace.

Picture16

Step 3:
Open the extracted file, Go to

File->open project from the file system

Picture17

Step 4:
Search for the directory where you have extracted your project and then click finish. It will add your project to the workspace.

Picture18

Step 5:
Clean your project

Project->Right click->Debug as->maven clean->finish

Picture19

Step 6:
Update your project.(it will add all your dependency)

Project ->right click->maven-> update project->force update

Picture20
Picture21

Step 7:
write port number and the cloudHub API in the application.properties file as shown below and save the file.

Picture22

For integrating front end with back end:

Backend modification:

Go to chatbot.java file:

src->com.invenio.util.controller->chatbot.java

add @CrossOrigin(origins = http://localhost:4202).(We are using port 4202. You can use any port number change the port accordingly.)

Picture23

Front-end modification:

Open Chatbox.service.ts, Got to

src->app->chatbot->Chatbox.service.ts

Change the rest api url according to the port you are using as shown below.

Picture24

How to run your chatbot:

Step 1:
Once your set up is ready.
Start your backend service as spring boot app. Go to

project->right click->run as->spring boot app.

Picture25

Picture26

Step 2:
Put the URL http://localhost:4202 in the browser to see the running chatbot UI

Picture27

AnyPoint Studio platform:

We have tested our application for the following cloudhub Api:

  1. https://anypoint.mulesoft.com/accounts/login
  2. https://anypoint.mulesoft.com/accounts/api/me
  3. https://anypoint.mulesoft.com/accounts/api/organizations/<>/environments
  4. https://anypoint.mulesoft.com/cloudhub/api/v2/applications
  5. https://anypoint.mulesoft.com/hybrid/api/v1/servers

For reference to other cloud hub API

Testing your chatbot:

Enter your query in the chatbot. For cloud hub related query, login to cloud hub.

Picture28

Once Authentication successful. You will get the response.

Picture29

Now, chatbot can also response to the cloud hub related query

Picture30

Future Extension of the IGenie-ChattyBot:

  1. Interaction over Voice.
  2. Command following chatbot

Interaction over Voice:

We are trying to provide the voice capability to our chatbot such that the user can interact over voice.

Command following chatbot:

We are also working on providing the capability to our IGenie-ChattyBot to handle the minor error on our cloud where user intervention is not required.

The above statement can be justified by the below scenario:
Based on the error alert IGenie-ChattyBot will provide the best solutions to be tried, which can resolve the error or capable of handling by itself if required permission and formatted file given.

Download IGenie-ChattyBot UI

Download IGenie-ChattyBot backend

Top comments (7)

Collapse
 
roystonlobo profile image
Royston Lobo

Thank you for your submission @vikashinvenio . I wasn't able to find you in the list of registrants. Can you please confirm that you have registered here mulesoft.com/hackathon2020?

Please also either comment with your email address or send me an email at royston (dot) lobo (at) mulesoft (dot).com

Collapse
 
vikashinvenio profile image
Vikash-Invenio

Hello @Royston Lobo,
I have registered for the hackathon with email id(vikash.bajoria@invenio-solutions.com). can you please confirm about the registration?

Collapse
 
roystonlobo profile image
Royston Lobo

Hi @vikashinvenio , I can now see your registration as expected. Thank you and all the best!

Collapse
 
vishalinvenio profile image
Vishal Konaparthi

Good job!

Collapse
 
vikashinvenio profile image
Vikash-Invenio

Thank you

Collapse
 
mrram profile image
mrram

Excellent Vikash..! Great idea

Collapse
 
vikashinvenio profile image
Vikash-Invenio

Thank you