import QtQuick
import qs.config
import qs.services

Item {
    id: root

    required property var eventData
    property bool past: false

    signal activated
    signal joinRequested

    readonly property var sourceData: CalendarAgenda.sourceForId(eventData.sourceId)
    readonly property color eventColor: sourceData?.color ?? Theme.accent
    readonly property string timeText: eventData.allDay
        ? "All day"
        : Qt.formatTime(new Date(Number(eventData.start) * 1000), Settings.use24Hour ? "HH:mm" : "h:mm AP")
    readonly property string detailText: {
        const source = root.sourceData?.name ?? "Calendar";
        const location = String(root.eventData.location ?? "").trim();
        return location === "" ? source : source + " · " + location;
    }

    implicitHeight: 58
    opacity: past ? 0.52 : 1

    Rectangle {
        anchors.fill: parent
        radius: 9
        border.width: 0
        color: rowMouse.containsMouse ? Theme.alpha(Theme.fg, 0.07) : "transparent"

        Behavior on color { ColorAnimation { duration: Theme.durFast } }
    }

    MouseArea {
        id: rowMouse
        anchors.fill: parent
        hoverEnabled: true
        cursorShape: Qt.PointingHandCursor
        onClicked: root.activated()
    }

    Text {
        id: timeLabel
        anchors.left: parent.left
        anchors.verticalCenter: parent.verticalCenter
        width: 56
        text: root.timeText
        color: Theme.fgDim
        horizontalAlignment: Text.AlignRight
        font.family: Theme.fontFamily
        font.features: Theme.tabularFigures
        font.pixelSize: Theme.fontSizeSmall
    }

    Rectangle {
        id: sourceRail
        anchors.left: timeLabel.right
        anchors.leftMargin: 10
        anchors.verticalCenter: parent.verticalCenter
        width: 3
        height: 34
        radius: 2
        border.width: 0
        color: root.eventColor
    }

    Column {
        anchors.left: sourceRail.right
        anchors.leftMargin: 10
        anchors.right: joinPill.visible ? joinPill.left : parent.right
        anchors.rightMargin: joinPill.visible ? 10 : 4
        anchors.verticalCenter: parent.verticalCenter
        spacing: 3

        Text {
            width: parent.width
            text: root.eventData.summary || "Untitled event"
            color: Theme.fg
            elide: Text.ElideRight
            font.family: Theme.fontFamily
            font.pixelSize: Theme.fontSize
            font.weight: Font.DemiBold
        }

        Text {
            width: parent.width
            text: root.detailText
            color: Theme.fgDim
            elide: Text.ElideRight
            font.family: Theme.fontFamily
            font.pixelSize: Theme.fontSizeSmall
        }
    }

    Rectangle {
        id: joinPill
        anchors.right: parent.right
        anchors.rightMargin: 4
        anchors.verticalCenter: parent.verticalCenter
        visible: String(root.eventData.joinUrl ?? "").startsWith("https://")
        width: joinLabel.implicitWidth + 18
        height: 26
        radius: Theme.pillRadius
        border.width: 0
        color: joinMouse.containsMouse ? Theme.alpha(Theme.accent, 0.28) : Theme.alpha(Theme.accent, 0.14)

        Text {
            id: joinLabel
            anchors.centerIn: parent
            text: "Join"
            color: Theme.accent
            font.family: Theme.fontFamily
            font.pixelSize: Theme.fontSizeSmall
            font.weight: Font.DemiBold
        }

        MouseArea {
            id: joinMouse
            anchors.fill: parent
            hoverEnabled: true
            cursorShape: Qt.PointingHandCursor
            onClicked: root.joinRequested()
        }
    }
}