Improve variables tab integration

[abdul99ahad]

Closes #4516

Proposed Changes

Variables Application Menu

Variables Tab Keyboard shortcut

(For Mac OS): Press Command + Shift + V

Variables Bottom Tab

Checklist

To ensure you provided everything we need to look at your PR:

• Brief textual description of the changes present
• Visual demo attached
• Steps to try out present, i.e. using the @bpmn-io/sr tool
• Related issue linked via Closes {LINK_TO_ISSUE} or Related to {LINK_TO_ISSUE}

[philippfromme]

We should call this Toggle variables tab

I'd also add Toggle problems tab now that we have the other entry.

[barmac]

I'd suggest that we decide on another key for the shortcut. Ctrl/Cmd+V is the traditional paste shortcut, and in some editors a combination of Cmd+Shift+(Option)+V triggers "paste and match formatting". Why don't we use a letter without strong OS link, e.g. U or M.

Screen.Recording.2024-10-30.at.17.26.31.mov

[nikku]

I'd suggest that we decide on another key for the shortcut. Ctrl/Cmd+V is the traditional paste shortcut, and in some editors a combination of Cmd+Shift+(Option)+V triggers "past and match formatting".

I subscribe to this. CC @lmbateman.

[lmbateman]

I agree that we should stay away from Cmd-V variations. Looks like for many MacOS apps (but not the Desktop Modeler), Cmd-M minimizes the window. Cmd-U is a common shortcut for underline, but since that's a fairly specialized feature, I think Cmd-U will work, and Ctrl-U should be fine for Windows. (Should we add a Cmd-M shortcut?)

[barmac]

BTW the recording I shared displays the vscode shortcuts. I think the Shift usage in that tool is wise as it allows to avoid conflicts. Learning from Cmd+P (print or toggle properties panel 🤡 ).