Dotfiles/.config/ags/config.js

const systemtray = await Service.import('systemtray')

/** @param {import('types/service/systemtray').TrayItem} item */
const SysTrayItem = item => Widget.Button({
    child: Widget.Icon().bind('icon', item, 'icon'),
    tooltipMarkup: item.bind('tooltip_markup'),
    onPrimaryClick: (_, event) => item.activate(event),
    onSecondaryClick: (_, event) => item.openMenu(event),
});

function SysTray() {
    return Widget.Box({ children: systemtray.bind('items').transform(i => i.map(SysTrayItem)) });
}

function Bar(monitor = 0) {
    const lTime = Widget.Label({
        label: 'TIME',
    });

    Utils.interval(1000, () => {
        lTime.label = Utils.exec('date +%H:%M');
        //date +%d.%m.%Y
    });

    const bTimeDate = Widget.Box({
        children: [lTime]
    });

    const bInfo = Widget.Box({
        hpack: "end",
        children: [SysTray()]
    });

    return Widget.Window({
        monitor,
        exclusivity: 'exclusive',
        name: `bar ${monitor}`,
        anchor: ['top', 'left', 'right'],
        child: Widget.CenterBox({
            centerWidget: bTimeDate,
            endWidget: bInfo,
        }),
    });
}

export default {
    windows: [Bar(1), Bar(2)]
};