Embedding Oracle Integration Insight dashboards : Quickly and Easily

Integration Insight in Oracle Integration (or short Insight) empowers business users by providing a real-time view into their business processes. In addition to viewing Insight dashboards within the Oracle Integration console, Insight offers the capability to embed business dashboards in other applications.

For example: 

• If your business involves order management and you already have your business users using Oracle Cloud ERP to manage your orders, you can embed Insight dashboards for the order process in Cloud ERP. This provides business users with a single consolidated view within Cloud ERP, without needing to sign into Oracle Integration to view the Insight dashboards.
• If you have a financial business process, with a front-end application that is used by business users, Insight dashboards can be embedded in the front-end application to show real-time business process metrics that can assist in making business decisions

Integration Insight provides three ways to embed dashboards in other applications:

• URL builder for embedding dashboards in an iFrame.
• Custom web component built using Oracle JET Composite Component Architecture.
• Insight web components for Visual Builder Application.

As shown below:

URL Builder

This approach requires building a dashboard URL in Integration Insight and using that URL within an HTML iframe tag in a SaaS application. Both the SaaS application and Oracle Integration must use the same Single Sign-On (SSO) credentials. This means that user identity synchronization must be established across both the SaaS application and Oracle Integration instance, as described in this documentation

Note: In the November 2020 release, Insight introduced the ability to construct the URL manually. From the February 2021 release, Insight includes a URL builder for constructing the URL to make embedding dashboards even easier.

In the URL builder, you can select parameters that identify the dashboards and specify details about what you want to display. Based on these values, the URL is built automatically, and you can preview the dashboards that the URL renders. 

The URL builder is available for all dashboards, the business transactions dashboard, the business transactions details dashboard, and the progress tracker.

Example: 

Let’s see how order process dashboards can be embedded in Oracle Cloud ERP:

• Sign in to Oracle Integration and click Insight in the left navigation pane, then Consoles.
• On the Consoles page, select the console for the associated order business process to open its Business Transactions dashboard.
• Click the </> icon to open the URL builder.
• In the URL builder, all existing dashboard filters are preserved by default. Select or specify values to customize the dashboard(s) you want to embed in Oracle   Cloud ERP.
• Click Update Preview to preview the dashboard(s) that the URL renders.
• Copy the URL.
• Sign in to the Oracle Cloud ERP instance with valid credentials.
• Click the hamburger menu and select Configuration → Sandboxes to view the available and published sandboxes.

• Click Create Sandbox

• Enter a name for the sandbox, select all the tools, and click Create and Enter.

• Click the hamburger menu and select Tools → Page Integration

            .

• Click New Page. Enter a name for the page (for example, Order Analysis). Select an icon, relevant application role, and paste the URL copied from the Integration Insight URL builder in step 6.

• Click Save and Close.
• Click the hamburger menu and select Configuration → Structure.

• Search for the page created in step 12 and click it.

• Select a section/tab where you want to make the dashboard available. In this example, select the group Order Management.

• Click Save and Close.
• Navigate to the selected section/ tab to view how the dashboard is rendered. If there is distortion, click Edit Page.

• Expand the layout, so that all the dashboards are visible.

• Click Publish under the sandbox to save the changes.

• Click Publish again and click Yes in the warning dialog.

• Navigate again to the selected section/tab to see how the page will be rendered for business executives.

• Click the page name to view the Insight dashboard(s) rendered by the URL

Custom Web Components

Integration Insight custom web components, built using Oracle JET Composite Component Architecture (CCA), are reusable pieces of user interface code that you can embed as custom HTML elements. 

From the February 2021 release, you can embed Insight dashboard components in other applications as custom web components, which can be bundled with native web applications. One of the key advantages of this approach is that there is no need for a Single Sign-On (SSO) synchronization between Oracle Integration and the web application. Custom web components use OAuth token to access Insight dashboards.

This approach provides a lot of flexibility and customization options to the SaaS/web application. Your existing web applications can be extended with  Insight custom web components.

Prerequisites:

• Create a trusted client application in IDCS that represents your SaaS/web application. Copy the client id, client secret, and scope.
• In the SaaS/web application, make sure that you make a REST call to the IDCS API to fetch the OAuth token. Refer to this link for more details.
• You can download the offline version of Insights CCA components, to get the offline version please raise an SR with oracle support or fetch them at runtime (fetching at runtime would require SSO set up).

After completing the prerequisites, host the SaaS/web application to render the Integration Insight dashboards.

Refer to this link to learn more.

Insight web components for Visual Builder

To provide native integration with Visual Builder applications, we have introduced Insight web components. These web components can be downloaded from the Insight console as shown below.

Web components are available for Insight dashboards, business transaction detail, and progress tracker views.

Once the component is downloaded, it can be used within the Visual Builder application as shown below.

Click on the + icon next to the Custom section in the design palate. Browse the zip file you downloaded earlier from your file system.

Click on Import.

After importing successfully, you will see the insight-dashboard component in the design palette under the OIC section.

Now drag and drop this component into your design canvas as required.You can see the filters from the insight console as properties in the right-side pane.

Configure the Model Identifier, Views, and other properties as shown below.

Note: The values of Model Identifier and views can be fetched from the console manifest as shown below:

The dashboards get rendered based on the values provided in the properties tab.

Now run this application to get a preview of the embedded dashboards.

Modify the styling as required.

Similar steps can be configured to import and embed the transaction detail/progress tracker view.

First, download the insight-transaction-dashboard web component. Next, import this web component into the design palate.

Drag and drop this component into the design canvas and provide the Model Identifier, Business transaction id, and View Type.

You can choose between the details and the progress tracker View Type.

When View Type “details” is selected, the insight-transaction-dashboard renders as shown below.

In future releases, we will add more functionality to the Insight web components, like transaction list view and event handling.