Loop UI Handlers

Specify Loop actions based on the end user interactions with UI elements

loopOpenHandler

The loopOpenHandler is a method that works in conjunction with the My Loops page and with the search dropdown menu. It will get called when the end user clicks on a Loop in one of those areas. It will also get called when a user installs, restarts, or unpauses your Loop. The purpose of this handler is to allow the end user to easily get back to the starting point of a Loop, by allowing Loop Authors to programmatically trigger their Loop’s Start Whisper. You can do this by wrapping your Start Whisper code within the ui.loopOpenHandler method.

Example

Here is an example of how to use the loopOpenHandler to trigger a Start Whisper:

Important: Utilizing the loopOpenHandler function is included in our Product Requirements. Without this function, your Loop will not provide the ideal user experience and will not meet the criteria stated in our Loop Approval Checklist.

(async () => {
  ui.listenSearchbar(doSomethingWithSearchText);
  ui.listenGlobalSearch(doSomethingWithSearchText);

  ui.loopOpenHandler(() =>
    whisper.create({
      label: 'Start Whisper',
      components: [
        {
          type: whisper.WhisperComponentType.Markdown,
          body: "I'm a whisper that only opens when loopOpenHandler is called",
        },
      ],
    })
  );
})();

My Loops Page

Think of the My Loops page as your home page for all of your installed Loops. From this page, you can easily access your Loops without executing a search, triggering a sensor, or opening extra windows. Simply click on the Loop you want to use, and a Whisper will be triggered.

You can also manage Loops from this page using the options provided within the dropdown arrow. Click Remove Loop to uninstall and Manage Loop to open the Loop detail page in the Loop Library window.

When a Loop is clicked from this page, the function inside ui.loopOpenHandler will be called. This should contain the code for launching the Loop's Start Whisper.

The Loop Dropdown Menu

Olive Helps' search experience features a Loop dropdown menu. This feature supports better searching when multiple Loops are installed. It will allow the end users to search across multiple Loops, or only within a specified Loop.

To check out this feature, click on the search icon at the top of the Olive Helps sidebar.

Clicking on the search icon will activate the new search bar:

You’ll notice a button-like element labeled All, with a dropdown arrow. Clicking on this element will open up a dropdown menu that displays all currently installed Loops, as well as Sidenote. The dropdown menu allows users to select a single Loop to engage with - for example, searching within just the selected Loop, or launching the Start Whisper for that Loop.

When the end user clicks on the Loop in the dropdown menu, the function inside ui.loopOpenHandler will be called. This should contain the code for launching the Loop's Start Whisper.

Last updated