From 51083e2005313220e92cc23302b1d07affb47851 Mon Sep 17 00:00:00 2001
From: Pascal Precht <pascal.precht@gmail.com>
Date: Thu, 14 Jan 2021 14:19:58 +0100
Subject: [PATCH] feat: introduce StatusSectionDescItem

This is a component that is similar to the `StatusSectionMenuItem` component, just
with the difference that it's not a clickable element, rather "description" element,
inspired by HTML `<dl>`, `<dt>` and `<dd>` elements ("description list", "description term",
"description" respectively).

The component comes with a `CopyToClipBoardButton` by default. We might want to decide
to make it configurable later on, as there could be places where we just want to
render the description item, without a copyble description.
---
 ui/shared/status/StatusSectionDescItem.qml | 43 ++++++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 ui/shared/status/StatusSectionDescItem.qml

diff --git a/ui/shared/status/StatusSectionDescItem.qml b/ui/shared/status/StatusSectionDescItem.qml
new file mode 100644
index 0000000000..80978983c6
--- /dev/null
+++ b/ui/shared/status/StatusSectionDescItem.qml
@@ -0,0 +1,43 @@
+import QtQuick 2.13
+import QtQuick.Controls 2.13
+import QtQuick.Layouts 1.13
+import QtGraphicalEffects 1.13
+import "../../imports"
+import "../../shared"
+
+Item {
+    property string name
+    property string description
+
+    id: root
+    width: parent.width
+    height: name.height
+
+    StyledText {
+        id: name
+        text: root.name
+        font.pixelSize: 15
+    }
+
+    StyledText {
+        id: description
+        visible: !!root.description
+        text: root.description
+        elide: Text.ElideRight
+        font.pixelSize: 15
+        horizontalAlignment: Text.AlignRight
+        color: Style.current.secondaryText
+        anchors.right: parent.right
+        anchors.rightMargin: Style.current.smallPadding
+        anchors.verticalCenter: name.verticalCenter
+
+        CopyToClipBoardButton {
+            id: copyToClipboardBtn
+            textToCopy: root.description
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left: parent.right
+            anchors.leftMargin: Style.current.smallPadding
+        }
+    }
+}
+