feat(touch_bar): basic integration

src/public/app/components/app_context.ts

@@ -25,6 +25,7 @@ import type { default as NoteContext, GetTextEditorCallback } from "./note_conte
 import type { ContextMenuEvent } from "../menus/context_menu.js";
 import type TypeWidget from "../widgets/type_widgets/type_widget.js";
 import type EditableTextTypeWidget from "../widgets/type_widgets/editable_text.js";
+import TouchBarWidget from "../widgets/touch_bar.js";
 
 interface Layout {
     getRootWidget: (appContext: AppContext) => RootWidget;
@@ -444,6 +445,10 @@ class AppContext extends Component {
 
         this.components = [this.tabManager, new RootCommandExecutor(), new Entrypoints(), new MainTreeExecutors(), new ShortcutComponent()];
 
+        if (utils.isElectron() && utils.isMac()) {
+            this.components.push(new TouchBarWidget());
+        }
+
         if (utils.isMobile()) {
             this.components.push(new MobileScreenSwitcherExecutor());
         }

src/public/app/widgets/touch_bar.ts

@@ -0,0 +1,37 @@
+import utils from "../services/utils.js";
+import Component from "../components/component.js";
+
+export default class TouchBarWidget extends Component {
+
+    remote: typeof import("@electron/remote");
+
+    constructor() {
+        super();
+        this.remote = utils.dynamicRequire("@electron/remote") as typeof import("@electron/remote");
+        this.#setTouchBar();
+    }
+
+    #setTouchBar() {
+        const touchBarData = this.#buildTouchBar();
+        this.remote.getCurrentWindow().setTouchBar(touchBarData);
+        console.log("Setting touch bar", touchBarData);
+    }
+
+    #buildTouchBar() {
+        const { TouchBarButton } = this.remote.TouchBar;
+
+        const items = [
+            new TouchBarButton({
+                label: "New note",
+                click: () => {
+                    console.log("New note pressed.");
+                }
+            })
+        ];
+
+        return new this.remote.TouchBar({
+            items
+        });
+    }
+
+}