App (Portal Page) Developers' FAQs

Portal Pages have been renamed to Apps in 7.1.0.

This article provides information on some of the most frequently asked questions regarding advanced App functionality.

Do Apps inherit CSS from the rest of the application?

If setting Display without Metric Insights navigation bar on the Info tab is disabled, an App inherits all styles from the application, including its theme (if applicable). 

To use custom CSS classes, we recommend adding a prefix cp_ (custom page) in front of new class names. iframes can be used to prevent CSS overlaps from happening.

What are the JavaScript libraries that I can use?

  • If Display without Metric Insights navigation bar is enabled + Layout is not set to "Default", you may use any JavaScript library.
  • If Display without Metric Insights navigation bar is disabled, all JavaScript libraries available in Metric Insights can be used with a few exceptions:
    1. jQuery must be used in no-conflict mode
    2. Highcharts v5.0.4 and Underscore.js version 1.8.3 are available globally
    3. Ext.js is not allowed

How can I store data in JavaScript?

Data specific to an App can be stored in an “Internal” App Entity.

  • Public internal entities write data available to many users
  • Private internal entities write data for a specific user
  • Managed (Beta) entities provide object storage that can be granted to specific users. For example, 
    • Dashboard 1 is granted to User A, User B, User C.
    • Dashboard 2 is granted to User X, User Y, User Z.
  • Inherited provides the ability to inherit access from a Dataset, Element, or Folder

How should I manage my assets?

There are several ways of managing Assets like JavaScript libraries, CSS, and images:

  • Sync with a Git repository located in:
  • Manually upload via ZIP archive
  • Directly upload via the Assets tab (Content > Apps > Assets tab) and directly link from either the App, Template, or Layout.

NOTE: You cannot reference externally hosted libraries. They must be hosted within the MI system itself. We enforce this to meet common security requirements in the enterprise.

If I use a custom theme, how do I apply those colors/styling to my App?

  • If Display without Metric Insights navigation bar is disabled, the theme will be applied automatically.
  • If Display without Metric Insights navigation bar is enabled + Layout is not set to "Default", the developer should explicitly include the theme CSS in their layout.

How do I track links opened from an App?

In order to call the tracking function, your App must have access to the /js/application/portal_page_view.js file:

  • If Display without Metric Insights navigation bar is disabled, this file is already included into the App by default.
  • If Display without Metric Insights navigation bar is enabled + Layout is not set to "Default", include the /js/application/portal_page_view.js file into App's HTML via the <script> tag:

<script src="https://<MI_hostname>/js/application/portal_page_view.js"></script>

JavaScript call of the tracking function: MI.PortalPageView.logClick(href,page_internal_name);

Function parameters:

  • href:  URL of the opened link
  • page_internal_name: An Internal Name of the App from which the link is opened

All the tracked data is stored in the portal_page_link table of the dashboard database in the following format:

portal_page_link
portal_page_link_id portal_page_internal_name user_id link_clicked view_time

How do I use the "Enable POST request navigation from other sites" option?

POST requests from sites other than current Metric Insights instance are disabled by default due to security considerations; however, this behavior can be changed by activating the Enable POST request navigation from other sites option from the App's Advanced tab. This will allow receiving POST requests from sites other than your Metric Insights instance.

An example of using this feature is configuring OAuth 2.0 authentication:

  • MI sends an authentication request to the Microsoft identity platform
  • User receives a POST response with an ID token and an Access token

How do I configure the condition for taking an App screenshot?

You can customize the condition for taking a screenshot while creating/configuring App Templates and Apps. For more information, refer to Customize the Image Capture Setting section.  

What are the common endpoints for App development?

Providing a robust set of endpoints that cover most major objects in the system, the API follows a standard RESTful design pattern and many endpoints offer the ability to PUT, POST, DELETE, etc.

Common endpoints for App development:

  1. /api/element and /api/element_info return details about a specific element
  2. /api/dataset_data returns Dataset's data
  3. /api/favorite can be used to add or remove an Element/Folder from user's Favorites
  4. /api/metric_data returns current metric value
  5. /api/announcement allows full CRUD operations on announcements, and assigning announcements to Groups, Elements, Data Sources, Categories, and Folders.
  6. /api/search returns paginated results from the system’s search service, the Data Analyzer
  7. /api/custom_field returns the name of the custom field, its values, and other properties
  8. /api/folder and /api/folder_element allows full CRUD operations on a Folder and the elements that belong to a folder

In total, over 100 endpoints are available, many with multiple methods. Explore endpoints via the API Toolkit at <hostname>/api (NOTE: if you are a Power User, you will need an Admin to provide the “API Toolkit” Privilege)