Customize microapps

Note:

This article has been replaced by Create microapps. Please update your bookmark.

Customize existing out-of-the-box microapps or build your own microapps to deliver the best end-user experience that meets your needs and streamlines daily workflows. Add a blank microapp to an application integration and then create pages or event notifications or both.

  • Notifications are event-driven microapps that automatically notify users when something requires their attention, for example as a card in the Workspace activity feed. Such microapps include New Expense Report for Approval and New Course Available for Registration.

  • Pages are user-initiated microapps that are available as actions in Workspace and make it easy to do initiate actions. For example, Request PTO, Submit a Help Desk Ticket, and Search the Directory.

Verify needed entities

Check an existing integration to ensure that the tables that you require exist already in Microapps. If you find a required table missing, you must add it.

Edit microapp schema

  1. From the Integrations page, select the menu next to the integration to which you want to add the microapp.
  2. Select Edit.

    The Tables page opens with an overview of how the database is divided into database tables.

  3. To find your required table, select Edit Schema, and filter for the required entity and confirm that it exists.

Adding microapps

For template integrations, a large quantity of data can be pulled from your integrated applications to the Microapps platform. To better control and limit this amount of data, use the Table page to filter entities for your data synchronization to speed up synchronization.

For more information, see Verify needed entities and Set data synchronization in the Configure the integration article.

Add a microapp

You can add a microapp by adding a blank microapp to an application integration or by importing a .mapp file containing the microapp.

Adding microapps

Once you add the microapp, it appears under the related integration on the Manage Microapps page.

Follow these steps:

  1. From the Manage Microapps page, select the menu next to the integration that you want to add the microapp to.
  2. Select Add Microapp.
  3. Choose one of the out-of-the-box microapps or select Blank Template to build your own microapp based on your business needs.

    After you add the blank microapp, it appears under the related integration on the Manage Microapps page.

  4. Return to the Manage Microapps page and select Blank Microapp from the list under the integration.

    The Properties page opens.

  5. Give it an appropriate name and description.
  6. Select Microapp Icon and choose an appropriate icon from menu. There are App Icons, Action and Notification Icons, and Microapps and Data icons from which you can select.

You are ready to add a Page or Notification.

Import a microapp

Import a microapp that you created in another instance. You can then edit existing or add pages and notifications.

Follow these steps:

  1. Upload the .mapp file containing the microapp to the Application Integration.
  2. Verify needed table entities. Add new entities if necessary.
  3. Add pages or notifications or both or open existing pages or notifications.
  4. Customize the pages and notifications using the builder.
  5. Manage access.

Add new pages and notifications

After you have your microapp ready and database entities prepared, you need to create pages or event notifications or both.

Add new page and notifications

Add event notifications

Create triggers for events to be sent to the client application, such as new PTO request or notification that a record changed. Select from the template types, then customize the event in the builder.

Follow these steps:

  1. Select the microapp that you want to add an event to.

  2. Select Add Notification at the bottom of the page.
  3. Give the Notification event a name.
  4. Select your desired trigger and notification type from the following:

    • New records
    • Changed records
    • Matching record
    • Delete records
    • Periodic notification (user action)
    • Periodic report
    • Date reminder

    The following screenshot shows what the New Notification screen looks like:

    New notification

  5. Select the data source and select your data table.

    Note:

    As Citrix Workspace Microapps supports cross-integration microapps, the Select data source list shows all available integration data sources.

  6. Select Add.

The new notification is added to the Notifications list and is ready to be configured.

Add action pages

To add an action page for your microapp, select from the starting templates then customize the page in the builder.

Follow these steps:

  1. Select the microapp that you want to add a page to.
  2. Select Pages, and Add New Page.
  3. Give the Page a name.
  4. Select a starting template for the page:
    • Detail
    • Form
    • Table
    • Static content

    The following screenshot shows what the New Page screen looks like:

    Add new page templates; Detail, Form, Table, Static content

  5. Use the Select data source and Select data table menus to verify the data source and select your data table.

    Note:

    As Citrix Workspace Microapps supports cross-integration microapps, the Select data source list shows all available integration data sources.

  6. Select Select Fields to determine which table columns the new page will be pre-populated with.
  7. Select Add.

The new page is added to the Pages list and is ready to be customized.

Build event notifications

There are various options when creating microapps based on your intended outcome. Citrix Workspace Microapps provide both a series of pre-configured out-of-the-box microapps and provides you the tools to configure your own custom microapp.

Follow these steps to build an event notification:

  • Create the conditions to send the notification/action and the target subscribers.
  • Configure the notification card for subscribers.
  • Configure the action items.
  • Set the expiration condition and time period.

You can select Run Event to manually trigger this event notification to run. Select Show Event Log to view a history of changes categorized by severity.

Edit Notification

To edit your notification properties and conditions such as triggers, timestamps, and content you can select your microapp to configure it directly.

Follow these steps:

  1. Select the microapp you want to configure your notification for.
  2. Select the Notifications icon in the left hand column of your microapp.

    The Edit Notification screen opens with the following notification sections:

  • Notification Name lets you input the notification name and optionally select whether the notification event is run immediately after synchronization with your target application integration.
  • Content lets you configure the information displayed on your notification. Here you can configure the notification icon, notification title, and body content in addition to the display card image. You can optionally enter variables to incorporate elements generated from your target application integration.
  • Target Page lets you choose the page that is shown when the notification is selected. You can select the target microapp, target page, and optionally preview the page to see what your microapp recipients receive.
  • Settings lets you define the trigger conditions of your notification and the notification recipients. Select Audience to define the recipients of your notification from your integration and Edit Conditions to set what conditions trigger the notification for your users.
  • Expiration lets you define any of the conditions to remove the notification. You can set to expire the notification when the record in your integration is no longer available. You can expire the notification after a defined interval. You can also configure integration trigger conditions to expire the notification when there is a change in data in your target integration.

When your notification is configured correctly, scroll to the top of the page and select Save.

Clear all notifications

You can clear all notifications from your microapp by selecting Clear all notifications on the individual microapp’s edit menu. Use this option to clear your notifications in cases when you need to reorganize or regenerate your notifications (for example, when testing) when using a newer data structure.

Create a new page

When creating a page, you can select from the following basic page layouts depending on the information you want. Each template is intended only to speed up your activity to produce the page you want. You add and customize extra fields and buttons depending on your own requirements.

Page templates

  • Detail - Page template that provides static details.
  • Form - Create a page that provides static details in addition to the ability to input user data into your page.
  • Table - Create a page based on the data tables loading from your target application integration.
  • Static content - Set up page components that provide static, non-actionable, information such as headlines, error messages, reminders.

The different components and sections of the page builder are described in the following sections.

Detail view of page builder

Page builder components

The Page Builder lets you choose from various page components that let you customize and configure your microapp output, information, and display. Use components to build a page microapp based on your expectations and needs. For example, if you want to show a list of users, you use the Table component to build it.

The different template pages have different component features available by default. The following lists cover all available options.

Input components - Input provides the components to create actionable sections on your page including buttons, text input, radio buttons and so on.

  • Button - Add a clickable component on the page with actions and logic.
  • Text Input - Define text source and default to load to the page. Actions can be added. Can be disabled.
  • Text Area - Define text source and default to load to the page. Actions can be added.
  • Num. Input - Define number source, range, default, and formatting to load to the page.
  • Image - Define image source and formatting to load to the page.
  • Select - Allows users to choose from a set list of values (limit is 100 values). Populated by data from the source system or you can enter the list of values manually.
  • Look Up - Allows users to search though a large quantity of values and allows users to select a value by searching for something else.
  • Checkbox - Add a selectable component on the page by defining source, default, actions, and logic.
  • Radio - Add a set of options where only one can be selected. Populated by data from the source system or you can enter the list of values manually.
  • Date/Time - Define date and/or time to display in the microapp, as well as default time (the time displayed before selection), and formatting (12 hour, 24 hour, browser time) to load to the page.

Display components - Display provides the components to provide information to your end users of microapps including tables, static text, and images and so on.

Important:

A table without a personalized query exposes all records that match a table filter regardless of the data relation to subscribers. Your potentially sensitive data may be exposed to all microapp users unless you limit data exposure. Control data access for pages using the Personalize feature.

In a page, select the table in the component builder pane. Select Table Properties and select PERSONALIZE. Then select +Add Condition and add the constraints as required.

  • Table - Add a table by defining table source, filters, and defining columns. Page link actions can be added. Personalized queries must be set to limit data exposure.
  • Text - Define text source and formatting to load to the page. Actions and logic can be added.
  • Static Text - Define static text to appear the page. Actions can be added.
  • Static Image - Upload and display a static image from a URL source.
  • Line Divider - Use the divider to separate unrelated and group related information.
  • Back Button - Allows users to go back to previous page.
  • Power BI - Displays a BI report. Define source and formatting.
  • Concur Receipt Viewer - Displays a receipt image. Define source and formatting.
  • HTML Content - Use to display HTML content from pulled sources (for example RSS feeds) to display HTML correctly.

Layout component - Provides the grid component for setting the layout of your page.

  • Flexible Grid - Gives you more control over the positioning of components on your pages. Helpful when you’re designing pages intended for devices with larger screens. Set the label and the total number of cells you want in your grid.

Page details

Page details let configure the page you are creating and setting filters for information and providing various informational debugging features:

  • Page Name - Set the name of the page.
  • Data Filter - Use to set constraints on the action data.
  • Show SQL - Use this to display the SQL for debugging purposes.
  • Show Component Logic - Use this to display the component logic for debugging purposes.
  • Content to Display if Record Does Not Exist - Set the static content page to display when a record does not exist.

Component properties

Each page builder component has its own specific properties menu with various options to choose from depending on the component including:

  • Label - Customize the label of the button, text, image, and so on.
  • Size - Set the size of the button, text, and so on.
  • Style - Switch between different colors and formats for the text, button, and so on.
  • Show in Blade Footer - Toggle to display the element in the page blade.
  • Data Source - Select the data source for the displayed element.
  • Data Table - Select the data table for the displayed element.
  • Data Column - Select the data column for the displayed element.
  • Conditional Formatting - Configure conditional formatting for the page element.
  • Insert Variables - Add variable to the page element to automatically display application integration data.
  • Display toggles - Toggle how the element displays on the page builder.

Actions

The actions menu is present for the Button component to allow the microapp recipients to respond with actionable input. Define the action that the button executes from the configured service actions that you configured in the integration.

Logic

Select the Create Logic button to open the logic configuration. This enables you to configure the logic for your particular page component. Create conditions using standard logic arguments to achieve various outcomes depending on the desired behavior of your component. You can add multiple, stacked actions to any single button to create multiple action effects with a single click. When each service action runs successfully, the system moves through the chain of actions until all are completed. Actions include:

  • Evaluate Condition - Set and edit condition via a logical argument.
  • Set Component Value - Set the component value for the button to commit an action.
  • Show Component - Configure conditions to show the component.
  • Hide Component - Configure conditions to hide the component.
  • Enable Component - Configure conditions to enable the component.
  • Disable Component - Configure conditions to disable the component.
  • Set Component to Required - Configure conditions to require the component.
  • Set Component to Not Required - Configure conditions to exclude the component.

Where to go next

Review the customization scenarios. For more information, see Customization scenarios.

Customize microapps