Tray Embedded / Building Integrations / Displaying Solutions
Displaying Solutions
Read first
Make sure you have read the following sections before proceeding:
Introduction
Once you have registered and logged a user into your app, you will need to display the Integrations / Solutions available for them to configure their own 'Solution Instances'.
The above screenshot shows a simple mockup of what this might look like (exactly how you display available Solutions to your End Users is up to you).
In the above case, for an End User (who has already been registered and has an access token) you will need to implement the following:
List the available Integrations / Solutions in your application with the solutions query (master token)
The End User can click to configure any of the available solutions, whereby you:
generate a Config Wizard one-time authorization code (master token)
and use createSolutionInstance (user token) to obtain a solutionInstanceId
The Config Wizard can then be activated with the following url:
https://embedded.tray.io/external/solutions/${embeddedId}/configure/${solutionInstanceId}?code=${authorizationCode}
You can remove the Tray.io domain and whitelabel the Config Wizard url. If you have done so then embedded.tray.io
will be replaced with e.g. acme.integration-configuration.com
In the above url remember that embeddedId is set in the People and settings section of the dashboard
Key Data
id is the unique id of the Solution, and is required when creating a Solution Instance for an End User
title is the title of the Solution as named in the Tray Embedded UI, and can be displayed in your application
tags which have been set in the Tray Embedded UI can be used to categorize and filter Solutions in your application
customFields can be used to add any custom fields, such as an icon url for your Solution
Viewing Solutions in the UI
The Projects section of the Tray Embedded dashboard has following tags on Project tiles:
Live solution: This means that the project has a live published solution that is ready to be used by the End users.
Draft solution: This tag means a solution was created but hasn't been published yet.
Unpublished changes: This tag means some edits were made either in the workflows or on the config wizard that haven't been published yet. The end users won't be able to use your changes until you publish the solution again.
If none of these tags exist as marked in the screenshot above, that means you haven't created a solution for this project yet.
APIs connected to Solutions
The GraphQL solutions query is used to list the Solutions available
Tagging Solutions
In Solution settings, it is possible to use tags to categorize Solutions:
One use for this is that you may wish to group users into basic and advanced product users, using tags in the Solution editor:
tags is then one of the node fields that can be returned for each result from the solutions query:
1query {2viewer {3solutions {4edges {5node {6id7title8description9tags10}11}12}13}14}
Results are returned in the following format and solutions can then be filtered accordingly for presentation to End Users in your external application:
1{2"data": {3"viewer": {4"solutions": {5"edges": [6{7"node": {8"id": "2d38bxxx-xxx-xxx-xxx-xxc68084266",9"title": "Salesforce 1",10"description": "",11"tags": [12"basic"13]14}15},16{17"node": {18"id": "53b10xxx-xxx-xxx-xxx-xxe09038b",19"title": "Salesforce 2",20"description": "",21"tags": [22"advanced"23]24}25}26]27}28}29}30}
Connected topics
Custom icon URL can be used to present images/icons
Read next
The next page in this section is a guide to working with the Config Wizard: