Add support for window.titleBarStyle advanced setting

[per1234]

Describe the request

Allow the user to persistently configure the "Window: Title Bar Style" (machine identifier window.titleBarStyle) advanced setting to "custom".

- AND -

Ensure the Arduino IDE UI is fully functional when this setting is set to "custom".

🙂 Users will have control over the style of Arduino IDE's title bar.

Describe the current behavior

In addition to the primary settings that are accessible via the File > Preferences... menu item (or Arduino IDE > Settings... for macOS users), Arduino IDE has some additional settings for advanced users.

One of those advanced settings is "Window: Title Bar Style" (machine identifier window.titleBarStyle), which is intended to allow the user to choose between the use of the operating system's native window title bar style (the "native" setting), and a bespoke title bar style implemented by the Eclipse Theia Platform IDE framework (the "custom" setting).

The setting is locked to "native" by the Arduino IDE codebase:

arduino-ide/arduino-ide-extension/src/electron-main/theia/electron-main-application.ts

Lines 456 to 461 in 0f9f0d0

	protected override getTitleBarStyle(
	// eslint-disable-next-line @typescript-eslint/no-unused-vars
	_config: FrontendApplicationConfig
	): 'native' | 'custom' {
	return 'native';
	}

If the user attempts to change the setting to "custom", after the next time the user restarts the application (not including the restart that is triggered by the setting change) Arduino IDE will be in a non-functional state where the title bar is missing entirely. After one more restart, it will revert back to the "native" title bar style.

🙁 Users are not able to persistently configure the title bar style according to their preference.

🐛 During the time when the setting is temporarily set to "custom", the title bar is in a partially non-functional state due to the window control icons (minimize, maximize/restore, close) overlapping the "Sketch", "Tools", and "Help" menus, and the "Help" menu being positioned mostly off the right edge of the window (or if the "Window: Menu Bar Visibility" setting is set to "compact", then the icons instead overlap the Serial Plotter and Serial Monitor icons).

Arduino IDE version

Original report

2.0.0.rc7-nightly-20220615

Last verified with

2.3.6

Operating system

• Linux
• Windows

Operating system version

• Ubuntu 24.04
• Windows 11

Additional context

window.titleBarStyle is intentionally disabled when Arduino IDE is running on a macOS machine. The reason is explained here.

window.titleBarStyle is connected to another setting value: window.menuBarVisibility. This preference is also disabled in Theia on macOS. Both preferences must be supported, or there is no way to show a custom title bar.

---

@kittaakos put together a preview from the latest Theia sources. Please look at how it works on resizing concerning overlay, menu, etc.:

custom-titlebar.mp4

• On macOS, the window control buttons must be moved to the left, and custom button styles are needed to provide a native look and feel.
• Figure out if IDE2 wants to support menus on the title bar. If not, the styling issues 👆 still be fixed on Windows and Linux.

---

Originally reported at #1077

Additional reports

• Menu is misplaced #2680
• https://forum.arduino.cc/t/window-titlebarstyle-not-working-not-persistent/1374700

Related

• Restore support of breadcrumbs.enabled and workbench.editor.highlightModifiedTabs advanced settings #1733
• Title bar unexpectedly switches to "custom" style #2440

Issue checklist

• I searched for previous requests in the issue tracker
• I verified the feature was still missing when using the latest nightly build
• My request contains all necessary details