contents/ui/MailDelegate.qml

0001 // SPDX-FileCopyrightText: 2022 Devin Lin <devin@kde.org>
0002 // SPDX-FileCopyrightText: 2022 Carl Schwan <carl@carlschwan.eu>
0003 // SPDX-License-Identifier: GPL-2.0-or-later
0004
0005 import QtQuick 2.15
0006 import QtQuick.Controls 2.15 as QQC2
0007 import QtQuick.Layouts 1.15
0008
0009 import org.kde.kirigami 2.19 as Kirigami
0010
0011 Kirigami.AbstractListItem {
0012     id: root
0013
0014     property bool showSeparator: false
0015
0016     property string datetime
0017     property string author
0018     property string title
0019     property string contentPreview
0020
0021     property bool isRead
0022
0023     leftPadding: Kirigami.Units.gridUnit
0024     rightPadding: Kirigami.Units.gridUnit
0025     topPadding: Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing
0026     bottomPadding: Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing
0027
0028     hoverEnabled: true
0029
0030     signal openMailRequested()
0031     signal starMailRequested()
0032     signal contextMenuRequested()
0033
0034     property bool showSelected: (mouseArea.pressed || (root.highlighted && applicationWindow().isWidescreen))
0035
0036     background: Rectangle {
0037         color: Qt.rgba(Kirigami.Theme.highlightColor.r, Kirigami.Theme.highlightColor.g, Kirigami.Theme.highlightColor.b, root.showSelected ? 0.5 : hoverHandler.hovered ? 0.2 : 0)
0038
0039         // indicator rectangle
0040         Rectangle {
0041             anchors.left: parent.left
0042             anchors.top: parent.top
0043             anchors.topMargin: 1
0044             anchors.bottom: parent.bottom
0045             anchors.bottomMargin: 1
0046
0047             width: 4
0048             visible: !root.isRead
0049             color: Kirigami.Theme.highlightColor
0050         }
0051
0052         HoverHandler {
0053             id: hoverHandler
0054             // disable hover input on mobile because touchscreens trigger hover feedback and do not "unhover" in Qt
0055             enabled: !Kirigami.Settings.isMobile
0056         }
0057
0058         Kirigami.Separator {
0059             anchors.bottom: parent.bottom
0060             anchors.left: parent.left
0061             anchors.right: parent.right
0062             anchors.leftMargin: root.leftPadding
0063             anchors.rightMargin: root.rightPadding
0064             visible: root.showSeparator && !root.showSelected
0065             opacity: 0.5
0066         }
0067     }
0068
0069     onClicked: root.openMailRequested()
0070
0071     Item {
0072         id: item
0073         implicitHeight: rowLayout.implicitHeight
0074
0075         RowLayout {
0076             id: rowLayout
0077             anchors.top: parent.top
0078             anchors.left: parent.left
0079             anchors.right: parent.right
0080
0081             Kirigami.Avatar {
0082                 // Euristic to extract name from "Name <email>" pattern
0083                 name: author.replace(/<.*>/, '').replace(/\(.*\)/, '')
0084                 // Extract and use email address as unique identifier for image provider
0085                 source: 'image://contact/' + new RegExp("<(.*)>").exec(author)[1] ?? ''
0086                 Layout.rightMargin: Kirigami.Units.largeSpacing
0087                 sourceSize.width: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 2
0088                 sourceSize.height: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 2
0089                 Layout.preferredWidth: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 2
0090                 Layout.preferredHeight: Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing * 2
0091             }
0092
0093             ColumnLayout {
0094                 Layout.fillWidth: true
0095                 spacing: Kirigami.Units.smallSpacing
0096
0097                 RowLayout {
0098                     Layout.fillWidth: true
0099                     QQC2.Label {
0100                         Layout.fillWidth: true
0101                         text: root.author
0102                         elide: Text.ElideRight
0103                         font.weight: root.isRead ? Font.Normal : Font.Bold
0104                     }
0105
0106                     QQC2.Label {
0107                         color: Kirigami.Theme.disabledTextColor
0108                         text: root.datetime
0109                     }
0110                 }
0111                 QQC2.Label {
0112                     Layout.fillWidth: true
0113                     text: root.title
0114                     elide: Text.ElideRight
0115                     font.weight: root.isRead ? Font.Normal : Font.Bold
0116                 }
0117                 QQC2.Label {
0118                     Layout.fillWidth: true
0119                     text: root.contentPreview
0120                     elide: Text.ElideRight
0121                     color: Kirigami.Theme.disabledTextColor
0122                 }
0123             }
0124         }
0125
0126         MouseArea {
0127             id: mouseArea
0128             anchors.fill: parent
0129             acceptedButtons: Qt.LeftButton | Qt.RightButton
0130
0131             onClicked: {
0132                 if (mouse.button === Qt.RightButton) {
0133                     root.contextMenuRequested();
0134                 } else if (mouse.button === Qt.LeftButton) {
0135                     root.clicked();
0136                 }
0137             }
0138             onPressAndHold: root.contextMenuRequested();
0139         }
0140     }
0141 }