Advanced Customization > Using Reusable Components
  
Using Reusable Components
Overview
This topic provides a brief overview of the ThingWorx Navigate BETA reusable components, that are based on ThingWorx guidelines and best practices for building components.
When you build applications, it is efficient to reuse standard components throughout your applications. These reusable components become the building blocks of your application, and you can configure and customize these components to suit your business case.
For more general information on reusable components, see the section Building ThingWorx Applications Using Reusable Components in the ThingWorx Help Center.
This topic provides information on the following:
Reusable Components in ThingWorx Navigate
Including Reusable Components In Your Mashup
Configuring Reusable Components
Customizing Reusable Components
Reusable Components in ThingWorx Navigate
ThingWorx Navigate 8.5 introduces BETA reusable components. Reusable components improve and simplify task development by providing out-of-the-box components that are ready to assemble into custom tasks.
* 
These components are released as BETA with limited documentation and are available for testing and evaluation. Using them in a production environment is not recommended.
The first assortment of reusable components was created for the development of the My Tasks task. This task is the first in the ThingWorx Navigate Contribute series of tasks.
When you insert a reusable component into a mashup, it has a default configuration. In general, the default configuration has no inherent functionality, and the reusable component requires additional configuration in order to work. Some reusable components also have one or more predefined configurations available, allowing these components to be used for specialized applications with minimal additional configuration. For example, the Item List component has four predefined configurations: Task List, Attachments List, Affected Items List, and Activity List. Each of these is a specialized configuration of the Item List component.
The predefined configurations connect to Windchill as their backend system. All access control settings, attribute visibility configurations, and security labels that are configured in Windchill are honored in ThingWorx Navigate. As a result, users can only see what the Windchill rules allow them to see.
See the Configuring Reusable Components section below for more information on configuring reusable components and selecting predefined configurations.
The following diagram and table provide a summary of the existing reusable components and their predefined configurations. The reusable components are based on the PTC Design System to ensure consistency. Some of the reusable components include other embedded reusable components. For example, the Item List component includes the Action Bar component.
Component
Description
Type
Predefined Configurations
Item List
Displays a data set as a list in a grid format. Includes sorting, filtering, and searching as well as more advanced capabilities.
Contained mashup
Task List, Attachments List, Affected Items List, Activity List
Attribute
Displays data in the form of name-value pairs. Can be embedded into an Item Identity panel.
Widget
None
Tile
Displays a set of tiles that each contain data in the form of a name-value pair.
Widget
None
Action Bar
Displays available actions. Can be embedded into an Item List or Item Identity panel to enable actions within those components.
Widget
None
Item Identity
Displays basic identity information on a specific item, including the title and identity attributes.
Widget
Task Identity
Task Progress
Displays summary of progress on task, including member votes and how many members have already taken action.
Widget
None
Including Reusable Components In Your Mashup
1. In the Mashup Builder, find the desired component.
a. For reusable components that are widgets, go to the Widgets panel and select Beta in the Category drop-down menu.
b. For the Item List reusable component, go to the Mashups panel and search for PTC.ItemListMashup.
2. Drag the component into your mashup.
3. Configure the component. See the following section for more information.
Configuring Reusable Components
Reusable Components are in BETA mode as of ThingWorx Navigate 8.5. As a result, you can only configure components by editing their JSON configuration. At this point, these topics are the extent of available support for configuring reusable components.
To configure a reusable component, follow these steps:
1. Select an existing reusable component from your mashup.
2. Click Gear icon in the top right of the Widget Properties panel. The Configure Mashup Parameters window appears.
3. If the selected reusable component has any predefined configurations, the Configuration Type drop-down menu is visible. You can select a preset configuration from the menu.
4. You can configure the reusable component by editing the JSON file in the Configuration box.
* 
You can use the Restore defaults button to restore the out-of-the-box configuration. Note that this button does not restore the last saved configuration.
5. Click Done to save your work. When you are done working in the Mashup Builder, click Save at the top of the page.
Customizing Reusable Components
A ThingWorx Navigate 8.5 component consists of a user interface layer and a business logic layer. You can customize the business logic layer of the component. The customizable part of the component is called the component model. To customize the component model, follow these steps:
1. Inherit the component Model Thing Template.
2. Override the required services.
3. Create a new Thing from the Thing Template.
4. Add the Thing to the component modelThingName configuration property value.
When these steps are complete, the component uses the Model custom code instead of the out-of-the-box Model code.