import { bind } from "astal"
import { Button, Icon } from "astal/gtk3/widget"
import Tray from "gi://AstalTray"

const tray = Tray.get_default()

export default function Systray() {
    for (const item of tray.get_items()) {
        print(item.title)
    }
    return <box>
        {tray.get_items().map(item => <SystrayItem item={item} />)}
    </box>
}

function SystrayItem({ item }: { item: Tray.TrayItem }) {
    return <Button
        onClick={() => item.activate(0, 0) /* NOTE: Figure out what these numbers do */}
        tooltipMarkup={bind(item, "tooltip_markup")}
    >
        <Icon gicon={bind(item, "gicon")} />
    </Button>
}