From 92dd998c4fc83bc9eb188c982e184250f603a2ec Mon Sep 17 00:00:00 2001
From: Pascal Precht <pascal.precht@gmail.com>
Date: Tue, 20 Jul 2021 14:01:27 +0200
Subject: [PATCH] feat(StatusListItem): support tertiaryTitle

Usage:

```qml
StatusListItem {
    title: ...
    subTitle: ...
    tertiaryTitle: ...
}
```

Closes #275
---
 ui/StatusQ/sandbox/ListItems.qml              |  9 +++++++++
 .../src/StatusQ/Components/StatusListItem.qml | 20 ++++++++++++++++---
 2 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/ui/StatusQ/sandbox/ListItems.qml b/ui/StatusQ/sandbox/ListItems.qml
index 944509b0c2..4d3a93adef 100644
--- a/ui/StatusQ/sandbox/ListItems.qml
+++ b/ui/StatusQ/sandbox/ListItems.qml
@@ -143,6 +143,15 @@ GridLayout {
         subTitle: "Subtitle"
     }
 
+    StatusListItem {
+        title: "Title"
+        subTitle: "Subtitle"
+        tertiaryTitle: "Tertiary title"
+
+        statusListItemTitle.font.pixelSize: 17
+        statusListItemTitle.font.weight: Font.Bold
+    }
+
     StatusListItem {
         title: "Title"
         subTitle: "Subtitle"
diff --git a/ui/StatusQ/src/StatusQ/Components/StatusListItem.qml b/ui/StatusQ/src/StatusQ/Components/StatusListItem.qml
index 583e4446f8..d5507d0e24 100644
--- a/ui/StatusQ/src/StatusQ/Components/StatusListItem.qml
+++ b/ui/StatusQ/src/StatusQ/Components/StatusListItem.qml
@@ -8,7 +8,7 @@ Rectangle {
     id: statusListItem
 
     implicitWidth: 448
-    implicitHeight: 64
+    implicitHeight: Math.max(64, statusListItemTitleArea.height + 16)
 
     enum Type {
         Primary,
@@ -34,6 +34,7 @@ Rectangle {
 
     property string title: ""
     property string subTitle: ""
+    property string tertiaryTitle: ""
     property real leftPadding: 16
     property real rightPadding: 16
     property StatusIconSettings icon: StatusIconSettings {
@@ -69,6 +70,7 @@ Rectangle {
     property alias sensor: sensor
     property alias statusListItemTitle: statusListItemTitle
     property alias statusListItemSubTitle: statusListItemSubTitle
+    property alias statusListItemTertiaryTitle: statusListItemTertiaryTitle
     property alias statusListItemComponentsSlot: statusListItemComponentsSlot
 
     property list<Item> components
@@ -144,10 +146,13 @@ Rectangle {
         }
 
         Item {
+            id: statusListItemTitleArea
             anchors.left: iconOrImage.active ? iconOrImage.right : parent.left
             anchors.leftMargin: statusListItem.leftPadding
             anchors.verticalCenter: parent.verticalCenter
-            height: statusListItemTitle.height + (statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0)
+            height: statusListItemTitle.height + 
+              (statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0) +
+              (statusListItemTertiaryTitle.visible ? statusListItemTertiaryTitle.height : 0)
 
             StatusBaseText {
                 id: statusListItemTitle
@@ -171,9 +176,18 @@ Rectangle {
 
                 text: statusListItem.subTitle
                 font.pixelSize: 15
-                color: Theme.palette.baseColor1
+                color: !statusListItem.tertiaryTitle ? Theme.palette.baseColor1 : Theme.palette.directColor1
                 visible: !!statusListItem.subTitle
             }
+
+            StatusBaseText {
+                id: statusListItemTertiaryTitle
+                anchors.top: statusListItemSubTitle.bottom
+                text: statusListItem.tertiaryTitle
+                color: Theme.palette.baseColor1
+                font.pixelSize: 13
+                visible: !!statusListItem.tertiaryTitle
+            }
         }
 
         StatusBaseText {