FDC3 Workbench: Add Support for FDC3 2.0 features

[kriswest]

Enhancement Request

The FDC3 Workbench should be updated to support 2.0 features (after #787 is resolved)

1. Use the new names for joinChannel() ->joinUserChannel() and getSystemChannels()-> getUserChannels()

   1. Update types used to 2.0 versions
   2. Change all function calls to use new names
   3. Change tab names and other labels to replace System Channels with User Channels

2. App's own metadata

   1. Add an additional row to the FDC3 implementation metadata top-right, to display the appID
   2. Apply CSS to the value field to limit its width:

      {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          overflow-wrap: anywhere;
          max-width: 150px;
      }
      

3. Originating app metadata

   1. In 2.0 Context and Intent Handler functions may be passed an additional metadata argument identifying the app that originated the message.
      1. See: https://fdc3.finos.org/docs/next/api/ref/Types#contexthandler
   2. Add a second element under each 'LAST RECEIVED CONTEXT' text area (User Channels, App Channels and Intents sections), with title 'RECEIVED FROM'
   3. If present the metadata argument is present, format it manually (to avoid {} taking up a line each) and populate the box with it, e.g.:

      appId: someApp
      instanceId: f5300a97-c0df-4df2-922b-6cdc09db7a9e
      

   4. If NOT present, populate box with string 'METADATA NOT PROVIDED''

4. Receiving an Intent result

   1. In the Intents tab in left hand panel, in the two 'raise' elements ('Raise Intent' and Raise Intent for context'), after the intent is raised add a new 'resolution' element that will render the 'IntentResolution' we receive back from the raised intent (see https://fdc3.finos.org/docs/next/api/ref/Metadata#intentresolution for details of the object returned)
   2. Render data:
      1. Resolved by (resolution.source):

         appId: someApp
         instanceId: f5300a97-c0df-4df2-922b-6cdc09db7a9e
         

      2. Result: pending…
   3. Await any result with:

      //Raise an intent and retrieve a result from the IntentResolution</code></strong>
      let resolution = await agent.raiseIntent("intentName", context);
      try {
        const result = await resolution.getResult();
        //detect whether the result is Context or a Channel
        if (result && result.broadcast) { 
          //render channel
        } else if (result){
          //render context
        } else {
          //render no result
        }
      } catch(error) {
        console.error(`${resolution.source} returned a result error: ${error}`);
      }
      

   4. Render results appropriately:
      1. Context:
         Format with JSON.stringify(context, null, 2) and render in disabled text field (as used for 'Last received context' in right hand panel) and title 'RESULT CONTEXT'
      2. Channel:
         Check type of channel (result.type == "app" or result.type == "private", see https://fdc3.finos.org/docs/next/api/ref/Channel for details)
         1. If type of channel is "app"
            Add elements that are normally displayed on app channels tab after a channel is retrieved with fdc3.getOrCreateChannel
         2. If type of channel is "private", add the same elements
            1. Additionally, add a 'disconnect' button, that should call the disconnect function of a PrivateChannel: see https://fdc3.finos.org/docs/next/api/ref/PrivateChannel for details
            2. Add a 'Channel id' element to render the private channel's ID.
            3. In the right-hand panel, listeners tab, add a 'Private Channels' section where an element should be added when a listener is added to the channel and contexts received should be rendered (as they are for App Channels).
               1. Channel will likely have an unfriendly id, which needs to be displayed so it can be (manually) connected back to the result received
            4. Automatically supply handlers for the 3 additional listener functions that private channels have:
               2. onAddContextListener(handler: (contextType?: string) => void): Listener;
               3. onUnsubscribe(handler: (contextType?: string) => void): Listener;
               4. onDisconnect(handler: () => void): Listener;
            5. Render events received on these 3 handlers in the left-hand panel under the result element NOT in the right-hand panel where contexts received are rendered.
               1. Treat these events like a log and accumulate them.
      3. No result:
         Simple string: No result returned
   5. Add a 'Clear result' button, that should delete the specific result element

5. Sending an Intent Result

   Note: The workbench will not be able to support complex intent result behaviors, but should be able to support example intent result behaviors to fulfill its purpose of enabling development and test.

   1. On the intents tab, under 'Add Intent Listener', new options will be needed - they should be enabled via a checkbox:
      ☑️ Send Intent Result
   2. There are two types of result, which should be selected via radio buttons, each will have options:
      🔘 Context result | Context template dropdown 🔽 |
      🔘 Channel result
      🔲 Use a private channel
      |--Channel name–-------|
      | my channel name        |
      |--------------------------|
      ☑️ Send context result over channel
      | Context template dropdown 🔽 |

   Note: The options selected should affect the code on the copy button next to the 'add listener' button \

   1. The context result option should be fairly simple, the intent handler should just return the selected context template.
   2. The Channel result is slightly more complex…
      1. If 'use a private channel' is selected, the intent handler registered should:
         1. Hide or disable the channel name box
         2. Create a private channel with fdc3.createPrivateChannel()
         3. If 'Send context result over channel' is selected
            1. Add a listener to it with channel.onAddContextListener(...)
            2. Broadcast the selected context via the channel object when the listener fires.
         4. Return the (private) channel object
      2. If 'use a private channel' is NOT selected, the intent handler registered should:
         1. Show/enable the 'channel name box'
         2. Retrieve the channel object with fdc3.getOrCreateChannel(channelName)
         3. Set-up a setTimeout call to wait 1.5 seconds then broadcast the select context bia the channel object
            1 Return the (app) channel object.

   Note: We may later decide that the delay before sending context should be configurable (but isn't needed for private channels that sync on the addition of the context listener). We may also decide that we need to be able send multiple contexts with a delay between, which will require further development to set up the sequence with delays…

6. Targeting a raised intent (at an app instance)

   Note: Intents can be targeted at particular appIds in FDC3 1.2 and appId/instanceId pairs in 2.0. However, there is no way to retrieve the list of available appIds in FDC3, hence we will have to rely on user data entry for the AppId. Instance Ids can be retrieved for an appId however.

   1. On the intents tab, add a check box under 'Raise Intent' and 'Raise Intent for Context' (above where results will be displayed, but below other controls):
      ☑️ Target an app
      |--AppId–-----------|
      | myAppId               |
      |---------------------|
      ☑️ Target an instance of the app
      | Instance id drop down 🔽 |

   2. Due to the space this will occupy, it is recommended that the fields are displayed when the checkboxes are clicked.

   3. Instance id drop down can be populated via a call tofdc3.findInstances(...)
      See: https://fdc3.finos.org/docs/next/api/ref/DesktopAgent#findinstances

   4. When the Raise Intent button is clicked, an object with the appId(and instanceId, if selected) should be passed as an argument
      See: https://fdc3.finos.org/docs/next/api/ref/DesktopAgent#raiseintent