import QtQuick.Layouts
import QtQuick
import QtQuick.VectorImage
import Quickshell
import Quickshell.Services.SystemTray
import qs.Helpers
import qs.Modules
import qs.Components
import qs.Config

Item {
	id: root

	property bool current: popouts.currentName.startsWith(`traymenu${ind}`) && popouts.hasCurrent
	readonly property real dpr: Hypr.monitorFor(loader.screen).scale
	required property int ind
	required property SystemTrayItem item
	required property RowLayout loader
	required property Wrapper popouts

	function resolveIcon(app: string, icon: string): string {
		if (app === "chrome_status_icon_1") {
			return Quickshell.iconPath("discord-tray");
		} else if (app === "AyuGramDesktop") {
			if (icon === Quickshell.iconPath("com.ayugram.desktop-attention-symbolic"))
				return Quickshell.iconPath("telegram-attention-panel");
			else if (icon === Quickshell.iconPath("com.ayugram.desktop-mute-symbolic"))
				return Quickshell.iconPath("telegram-mute-panel");
			else if (icon === Quickshell.iconPath("com.ayugram.desktop-symbolic"))
				return Quickshell.iconPath("telegram-panel");
		} else if (app === "TelegramDesktop") {
			if (icon === Quickshell.iconPath("org.telegram.desktop-symbolic"))
				return Quickshell.iconPath("telegram-panel");
			else if (icon === Quickshell.iconPath("org.telegram.desktop-attention-symbolic"))
				return Quickshell.iconPath("telegram-attention-panel");
			else if (icon === Quickshell.iconPath("org.telegram.desktop-mute-symbolic"))
				return Quickshell.iconPath("telegram-mute-panel");
		} else if (app === "steam") {
			return Quickshell.iconPath("steam_tray_mono");
		}

		return root.item.icon;
	}

	CustomRect {
		anchors.fill: parent
		anchors.margins: 3
		color: icon.layer.enabled && enabled && root.current ? DynamicColors.palette.m3primary : "transparent"
		enabled: !Config.bar.tray.showOnHover
		radius: Appearance.rounding.full

		StateLayer {
			acceptedButtons: Qt.LeftButton | Qt.RightButton
			anchors.fill: parent
			color: icon.layer.enabled && root.current ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface

			onClicked: mouse => {
				if (mouse.button === Qt.LeftButton) {
					root.item.activate();
					console.log(icon.source + "\n" + root.item.id);
				} else if (mouse.button === Qt.RightButton && Config.bar.popouts.tray && !Config.bar.tray.showOnHover) {
					root.popouts.currentName = `traymenu${root.ind}`;
					root.popouts.currentCenter = Qt.binding(() => root.mapToItem(root.loader, root.implicitWidth / 2, 0).x);
					root.popouts.hasCurrent = true;
					if (visibilities.sidebar || visibilities.dashboard || visibilities.settings) {
						visibilities.sidebar = false;
						visibilities.dashboard = false;
						visibilities.settings = false;
					}
				}
			}
		}
	}

	ColoredIcon {
		id: icon

		anchors.centerIn: parent
		antialiasing: true
		color: root.current && !Config.bar.tray.showOnHover ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface
		implicitSize: Config.bar.tray.trayIconSize * root.dpr
		layer.enabled: Config.bar.tray.recolorIcons
		scale: 1 / root.dpr
		source: root.resolveIcon(root.item.id, root.item.icon)
	}
}
