Handle dynamic monitors

modules/wm/ags/config.js

@@ -7,11 +7,33 @@ import Gtk from "gi://Gtk?version=3.0";
 import Gdk from "gi://Gdk";
 
 /**
- * @param {(monitor: number) => Gtk.Window} widget
+ * @param {Array<(monitor: number) => Gtk.Window>} widgets
  */
-export function forMonitors(widget) {
-	const n = Gdk.Display.get_default()?.get_n_monitors() || 1;
-	return Array.from({ length: n }, (_, i) => i).flatMap(widget);
+export function forMonitors(widgets) {
+	const display = Gdk.Display.get_default();
+
+	display?.connect("monitor-added", (disp, gdkmonitor) => {
+		let monitor = 0;
+		for (let i = 0; i < display.get_n_monitors(); i++) {
+			if (gdkmonitor === display.get_monitor(i)) {
+				monitor = i;
+				break;
+			}
+		}
+
+		widgets.forEach((win) => App.addWindow(win(monitor)));
+	});
+
+	display?.connect("monitor-removed", (disp, monitor) => {
+		App.windows.forEach((win) => {
+			if (win.gdkmonitor === monitor) App.removeWindow(win);
+		});
+	});
+
+	const n = display?.get_n_monitors() || 1;
+	return Array.from({ length: n }, (_, i) => i).flatMap((mon) =>
+		widgets.map((x) => x(mon)),
+	);
 }
 
 App.config({
@@ -21,10 +43,5 @@ App.config({
 		osd: 300,
 	},
 	style: `${App.configDir}/style.css`,
-	windows: [
-		...forMonitors(Bar),
-		Quicksettings(),
-		Notifications(),
-		OSD(),
-	],
+	windows: [...forMonitors([Bar]), Quicksettings(), Notifications(), OSD()],
 });