Add visualisation of the account's third party IDs in the account editor.

A category won't be shown if there are no relevant IDs (will add the ability to add new ones later).

Part of network/neochat#565

![image](/uploads/7da00b0b4acf90d145c09969ac2a91e1/image.png)

src/settings/AccountEditorPage.qml

@@ -11,6 +11,7 @@ import QtQuick.Window
 import org.kde.kirigami as Kirigami
 import org.kde.kirigamiaddons.formcard as FormCard
 import org.kde.kirigamiaddons.components as KirigamiComponents
+
 import org.kde.neochat
 
 FormCard.FormCardPage {
@@ -195,7 +196,16 @@ FormCard.FormCardPage {
             }
         }
     }
-
+    ThreePIdCard {
+        connection: root.connection
+        title: i18n("Email Addresses")
+        medium: "email"
+    }
+    ThreePIdCard {
+        connection: root.connection
+        title: i18n("Phone Numbers")
+        medium: "msisdn"
+    }
     FormCard.FormHeader {
         Layout.fillWidth: true
         title: i18n("Server Information")

src/settings/CMakeLists.txt

@@ -32,4 +32,5 @@ qt_add_qml_module(settings
         IgnoredUsersDialog.qml
         NotificationRuleItem.qml
         ThemeRadioButton.qml
+        ThreePIdCard.qml
 )

src/settings/ThreePIdCard.qml

@@ -0,0 +1,43 @@
+// SPDX-FileCopyrightText: 2024 James Graham <james.h.graham@protonmail.com>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+import QtQuick
+import QtQuick.Layouts
+
+import org.kde.kirigami as Kirigami
+import org.kde.kirigamiaddons.formcard as FormCard
+import org.kde.kitemmodels
+
+import org.kde.neochat
+
+ColumnLayout {
+    id: root
+
+    required property NeoChatConnection connection
+
+    required property string title
+    required property string medium
+
+    visible: deviceRepeater.count > 0
+
+    FormCard.FormHeader {
+        title: root.title
+    }
+    FormCard.FormCard {
+        id: devicesCard
+
+        Repeater {
+            id: deviceRepeater
+            model: KSortFilterProxyModel {
+                sourceModel: root.connection.threePIdModel
+                filterRoleName: "medium"
+                filterString: root.medium
+            }
+
+            delegate: FormCard.FormTextDelegate {
+                required property string address
+                text: address
+            }
+        }
+    }
+}