[APM] Create custom action from Trace summary

[formgeist]

Summary

As outlined in the design elastic/apm#196 we want to enable users to create custom actions that will appear in the Actions context menus in the UI. Currently available in the Transaction detail view and detail flyouts for Transactions and Spans in the Timeline.

Create custom action from the actions menu in Transaction detail (Trace summary)

We want to enable the user to create a custom action from within a selected service and transaction in order to quickly add a new action based on a specific scope.

• Enable user to invoke the create custom action flyout ([APM] Custom actions: Add flyout for creating and editing custom actions #56365)
• Use the existing metadata from the transaction document to fill in the fields in the Filter (see example below)

Screens

Actions menu with no custom actions available

Actions menu with options to manage and create custom action icon buttons

Create flyout with the filter prefilled to assist in scoping the custom action

[elasticmachine]

Pinging @elastic/apm-ui (Team:apm)

[sorenlouv]

I think the empty state copy: "No custom actions found for this service" should no longer include any mention of "service". The user could have a custom action for the service, but it doesn't match the current environment or transaction name.

[cauemarcondes]

@formgeist we should show the first 3 items in the action menu, and when the user clicks on See more, are we going to redirect the user to the Custom Link page? if Yes should we filter the result on that page?

[formgeist]

@cauemarcondes The "See more" option would actually reveal all the remaining actions in another panel within the context menu, like so;

Sorry for not explaining this in the implementation issue

[cauemarcondes]

@formgeist and what about the engine icon? what it should do?

[cauemarcondes]

Things discussed on Zoom:

1. The engine button should open the settings page. @formgeist can you provide what's the text that's going to be shown on the tooltip?
2. When the create button is clicked, the flyout should open with all filters prefilled. After it's saved, the item should be available in the actions menu.
3. The items should be sorted alphabetically.
4. Hide the create button when the user doesn't have permission.
5. Added a subtitle saying the links will be opened in a new tab. @formgeist can you provide it?

[formgeist]

The engine button should open the settings page. @formgeist can you provide what's the text that's going to be shown on the tooltip?

Manage custom links

Added a subtitle saying the links will be opened in a new tab. @formgeist can you provide it?

Links will always open in a new window/tab.

[formgeist]

@cauemarcondes and I went over the Actions menu and it occurred to us that it's a EuiPopover component, not a EuiContextMenu so the support for nesting items is not there. This means extending the current Actions menu to support nesting with inspiration from the EuiContextMenu implementation (see above). This got us thinking whether we should split the Custom links menu out from the Actions menu for the following reasons;

1. Allows for more options by default because we don't have to take into consideration the existing Actions items (which is a lot for APM transactions).
2. It's a premium feature, which makes all the more sense to allow separate access and ease-of-use for the user.
3. Since they're no longer actions, but links, it doesn't belong in the Actions menu.

Thoughts? cc @nehaduggal @roncohen

[nehaduggal]

Everything else that we have on the Actions menu today is essentially links to different visualizations, so why should these be treated differently in the UI? If and when we have actual Actions in the UI, it would make sense for us to separate them out but for now we are cluttering the UI by calling Links out separately from the Actions.