page: welcomepage: add some icons for style points

imports/NeoChat/Component/Login/Loading.qml

@@ -5,24 +5,18 @@ import QtQuick 2.15
 import QtQuick.Controls 2.15 as QQC2
 import QtQuick.Layouts 1.15
 
-import org.kde.kirigami 2.15 as Kirigami
+import org.kde.kirigami 2.19 as Kirigami
 
 import org.kde.neochat 1.0
 import NeoChat.Component 1.0
 
-Kirigami.PlaceholderMessage {
+Kirigami.LoadingPlaceholder {
     property var showContinueButton: false
     property var showBackButton: false
-    property string title: i18n("Loading…")
+    text: i18n("Synchronizing with your homeserver…")
+    icon.name: "cloud-download"
 
     anchors.centerIn: parent
 
-    QQC2.Label {
+    explanation: i18n("Please wait. This might take a little while.")
-        text: i18n("Please wait. This might take a little while.")
-    }
-
-    QQC2.BusyIndicator {
-        Layout.alignment: Qt.AlignHCenter
-        running: false
-    }
 }

imports/NeoChat/Component/Login/Login.qml

@@ -14,24 +14,29 @@ import NeoChat.Component 1.0
 LoginStep {
     id: login
 
-    showContinueButton: true
+    showContinueButton: LoginHelper.homeserverReachable
     showBackButton: false
 
     title: i18nc("@title", "Login")
-    message: i18n("Enter your Matrix ID")
+    message: i18n("Welcome to NeoChat!")
 
     Component.onCompleted: {
         LoginHelper.matrixId = ""
     }
 
+    QQC2.Label {
+        text: i18n("To get started, enter your matrix ID:")
+    }
+
     Kirigami.FormLayout {
         QQC2.TextField {
             id: matrixIdField
-            Kirigami.FormData.label: i18n("Matrix ID:")
             placeholderText: "@user:matrix.org"
             onTextChanged: {
                 if(acceptableInput) {
                     LoginHelper.matrixId = text
+                } else {
+                    LoginHelper.matrixId = ""
                 }
             }
 
@@ -61,5 +66,6 @@ LoginStep {
             }
         }
         enabled: LoginHelper.homeserverReachable
+        iconName: "go-next"
     }
 }

imports/NeoChat/Component/Login/Password.qml

@@ -25,6 +25,7 @@ LoginStep {
         onTriggered: {
             LoginHelper.login();
         }
+        iconName: "go-next"
     }
 
     Connections {

imports/NeoChat/Page/WelcomePage.qml

@@ -5,7 +5,7 @@ import QtQuick 2.15
 import QtQuick.Controls 2.15 as Controls
 import QtQuick.Layouts 1.15
 
-import org.kde.kirigami 2.15 as Kirigami
+import org.kde.kirigami 2.19 as Kirigami
 
 import org.kde.neochat 1.0
 import NeoChat.Component.Login 1.0
@@ -45,10 +45,81 @@ Kirigami.ScrollablePage {
     }
 
     ColumnLayout {
-        Kirigami.Icon {
+        Item {
-            source: "org.kde.neochat"
+            Layout.preferredHeight: Kirigami.Units.gridUnit * 10
+            Layout.alignment: Qt.AlignHCenter
             Layout.fillWidth: true
-            Layout.preferredHeight: Kirigami.Units.gridUnit * 16
+
+            id: swapper
+            states: [
+                State {
+                    when: !LoginHelper.homeserverReachable
+                    name: "idle"
+                    PropertyChanges {
+                        target: icon
+                        opacity: 1
+                    }
+                    PropertyChanges {
+                        target: avi
+                        opacity: 0
+                    }
+                },
+                State {
+                    when: LoginHelper.homeserverReachable
+                    name: "showAvi"
+                    PropertyChanges {
+                        target: icon
+                        opacity: 0
+                    }
+                    PropertyChanges {
+                        target: avi
+                        opacity: 1
+                    }
+                }
+            ]
+
+            transitions: [
+                Transition {
+                    to: "showAvi"
+                    SequentialAnimation {
+                        NumberAnimation { target: icon; properties: "opacity";}
+                        NumberAnimation { target: avi; properties: "opacity";}
+                    }
+                },
+                Transition {
+                    from: "showAvi"
+                    SequentialAnimation {
+                        NumberAnimation { target: avi; properties: "opacity";}
+                        NumberAnimation { target: icon; properties: "opacity";}
+                    }
+                }
+            ]
+
+            Kirigami.Icon {
+                id: icon
+                source: "org.kde.neochat"
+                anchors.fill: parent
+                implicitWidth: height
+            }
+
+            ColumnLayout {
+                id: avi
+                opacity: 0
+                anchors.fill: parent
+                Kirigami.Avatar {
+                    source: LoginHelper.loginAvatar
+                    name: LoginHelper.loginName
+                    Layout.fillHeight: true
+                    implicitWidth: height
+                    Layout.alignment: Qt.AlignHCenter
+               }
+
+               Controls.Label {
+                   text: LoginHelper.loginName
+                   font.pointSize: 24
+                   Layout.alignment: Qt.AlignHCenter
+               }
+            }
         }
         Controls.Label {
             Layout.fillWidth: true
@@ -66,6 +137,7 @@ Kirigami.ScrollablePage {
                 headerMessage.text = ""
             }
         }
+
         RowLayout {
             Layout.alignment: Qt.AlignHCenter
 
@@ -78,16 +150,26 @@ Kirigami.ScrollablePage {
                 onClicked: {
                     module.source = welcomePage.currentStep.previousUrl
                 }
+                icon.name: "go-back"
             }
 
             Controls.Button {
                 id: continueButton
                 enabled: welcomePage.currentStep.acceptable
-                visible: welcomePage.currentStep.showContinueButton
+                opacity: welcomePage.currentStep.showContinueButton ? 1 : 0
+                Behavior on opacity { NumberAnimation {} }
                 action: welcomePage.currentStep.action
             }
         }
 
+        Kirigami.LoadingPlaceholder {
+            icon.name: "online"
+            opacity: LoginHelper.testing ? 1 : 0
+            text: i18n("Connecting to your homeserver...")
+            Behavior on opacity { NumberAnimation {} }
+            Layout.alignment: Qt.AlignHCenter
+        }
+
         Connections {
             target: currentStep
 

src/login.cpp

@@ -13,6 +13,7 @@
 #include <KLocalizedString>
 
 using namespace Quotient;
+#include <csapi/profile.h>
 
 Login::Login(QObject *parent)
     : QObject(parent)
@@ -20,6 +21,16 @@ Login::Login(QObject *parent)
     init();
 }
 
+QUrl Login::loginAvatar() const
+{
+    return m_loginAvatar;
+}
+
+QString Login::loginName() const
+{
+    return m_loginName;
+}
+
 void Login::init()
 {
     m_homeserverReachable = false;
@@ -34,6 +45,10 @@ void Login::init()
 
     connect(this, &Login::matrixIdChanged, this, [this]() {
         setHomeserverReachable(false);
+        m_loginAvatar = QString();
+        m_loginName = QString();
+        Q_EMIT loginNameChanged();
+        Q_EMIT loginAvatarChanged();
 
         if (m_matrixId == "@") {
             return;
@@ -52,6 +67,17 @@ void Login::init()
             m_supportsSso = m_connection->supportsSso();
             m_supportsPassword = m_connection->supportsPasswordAuth();
             Q_EMIT loginFlowsChanged();
+
+            GetUserProfileJob *job = m_connection->callApi<GetUserProfileJob>(m_matrixId);
+            connect(job, &BaseJob::result, this, [this, job] {
+                auto foundAvatar = job->avatarUrl();
+                m_loginAvatar = QUrl(QStringLiteral("%1/_matrix/media/r0/download/%2")
+                                         .arg(m_connection->homeserver().toString())
+                                         .arg(foundAvatar.authority() + foundAvatar.path()));
+                m_loginName = job->displayname();
+                Q_EMIT loginAvatarChanged();
+                Q_EMIT loginNameChanged();
+            });
         });
     });
     connect(m_connection, &Connection::connected, this, [this] {

src/login.h

@@ -23,6 +23,8 @@ class Login : public QObject
     Q_PROPERTY(bool supportsPassword READ supportsPassword NOTIFY loginFlowsChanged STORED false)
     Q_PROPERTY(QUrl ssoUrl READ ssoUrl NOTIFY ssoUrlChanged)
     Q_PROPERTY(bool isLoggingIn READ isLoggingIn NOTIFY isLoggingInChanged)
+    Q_PROPERTY(QUrl loginAvatar READ loginAvatar NOTIFY loginAvatarChanged STORED false)
+    Q_PROPERTY(QString loginName READ loginName NOTIFY loginNameChanged STORED false)
 
 public:
     explicit Login(QObject *parent = nullptr);
@@ -52,7 +54,12 @@ public:
     Q_INVOKABLE void login();
     Q_INVOKABLE void loginWithSso();
 
+    QUrl loginAvatar() const;
+    QString loginName() const;
+
 Q_SIGNALS:
+    void loginAvatarChanged();
+    void loginNameChanged();
     void homeserverReachableChanged();
     void testHomeserverFinished();
     void matrixIdChanged();
@@ -76,6 +83,8 @@ private:
     bool m_supportsPassword = false;
     Quotient::Connection *m_connection = nullptr;
     QUrl m_ssoUrl;
+    QUrl m_loginAvatar;
     bool m_testing = false;
     bool m_isLoggingIn = false;
+    QString m_loginName;
 };