Changing the way hotkeys are displayed

[Nindouja]

As mentionned in #17 moving the hotkeys from the top bar would be usefull to have more tabs space.

The solution mentionned is to create a help popup that opens on ? hotkey. The popup could eventually display an introduction to the app, but mostly all those global hotkeys. And even maybe the actions for the selected tab.

The global shortcuts could also be kept on the main page at the bottom on a separate line than the current tab hotkeys.

I've implemented exactly that on a another TUI and I like how it look likes, I'll add a screenshot when I'm on my main PC.

[Nindouja]

Here are the screenshot showcasing what I was talking about

[Dark-Alex-17]

I'm curious which is better:

• Displaying the help as a popup
• Displaying it as a separate screen that you can just ESC out of to go back to whatever you were looking at.

The latter is less technically challenging but a bit more disruptive in the UI. The former looks prettier, but is harder to implement with the number of popups/screens Managarr has.

[Dark-Alex-17]

The other challenge is that the hotkeys vary by tab/popup/screen. So it would need to change by whatever screen you're looking at, which is itself a bit more challenging.

[Nindouja]

For the popup vs screen, I don't have much of a preference. In my case it's almost the same as the popup takes 99% of the screen, and it's closable on ESC as well.

The I implemented it (so I have dynamic actions based on context):
I have a root component. It holds the tab list, and each tab instances as well as an Option. During drawing, if that Option is Some I'll draw it after I draw the tab list and current tab so it's above them.

When the event for toggling the help is recieved, I query the current tab to get a list of its actions; and I set the Option to a fresh instance. The global actions are stored in a const so HelpView can access them as well.

[Dark-Alex-17]

My system is roughly the same, but the issue is in how you have to draw popups in Ratatui. I have some ideas. Let me play for a sec.

The other challenge is if that's actually convenient for users right now vs leaving them available for first-timers and ease-of-use. That alone gives me pause to delay this until the next release.

[Nindouja]

Yeah, there is definitely no rush !

Here is my code for the render of the popup:

self.draw_tab(f, real_main_view, instructions_tab, global_state)?;
if let Some(help) = &mut self.help_view {
    let area = f.area().inner(Margin::new(3, 1));
    Clear.render_ref(area, f.buffer_mut());
    help.draw(f, area, global_state)?;
}

I just get an nested Rect inside my root rect. Clear it, and redraw the help there. Take a look at the clear doc, it might help: https://docs.rs/ratatui/latest/ratatui/widgets/struct.Clear.html

The other challenge is if that's actually convenient for users right now vs leaving them available for first-timers and ease-of-use.
That's why I keep them at the bottom of my screen in more concise version.

If you want to get more inspiration here is my TUI repo: https://gitlab.vba.ovh/Nindouja/spp/-/tree/main/spp-tui?ref_type=heads
But it is kindof a mess; i'm trying to play with the foundations to buiild more robust TUI and easier in the future and I kinda reinvented the wheel in some parts. I'll switch to tui-realm I believe

[Dark-Alex-17]

I've implemented support for this functionality! If you get some time, test it out and let me know your thoughts and if there's anything you think I should change! I kept the context-specific keybindings and global keybindings together in one menu and didn't separate them. However, I did make it so that the context-specific keybindings always show up first in the table, followed by the global keybindings. This made a bit of sense to me because you'll always look at the top and see the new keybindings relevant to the window you're in.

Let me know what you think! @Nindouja