[Canvas] Move app menu into new stacked header

[ryankeairns]

With the introduction of the new global, stacked header, application menus are now being relocated into the lower bar as seen below:

For consistency, it would be preferable that Canvas followed suit (ideally for 7.10). This can be accomplished using the shared TopNavMenu component which has been adapted to leverage a new API which pushes the menu into the header. For reference, other Kibana apps such as Discover, Dashboard, and Lens have already been converted.

Proposed changes

• Convert the current Canvas menu to use the shared TopNavMenu component
• Change 'View' to 'Options' to align with terminology used in Dashboard
• Change the order to: 'Options', 'Share', and 'Edit' (again, following the Dashboard order)
• Add the V1 toolbar / Keep the 'Add element' button in its current place (perhaps pushed into the new toolbar component)
• Remove 'Add from Kibana' from the 'Add element' context menu. Instead, use the 'Add from Library' button to open the embeddables/library flyout

TopNavMenu component

https://github.com/elastic/kibana/blob/61c4e6fd8d7410bfabe3d108211d7aa1d54c7ef5/src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx

Alignment with Dashboard

Dashboard is planning to add a new tooblar which could be leveraged in Canvas for similar purposes (e.g. adding content from the library).

Dashboard V1 toolbar (proposed)

Canvas V1 toolbar (proposed)

cc:/ @alexfrancoeur

[elasticmachine]

Pinging @elastic/kibana-canvas (Team:Canvas)

[nreese]

Closing as not planned