Overview
You have the ability to add additional details to a summary tag or field tag. This can be things such as charts, tables, or images. Having the the ability to add visuals within summary tags and field tags empowers skill builders to provide additional information other than plain text. When a tag is added from V1 Powers, new properties are available. This article will cover those properties.
Adding Additional Details to a Tag
AdditionalText is free text that is provided as a way to add more information to a tag. When additionalText is added to a tag, the tag will display along with a "Learn More" link that shows under the tag. The "Learn More" link text can be overwritten using the learnMoreLinkText property. This additional text can be used to provide additional clarity or information on the tag without making the tag look big and bulky on its own.
In its default state:
After clicking on the "Learn More" link:
CanRequestAdditionalData is a boolean that when set to true, either turns the "Learn More" into a link that triggers a chat with Andi if additionalText is not included or, adds an "Additional Details" link to additionalText if it is included. The text used for the Additional Details link can also be overwritten using the additionalLinkText property.
If additionalText is included and canRequestAdditionalData is set to true:
If canRequestAdditionalData is set to true with no additionalText included:
Selecting "Additional Details" or "Learn More" respectively in the cases above will start a conversation in Andi. This conversation will call out specifically to the skill that returned the related tag and wait for a reply.
You can listen for this specific event by utilizing DialogueResponsePowers.isGetAdditionalTagDataEvent (using DialogueReponsePowers from @andi/powers). You should respond to this event in the skill with a DialogueResponse to start a conversation and provide further information on the tag.
Along with the DialogueResponse, you can include additionalContent to send back. AdditionalContent takes a new type, HtmlContent that takes a message and html both as a string. Message is optional text that will flow back in the response and show above the HTML data. The html property in HtmlContent is required and any content set here will be returned to Andi and rendered in view in the Andi chat window. Here is an example of how you could access skill storage for a custom HTML file to return with the response:
In PrecisionLender, the skill will look similar to this:
Upon clicking on the Expand View link, the Andi window will expand to encompass the entire screen and display the HTML in a larger pane to the right of the main Andi window.
Select Minimize View to return Andi to the normal size. Clicking on the X found in the top right corner will close the Andi window completely.
If you wish to provide a different image for the minimized/preview view, a separate preview property is available on the HtmlContent type.
If both html and preview properties are defined, then the preview HTML will be used for the minimized view, while the html will be used in the expanded view. If only the preview is defined, then there will be no "Expand View" link above the preview.