Improvements for intelligent commands

[slemeur]

Goals

The goal of this issue is to polish intelligent commands UX and UI.

UI improvements

• Stretch the command toolbar
  At this moment the command toolbar is using a fixed width.

We need to make it using all the width available

• Previews button

• We need to resize the preview button so that it has the same size than the other buttons "Run", "Debug".

• We also need to increase the size of the preview icon

• We need to add a tooltip when hovering the preview button "Previews"

• Buttons behaviors

• We have some insconsistency in the mouse pointer icon which is used accross the different buttons. We need to make sure to use the little hand on all of the buttons "Run", "Debug", "Preview" and all over the command toolbar.
  

• We also need to put feedback when hover and manage clicked state:

• Fix position of the leftsidebar icon button
  It must vertically centered in the menubar

• Fix styles of command type selector

Remove the border

• Fix color of Java icon

Use color #B6BABD

UX Improvements

• Improve context selection

• We need to remove the "Context: workspace"
• Replace "Projects" title by "Apply to"
• By default, all projects are "applicable" (means - applicable to all projects of the workspaces)
• User can disable the projects in which the command is not applicable
• If a command is not applicable for any project, then it's store in the workspace, visible from command explorer, but not displayed from "run" or "debug" buttons and not available in command palette.
• When a new project is added into the workspace, the command is applicable for it.
• When a new command is created, it is applicabled to all existing projects

Other improvements are mostly based on first time experience reports

• When create a new command, open it at the top of the form
  Today, when you create a new command, it automatically scrolls to the bottom of the form. We need to stay at the top.

• Improve experience when no command exist in workspace
  When there are no commands configured in the workspace, the user is not guided into the flow of creating a command. We need to help him to understand how it works and how he can configure his workspace's commands.

• When, there are no commands configured in the workspace: the command toolbar will display " Create and start command." when clicked, it will open the "Commands Explorer" with the editor open to create a new command with goal "Run"

• When, there are no commands configured in the workspace: When clicking on the "Run" button, it will show this:

When clicked, it will open the "Commands Explorer" with the editor open to create a new command with goal "Run"

• When, there are no commands configured in the workspace: When clicking on the "Debug" button, it will show this:

When clicked, it will open the "Commands Explorer" with the editor open to create a new command with goal "Debug"

• Fix complexity to find where to execute the command from the editor:

• Add button to display command palette
  At first, it is difficult to understand how to get the command palette. We need to add a button in the toolbar so that the commands are easier to find. When clicked, we will display the Command palette.
  We need an tooltip which will also display the keyboard shortcut to display the command palette.

• Add hint in command palette for how to execute a command and keyboard navigation

• Remove 'v' arrow from command toolbar when there is 0 or 1 command running and disable unfolding the list

[slemeur]

We need to define keyboard shortcuts to trigger the default "Run" and "Build" commands too.

[slemeur]

Linking with #4380