Help & Documentation
Open Support Ticket

App (Portal Page) Developers' FAQs

Portal Pages have been renamed to Apps in 7.1.0.

This article covers frequently asked questions about advanced App functionality. The steps below address CSS styling, custom class naming, and iframe usage. Review all sections before making configuration changes to avoid unintended style conflicts.

Do Apps inherit CSS from the rest of the application?

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

To use custom CSS classes, add a prefix cp_ (custom page) in front of new class names. Use iframes to prevent CSS overlaps.

What are the JavaScript libraries that I can use?

  • If Display without Metric Insights navigation bar is enabled and Layout is not set to "Default", any JavaScript library may be used.
  • 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:
    • Homepage 1 is granted to User A, User B, and User C.
    • Homepage 2 is granted to User X, User Y, and 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 to manage assets such as JavaScript libraries, CSS, and images:

NOTE: Externally hosted libraries cannot be referenced. Libraries must be hosted within the MI system itself to meet common enterprise security requirements.

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 is applied automatically.
  • If Display without Metric Insights navigation bar is enabled and Layout is not set to "Default", the developer must explicitly include the theme CSS in the layout.

How do I track links opened from an App?

To call the tracking function, the 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 included in the App by default.
  • If Display without Metric Insights navigation bar is enabled and Layout is not set to "Default", include the /js/application/portal_page_view.js file in the 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: The Internal Name of the App from which the link is opened.

All 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)