added monitor layout icon to waybar when external monitors are connected

hyprland/.local/bin/monitor-status.sh

@@ -0,0 +1,38 @@
+#!/usr/bin/env bash
+# monitor-status: waybar module for external display layout.
+#
+# Emits a JSON update on stdout every couple of seconds so the module appears
+# as soon as an external (non-eDP/HEADLESS) monitor is detected and collapses
+# again when it is disconnected. Clicking the icon opens monique to manage the
+# display layout.
+#
+# Outputs (return-type json):
+#   connected: { "text": "󰍹", "class": "active", "tooltip": "<monitor list>" }
+#   otherwise: { "text": "", "class": "hidden", "tooltip": "" }
+
+set -uo pipefail
+
+POLL_SECONDS=2
+
+emit() {
+  local out_json
+  out_json="$(hyprctl monitors -j 2>/dev/null)" || {
+    echo '{"text":"","class":"hidden","tooltip":""}'
+    return
+  }
+  jq -c '
+    [.[] | select((.name | test("^(eDP|HEADLESS)-")) | not)] as $ext |
+    if ($ext | length) == 0 then
+      { text: "", class: "hidden", tooltip: "" }
+    else
+      { text: "󰍹",
+        class: "active",
+        tooltip: (($ext | map("\(.description)  \(.width)x\(.height) @ \(.refreshRate | floor) Hz") | join("\n"))) }
+    end
+  ' <<<"$out_json" 2>/dev/null || echo '{"text":"","class":"hidden","tooltip":""}'
+}
+
+while true; do
+  emit
+  sleep "$POLL_SECONDS"
+done

waybar/.config/waybar/config.jsonc

@@ -2,7 +2,7 @@
   "position": "top",
   "modules-left": ["hyprland/workspaces", "mpris"],
   "modules-center": ["hyprland/window"],
-  "modules-right": ["cpu", "memory", "tray", "bluetooth", "network", "pulseaudio", "battery", "custom/weather", "clock", "power-profiles-daemon", "custom/power"],
+  "modules-right": ["cpu", "memory", "tray", "bluetooth", "network", "pulseaudio", "battery", "custom/external-monitors", "custom/weather", "clock", "power-profiles-daemon", "custom/power"],
   "clock": {
     "format": "<span foreground='#f5c2e7'>   </span>{:%a %d %H:%M}",
     "tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>"
@@ -84,6 +84,13 @@
 	"tooltip-format-enumerate-connected": "{device_alias}\t{device_address}",
 	"tooltip-format-enumerate-connected-battery": "{device_alias}\t{device_address}\t{device_battery_percentage}%",
     "on-click-left": "blueman-manager"
+},
+  "custom/external-monitors": {
+    "format": "{}",
+    "exec": "~/.local/bin/monitor-status.sh",
+    "return-type": "json",
+    "tooltip": true,
+    "on-click": "monique"
   },
   "custom/power": {
 "format" : "⏻ ",

waybar/.config/waybar/style.css

@@ -140,6 +140,27 @@ button:hover {
   color: #ec9974;
 }
 
+#custom-external-monitors {
+  color: @sky;
+  border-bottom: 2px solid @sky;
+  margin-top: 2px;
+  margin-bottom: 2px;
+  margin-left: 4px;
+  margin-right: 4px;
+  padding-left: 8px;
+  padding-right: 8px;
+}
+
+#custom-external-monitors.hidden {
+  border: none;
+  background: transparent;
+  color: transparent;
+  margin: 0;
+  padding: 0;
+  min-width: 0;
+  text-shadow: none;
+}
+
 /* If workspaces is the leftmost module, omit left margin */
 .modules-left>widget:first-child>#workspaces {
     margin-left: 0;