How beagle-config UI is going to look like?

[ArthurSonzogni]

@SAtacker, @lorforlinux, @VedantParanjape, @jadonk

Hello, I am wondering what kind of UI you would like to get for beagle-config?

The current UI prototype looks like: I see the main menu (system, network, ...) presented horizontally. Then vertical sub-menu. A modal window appears when clicking on the sub menu and display some script output.

---

Note: Just to see how a vertical menu could look like, I took inspiration from the gnome-control-center that I like:: I could give something like:

---

What are your opinions?

• Do you want to see a permanent menu, or something that disappear after selecting an entry (similar to raspi-config)?
• Do you want something horizontal or vertical? etc...

[SAtacker]

The UI you have shown above is far better looking than the current one. Then I would have to add an i button in every menu to let the users know what it will do.

[SAtacker]

Do I need to do some kind of wireframing before going ahead? @ArthurSonzogni

[ArthurSonzogni]

Do I need to do some kind of wireframing before going ahead? @ArthurSonzogni

Not necessary. I just wanted to check you and other mentors were aligned and all happy about it.

Then I would have to add an i button in every menu to let the users know what it will do.

If you go with a vertical menu on the left, You probably can put menu-specific component on the right. I guess you can decide what to display per component and put some informations about what each of those is about there.

In my example, I defined:

class PanelBase : public ftxui::ComponentBase {
 public:
  virtual std::wstring Title() { return L"title undefined"; }
  virtual ~PanelBase() {}
};
using Panel = std::shared_ptr<PanelBase>;

   std::vector<Panel> panels = {
       panel::Sound(),
       panel::PlaceHolder(L"Wi-Fi"),
       panel::PlaceHolder(L"Network"),
       panel::PlaceHolder(L"Bluetooth"),
       panel::PlaceHolder(L"Background"),
       panel::PlaceHolder(L"Notification"),
       panel::PlaceHolder(L"Search"),
       panel::PlaceHolder(L"Application"),
       panel::PlaceHolder(L"Confidentiality"),
       panel::PlaceHolder(L"Online account"),
       panel::PlaceHolder(L"Sharing"),
       panel::PlaceHolder(L"Energy"),
       panel::PlaceHolder(L"Screen"),
       panel::PlaceHolder(L"Mouse & Trackpad"),
       panel::PlaceHolder(L"Printer"),
       panel::PlaceHolder(L"Amovible device"),
       panel::PlaceHolder(L"Printer"),
       panel::PlaceHolder(L"Colors"),
       panel::PlaceHolder(L"State and language"),
       panel::PlaceHolder(L"Universal access"),
       panel::PlaceHolder(L"Users"),
       panel::PlaceHolder(L"Default application"),
       panel::PlaceHolder(L"Date and time"),
       panel::PlaceHolder(L"About"),
   };

And a Menu component containing them. You can implement Menu, with ftxui::Menu, ftxui::Container::Horizontal, ftxui::Container::Tab, ...

[SAtacker]

If you go with a vertical menu on the left, You probably can put a menu-specific component on the right. I guess you can decide what to display per component some information about what each of those is about.

:+1:

In my example, I defined:

class PanelBase : public ftxui::ComponentBase {
 public:
  virtual std::wstring Title() { return L"title undefined"; }
  virtual ~PanelBase() {}
};
using Panel = std::shared_ptr<PanelBase>;

Could you please explain why we need a custom component here? Could Menu not do this just by using a vector of those strings?

[ArthurSonzogni]

Could you please explain why we need a custom component here? Could Menu not do this just by using a vector of those strings?

This is a bit more than a menu. There is a menu on the left, and a "tab" on the right displaying the component selected by the menu.

This is a bit similar to the example: https://github.com/ArthurSonzogni/FTXUI/blob/master/examples/component/tab_vertical.cpp

Outside of some customized rendering, the layout looks like:

Container::Horizontal({
  Menu(&panel_titles, &selected_panel),
  Container::Tab(panels, &selected_panel)
})

[SAtacker]

Thanks, a vector of components makes sense

[VedantParanjape]

@ArthurSonzogni In my opinion a modern look will be better, like the one you posted (from the gnome control center). The one in raspiconfig is borrowed from kconfig and looks a bit awful.

[SAtacker]

So I'll close #3 as I'll rewrite most of its parts.

[VedantParanjape]

So I'll close #3 as I'll rewrite most of its parts.

Sounds good, go ahead !

[SAtacker]

Also How about I expose the execute function here as well as one on L97 and handle all the execution of scripts in a different object which will also provide a bit of logging?

[VedantParanjape]

Also How about I expose the execute function here as well as one on L97 and handle all the execution of scripts in a different object which will also provide a bit of logging?

What do you mean by expose the function on Line 97 ?

Yes, a separate class for exec script seems like a good idea.