Composer Action menu should group custom actions by dotted paths.

[tomlm]

Describe the bug

When adding custom actions the convention is to namespace them with dots, and if you have a lot of them, further namespace
the name of the action with dots.

For example:
Github.Activity.Feeds.GetFeeds

Composer treats it as a flat list, we should default to using dots as grouping, and group in the menu hierarchy.

Version

1.3.1-nightly.220254

Browser

• Electron distribution
• Chrome
• Safari
• Firefox
• Edge

OS

• macOS
• Windows
• Ubuntu

To Reproduce

Steps to reproduce the behavior:

1. Go to package manager
2. add \fusebox\public\feed as a custom feed
3. install github package
4. Go to add a custom action, see how all of these 400+ actions are listed flat.

Expected behavior

They should be listed grouped by each name
Github
Activity
Feeds
GetFeeds

Screenshots

Additional context

[yeze322]

@tomlm Hi Tom, 'Custom Action' is our previous gen solution on customized action and seems rough and not recommended anymore.

But YES, I think grouping by namespace is a reasonable feature and can improve first-time experience. So I'd like to implement it. There will be a prefix tree solution.

---

In 1.4, I recommend that defining the uischema menu options for customized grouping. Compared to 'Custom Action', the uischema solution supports more powerful control of those action kinds, including controlling the flyout menu, defining the visual canvas appearances, etc.

For example, in Microsoft.SendHandoffActivity.uischema, it groups SendHandoffActivity under the 'Access external resources' label by writting

{
    "$schema": "https://schemas.botframework.com/schemas/ui/v1.0/ui.schema",
    "form": ...,
    "menu": {
        "submenu": [ "Access external resources" ],
        "label": "Send Handoff Event"
    },
    "flow": ...
}

Similarly, you can group Github.Activity.Feeds.GetFeeds to Github Activity -> Feeds by defining Github.Activity.Feeds.GetFeeds.uischema as

{
    "$schema": "https://schemas.botframework.com/schemas/ui/v1.0/ui.schema",
    "menu": {
        "submenu": [ "Github Activity", "Feeds" ],
        "label": "Send Handoff Event"
    }
}

If you feel too complicated to author *.uischema files, I can help you adding them in your Github actions repo.

[yeze322]

@hatpick Soroush what kind of UX design do we need for this? I saw you add a 'UX design' label.

[hatpick]

@hatpick Soroush what kind of UX design do we need for this? I saw you add a 'UX design' label.

Hey, please consult Sangwoo and get his thoughts on the matter