In this blog, we showcase the abilities of Oracle Integration Cloud – Process to be embedded in SaaS applications. This is useful when you need to straddle workflows across systems or when users you need to conduct an approval are outside your organisation. OIC Process is extremely powerful for application extensions, providing capabilities to deliver embeddable UIs for Forms and Task Lists as HTML5 files that can be inserted in ANY application, Oracle, non-Oracle and even on-prem. We are using Oracle Service Cloud to showcase this. Service Cloud is a Service Request SaaS CRM, typically utilized by Contact Centres. Since only Contact Centre users have access to Service Cloud, what if you need information from another department, such as Field Services/Billing or even another organisation?

Note: The code in this blog is related to Oracle Integration Cloud (OIC) 18.2.3 release https://cloud.oracle.com/en_US/oic, which combines Integration, Process and Visual Builder into the same suite. You can get it at https://github.com/solutionsanz/process

About Oracle Process Automation

With its roots in Oracle BPM, OIC Process is Oracle’s rendition of Processes and Human Workflow into the Cloud. Process provides low-code business-friendly automation for agile delivery by LOB IT users. You can collaboratively build applications (processes, forms, rules, documents, services, and data) in a zero-code, 100% web-based designer. Forms are HTML5-responsive and can be skinned with CSS. They can be accessed through a Mobile App downloaded on the Apple and Google App Stores. You also can design actionable emails for busy executives to approve on the fly.

OIC Process supports structured processes (using BPMN language) and unstructured Case Management, which can be delivered in combination in a single application, mimicking closely the way humans work.

Use Case

Let’s say you are a Contact Centre user that needs to request for info from another department that has no access to Service Cloud. You would like to access the request page and review the responses in Service Cloud.

We will need to:

1. Embed a Request for External Info page in the Service Cloud UI
2. Trigger an external user that only has access to Process Cloud to submit a response to the query.
3. Embed the Task List of responses in the Service Cloud UI for review.

Create a Simple Process Cloud Application

This is a standard-alone process application that is embedded into Service Cloud. There no API interactions between Service Cloud and Process. I like to start with Form Approval Pattern as a reference.

Create the Requester and Responder swimlines.

Modify the UI with fields [Request] and [Response]. Once done Publish and Activate the process.

Once deployed, attach Roles to the relevant swimlanes so that all parties can access their tasks.

Use the OIC Process UI and run through the workflow to ensure all assignments have been set correctly.

Start Form

Process provides a cookbook with the necessary code snippets for embeds inside the instance at https://[YOUR_PROCESS_DOMAIN]/ic/pub/components/ There is no other way to access the cookbook, so sign-up for a trial to get access. It is important to follow your version of the cookbook so you don’t get stuck in debugging hell as Oracle may upgrade the JS references (e.g. Oracle Jet 2.0 -> 3.2) with each version.

You will create a HTML5 page that uses RequireJS and Oracle JET to surface this client-side UI. You do not need to download the libraries locally as they are hosted by the Process instance and you can host it in any HTML server e.g. Apache, Node, Tomcat, WebLogic. I’m using Node serve on my local machine for testing purpose after which I’m hosting it directly in Service Cloud.

We will first need to embed the Start Form to kick-off the process. Here’s what it looks like inside:

Grab the AuthInfo from the Cookbook

To ensure you get the right values to kick start the process. Navigate to [Start Application] in the cookbook. Kick-off your relevant process and then look at the payload values.

Once you’ve installed the serve npm package, run “serve” and navigate to the page.

If you have made any mistakes in including the wrong JS packages, you may find that the screen is blank or the UI is strangely formatted. Pop open the Chrome Developer Tools to check for errors. This may take some back-and-forth if you have typos to find the right location or name of the file reference.

Note that there are always seems to be an error for main.js so don’t fret over it, the UI is rendering correctly.

Task List

Once the request is responded to, we also need to see my incoming tasks to action on the response. The embed is pretty is similar:

View it in the Browser

Embed in Service Cloud

Quick and easy wasn’t it? Now let’s embed it into Service Cloud. Service Cloud uses WebDAV to load up static files. I use CyberDuck to connect to it and store this asset.

Now we need to load the screens up into a Workspace.

Log into Service Cloud Agent Desktop as an admin user. Navigate to [Workspaces / Workflows] and select the Workflow you want to add the page to.

Create a [Tab] and then add a [Browser Control]. Insert the URL of StartForm.html into the URL field. Do the same for TaskList. Make sure to set “Send URL as Post Data”.

Save it and you’re all set.

Go to your Internet Browser and login to the Agent Browser UI at https://[YOUR_SVC_CLOUD_URL]/AgentWeb/

Navigate to the Incident Workspace and select an Incident. You will see the Start Form and Task Lists embedded in Service Cloud.

Now as a Contact Center user, let’s kick-off a Request for External Information.

Login to OIC Process as another user that has access to the Process system but not Contact Center. Goto Tasks.

I can now interact with this query and submit a response.

Once submitted, navigate back to the Agent Browser you can see a new Task has been added to the requester’s list.

I can choose to copy and paste the answers into Service Cloud or create a Web Service call from Process to insert the record into Service Cloud.

Come to my next blog when I show you how kick-off a process from a status change in Service Cloud and update the results back into Service Cloud fields.

Have fun extending!