import QtQuick
import QtQuick.Layouts
import "../config"

Pill {
    id: root
    background: Theme.surface1
    property var now: new Date()

    Timer {
        interval: 1000
        running: true
        repeat: true
        triggeredOnStart: true
        onTriggered: root.now = new Date()
    }

    Text {
        text: Icons.clock
        font.family: Theme.monoFont
        font.pixelSize: Theme.fontSize + 1
        color: Theme.lavender
        Layout.alignment: Qt.AlignVCenter
    }

    TextMetrics {
        id: dateMetrics
        font: dateText.font
        // widest day/month abbreviations in this locale
        text: "Wed 00 MMM"
    }

    Text {
        id: dateText
        text: Qt.formatDateTime(root.now, "ddd dd MMM")
        font.family: Theme.font
        font.pixelSize: Theme.fontSize
        color: Theme.subtext
        horizontalAlignment: Text.AlignHCenter
        Layout.alignment: Qt.AlignVCenter
        Layout.preferredWidth: dateMetrics.advanceWidth
    }

    Text {
        text: Qt.formatDateTime(root.now, "HH:mm")
        font.family: Theme.font
        font.pixelSize: Theme.fontSize
        font.bold: true
        color: Theme.text
        Layout.alignment: Qt.AlignVCenter
    }
}