feat(ProfilePopup): Add avatar change fucntionality

Closes: #3734

ui/app/AppLayouts/Chat/popups/ProfilePopup.qml

@@ -8,6 +8,8 @@ import utils 1.0
 import shared 1.0
 import shared.popups 1.0
 
+import "../../Profile/popups"
+
 import StatusQ.Core.Theme 0.1
 import StatusQ.Components 0.1
 import StatusQ.Controls 0.1
@@ -24,6 +26,7 @@ StatusModal {
 //TODO ---------------------------------------
 //use one PofilePopup instance and pass the store there
     property var store
+    property var profileStore
     property var identicon: ""
     property var userName: ""
     property string nickname: ""
@@ -63,6 +66,7 @@ StatusModal {
     header.subTitle: isEnsVerified ? alias : fromAuthor
     header.subTitleElide: Text.ElideMiddle
     header.image.source: identicon
+    header.headerImageEditable: isCurrentUser
 
     headerActionButton: StatusFlatRoundButton {
         type: StatusFlatRoundButton.Type.Secondary
@@ -75,6 +79,27 @@ StatusModal {
         onClicked: contentItem.qrCodePopup.open()
     }
 
+    property var popupLink: null
+
+    onHeaderImageClicked: {
+        popupLink = changeProfileModalComponent.createObject(applicationWindow);
+        popupLink.open()
+    }
+
+    Component {
+        id: changeProfileModalComponent
+        ChangeProfilePicModal {
+            largeImage: profileStore.profileLargeImage
+            hasIdentityImage: profileStore.profileHasIdentityImage
+            onCropFinished: {
+                uploadError = profileStore.uploadImage(selectedImage, aX, aY, bX, bY)
+            }
+            onRemoveImageButtonClicked: {
+                uploadError = profileStore.removeImage()
+            }
+        }
+    }
+
     contentItem: Item {
         width: popup.width
         height: modalContent.height

ui/app/AppLayouts/Profile/ProfileLayout.qml

@@ -15,7 +15,7 @@ StatusAppTwoPanelLayout {
 
     id: profileView
 
-    property RootStore store: RootStore { }
+    property RootStore store
     property var globalStore
     property int contentMaxWidth: 624
     property int contentMinWidth: 450

ui/app/AppLayouts/stores/RootStore.qml

@@ -1,7 +1,13 @@
 import QtQuick 2.13
 
+import "../Profile/stores" as ProfileStores
+
+
 QtObject {
     id: root
+
+    readonly property ProfileStores.RootStore profileStore: ProfileStores.RootStore {}
+
     property var mainModuleInst: mainModule
     property var profileModuleInst: profileModule
 

ui/app/AppMain.qml

@@ -140,6 +140,7 @@ Item {
     property Component profilePopupComponent: ProfilePopup {
         id: profilePopup
         store: rootStore
+        profileStore: appMain.profileStore
         onClosed: {
             if(profilePopup.parentPopup){
                 profilePopup.parentPopup.close();
@@ -455,6 +456,7 @@ Item {
                 Layout.alignment: Qt.AlignLeft | Qt.AlignTop
                 Layout.fillHeight: true
                 globalStore: appMain.rootStore
+                store: appMain.rootStore.profileStore
             }
 
             NodeLayout {