import { App, Astal, Gtk, Gdk } from "astal/gtk3"
import { 
    PowerMenu,
    Cpu,
    BatteryLevel,
    Ram,
    Storage,
    Workspaces,
    FocusedClient,
    Time,
    SysTray
} from "./modules/export"

export default function Bar(gdkmonitor: Gdk.Monitor) {
    const { TOP, LEFT, RIGHT } = Astal.WindowAnchor

    return <><window
        className="Bar"
        name="Bar"
        gdkmonitor={gdkmonitor}
        exclusivity={Astal.Exclusivity.EXCLUSIVE}
        anchor={TOP | LEFT | RIGHT}
        application={App}>
        <centerbox>
            <box hexpand halign={Gtk.Align.START} className="RoudedBlock">
                <button
                    onClicked="/home/tola/dotfiles/rofi/launcher/launcher.sh"
                    halign={Gtk.Align.START}
                    className="Menubutton"
                >
                    
                </button>
                <Cpu />
                <Ram />
                <Storage />
                {/*<FocusedClient />*/}
            </box>  
            <box hexpand halign={Gtk.Align.CENTER} className="RoudedBlock">
                <Workspaces />
            </box>
            <box hexpand halign={Gtk.Align.END} className="RoudedBlock">
                <SysTray />
                <BatteryLevel />
                <Time />
                <button
                    onClicked={() => App.toggle_window("powermenu")}
                    halign={Gtk.Align.START}
                    className="Menubutton"
                >
                    ⏻
                </button>
            </box>
        </centerbox>
    </window>
    <PowerMenu />
    </>
}