import { App, Astal, Gtk, Gdk } from "astal/gtk3";
import Launcher from "./components/Launcher";
import Workspace from "./components/Workspaces";
import Date from "./components/Date";
import Systray from "./components/Tray";
import Hyprland from "gi://AstalHyprland";

const anchor =
  Astal.WindowAnchor.TOP | Astal.WindowAnchor.LEFT | Astal.WindowAnchor.RIGHT;

const hyprland = Hyprland.get_default();

function getHyprlandMonitor(gdkmonitor: Gdk.Monitor) {
  const display = Gdk.Display.get_default()!;
  const screen = display.get_default_screen();
  for (let i = 0; i < display.get_n_monitors(); ++i) {
    if (gdkmonitor === display.get_monitor(i))
      return hyprland.get_monitor_by_name(screen.get_monitor_plug_name(i)!);
  }
}

export default (monitor: Gdk.Monitor) => (
  <window
    className="bar"
    gdkmonitor={monitor}
    exclusivity={Astal.Exclusivity.EXCLUSIVE}
    anchor={anchor}
    application={App}
  >
    <centerbox className="widgets">
      <box hexpand halign={Gtk.Align.START}>
        <Launcher />
        <Workspace monitor={getHyprlandMonitor(monitor)!} />
      </box>
      <box hexpand halign={Gtk.Align.CENTER}>
        <Date />
      </box>
      <box hexpand halign={Gtk.Align.END}>
        <Systray />
      </box>
    </centerbox>
  </window>
);